/* Temas visuais fixos. O tema escuro permanece definido nos estilos originais. */
body[data-tema="claro"] {
  color-scheme: light;
  --bg: #edf3f7;
  --surf: #ffffff;
  --card: rgba(255, 255, 255, .96);
  --surface: rgba(255, 255, 255, .96);
  --surface-2: rgba(15, 23, 42, .05);
  --line: rgba(15, 23, 42, .12);
  --line-strong: rgba(15, 23, 42, .20);
  --text: #102437;
  --muted: #53687a;
  --soft: #728396;
  --blue: #2563eb;
  --cyan: #0891b2;
  --green: #15803d;
  --yellow: #b45309;
  --red: #dc2626;
  --shadow: 0 18px 48px rgba(15, 23, 42, .12);
  --grafico-grade: rgba(15, 23, 42, .13);
  --grafico-eixo: rgba(15, 23, 42, .48);
  --grafico-texto: #102437;
  --grafico-texto-suave: #53687a;
  background:
    radial-gradient(circle at top left, rgba(37, 99, 235, .12), transparent 30%),
    radial-gradient(circle at top right, rgba(8, 145, 178, .10), transparent 26%),
    linear-gradient(180deg, #f8fbfd 0%, #edf3f7 100%);
}

body[data-tema="claro"]::before {
  background-image:
    linear-gradient(rgba(15, 23, 42, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 23, 42, .035) 1px, transparent 1px);
}

body[data-tema="claro"] header,
body[data-tema="claro"] footer,
body[data-tema="claro"] .topbar {
  background: rgba(255, 255, 255, .92);
}

body[data-tema="claro"] .month,
body[data-tema="claro"] .item,
body[data-tema="claro"] .birthday,
body[data-tema="claro"] .date-chip,
body[data-tema="claro"] .media {
  background: rgba(255, 255, 255, .68);
}

body[data-tema="claro"] .panel-nav,
body[data-tema="claro"] .panel-play-toggle {
  color: #ffffff;
  background: rgba(15, 23, 42, .40);
}

body[data-tema="claro"] .grafico-ponto {
  stroke: rgba(255, 255, 255, .94);
}

body[data-tema="oceano"] {
  color-scheme: dark;
  --bg: #061724;
  --surf: #0a2232;
  --card: rgba(10, 34, 50, .95);
  --surface: rgba(10, 34, 50, .95);
  --surface-2: rgba(125, 211, 252, .07);
  --line: rgba(186, 230, 253, .11);
  --line-strong: rgba(186, 230, 253, .20);
  --text: #effaff;
  --muted: #9bb8c8;
  --soft: #66879a;
  --blue: #38bdf8;
  --cyan: #22d3ee;
  --green: #34d399;
  background:
    radial-gradient(circle at top left, rgba(14, 165, 233, .24), transparent 30%),
    radial-gradient(circle at bottom right, rgba(6, 182, 212, .18), transparent 28%),
    linear-gradient(180deg, #082235 0%, #061724 100%);
}

body[data-tema="oceano"] header,
body[data-tema="oceano"] footer,
body[data-tema="oceano"] .topbar {
  background: rgba(6, 23, 36, .91);
}

body[data-tema="floresta"] {
  color-scheme: dark;
  --bg: #081712;
  --surf: #10251d;
  --card: rgba(16, 37, 29, .95);
  --surface: rgba(16, 37, 29, .95);
  --surface-2: rgba(167, 243, 208, .07);
  --line: rgba(209, 250, 229, .10);
  --line-strong: rgba(209, 250, 229, .19);
  --text: #f0fdf4;
  --muted: #9ab9a7;
  --soft: #668475;
  --blue: #34d399;
  --cyan: #5eead4;
  --green: #86efac;
  background:
    radial-gradient(circle at top left, rgba(34, 197, 94, .20), transparent 30%),
    radial-gradient(circle at top right, rgba(20, 184, 166, .15), transparent 25%),
    linear-gradient(180deg, #10291f 0%, #081712 100%);
}

body[data-tema="floresta"] header,
body[data-tema="floresta"] footer,
body[data-tema="floresta"] .topbar {
  background: rgba(8, 23, 18, .91);
}

body[data-tema="areia"] {
  color-scheme: light;
  --bg: #efe7d7;
  --surf: #fffaf0;
  --card: rgba(255, 250, 240, .96);
  --surface: rgba(255, 250, 240, .96);
  --surface-2: rgba(73, 55, 32, .06);
  --line: rgba(73, 55, 32, .14);
  --line-strong: rgba(73, 55, 32, .23);
  --text: #352b20;
  --muted: #6f6252;
  --soft: #8a7a67;
  --blue: #b7791f;
  --cyan: #0f766e;
  --green: #4d7c0f;
  --yellow: #b45309;
  --red: #b91c1c;
  --shadow: 0 18px 48px rgba(73, 55, 32, .14);
  --grafico-grade: rgba(73, 55, 32, .14);
  --grafico-eixo: rgba(73, 55, 32, .48);
  --grafico-texto: #352b20;
  --grafico-texto-suave: #6f6252;
  background:
    radial-gradient(circle at top left, rgba(217, 119, 6, .13), transparent 31%),
    radial-gradient(circle at top right, rgba(15, 118, 110, .10), transparent 25%),
    linear-gradient(180deg, #fffaf0 0%, #efe7d7 100%);
}

body[data-tema="areia"]::before {
  background-image:
    linear-gradient(rgba(73, 55, 32, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(73, 55, 32, .035) 1px, transparent 1px);
}

body[data-tema="areia"] header,
body[data-tema="areia"] footer,
body[data-tema="areia"] .topbar {
  background: rgba(255, 250, 240, .92);
}

body[data-tema="areia"] .month,
body[data-tema="areia"] .item,
body[data-tema="areia"] .birthday,
body[data-tema="areia"] .date-chip,
body[data-tema="areia"] .media {
  background: rgba(255, 250, 240, .72);
}

body[data-tema="areia"] .panel-nav,
body[data-tema="areia"] .panel-play-toggle {
  color: #ffffff;
  background: rgba(53, 43, 32, .42);
}

body[data-tema="areia"] .grafico-ponto {
  stroke: rgba(255, 250, 240, .96);
}

body[data-tema="vinho"] {
  color-scheme: dark;
  --bg: #1c0b13;
  --surf: #2b111d;
  --card: rgba(43, 17, 29, .95);
  --surface: rgba(43, 17, 29, .95);
  --surface-2: rgba(251, 207, 232, .07);
  --line: rgba(251, 207, 232, .11);
  --line-strong: rgba(251, 207, 232, .20);
  --text: #fff5f7;
  --muted: #c6a3b0;
  --soft: #8f6877;
  --blue: #f472b6;
  --cyan: #fb7185;
  --green: #a7f3d0;
  background:
    radial-gradient(circle at top left, rgba(190, 24, 93, .22), transparent 30%),
    radial-gradient(circle at top right, rgba(244, 63, 94, .16), transparent 25%),
    linear-gradient(180deg, #351120 0%, #1c0b13 100%);
}

body[data-tema="vinho"] header,
body[data-tema="vinho"] footer,
body[data-tema="vinho"] .topbar {
  background: rgba(28, 11, 19, .91);
}
