/* Temas claro e escuro em todas as páginas públicas (17/10/2026, Felipe: "Essa tela não está preparada para os temas
   também… Da uma corrigida em todas"). O site força cabeçalho e topo escuros (site.css, pages.css); no modo claro eles
   ficam claros, como já é na página inicial. O rodapé continua escuro nos dois temas. */

/* Logo com texto escuro no modo claro (marcação img.tema-escuro + img.tema-claro) */
.tema-claro { display: none !important; }
html[data-theme="light"] .tema-claro { display: block !important; }
html[data-theme="light"] .tema-escuro { display: none !important; }

/* Rodapé: fundo sempre escuro, então os textos ficam sempre claros (no modo claro a faixa
   "Precisa de ajuda para começar?" sumia, com texto escuro sobre o fundo escuro). */
.site-footer, .stock-footer { --ink-inverse: #f5fbfb; --muted-inverse: #b7c9cc; --line-dark: rgba(222, 247, 247, .14); }

/* Cabeçalho das páginas internas (Planos, Como começar, Ajuda, Baixar…) */
html[data-theme="light"] .site-header.inner-header:not(.sgq-header) {
  --bg: #f4f9f9; --bg-elevated: #ffffff; --ink-inverse: #102226; --muted-inverse: #4d666a; --line-dark: rgba(15, 49, 55, .16);
  background: rgba(244, 249, 249, .96); border-bottom: 1px solid rgba(15, 49, 55, .1);
}
html[data-theme="light"] .main-nav a[aria-current="page"] { color: #087c79; }

/* Topo escuro das páginas internas */
html[data-theme="light"] .page-hero {
  --ink-inverse: #102226; --muted-inverse: #4d666a;
  background: radial-gradient(ellipse at 85% -10%, rgba(91, 212, 206, .22), transparent 55%), #eef6f6; color: #102226;
}
html[data-theme="light"] .page-hero .eyebrow { color: #087c79; }
html[data-theme="light"] :is(.page-hero, .security-hero-copy) p:not(.eyebrow) { color: #496166; }

/* Modo escuro: o botão escuro ficava escuro sobre o fundo escuro e parecia só texto */
html[data-theme="dark"] .button-dark { background: #1d4d53; color: #ffffff; border: 1px solid rgba(91, 212, 206, .45); }
html[data-theme="dark"] .button-dark:hover { background: #23606a; }
html[data-theme="light"] .page-hero .guide-switch .button-secondary { color: #102226; border-color: rgba(15, 49, 55, .2); background: #ffffff; }

/* Menu da página do Estoque: destaca a página atual, como nas outras */
.stock-paths a[aria-current="page"] { color: #5bd4ce; font-weight: 700; }
html[data-theme="light"] .stock-landing .stock-paths a[aria-current="page"] { color: #087c79; }

/* Botão de tema em todas as páginas (18/10/2026, Felipe: "Faltou aquele botão de modo light e dark em alguns dele").
   A escolha vale no site, nas telas de entrar/criar conta e no portal (tema-init.js e tema.js). */

/* Estoque: botão no mesmo lugar do /kanban; no claro o cabeçalho é claro, então o botão fica escuro */
html[data-theme="light"] .stock-landing .stock-header .icon-button { color: #102226; border-color: rgba(15, 49, 55, .2); }
@media (max-width: 820px) { .stock-header-actions .icon-button { display: none; } }
/* Entre 1021 e 1260 pontos o menu do Estoque já quebrava em duas linhas: "Baixar para Windows" vira "Baixar", como no
   celular, e os espaços ficam menores, para tudo caber numa linha só. */
@media (min-width: 1021px) and (max-width: 1260px) {
  .stock-header .download-label-long { display: none; }
  .stock-header .download-label-short { display: inline; }
  .stock-header .stock-paths { gap: .8rem; }
  .stock-header .brand, .stock-header .brand img { width: 170px; }
  .stock-header-inner { gap: 1rem; }
}
@media (min-width: 1021px) and (max-width: 1120px) {
  .stock-header .stock-paths { gap: .6rem; }
  .stock-header .brand, .stock-header .brand img { width: 150px; }
  .stock-header-inner { gap: .75rem; }
  .stock-header-actions { gap: .5rem; }
}

/* Telas de entrar e criar conta: no claro ficam como sempre foram; no escuro o lado do formulário usa as cores do
   portal escuro. O painel da marca, à esquerda, é escuro nos dois temas. */
.auth-top .back-link + .back-link { margin-left: auto; }
.auth-top .icon-button { flex: 0 0 auto; }
html[data-theme="dark"] body.auth-page {
  --ink: #e8f2f3; --ink-soft: #9fb8bc; --line: #1e363b; --surface: #081518; --surface-strong: #0d2429; --surface-alt: #10282d;
  --teal-dark: #4fd1c9; --ux-focus: #4fd1c9;
  background: #081518; color: #e8f2f3;
}
html[data-theme="dark"] .auth-page .auth-main { background: #081518; }
html[data-theme="dark"] .auth-page .back-link { color: #a9c3c6; }
html[data-theme="dark"] .auth-page .back-link:hover { color: #4fd1c9; }
html[data-theme="dark"] .auth-page .auth-card h1 { color: #e8f2f3; }
html[data-theme="dark"] .auth-page :is(.auth-intro, .auth-switch, .auth-context, .checkbox, .form-section p.section-help, .field small, .registration-choice-help) { color: #9fb8bc; }
html[data-theme="dark"] .auth-page .auth-main .inline-help { color: #a9c3c6; }
html[data-theme="dark"] .auth-page :is(.auth-link, .password-toggle, .eyebrow.dark) { color: #4fd1c9; }
html[data-theme="dark"] .auth-page .form-section { background: #0d2429; border-color: #1e363b; box-shadow: none; }
html[data-theme="dark"] .auth-page .form-section legend { color: #e8f2f3; }
html[data-theme="dark"] .auth-page :is(.form-section legend span, .form-subsection summary span) { color: #7c9ea2; }
html[data-theme="dark"] .auth-page .form-subsection { border-top-color: #1e363b; }
html[data-theme="dark"] .auth-page .form-subsection summary { color: #c9dcde; }
html[data-theme="dark"] .auth-page .form-subsection summary:hover { color: #4fd1c9; }
html[data-theme="dark"] .auth-page :is(.field label, .field > span:first-child) { color: #d3e3e5; }
html[data-theme="dark"] .auth-page :is(.field input, .field select, .field textarea) { background: #0a1c20; color: #e8f2f3; border-color: #2b5157; }
html[data-theme="dark"] .auth-page :is(.field input, .field select, .field textarea):hover { border-color: #3f6f75; }
html[data-theme="dark"] .auth-page :is(.field input, .field select, .field textarea):focus { background: #0a1c20; border-color: #4fd1c9; box-shadow: 0 0 0 3px rgba(79, 209, 201, .18); }
html[data-theme="dark"] .auth-page .field :is(input, textarea)::placeholder { color: #5f8085; }
html[data-theme="dark"] .auth-page .field input:-webkit-autofill { -webkit-box-shadow: 0 0 0 100px #0a1c20 inset; -webkit-text-fill-color: #e8f2f3; caret-color: #e8f2f3; }
html[data-theme="dark"] .auth-page .field[data-field-state="valid"] :is(input, select) { border-color: #2fb39a; }
html[data-theme="dark"] .auth-page .field[data-field-state="invalid"] :is(input, select) { border-color: #e0707a; }
html[data-theme="dark"] .auth-page .field[data-field-state="valid"] .field-status, html[data-theme="dark"] .auth-page .step-status { color: #6fd6b5; }
html[data-theme="dark"] .auth-page .field[data-field-state="invalid"] .field-status { color: #ff9aa3; }
html[data-theme="dark"] .auth-page .checkbox input { accent-color: #4fd1c9; }
html[data-theme="dark"] .auth-page .auth-submit { background: #4fd1c9; color: #062a2d; }
html[data-theme="dark"] .auth-page .auth-submit:hover:not(:disabled) { background: #74ded8; }
html[data-theme="dark"] .auth-page .registration-security-note { background: #0f2f34; color: #b9d0d3; }
html[data-theme="dark"] .auth-page .registration-security-note strong { color: #e8f2f3; }
html[data-theme="dark"] .auth-page .registration-reassurance li { background: #0f2f34; border-color: #2b5157; color: #8ff3ec; }
html[data-theme="dark"] .auth-page .registration-progress li { color: #7c9ea2; }
html[data-theme="dark"] .auth-page .registration-progress li::before { background: #1e363b; }
html[data-theme="dark"] .auth-page .registration-progress span { border-color: #2b5157; background: #081518; color: #9fb8bc; }
html[data-theme="dark"] .auth-page .registration-progress li:is([aria-current="step"], [data-complete]) { color: #4fd1c9; }
html[data-theme="dark"] .auth-page .registration-progress li[aria-current="step"] span { border-color: #4fd1c9; background: #4fd1c9; color: #062a2d; box-shadow: 0 0 0 4px rgba(79, 209, 201, .15); }
html[data-theme="dark"] .auth-page .registration-progress li[data-complete] span { border-color: #2cb3ab; background: rgba(79, 209, 201, .15); color: #8ff3ec; }
html[data-theme="dark"] .auth-page .registration-progress li:is([data-complete], [aria-current="step"])::before { background: #2cb3ab; }
html[data-theme="dark"] .collaborator-registration .registration-progress { background: #0d2429; }
html[data-theme="dark"] .auth-page .registration-actions { background: #081518; }
html[data-theme="dark"] .auth-page .registration-summary { border-color: #1e363b; }
html[data-theme="dark"] .auth-page .registration-summary div { border-color: #1e363b; }
html[data-theme="dark"] .auth-page .registration-summary dt { color: #7c9ea2; }
html[data-theme="dark"] .auth-page .registration-summary dd { color: #e8f2f3; }
html[data-theme="dark"] .auth-page .form-feedback[data-type="error"] { background: #3a1519; color: #ffb3b8; }
html[data-theme="dark"] .auth-page .form-feedback[data-type="warning"] { background: #3a2a0c; color: #f6cf8a; }
html[data-theme="dark"] .auth-page .form-feedback[data-type="success"] { background: #0f3326; color: #9fe3c2; }
html[data-theme="dark"] .auth-page .form-feedback[data-type="info"] { background: #0f2f34; color: #b9e3ea; }
html[data-theme="dark"] .auth-page .success-panel { background: #0f3326; border-color: #1f6b4c; color: #c9f0dc; }
html[data-theme="dark"] .auth-page .dev-notice { background: #3a2a0c; color: #f6cf8a; }
html[data-theme="dark"] .auth-page .registration-kind a { border-color: #2b5157; color: #b9d0d3; }
html[data-theme="dark"] .auth-page .registration-kind a[aria-current="page"] { background: #4fd1c9; border-color: #4fd1c9; color: #062a2d; }
html[data-theme="dark"] .collaborator-registration [data-join-preview] { background: #0f2f34; color: #b9e3ea; }