/* Tema claro + botões de tema/instalação. Carregado depois dos outros CSS. */
:root { color-scheme: dark; }
html[data-theme="light"] { color-scheme: light; }

/* botão de tema: mostra sol no escuro, lua no claro */
.theme-toggle svg { width: 18px; height: 18px; }
.theme-toggle .i-moon { display: none; }
html[data-theme="light"] .theme-toggle .i-sun { display: none; }
html[data-theme="light"] .theme-toggle .i-moon { display: block; }
.d-auth > .theme-toggle { position: fixed; top: 16px; right: 16px; z-index: 5; }

/* instalar app: só aparece quando o navegador permite */
.install-btn { display: none; }
html.can-install .install-btn { display: flex; }

html[data-theme="light"] {
  --bg: #f3f5f8;
  --bg-deep: #e8ecf1;
  --surface: #ffffff;
  --surface-2: #f6f8fb;
  --surface-3: #e9edf3;
  --line: rgba(15, 23, 42, 0.12);
  --line-strong: rgba(15, 23, 42, 0.24);
  --txt: #0f172a;
  --txt-dim: #38434f;
  --muted: #5b6676;
  --violet: #0f766e;
  --violet-hi: #0f766e;
  --violet-low: rgba(15, 118, 110, 0.10);
  --violet-glow: rgba(15, 118, 110, 0.28);
  --ok: #15803d;
  --bad: #be123c;
  --warn: #b45309;
  --shadow: 0 24px 60px -30px rgba(15, 23, 42, 0.35);
}

html[data-theme="light"] a:hover,
html[data-theme="light"] .link-btn:hover { color: #115e59; }
html[data-theme="light"] ::selection { background: rgba(15, 118, 110, 0.28); color: #0f172a; }
html[data-theme="light"] ::-webkit-scrollbar-track { background: #e8ecf1; }
html[data-theme="light"] ::-webkit-scrollbar-thumb { background: #b9c2cf; border-color: #e8ecf1; }
html[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: #9aa6b6; }

/* textos que eram brancos fixos */
html[data-theme="light"] .icon-btn:hover,
html[data-theme="light"] .d-menu button:hover,
html[data-theme="light"] .d-menu button.active,
html[data-theme="light"] .d-auth-tabs a.active,
html[data-theme="light"] .docs-nav a:hover,
html[data-theme="light"] .docs-nav a.active,
html[data-theme="light"] .brand,
html[data-theme="light"] .d-doc-brand,
html[data-theme="light"] .d-doc .d-doc-sec h2,
html[data-theme="light"] .d-auth-brand,
html[data-theme="light"] .d-logo { color: var(--txt); }
html[data-theme="light"] .stat-plan { background: linear-gradient(120deg, #0f172a, #0f766e); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* tons de verde-água claros demais para fundo branco */
html[data-theme="light"] .plan-badge, html[data-theme="light"] .table-btn,
html[data-theme="light"] .copy-field, html[data-theme="light"] .docs-copy,
html[data-theme="light"] td.code, html[data-theme="light"] .code,
html[data-theme="light"] .key-value, html[data-theme="light"] .endpoint-row code,
html[data-theme="light"] .docs-base-url, html[data-theme="light"] .docs-callout code,
html[data-theme="light"] .record-card .record-title, html[data-theme="light"] .method-post { color: #0f766e !important; }
html[data-theme="light"] .table-btn:hover, html[data-theme="light"] .copy-field:hover,
html[data-theme="light"] .docs-copy:hover { color: #fff !important; }
html[data-theme="light"] .btn-danger, html[data-theme="light"] .d-menu-out,
html[data-theme="light"] #profile-logout { color: #be123c !important; }

/* superfícies que eram escuras fixas */
html[data-theme="light"] .btn,
html[data-theme="light"] .icon-btn,
html[data-theme="light"] .d-user,
html[data-theme="light"] .consult-row .input,
html[data-theme="light"] .consult-row select { background: rgba(15, 23, 42, 0.03); }
html[data-theme="light"] .input, html[data-theme="light"] input[type=text],
html[data-theme="light"] input[type=email], html[data-theme="light"] input[type=password],
html[data-theme="light"] input[type=number], html[data-theme="light"] input:not([type]),
html[data-theme="light"] select, html[data-theme="light"] textarea,
html[data-theme="light"] .d-auth-tabs, html[data-theme="light"] .key-box,
html[data-theme="light"] .endpoint-row, html[data-theme="light"] .docs-base-url { background: #fff; }
html[data-theme="light"] .input:focus, html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus, html[data-theme="light"] textarea:focus { background: #fff; }
html[data-theme="light"] select option { background: #fff; color: var(--txt); }
html[data-theme="light"] .input::placeholder, html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder { color: #8a94a3; }

html[data-theme="light"] .card, html[data-theme="light"] .d-auth-card,
html[data-theme="light"] .consult-card, html[data-theme="light"] .table-wrap,
html[data-theme="light"] .upgrade-card, html[data-theme="light"] .docs-code-card,
html[data-theme="light"] .docs-hero, html[data-theme="light"] .admin-account-dialog,
html[data-theme="light"] .modal, html[data-theme="light"] .toast {
  background: #fff;
  box-shadow: var(--shadow);
}
html[data-theme="light"] .d-side { background: linear-gradient(180deg, #ffffff, #f3f5f8); }
html[data-theme="light"] .d-bar, html[data-theme="light"] .docs-nav,
html[data-theme="light"] .docs-top { background: rgba(243, 245, 248, 0.85); }
html[data-theme="light"] .d-menu button:hover { background: rgba(15, 23, 42, 0.05); }
html[data-theme="light"] .d-menu button.active { background: linear-gradient(100deg, rgba(15, 118, 110, 0.16), rgba(15, 118, 110, 0.04)); }

html[data-theme="light"] .data-field, html[data-theme="light"] .record-card .data-field,
html[data-theme="light"] .photo-card, html[data-theme="light"] .photo-preview { background: #fff; }
html[data-theme="light"] .data-field:hover, html[data-theme="light"] .record-card .data-field:hover { background: #f1f5f9; }
html[data-theme="light"] .record-card, html[data-theme="light"] .list-item { background: #fff; }
html[data-theme="light"] .record-card .record-title { background: rgba(15, 118, 110, 0.07); }
html[data-theme="light"] pre, html[data-theme="light"] .code-block, html[data-theme="light"] .docs-code { background: #f1f5f9; color: #1e293b; }
html[data-theme="light"] tbody td { border-bottom-color: rgba(15, 23, 42, 0.07); }
html[data-theme="light"] .admin-password-target, html[data-theme="light"] .admin-created-key { background: #f1f5f9; }
html[data-theme="light"] .admin-account-dialog { background: #fff; }

/* fundo escuro por trás de janelas: continua escuro, o texto dentro precisa ficar claro */
html[data-theme="light"] .photo-modal { background: rgba(10, 14, 20, 0.88); }
html[data-theme="light"] .photo-modal * { color: #fff; }
html[data-theme="light"] .btn-primary { color: #fff; }
html[data-theme="light"] .skeleton, html[data-theme="light"] .shimmer {
  background: linear-gradient(90deg, rgba(15, 23, 42, 0.05) 25%, rgba(15, 118, 110, 0.13) 37%, rgba(15, 23, 42, 0.05) 63%);
}

/* "Instalar app" usa o tamanho do botão de sair, mas em tom neutro */
.d-side-foot .install-btn { border-color: var(--line-strong); background: var(--violet-low); color: var(--violet-hi); }
.d-side-foot .install-btn:hover { background: var(--violet-low); border-color: var(--violet-hi); }
html[data-theme="light"] .d-side-foot .install-btn { color: #0f766e !important; }

html[data-theme="light"] .btn.btn-primary { background: #0f766e; border-color: #0f766e; color: #fff; }
html[data-theme="light"] .btn.btn-primary:hover { background: #115e59; border-color: #115e59; }
