/* =========================================================
   DNA DO REALITY — DESIGN SYSTEM GLOBAL
   Padronização de botões + rodapé
   2026-08-19
========================================================= */

:root{
  --dna-action-red:#ef0b16;
  --dna-action-red-hover:#ff1a25;
  --dna-action-dark:#121212;
  --dna-action-dark-hover:#1a1a1a;
  --dna-action-border:rgba(255,255,255,.16);
  --dna-action-text:#fff;
  --dna-action-radius:11px;
}

/* BOTÕES DE AÇÃO — não afeta controles apenas de ícone */
:is(
  .btn,
  .btn-prof,
  .checkout-btn,
  .curso-btn,
  .btn-cadastro,
  .btn-footer,
  .btn-submit,
  .m-btn,
  .btn-social-blog,
  .btn-configurar-perfil
){
  min-height:46px !important;
  padding:0 18px !important;
  border-radius:var(--dna-action-radius) !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  font-family:"Montserrat","Poppins",sans-serif !important;
  font-size:.88rem !important;
  font-weight:800 !important;
  line-height:1 !important;
  text-decoration:none !important;
  cursor:pointer;
  transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease !important;
}

/* Primário = vermelho sólido, como na Mentoria */
:is(
  .btn-primary,
  .btn-submit,
  .checkout-btn,
  .curso-btn-pulse,
  .btn-cadastro,
  .btn-prof:not(.secondary):not(.ghost):not(.danger),
  .m-btn.primary,
  .btn-configurar-perfil
){
  color:var(--dna-action-text) !important;
  background:var(--dna-action-red) !important;
  border:1px solid var(--dna-action-red) !important;
  box-shadow:none !important;
  animation:none !important;
}

:is(
  .btn-primary,
  .btn-submit,
  .checkout-btn,
  .curso-btn-pulse,
  .btn-cadastro,
  .btn-prof:not(.secondary):not(.ghost):not(.danger),
  .m-btn.primary,
  .btn-configurar-perfil
)::after{
  display:none !important;
  content:none !important;
}

:is(
  .btn-primary,
  .btn-submit,
  .checkout-btn,
  .curso-btn-pulse,
  .btn-cadastro,
  .btn-prof:not(.secondary):not(.ghost):not(.danger),
  .m-btn.primary,
  .btn-configurar-perfil
):hover{
  color:#fff !important;
  background:var(--dna-action-red-hover) !important;
  border-color:var(--dna-action-red-hover) !important;
  transform:translateY(-2px) !important;
  box-shadow:0 9px 24px rgba(229,9,20,.24) !important;
}

/* Secundário = preto/chumbo com borda discreta */
:is(
  .btn-secondary,
  .btn.ghost,
  .btn.secondary,
  .btn-prof.secondary,
  .btn-prof.ghost,
  .m-btn:not(.primary),
  .m-btn.secondary,
  .m-btn.ghost,
  .btn-footer,
  .btn-google,
  .btn-social-blog
){
  color:#fff !important;
  background:var(--dna-action-dark) !important;
  border:1px solid var(--dna-action-border) !important;
  box-shadow:none !important;
  animation:none !important;
}

:is(
  .btn-secondary,
  .btn.ghost,
  .btn.secondary,
  .btn-prof.secondary,
  .btn-prof.ghost,
  .m-btn:not(.primary),
  .m-btn.secondary,
  .m-btn.ghost,
  .btn-footer,
  .btn-google,
  .btn-social-blog
):hover{
  color:#fff !important;
  background:var(--dna-action-dark-hover) !important;
  border-color:rgba(255,255,255,.28) !important;
  transform:translateY(-2px) !important;
  box-shadow:0 9px 22px rgba(0,0,0,.22) !important;
}

/* Ações destrutivas continuam semanticamente vermelhas */
:is(.btn-danger-blog,.btn-prof.danger,.btn.danger){
  color:#fff !important;
  background:#a80e16 !important;
  border:1px solid #c91822 !important;
}

/* SVGs acompanham a cor do botão */
:is(.btn,.btn-prof,.checkout-btn,.curso-btn,.btn-cadastro,.btn-footer,.btn-submit,.m-btn) svg{
  stroke:currentColor;
}

/* =========================================================
   RODAPÉ — compacto, alinhado e consistente em todo portal
========================================================= */
.footer,
.site-footer{
  min-height:0 !important;
  padding:52px 0 22px !important;
  border-top:1px solid rgba(255,255,255,.08) !important;
  background:
    radial-gradient(circle at 8% 0%,rgba(120,0,8,.20),transparent 32%),
    linear-gradient(180deg,#080808 0%,#050505 100%) !important;
}

.footer > .container,
.site-footer > .container{
  min-height:0 !important;
  display:block !important;
}

.footer-grid{
  display:grid !important;
  grid-template-columns:minmax(250px,1.35fr) minmax(150px,.7fr) minmax(170px,.78fr) minmax(220px,1fr) !important;
  gap:clamp(28px,4vw,58px) !important;
  min-height:0 !important;
  align-items:start !important;
  margin:0 0 38px !important;
}

.footer-brand{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:18px !important;
  margin:0 !important;
}

.footer-logo-wrap{
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  color:#fff !important;
  text-decoration:none !important;
}

.footer-logo{
  width:54px !important;
  height:54px !important;
  flex:0 0 54px !important;
  object-fit:contain !important;
}

.footer-logo-wrap .logo{
  margin:0 0 5px !important;
  line-height:1 !important;
}

.footer-brand-text{
  max-width:330px !important;
  margin:0 !important;
  color:rgba(255,255,255,.68) !important;
  font-size:.92rem !important;
  line-height:1.65 !important;
}

.footer-col,
.footer-col1,
.footer-col2,
.footer-col3{
  min-width:0 !important;
}

.footer-col h4,
.footer-col1 h4,
.footer-col2 h4,
.footer-col3 h4{
  margin:2px 0 16px !important;
  color:#fff !important;
  font-family:"Montserrat","Poppins",sans-serif !important;
  font-size:.95rem !important;
  font-weight:800 !important;
  letter-spacing:.02em !important;
}

.footer-col ul,
.footer-col1 ul,
.footer-col3 ul{
  display:grid !important;
  gap:10px !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}

.footer-col ul a,
.footer-col1 ul a,
.footer-col3 ul a{
  color:rgba(255,255,255,.62) !important;
  font-size:.88rem !important;
  line-height:1.45 !important;
  text-decoration:none !important;
  transition:color .2s ease,transform .2s ease !important;
}

.footer-col ul a:hover,
.footer-col1 ul a:hover,
.footer-col3 ul a:hover{
  color:#fff !important;
}

.footer-socials{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:9px !important;
  margin:0 !important;
}

.footer-socials .social-link{
  width:38px !important;
  height:38px !important;
  border-radius:10px !important;
  background:#111 !important;
  border:1px solid rgba(255,255,255,.10) !important;
}

.footer-socials .social-link svg{
  width:17px !important;
  height:17px !important;
}

.footer-col2{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:16px !important;
  padding:0 !important;
  align-self:start !important;
}

.footer-contact-text{
  max-width:280px !important;
  margin:0 !important;
  color:rgba(255,255,255,.68) !important;
  font-size:.9rem !important;
  line-height:1.65 !important;
}

.footer-col2 .btn-footer{
  min-width:0 !important;
  width:auto !important;
}

.footer-bottom{
  width:100% !important;
  margin:0 !important;
  padding-top:20px !important;
  border-top:1px solid rgba(255,255,255,.08) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
  color:rgba(255,255,255,.42) !important;
  font-size:.78rem !important;
}

.footer-bottom a{color:#fff !important;text-decoration:none !important}

@media(max-width:980px){
  .footer-grid{
    grid-template-columns:1.2fr .8fr .8fr !important;
  }
  .footer-col2{
    grid-column:1/-1 !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    padding-top:20px !important;
    border-top:1px solid rgba(255,255,255,.06) !important;
  }
}

@media(max-width:700px){
  .footer,.site-footer{padding:42px 0 20px !important}
  .footer-grid{
    grid-template-columns:1fr 1fr !important;
    gap:30px 22px !important;
    margin-bottom:30px !important;
  }
  .footer-brand{
    grid-column:1/-1 !important;
    align-items:flex-start !important;
    text-align:left !important;
  }
  .footer-logo-wrap{
    flex-direction:row !important;
    align-items:center !important;
  }
  .footer-socials{justify-content:flex-start !important}
  .footer-col2{
    grid-column:1/-1 !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    text-align:left !important;
  }
  .footer-bottom{
    flex-direction:column !important;
    align-items:flex-start !important;
    text-align:left !important;
  }
}

@media(max-width:430px){
  .footer-grid{grid-template-columns:1fr !important}
  .footer-col1,.footer-col3{grid-column:1 !important}
  :is(.btn,.btn-prof,.checkout-btn,.curso-btn,.btn-cadastro,.btn-footer,.btn-submit,.m-btn,.btn-configurar-perfil){
    white-space:normal !important;
  }
}


/* =========================================================
   PASSWORD VISIBILITY CONTROL - GLOBAL / DYNAMIC LOGIN
   The login menu is rebuilt by area-aluno.js after Firebase auth resolves.
   Keep the eye visible and positioned after that dynamic render as well.
========================================================= */
.site-header .login-dropdown .password-field,
.login-dropdown .password-field,
.password-field {
  position: relative !important;
  width: 100% !important;
}

.site-header .login-dropdown .password-field > input,
.login-dropdown .password-field > input,
.password-field > input {
  width: 100% !important;
  padding-right: 52px !important;
}

.site-header .login-dropdown .password-toggle,
.login-dropdown .password-toggle,
.password-field .password-toggle {
  position: absolute !important;
  right: 8px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  rotate: none !important;
  z-index: 10000 !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #ffffff !important;
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  place-items: center !important;
  cursor: pointer !important;
  writing-mode: horizontal-tb !important;
  --cms-move-x: 0px !important;
  --cms-move-y: 0px !important;
  --cms-rotate: 0deg !important;
}

.site-header .login-dropdown .password-toggle:hover,
.site-header .login-dropdown .password-toggle:focus-visible,
.login-dropdown .password-toggle:hover,
.login-dropdown .password-toggle:focus-visible {
  color: #fff !important;
  background: rgba(255,255,255,.08) !important;
  transform: translateY(-50%) !important;
}

.password-toggle svg {
  display: block !important;
  width: 21px !important;
  height: 21px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  pointer-events: none !important;
}

.password-toggle .eye-closed,
.password-toggle .eye-off { display: none !important; }
.password-toggle.is-visible .eye-open { display: none !important; }
.password-toggle.is-visible .eye-closed,
.password-toggle.is-visible .eye-off { display: block !important; }


/* Cadastro: mostrar/ocultar senha */
.cadastro-box .password-field{position:relative!important;display:block!important;width:100%!important;}
.cadastro-box .password-field>input{width:100%!important;padding-right:52px!important;margin:0!important;}
.cadastro-box .password-toggle{display:grid!important;visibility:visible!important;opacity:1!important;position:absolute!important;right:8px!important;top:50%!important;transform:translateY(-50%)!important;rotate:none!important;width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;padding:0!important;margin:0!important;border:0!important;border-radius:9px!important;background:transparent!important;color:#bdbdbd!important;z-index:9999!important;place-items:center!important;cursor:pointer!important;box-shadow:none!important;}
.cadastro-box .password-toggle:hover,.cadastro-box .password-toggle:focus-visible{color:#fff!important;background:rgba(255,255,255,.07)!important;outline:none!important;}
.cadastro-box .password-toggle svg{display:block!important;width:21px!important;height:21px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important;pointer-events:none!important;}
.cadastro-box .password-toggle .eye-closed,.cadastro-box .password-toggle .eye-off{display:none!important;}
.cadastro-box .password-toggle.is-visible .eye-open{display:none!important;}
.cadastro-box .password-toggle.is-visible .eye-closed,.cadastro-box .password-toggle.is-visible .eye-off{display:block!important;}