/* TRIP Guardian - tela de login (dark mode + glassmorphism)
   Especificacao: Fabio, 2026-11-09. Botao em verde da marca (#46B86C) em vez de laranja. */

body:has(tb-login) { background: #0a0f1e !important; }

/* Fundo: foto da subestacao + overlay azul-escuro */
tb-login .tb-login-content {
  margin: 0 !important;
  min-height: 100vh;
  background:
    linear-gradient(180deg, rgba(10,15,30,.55) 0%, rgba(10,15,30,.75) 100%),
    url('/guardian-marca/login-bg.jpg') center / cover no-repeat !important;
}

/* Card central em vidro */
tb-login .mat-mdc-card {
  overflow: hidden !important;
  padding: 40px 30px 28px !important;
  background: rgba(20,30,45,.75) !important;
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.15) !important;
  border-radius: 20px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.5) !important;
}
tb-login .mat-mdc-card ::-webkit-scrollbar { display: none; }

/* Fonte da marca so nos textos, nunca nos icones */
tb-login .mat-mdc-card :is(h1,h2,h3,span,input,label,a,button,.mat-mdc-form-field-error,.mdc-floating-label):not(.material-icons):not(mat-icon):not(.mat-icon) {
  font-family: 'Montserrat', Roboto, sans-serif !important;
}
tb-login mat-icon, tb-login .mat-icon, tb-login .material-icons { font-family: 'Material Icons' !important; }

/* Campos */
tb-login .mat-mdc-form-field {
  --mdc-outlined-text-field-container-shape: 8px;
  --mdc-outlined-text-field-outline-color: rgba(255,255,255,.18);
  --mdc-outlined-text-field-hover-outline-color: rgba(255,255,255,.35);
  --mdc-outlined-text-field-focus-outline-color: #46B86C;
  --mdc-outlined-text-field-label-text-color: #a0aec0;
  --mdc-outlined-text-field-focus-label-text-color: #46B86C;
  --mat-form-field-outlined-container-shape: 8px;
  --mat-form-field-outlined-outline-color: rgba(255,255,255,.18);
  --mat-form-field-outlined-hover-outline-color: rgba(255,255,255,.35);
  --mat-form-field-outlined-focus-outline-color: #46B86C;
  --mat-form-field-outlined-label-text-color: #a0aec0;
  --mat-form-field-outlined-focus-label-text-color: #46B86C;
}
tb-login .mat-mdc-text-field-wrapper { background: rgba(8,14,26,.45) !important; border-radius: 8px !important; }
tb-login input::placeholder { color: #a0aec0 !important; }
tb-login .mat-mdc-form-field.mat-focused .mat-icon { color: #46B86C !important; }

/* Botao Entrar */
tb-login button[type=submit] {
  background: #46B86C !important; color: #fff !important;
  border-radius: 20px !important; font-weight: 700 !important; letter-spacing: .3px;
  transition: background .2s ease, box-shadow .2s ease, transform .2s ease;
}
tb-login button[type=submit]:hover {
  background: #3A9D5A !important;
  box-shadow: 0 8px 24px rgba(70,184,108,.35) !important;
  transform: translateY(-1px);
}

/* Esqueceu sua senha? centralizado */
tb-login :has(> .forgot-password) { justify-content: center !important; display: flex !important; }
tb-login .forgot-password, tb-login .forgot-password * { color: #a0aec0 !important; }
tb-login .forgot-password:hover, tb-login .forgot-password:hover * { color: #fff !important; text-decoration: underline; }

/* Lema */
tb-login .tb-login-form::after {
  content: "A maioria monitora. Nós assumimos a responsabilidade.";
  display: block; text-align: center; margin: 18px 0 0; padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.10);
  font-family: 'Montserrat', sans-serif; font-size: 13px; font-style: italic; color: rgba(255,255,255,.7);
}

/* Celular */
@media (max-width: 600px) {
  tb-login .tb-login-content { align-items: center !important; padding: 16px !important; box-sizing: border-box; }
  tb-login .mat-mdc-card {
    width: 100% !important; max-width: 420px !important; box-sizing: border-box;
    padding: 28px 20px 20px !important; border-radius: 16px !important;
    background: rgba(20,30,45,.82) !important;
  }
  tb-login .tb-login-form { width: 100% !important; min-width: 0 !important; }
  tb-login img.tb-logo-title { height: 46px !important; }
  tb-login .mat-mdc-card :is(h1,h2,h3) { font-size: 20px !important; }
  tb-login .tb-login-form::after { font-size: 12px; margin-top: 12px; padding-top: 12px; }
}

/* Rodape: credito Big Bang Agencia */
.tb-powered-by-footer, .tb-powered-by-footer a { font-family: 'Montserrat', Roboto, sans-serif; }
tb-login .tb-login-content { position: relative; }
tb-login .tb-login-content::after {
  content: "Desenvolvido por Big Bang Agência";
  position: absolute; left: 0; right: 0; bottom: 18px; text-align: center;
  font-family: 'Montserrat', sans-serif; font-size: 12px; letter-spacing: .4px; color: rgba(255,255,255,.6);
}

/* Logo do menu em destaque */
mat-sidenav header mat-toolbar { height: 104px !important; min-height: 104px !important; }
mat-sidenav header img.tb-logo-title {
  height: 70px !important; max-height: none !important; max-width: 92% !important;
  filter: drop-shadow(0 0 10px rgba(70,184,108,.35)) brightness(1.08);
}
tb-login img.tb-logo-title { height: 78px !important; max-height: none !important; }
@media (max-width: 600px) { tb-login img.tb-logo-title { height: 60px !important; } }

/* Menu lateral */
mat-sidenav.tb-site-sidenav, mat-sidenav .mat-drawer-inner-container {
  background: linear-gradient(180deg, #24385A 0%, #16243A 55%, #0F1A2B 100%) !important;
}
mat-sidenav header mat-toolbar, mat-sidenav mat-toolbar { background: transparent !important; }
mat-sidenav .tb-side-menu > li { border-bottom: 1px solid rgba(255,255,255,.06) !important; }
mat-sidenav a.mat-mdc-button.tb-active {
  background: linear-gradient(90deg, rgba(70,184,108,.30), rgba(70,184,108,.06)) !important;
  border-left: 3px solid #46B86C; box-shadow: inset 0 0 18px rgba(70,184,108,.18);
}
mat-sidenav a.mat-mdc-button:hover { background: rgba(255,255,255,.06) !important; }
mat-sidenav .mat-drawer-inner-container::after {
  content: "●  Servidor online  ·  TRIP Guardian";
  display: block; padding: 14px 16px 18px; font-family: 'Montserrat', sans-serif; font-size: 11px;
  letter-spacing: .3px; color: #8FD3A6; border-top: 1px solid rgba(255,255,255,.08);
}
