/* MrAgenda — identidade visual (paleta extraída do logo) + temas claro e escuro.
   O tema vem de <html data-theme="light|dark"> (ver mragenda-tema.js); sem JS segue o sistema. */
:root {
    --page:#E6ECFB; --bg:#F3F6FF; --surface:#FFFFFF; --surface-soft:#EAF0FF; --border:#D6E0F5;
    --ink:#0A1433; --ink-soft:#4A5B85; --ink-faint:#5F6F97; --brand-word:#0B6FD6;
    --brand-900:#000A33; --brand-fill:#1546F0; --brand-ink:#1038C8; --brand-600:#1A4DF5; --brand-500:#0A93FA; --brand-100:#E0ECFF;
    --on-brand:#FFFFFF; --side-ink:rgba(255,255,255,.66); --side-hover:rgba(255,255,255,.07); --side-active:rgba(255,255,255,.14);
    --violet:#5B2BE0; --violet-bg:#ECE6FF;
    --amber:#9A5B0E; --amber-bg:#FDF0DA; --amber-border:#E9C27A; --coral:#C23B2E; --coral-bg:#FDE8E5; --done:#5E6B8C; --done-bg:#EAEEF8; --ok:#0E7A4F; --ok-bg:#DDF5EA;
    --shadow:0 1px 3px rgba(10,20,51,.08); --overlay:rgba(0,8,40,.62);
    --chart-bar:#1A4DF5; --chart-line:#0A93FA; --chart-grid:#D6E0F5; --chart-tick:#5F6F97;
    --grad:linear-gradient(135deg,#19D3FF 0%,#1546F0 55%,#5B22F5 100%);
    color-scheme: light;
}
:root[data-theme="dark"] {
    --page:#02061A; --bg:#050D2E; --surface:#0B1745; --surface-soft:#101F5A; --border:#223478;
    --ink:#EEF3FF; --ink-soft:#A9B8E0; --ink-faint:#7F90C2; --brand-word:#19A3FF;
    --brand-900:#010620; --brand-fill:#2A5BFF; --brand-ink:#7CC4FF; --brand-600:#3A68FF; --brand-500:#19A3FF; --brand-100:#112066;
    --on-brand:#FFFFFF; --side-ink:rgba(238,243,255,.62); --side-hover:rgba(255,255,255,.06); --side-active:rgba(42,91,255,.28);
    --violet:#B79CFF; --violet-bg:#2A1C66;
    --amber:#F2B24D; --amber-bg:#3A2A0A; --amber-border:#7A5A1E; --coral:#FF8F80; --coral-bg:#3E1B22; --done:#9AA8CC; --done-bg:#16224F; --ok:#4ADE9C; --ok-bg:#0E3A2C;
    --shadow:none; --overlay:rgba(0,3,20,.78);
    --chart-bar:#3A7BFF; --chart-line:#19A3FF; --chart-grid:#223478; --chart-tick:#7F90C2;
    --grad:linear-gradient(135deg,#19D3FF 0%,#1546F0 55%,#5B22F5 100%);
    color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --page:#02061A; --bg:#050D2E; --surface:#0B1745; --surface-soft:#101F5A; --border:#223478;
    --ink:#EEF3FF; --ink-soft:#A9B8E0; --ink-faint:#7F90C2; --brand-word:#19A3FF;
    --brand-900:#010620; --brand-fill:#2A5BFF; --brand-ink:#7CC4FF; --brand-600:#3A68FF; --brand-500:#19A3FF; --brand-100:#112066;
    --on-brand:#FFFFFF; --side-ink:rgba(238,243,255,.62); --side-hover:rgba(255,255,255,.06); --side-active:rgba(42,91,255,.28);
    --violet:#B79CFF; --violet-bg:#2A1C66;
    --amber:#F2B24D; --amber-bg:#3A2A0A; --amber-border:#7A5A1E; --coral:#FF8F80; --coral-bg:#3E1B22; --done:#9AA8CC; --done-bg:#16224F; --ok:#4ADE9C; --ok-bg:#0E3A2C;
    --shadow:none; --overlay:rgba(0,3,20,.78);
    --chart-bar:#3A7BFF; --chart-line:#19A3FF; --chart-grid:#223478; --chart-tick:#7F90C2;
    --grad:linear-gradient(135deg,#19D3FF 0%,#1546F0 55%,#5B22F5 100%);
    color-scheme: dark;
  }
}

/* marca: ícone + nome ("Mr" na cor do texto, "Agenda" em azul) */
.mr-logo { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; line-height: 1; }
.mr-ico { width: var(--mr-ico, 30px); height: var(--mr-ico, 30px); border-radius: 24%; flex-shrink: 0; display: block; }
.mr-word { font-family: 'Space Grotesk', 'Inter', sans-serif; font-weight: 700; letter-spacing: -.3px; font-size: var(--mr-fs, 20px); color: var(--ink); }
.mr-word i { font-style: normal; color: var(--brand-word); }
.sidebar .mr-word, .mr-on-dark .mr-word { color: #fff; }
.sidebar .mr-word i, .mr-on-dark .mr-word i { color: #19A3FF; }

/* botão de tema (claro/escuro) */
.mr-tema-btn { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); color: var(--ink-soft); cursor: pointer; padding: 0; }
.mr-tema-btn:hover { color: var(--brand-ink); border-color: var(--brand-500); }
.mr-tema-btn svg { width: 18px; height: 18px; }
.mr-tema-flut { position: absolute; top: 12px; right: 12px; z-index: 60; box-shadow: 0 2px 10px rgba(0,8,40,.18); }
body:has(.sidebar) .mr-tema-flut { display: none; }
.sidebar .mr-tema-btn { background: transparent; border-color: rgba(255,255,255,.22); color: var(--side-ink); width: 34px; height: 34px; }
:focus-visible { outline: 2px solid var(--brand-500); outline-offset: 2px; }

/* campos e textos base seguem o tema */
input, textarea, select { background-color: var(--surface); color: var(--ink); }
input::placeholder, textarea::placeholder { color: var(--ink-faint); opacity: 1; }
input:disabled, textarea:disabled, select:disabled { opacity: .6; }