/* =========================================================================
   PAINEL DO CLIENTE — 100% da página, de ponta a ponta, sempre responsivo.
   O wrapper vira uma camada própria por cima de todo o site (cabeçalho e
   rodapé do tema WordPress somem quando o portal está ativo).
   ========================================================================= */
#csa-fullpage-root{ position:relative; }
body.csa-fullpage-active{ margin:0 !important; overflow:hidden; }
body.csa-fullpage-active #csa-fullpage-root{
  position:fixed; inset:0; z-index:100000; overflow-y:auto; -webkit-overflow-scrolling:touch;
  background:var(--bg-alt, #f6f6f8);
}
body.csa-fullpage-active.admin-bar #csa-fullpage-root{ top:32px; }
@media(max-width:782px){ body.csa-fullpage-active.admin-bar #csa-fullpage-root{ top:46px; } }
/* Esconde o cabeçalho/rodapé/menu do tema do WordPress quando o portal está em tela cheia,
   sem depender de saber o nome exato do tema instalado. */
body.csa-fullpage-active > header, body.csa-fullpage-active > footer,
body.csa-fullpage-active .site-header, body.csa-fullpage-active .site-footer,
body.csa-fullpage-active #masthead, body.csa-fullpage-active #colophon,
body.csa-fullpage-active > nav, body.csa-fullpage-active #page > *:not(#csa-fullpage-root){
  display:none !important;
}

.csa-portal{ display:flex; flex-direction:column; gap:20px; min-height:100vh; width:100%; border-radius:0 !important; }
.csa-portal-top{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;
  position:sticky; top:0; z-index:40; background:var(--bg-alt); padding:4px 0 10px; margin:-4px 0 0; }

/* ---------- nav do portal: dock flutuante estilo macOS (vira Bottom Nav no mobile) ---------- */
.csa-portal-nav{ position:fixed; left:0; right:0; bottom:20px; z-index:9000; display:flex; justify-content:center; gap:6px;
  pointer-events:none; animation:csaDockRise .5s var(--ease) .1s both; }
@keyframes csaDockRise{ from{ opacity:0; transform:translate(-50%, 16px); } to{ opacity:1; transform:translate(-50%, 0); } }
.csa-portal-nav button{ pointer-events:auto; position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  width:62px; height:58px; background:transparent; border:none; color:var(--text-dim); border-radius:16px; font-size:10.5px; font-weight:650; cursor:pointer;
  transition:transform .28s cubic-bezier(.34,1.56,.64,1), background .22s ease, color .18s ease; }
.csa-portal-nav{ padding:10px 14px; border-radius:28px; background:var(--glass-bg); border:1px solid var(--glass-border);
  -webkit-backdrop-filter:blur(28px) saturate(190%); backdrop-filter:blur(28px) saturate(190%); box-shadow:var(--shadow-lg);
  width:max-content; margin:0 auto; left:50%; transform:translateX(-50%); }
.csa-portal-nav button::before{ content:attr(data-ico); font-size:21px; line-height:1; transition:transform .28s cubic-bezier(.34,1.56,.64,1); }
.csa-portal-nav button:hover{ transform:translateY(-10px) scale(1.12); background:var(--surface-3); color:var(--text); }
.csa-portal-nav button:hover::before{ transform:scale(1.1); }
.csa-portal-nav button:active{ transform:translateY(-4px) scale(.96); }
.csa-portal-nav button.active{ color:var(--red); background:var(--red-soft); }
.csa-portal-nav button.active::after{ content:''; position:absolute; bottom:5px; width:4px; height:4px; border-radius:50%; background:var(--red);
  box-shadow:0 0 8px 1px var(--red-glow); }

@media(max-width:900px){
  .csa-portal-nav{ left:0; right:0; bottom:0; transform:none; width:100%; border-radius:0; justify-content:space-around;
    border:none; border-top:1px solid var(--border-soft); padding:8px 6px calc(8px + env(safe-area-inset-bottom)); box-shadow:0 -8px 30px -14px rgba(20,20,25,.15);
    animation:none; }
  .csa-portal-nav button{ width:auto; flex:1; height:auto; padding:6px 2px; border-radius:12px; }
  .csa-portal-nav button::before{ font-size:19px; }
  .csa-portal-nav button:hover{ transform:none; }
}

.csa-portal-view{ display:none; }
.csa-portal-view.active{ display:block; animation:csaFade .3s ease; }

/* ---------- login ---------- */
body{ min-height:100vh; }
.csa-fullpage-login{ display:flex; align-items:center; justify-content:center; min-height:100vh; background:var(--bg-alt,#f6f6f8); padding:20px; }
.csa-login-wrap{ max-width:380px; width:100%; margin:0 auto; background:var(--surface,#ffffff); border:1px solid var(--border-soft,#eeeef1); border-radius:22px; padding:36px;
  color:var(--text,#0b0b0d); box-shadow:0 26px 60px -18px rgba(20,20,25,.16); animation:csaScaleIn .4s var(--ease) both; position:relative; z-index:1; }
.csa-login-wrap input{ width:100%; margin-bottom:12px; padding:11px 14px; border-radius:11px; border:1px solid var(--border,#ececef); background:var(--bg-alt,#fbfbfc); color:var(--text,#0b0b0d); font-size:13.5px; transition:border-color .18s ease, box-shadow .18s ease; }
.csa-login-wrap input:focus{ outline:none; border-color:#ff3b30; box-shadow:0 0 0 3px rgba(255,59,48,.09); }
.csa-login-wrap .login-submit input[type=submit]{ width:100%; background:linear-gradient(135deg,#ff3b30,#d70015); border:none; color:#fff; font-weight:700; cursor:pointer; padding:13px 14px; border-radius:11px; box-shadow:0 10px 24px -10px rgba(255,59,48,.35); transition:transform .18s ease, box-shadow .18s ease; }
.csa-login-wrap .login-submit input[type=submit]:hover{ transform:translateY(-2px); box-shadow:0 14px 30px -10px rgba(255,59,48,.45); }