/* Calendário Insights — complementos ao styles.css + medicina.css (design dala).
   Usa os mesmos tokens (--bg, --ink, --line, --blue, …); não redefine cores da marca. */

/* ---------- Cabeçalho comum (tp-header do topo.css) no ambiente escuro desta página ---------- */
:root:not([data-theme="light"]) {
  --tp-bg: #081a29; --tp-bg-rgb: 8,26,41;
  --tp-ink: #ffffff; --tp-ink-2: rgba(255,255,255,.82); --tp-ink-3: rgba(255,255,255,.6);
  --tp-line: rgba(255,255,255,.1); --tp-line-2: rgba(255,255,255,.2);
  --tp-glass: rgba(255,255,255,.08); --tp-glass-2: rgba(255,255,255,.14); --tp-shadow: rgba(0,0,0,.35);
}
:root:not([data-theme="light"]) .tp-header .tp-logo-img { content: url(/assets/logo-dioscope-escuro.svg?v=20260929b); }
:root:not([data-theme="light"]) .tp-header .tp-tab, :root:not([data-theme="light"]) .tp-tabbar .tp-tab { color: rgba(255,255,255,.7); }

/* Telemóvel tátil: o topo.css pinta o cabeçalho e a barra de baixo de branco */
@media (pointer: coarse) and (max-width: 599px) {
  :root:not([data-theme="light"]):not(.tp-sem-app) .tp-header::before { background: rgba(8,26,41,.96); }
  :root:not([data-theme="light"]):not(.tp-sem-app) .tp-tabbar { background: rgba(8,26,41,.96); border-top-color: rgba(255,255,255,.1); }
  :root:not([data-theme="light"]) .tp-tabbar .tp-tab--ativo, :root:not([data-theme="light"]) .tp-header .tp-tab--ativo { color: #7fb0ff; }
  :root:not([data-theme="light"]) .tp-tab--ativo .tp-tab__icone { background: rgba(53,125,237,.22); }
}

/* Botão de tema: o cabeçalho comum não o tem; fica no topo da página, à direita */
.cal-tema { position: absolute; top: 1.25rem; right: var(--pad-x); z-index: 2; }

/* ---------- Topo ---------- */
.landing--cal { justify-content: flex-start; padding-top: 4.5rem; padding-bottom: 3rem; }
@media (min-width: 1024px) { .landing--cal { min-height: 0; padding-top: 6rem; padding-bottom: 6rem; } }
.cal-hero { max-width: 52rem; }
.cal-hero .eyebrow { margin-bottom: 1.25rem; }
.landing--cal .line__inner { transition: transform 1.2s cubic-bezier(.16,1,.3,1); }
.cal-hero__title em { font-style: normal; color: var(--blue); }
.landing--cal .landing__title { margin-top: 0; }
.cal-hero__lead { max-width: 40rem; }

/* Calendário em partículas (particulas.js, canvas fixo .bg-canvas): no telemóvel fica por baixo do texto do topo */
/* topo: calendário em partículas à esquerda, texto à direita (no telemóvel o calendário fica por baixo do texto) */
.landing--cal { padding-bottom: 20rem; }
@media (min-width: 1024px) { .landing--cal { min-height: calc(100vh - var(--tp-altura, 78px)); justify-content: center; padding-top: 4rem; padding-bottom: 6rem; } .cal-hero { max-width: 46%; margin-left: auto; } }
.landing--cal .landing__title { font-size: clamp(3rem, 12vw, 4.2rem); }
@media (min-width: 768px) { .landing--cal .landing__title { font-size: 5.2rem; } }
@media (min-width: 1366px) { .landing--cal .landing__title { font-size: 6.4rem; } }
.cal-hero__lead { max-width: 36rem; }

.cal-hero__title em { font-style: normal; color: var(--blue); }

/* ---------- Agenda: cartões em grelha no azul da marca ---------- */
.cal-agenda .sec-head { margin-bottom: 2.5rem; }
.cal-estado { display: flex; align-items: center; gap: .9rem; padding: 2.5rem 0; color: var(--ink-2); }
.cal-estado[hidden], .cal-grelha[hidden] { display: none !important; }
.cal-spin { width: 1.4rem; height: 1.4rem; border-radius: 50%; border: 2px solid rgba(255,255,255,.3); border-top-color: #fff; animation: cal-rot .9s linear infinite; }
@keyframes cal-rot { to { transform: rotate(360deg); } }

.cal-grelha { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
@media (min-width: 600px) { .cal-grelha { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .cal-grelha { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .cal-grelha { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.1rem; } }

/* Cada cartão é um mês: grelha de dias com o dia do Insights marcado */
.cal-mes {
  position: relative; display: flex; flex-direction: column; gap: .9rem; height: 100%;
  padding: 1.25rem 1.25rem 1.2rem; border-radius: 1.1rem; text-decoration: none; color: #fff;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.2);
  transition: background .5s var(--ease), border-color .5s, transform .7s var(--ease), box-shadow .7s var(--ease);
}
a.cal-mes:hover { background: rgba(255,255,255,.15); border-color: rgba(255,255,255,.45); transform: translateY(-.2rem); box-shadow: 0 16px 40px rgba(12,44,61,.25); }
.cal-mes__topo { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; }
.cal-mes__nome { font-size: 1.35rem; font-weight: 400; letter-spacing: -.02em; text-transform: capitalize; }
.cal-mes__num { font-size: .72rem; font-weight: 600; letter-spacing: .1em; color: rgba(255,255,255,.55); font-variant-numeric: tabular-nums; }

.cal-dias { display: grid; grid-template-columns: repeat(7, 1fr); gap: .15rem .1rem; text-align: center; font-variant-numeric: tabular-nums; }
.cal-dias span { justify-self: center; width: 1.75rem; font-size: .7rem; line-height: 1.75rem; height: 1.75rem; border-radius: 50%; color: rgba(255,255,255,.85); }
.cal-dias .cal-dias__sem { width: auto; }
.cal-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.cal-dias .cal-dias__sem { font-size: .58rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.5); line-height: 1.2rem; height: 1.2rem; }
.cal-dias .is-passado { color: rgba(255,255,255,.35); }
.cal-dias .is-hoje { box-shadow: inset 0 0 0 1px rgba(255,255,255,.75); }
.cal-dias .is-evento { background: #fff; color: var(--navy); font-weight: 600; }
.cal-mes--passado .cal-dias .is-evento { background: rgba(255,255,255,.55); }

.cal-mes__tema { font-size: 1.05rem; font-weight: 400; letter-spacing: -.01em; line-height: 1.3; padding-top: .8rem; border-top: 1px solid rgba(255,255,255,.18); }
.cal-mes__tema small { display: block; margin-top: .2rem; font-size: .76rem; color: rgba(255,255,255,.66); }
.cal-mes__tema small b { font-weight: 500; color: rgba(255,255,255,.9); }
.cal-mes__pe { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-top: auto; }
.cal-mes__go { font-size: .66rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }

/* próximo ao vivo: mês em branco */
.cal-mes--proximo { background: #fff; color: var(--navy); border-color: #fff; box-shadow: 0 18px 50px rgba(12,44,61,.28); }
a.cal-mes--proximo:hover { background: #fff; border-color: #fff; }
.cal-mes--proximo .cal-mes__num, .cal-mes--proximo .cal-dias__sem, .cal-mes--proximo .cal-mes__tema small { color: #5d6f81; }
.cal-mes--proximo .cal-mes__tema small b { color: var(--navy); }
.cal-mes--proximo .cal-dias span { color: var(--navy); }
.cal-mes--proximo .cal-dias .is-passado { color: rgba(12,44,61,.35); }
.cal-mes--proximo .cal-dias .is-hoje { box-shadow: inset 0 0 0 1px rgba(12,44,61,.5); }
.cal-mes--proximo .cal-dias .is-evento { background: var(--blue); color: #fff; }
.cal-mes--proximo .cal-mes__tema { border-top-color: rgba(12,44,61,.12); }

.cal-pill { display: inline-flex; align-items: center; gap: .45rem; line-height: 1; font-size: .62rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; padding: .45rem .7rem; border-radius: 2rem; background: rgba(255,255,255,.16); color: #fff; }
.cal-pill--live { background: var(--blue); color: #fff; }
.cal-pill--live::before { content: ""; width: .45rem; height: .45rem; border-radius: 50%; background: #fff; animation: pill-pulse-w 1.8s ease-out infinite; }
.cal-mes:not(.cal-mes--proximo) .cal-pill--live { background: #fff; color: var(--navy); }
.cal-mes:not(.cal-mes--proximo) .cal-pill--live::before { background: var(--blue); }
.cal-pill--ate { background: #ffe2a3; color: #5a3b00; }
.cal-pill--breve { background: transparent; border: 1px dashed rgba(255,255,255,.45); }

.cal-nota { margin-top: 2rem; font-size: .85rem; color: rgba(255,255,255,.7); }

@media (prefers-reduced-motion: reduce) { .cal-spin, .cal-pill--live::before { animation: none; } }