/* SG_BRAND_OFICIAL_V2
   Referencia oficial SenaGuard Control - 18/09/2026
   Preto/grafite + metal prata/dourado + verde neon de status.
*/
:root{
  --sg-bg:#030609;
  --sg-bg-2:#060b0f;
  --sg-panel:#091117;
  --sg-panel-2:#0d171e;
  --sg-panel-3:#111c24;
  --sg-line:rgba(214,168,79,.24);
  --sg-line-soft:rgba(215,226,235,.12);
  --sg-text:#f4f7f9;
  --sg-silver:#d9e0e6;
  --sg-silver-2:#89959e;
  --sg-muted:#89979f;
  --sg-gold:#d6a84f;
  --sg-gold-hi:#f5d985;
  --sg-gold-deep:#8f6828;
  --sg-green:#39f58a;
  --sg-green-deep:#19c963;
  --sg-pink:#ff3f82;
  --sg-danger:#ff6b72;

  /* Compatibilidade com CSS legado */
  --brand:#39f58a;
  --v2-green:#39f58a;
  --green:#39f58a;
  --green2:#19c963;
  --text:#f4f7f9;
  --muted:#89979f;
}

html{background:var(--sg-bg)}
body{
  color:var(--sg-text);
  background:
    radial-gradient(circle at 78% -12%,rgba(214,168,79,.10),transparent 30%),
    radial-gradient(circle at 8% 24%,rgba(57,245,138,.035),transparent 24%),
    linear-gradient(180deg,#071017 0%,#030609 58%,#020406 100%);
}

/* ============================================================
   LOGO OFICIAL - substitui visualmente logos S simples/wordmarks antigos
   ============================================================ */
.sg-official-public .brand,
.sg-official-auth .auth-brand-panel .logo,
.sg-official-auth .auth-mobile-logo .logo,
.sg-official-auth .logo.centered,
.sg-official-app .sidebar .logo:not(.sg-admin-logo),
.sg-official-app .sg-mobile-brand{
  display:block!important;
  width:260px!important;
  max-width:72vw!important;
  min-height:58px!important;
  height:58px!important;
  padding:0!important;
  margin:0!important;
  font-size:0!important;
  color:transparent!important;
  background-image:url('/assets/img/senaguard-control-oficial.png')!important;
  background-repeat:no-repeat!important;
  background-position:left center!important;
  background-size:contain!important;
  border:0!important;
  box-shadow:none!important;
  text-decoration:none!important;
}

.sg-official-public .brand>*,
.sg-official-auth .auth-brand-panel .logo>*,
.sg-official-auth .auth-mobile-logo .logo>*,
.sg-official-auth .logo.centered>*,
.sg-official-app .sidebar .logo:not(.sg-admin-logo)>*,
.sg-official-app .sg-mobile-brand>*{
  display:none!important;
}

.sg-official-app .sg-admin-logo{
  min-height:54px!important;
  display:flex!important;
  align-items:center!important;
}
.sg-official-app .sg-admin-logo .sg-official-logo,
.sg-official-app img.sg-official-logo{
  display:block!important;
  width:min(230px,100%)!important;
  max-height:58px!important;
  object-fit:contain!important;
  object-position:left center!important;
  filter:drop-shadow(0 0 16px rgba(214,168,79,.10))!important;
}

/* ============================================================
   AUTENTICACAO / CADASTRO / RESET / 2FA / SMTP
   ============================================================ */
body.sg-official-auth{
  min-height:100vh;
  background:
    radial-gradient(circle at 15% 15%,rgba(214,168,79,.12),transparent 28%),
    radial-gradient(circle at 85% 80%,rgba(57,245,138,.045),transparent 24%),
    linear-gradient(150deg,#071017 0%,#030609 58%,#010203 100%)!important;
  color:var(--sg-text)!important;
}
.sg-official-auth .auth-layout{
  background:transparent!important;
}
.sg-official-auth .auth-brand-panel{
  background:
    linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,0)),
    radial-gradient(circle at 78% 48%,rgba(214,168,79,.10),transparent 28%),
    linear-gradient(145deg,#081118,#030609)!important;
  border-right:1px solid rgba(214,168,79,.18)!important;
}
.sg-official-auth .auth-form-panel{
  background:
    radial-gradient(circle at 50% 5%,rgba(214,168,79,.055),transparent 28%),
    #04080b!important;
}
.sg-official-auth .auth-form-wrap,
.sg-official-auth .sg-mini,
.sg-official-auth .card{
  background:
    linear-gradient(180deg,rgba(255,255,255,.032),rgba(255,255,255,.008)),
    var(--sg-panel)!important;
  border:1px solid rgba(214,168,79,.25)!important;
  border-radius:20px!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 28px 90px rgba(0,0,0,.48),
    0 0 0 1px rgba(0,0,0,.30)!important;
}
.sg-official-auth .auth-form-wrap{padding:32px!important}
.sg-official-auth .sg-mini{padding:30px!important}
.sg-official-auth .card{padding:28px!important}

.sg-official-auth h1,
.sg-official-auth h2,
.sg-official-auth h3{color:#f7f9fa!important}
.sg-official-auth .muted,
.sg-official-auth p{color:var(--sg-muted)}
.sg-official-auth .eyebrow{
  color:var(--sg-green)!important;
  letter-spacing:.18em!important;
}
.sg-official-auth label{
  color:#cbd3d8!important;
  font-weight:700!important;
}
.sg-official-auth input,
.sg-official-auth select,
.sg-official-auth textarea{
  background:#050a0e!important;
  color:#f6f8f9!important;
  border:1px solid rgba(215,226,235,.14)!important;
  border-radius:11px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018)!important;
}
.sg-official-auth input:focus,
.sg-official-auth select:focus,
.sg-official-auth textarea:focus{
  outline:none!important;
  border-color:rgba(245,217,133,.65)!important;
  box-shadow:0 0 0 3px rgba(214,168,79,.10)!important;
}
.sg-official-auth .btn.primary,
.sg-official-auth button:not(.danger){
  color:#100c04!important;
  background:
    linear-gradient(180deg,#f5d985 0%,#d6a84f 45%,#9a712b 100%)!important;
  border:1px solid rgba(255,230,163,.58)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -1px 0 rgba(69,42,4,.55),
    0 10px 30px rgba(214,168,79,.14)!important;
  font-weight:900!important;
}
.sg-official-auth .btn.primary:hover,
.sg-official-auth button:not(.danger):hover{
  filter:brightness(1.06)!important;
}
.sg-official-auth a{color:var(--sg-gold-hi)}
.sg-official-auth .notice.success,
.sg-official-auth .ok{
  background:rgba(57,245,138,.08)!important;
  border-color:rgba(57,245,138,.28)!important;
  color:#caffdc!important;
}
.sg-official-auth .notice.danger,
.sg-official-auth .err{
  background:rgba(255,63,130,.08)!important;
  border-color:rgba(255,63,130,.28)!important;
  color:#ffd5e4!important;
}
.sg-official-auth button.danger{
  background:linear-gradient(180deg,#ff6b72,#a92f45)!important;
  color:#fff!important;
  border:1px solid rgba(255,143,150,.40)!important;
}
.sg-official-auth .auth-proof{color:#8f9aa2!important}
.sg-official-auth .auth-proof span::first-letter{color:var(--sg-green)}
.sg-official-auth .auth-orbit{
  border-color:rgba(214,168,79,.15)!important;
}
.sg-official-auth .auth-orbit:before,
.sg-official-auth .auth-orbit:after{
  border-color:rgba(214,168,79,.12)!important;
}
.sg-official-auth .auth-orbit i{
  background:var(--sg-green)!important;
  box-shadow:0 0 0 7px rgba(57,245,138,.055),0 0 18px rgba(57,245,138,.22)!important;
}
.sg-official-auth .auth-orbit span{
  font-size:0!important;
  background:
    url('/assets/img/favicon.svg') center/64% no-repeat,
    radial-gradient(circle at 50% 35%,#171108,#060402 70%)!important;
  border:1px solid rgba(245,217,133,.50)!important;
  box-shadow:0 0 0 7px rgba(214,168,79,.045),0 0 34px rgba(214,168,79,.18)!important;
}

/* ============================================================
   SITE PUBLICO
   ============================================================ */
body.sg-official-public{
  background:
    radial-gradient(circle at 75% 0,rgba(214,168,79,.10),transparent 30%),
    linear-gradient(180deg,#071017 0%,#030609 62%,#020304 100%)!important;
}
.sg-official-public .topbar{
  background:rgba(3,6,9,.86)!important;
  border-bottom:1px solid rgba(214,168,79,.13)!important;
}
.sg-official-public .brand{
  width:250px!important;
  height:58px!important;
}
.sg-official-public .eyebrow{color:var(--sg-green)!important}
.sg-official-public h1,
.sg-official-public h2,
.sg-official-public h3{color:#f5f7f8!important}
.sg-official-public .btn.primary,
.sg-official-public .btn.gold{
  color:#100c04!important;
  background:linear-gradient(180deg,#f5d985,#d6a84f 48%,#966d28)!important;
  border:1px solid rgba(255,229,157,.48)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.48),0 10px 26px rgba(214,168,79,.13)!important;
}
.sg-official-public .status,
.sg-official-public .status i{
  color:var(--sg-green)!important;
}
.sg-official-public .status i{background:var(--sg-green)!important}
.sg-official-public .feature,
.sg-official-public .device-card{
  background:
    linear-gradient(180deg,rgba(255,255,255,.028),rgba(255,255,255,.006)),
    var(--sg-panel)!important;
  border-color:rgba(214,168,79,.18)!important;
}
.sg-official-public .feature .ic{
  color:var(--sg-gold-hi)!important;
  border-color:rgba(214,168,79,.28)!important;
  background:rgba(214,168,79,.06)!important;
}

/* ============================================================
   APP / CLIENTE / ADMIN - preservar layout premium e uniformizar marca
   ============================================================ */
body.sg-official-app.app-bg,
.sg-official-app .app-main{
  background-color:transparent;
}
.sg-official-app .sidebar{
  background:
    linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,0)),
    #050a0e!important;
  border-right-color:rgba(214,168,79,.15)!important;
}
.sg-official-app .panel,
.sg-official-app .admin-kpi{
  border-color:rgba(215,226,235,.12);
}
.sg-official-app .sidebar nav a.active:not(.sg-nav-tone-green):not(.sg-nav-tone-pink){
  border-color:rgba(214,168,79,.40)!important;
}
.sg-official-app .status-pill.on,
.sg-official-app .system-live,
.sg-official-app .live-dot{
  color:var(--sg-green)!important;
}
.sg-official-app .status-pill.on::before,
.sg-official-app .system-live i,
.sg-official-app .live-dot{
  background:var(--sg-green)!important;
}

/* Logo antiga dentro de navegacao lateral do cliente */
.sg-official-app .sidebar .logo:not(.sg-admin-logo){
  width:225px!important;
  height:56px!important;
  min-height:56px!important;
}

/* ============================================================
   RESPONSIVO
   ============================================================ */
@media(max-width:980px){
  .sg-official-public .brand{width:205px!important;height:48px!important;min-height:48px!important}
  .sg-official-auth .auth-mobile-logo{display:block!important;margin-bottom:22px!important}
  .sg-official-auth .auth-mobile-logo .logo{width:220px!important;height:52px!important;min-height:52px!important}
  .sg-official-auth .auth-form-wrap{padding:26px!important}
}
@media(max-width:560px){
  .sg-official-auth .auth-form-wrap,
  .sg-official-auth .sg-mini,
  .sg-official-auth .card{
    border-radius:16px!important;
    padding:22px!important;
  }
  .sg-official-auth .auth-form-wrap h2{font-size:32px!important}
  .sg-official-public .brand{width:178px!important;height:44px!important;min-height:44px!important}
}

/* SG_FINAL_VISUAL_PATCH_20260918
   Ajustes finais: faixa pública, logo no admin, logo nas telas de segurança
*/
.sgdl-download-ribbon{
  background:
    linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,0)),
    #050a0e!important;
  border-bottom:1px solid rgba(214,168,79,.20)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.18)!important;
}
.sgdl-ribbon-inner{
  color:#c9d2d8!important;
}
.sgdl-ribbon-inner b{
  color:#f5d985!important;
}
.sgdl-ribbon-inner .primary,
.sgdl-ribbon-inner a.primary{
  color:#100c04!important;
  background:linear-gradient(180deg,#f5d985,#d6a84f 48%,#966d28)!important;
  border:1px solid rgba(255,229,157,.48)!important;
}
.sgdl-ribbon-inner .secondary,
.sgdl-ribbon-inner a.secondary{
  color:#d9e0e6!important;
  background:#071016!important;
  border:1px solid rgba(214,168,79,.24)!important;
}

/* Logo oficial nas telas administrativas de segurança (2FA / SMTP etc.) */
body.sg-official-auth .card::before,
body.sg-official-auth .sg-mini::before{
  content:"";
  display:block;
  width:230px;
  max-width:72%;
  height:58px;
  margin:0 0 18px;
  background:url('/assets/img/senaguard-control-oficial.png') left center/contain no-repeat;
}

/* Admin premium: logo oficial antes do título da navegação lateral */
body.sg-official-app .sg-admin-sidebar>div:first-child::before{
  content:"";
  display:block;
  width:220px;
  max-width:88%;
  height:58px;
  margin:2px 8px 12px;
  background:url('/assets/img/senaguard-control-oficial.png') left center/contain no-repeat;
}

/* Evita duplicidade se a logo HTML já estiver visível */
body.sg-official-app .sg-admin-sidebar .sg-admin-logo{
  display:none!important;
}

/* Cadastro / telas compactas: mais presença para a marca */
body.sg-official-auth .auth-mobile-logo .logo,
body.sg-official-auth .logo.centered{
  width:245px!important;
  height:58px!important;
  min-height:58px!important;
}