/*
  Tema do Agendador: tons pastel com uma cor de marca sólida (anil #6366d8).
  Regras da paleta:
  - a marca é a única cor "cheia": logo, botão principal, destaques. Branco sobre ela: 4,75:1;
  - pastel é superfície e destaque, nunca texto no tema claro: texto vai na "tinta" do mesmo tom (≥ 4,5:1);
  - no escuro o pastel vira o próprio texto/ícone sobre um véu de 16% do tom (≥ 6,5:1);
  - situação nunca só por cor: sempre com ícone e rótulo;
  - sombras tingidas de anil, nunca preto puro; formas orgânicas (.ag-formas) só decoram, nunca carregam informação.
  Tema efetivo em <html data-tema="claro|escuro">, aplicado antes do CSS por _TemaScript.
*/

:root {
  color-scheme: light;

  /* Fundo: gradiente rosa → lavanda → menta bem diluído */
  --fundo: #f8f6fb;
  --fundo-gradiente: linear-gradient(135deg, #fdeef1 0%, #f1edfb 42%, #e9f0fb 70%, #e6f7f0 100%);
  --fundo-enfeite-1: rgba(99, 102, 216, .10);
  --fundo-enfeite-2: rgba(255, 180, 190, .22);
  --fundo-enfeite-3: rgba(140, 220, 190, .20);

  /* Superfícies */
  --superficie: #ffffff;
  --superficie-suave: #f5f3fb;
  --superficie-vidro: rgba(255, 255, 255, .72);
  --contorno: #ebe7f3;
  --contorno-forte: #dcd6ea;

  /* Texto */
  --texto: #25223a;
  --texto-apoio: #5d5874;
  --texto-tenue: #706a88;

  /* Marca: anil sólido, base da logo branca */
  --marca: #6366d8;
  --marca-hover: #5659cc;
  --marca-tinta: #ffffff;
  --marca-suave: #e6e7fb;
  --marca-forma: rgba(255, 255, 255, .14);

  /* Principal = marca */
  --primaria: var(--marca);
  --primaria-hover: var(--marca-hover);
  --primaria-tinta: var(--marca-tinta);
  --primaria-forte: #4e51c4;
  --primaria-suave: var(--marca-suave);
  --foco: rgba(99, 102, 216, .35);

  /* Tons de apoio: fundo / tinta */
  --menta: #d3f2e5;      --menta-tinta: #1e5a43;
  --pessego: #ffe3d2;    --pessego-tinta: #7a3a12;
  --rosa: #fbdae1;       --rosa-tinta: #8a2340;
  --ceu: #dbe9fb;        --ceu-tinta: #1f4a78;
  --manteiga: #fbf0c4;   --manteiga-tinta: #6a5212;
  --lavanda: #e9e3fb;    --lavanda-tinta: #45318e;
  --nevoa: #eeebf3;      --nevoa-tinta: #5c566a;

  /* Forma */
  --raio-p: 12px;
  --raio: 18px;
  --raio-g: 28px;
  --raio-pilula: 999px;
  --sombra: 0 1px 2px rgba(60, 50, 140, .05), 0 10px 30px -14px rgba(60, 50, 140, .22);
  --sombra-alta: 0 2px 6px rgba(60, 50, 140, .06), 0 28px 56px -22px rgba(60, 50, 140, .35);
  --sombra-marca: 0 14px 30px -12px rgba(99, 102, 216, .65);

  /* Tipografia */
  --fonte-titulo: "Poppins", "Plus Jakarta Sans", system-ui, sans-serif;
  --fonte-texto: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  --transicao: .18s ease;
}

:root[data-tema="escuro"] {
  color-scheme: dark;

  --fundo: #15131d;
  --fundo-gradiente: linear-gradient(135deg, #1b1424 0%, #16141f 45%, #131826 75%, #121c1c 100%);
  --fundo-enfeite-1: rgba(99, 102, 216, .20);
  --fundo-enfeite-2: rgba(240, 140, 170, .08);
  --fundo-enfeite-3: rgba(120, 200, 170, .07);

  --superficie: #1f1c2b;
  --superficie-suave: #282437;
  --superficie-vidro: rgba(31, 28, 43, .74);
  --contorno: #332e45;
  --contorno-forte: #453e5c;

  --texto: #f2effa;
  --texto-apoio: #bcb5d0;
  --texto-tenue: #948ca9;

  --marca-suave: rgba(140, 142, 240, .16);
  --primaria-forte: #aeb0f7;
  --foco: rgba(150, 152, 245, .5);

  --menta: rgba(168, 230, 201, .14);   --menta-tinta: #a8e6c9;
  --pessego: rgba(255, 201, 168, .14); --pessego-tinta: #ffc9a8;
  --rosa: rgba(247, 175, 195, .14);    --rosa-tinta: #f7afc3;
  --ceu: rgba(169, 205, 245, .14);     --ceu-tinta: #a9cdf5;
  --manteiga: rgba(243, 222, 140, .14);--manteiga-tinta: #f3de8c;
  --lavanda: rgba(195, 178, 247, .14); --lavanda-tinta: #cdbffa;
  --nevoa: rgba(201, 194, 214, .10);   --nevoa-tinta: #c9c2d6;

  --sombra: 0 1px 2px rgba(0, 0, 0, .25), 0 12px 30px -16px rgba(0, 0, 0, .6);
  --sombra-alta: 0 2px 6px rgba(0, 0, 0, .3), 0 30px 60px -24px rgba(0, 0, 0, .75);
  --sombra-marca: 0 14px 30px -14px rgba(99, 102, 216, .8);
}

/* Base */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  min-height: 100vh;
  margin: 0;
  color: var(--texto);
  background-color: var(--fundo);
  /* Gradiente pastel com círculos difusos por cima, fixos na rolagem */
  background-image:
    radial-gradient(34rem 34rem at 6% 2%, var(--fundo-enfeite-1), transparent 65%),
    radial-gradient(30rem 30rem at 98% 8%, var(--fundo-enfeite-2), transparent 65%),
    radial-gradient(36rem 30rem at 72% 104%, var(--fundo-enfeite-3), transparent 65%),
    var(--fundo-gradiente);
  background-attachment: fixed;
  font-family: var(--fonte-texto);
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
  margin: 0;
  color: var(--texto);
  font-family: var(--fonte-titulo);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.015em;
}

p {
  margin: 0;
}

a {
  color: var(--primaria-forte);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

img,
svg {
  display: block;
  max-width: 100%;
}

button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}

:focus-visible {
  outline: 3px solid var(--foco);
  outline-offset: 2px;
}

::selection {
  background: var(--marca);
  color: #fff;
}

/* hidden sempre esconde, mesmo em componentes com display próprio (botões, flex) */
[hidden] {
  display: none !important;
}

.visualmente-oculto {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* Troca de tema suave (js/core/tema.js) */
:root.trocando-tema,
:root.trocando-tema * {
  transition: background-color .35s ease, border-color .35s ease, color .35s ease !important;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}