/* Shared month-calendar styles (TVNAIA) — used by /admin and /week.
   The home page (templates/index.html) keeps its own inline copy of these rules.
   Status colours (.badge-*) for the hover popup are provided by the host page. */

.calendar { margin-top: 1.5rem; max-width: 780px; }
.cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.75rem; }
.cal-head h2 { margin: 0; font-size: 1.05rem; }
/* "Month overview →" — a quiet text link between the month title and the month nav. `margin-right:
   auto` eats the leftover width, so it groups with the title on the left and leaves .cal-nav
   pinned right (the head is a space-between flex row that now has three children). */
.cal-month-link {
  margin-left: 0.7rem;
  margin-right: auto;
  font-size: 0.78rem;
  font-weight: 600;
  white-space: nowrap;
}
.cal-nav { display: flex; gap: 0.4rem; }
.cal-nav button { width: auto; margin: 0; padding: 0.2rem 0.7rem; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; }
.cal-dow { text-align: center; font-size: 0.7rem; font-weight: 600; color: var(--pico-muted-color); padding: 0.2rem 0; }
.cal-day {
  position: relative; min-height: 40px;
  border: 1px solid var(--pico-muted-border-color); border-radius: 8px;
  padding: 0.3rem 0.45rem; font-size: 0.8rem; cursor: pointer;
  /* Fixed light cell + fixed dark text: the cell is white in BOTH themes, so its text must
     be a fixed dark colour (not var(--pico-color), which turns light on the dark theme and
     would vanish on the white cell). Status classes below override the colour where needed. */
  background: #fff; color: #334155;
}
.cal-day.blank { border: none; background: none; cursor: default; min-height: 0; }
.cal-day-top { display: flex; align-items: baseline; justify-content: space-between; gap: 0.35rem; }
.cal-day .dnum { font-weight: 600; }
.cal-day .frac { font-size: 0.78rem; font-weight: 600; font-variant-numeric: tabular-nums; }
/* Past weekday, no data — plain white baseline (solid border). */
.cal-none     { background: #fff; }
.cal-partial  { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.cal-complete { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
/* Weekend — clearly "not a news day": solid grey fill. */
.cal-weekend  { background: #e2e6ec; border-color: #cbd2dc; color: #94a3b8; }
/* Future — upcoming/inactive: dashed border, faint, non-clickable. */
.cal-day.future { background: #fff; border-style: dashed; border-color: #dde3ea; color: #c2cbd6; cursor: default; }
/* Spill days — the previous/next month's days shown to complete a straddling week. Dimmed so
   the current month reads as primary, but still coloured by status + clickable. The dim is a
   scrim OVERLAY (not `opacity` on the cell) so it covers only the cell box — the hover popup,
   which sits below the cell, stays fully opaque and readable. */
.cal-day.spill::after {
  content: ""; position: absolute; inset: 0; border-radius: 8px;
  background: rgba(130, 140, 155, 0.42); pointer-events: none; z-index: 1;
}
.cal-day.selected { box-shadow: 0 0 0 2px var(--tv-coral, #fe7f63); border-color: var(--tv-coral, #fe7f63); }
.cal-pop {
  display: none; position: absolute; z-index: 20; top: 100%; left: 0; margin-top: 4px;
  width: 320px; max-width: 92vw; background: #fff; border: 1px solid var(--pico-muted-border-color);
  border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,0.16);
  /* Fixed white popup → fixed dark text (was var(--pico-color): light-on-white on dark theme). */
  padding: 0.6rem 0.7rem; font-size: 0.78rem; color: #334155; cursor: default;
}
.cal-day:hover .cal-pop { display: block; }
.cal-pop .pop-date { font-weight: 600; margin-bottom: 0.35rem; }
.cal-pop .pop-row { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; padding: 0.12rem 0; }
.mini-badge { font-size: 0.67rem; padding: 0.05rem 0.45rem; border-radius: 999px; font-weight: 600; white-space: nowrap; }

/* Per-week action button (admin "Build summary" / public "View summary"). The week grid
   switches to one row per week so the button can sit at the end of each row. A FIXED final
   column (not auto) keeps the 7 day columns aligned across every row + the weekday header,
   whether or not a given row shows a button. */
.cal-weeks { display: flex; flex-direction: column; gap: 5px; }
.cal-week-row { display: grid; grid-template-columns: repeat(7, 1fr) 104px; gap: 5px; align-items: stretch; }
.cal-dow-row  { display: grid; grid-template-columns: repeat(7, 1fr) 104px; gap: 5px; }
.cal-week-action { display: flex; flex-direction: column; align-items: stretch; justify-content: center; gap: 3px; }
.cal-week-action button {
  width: 100%; margin: 0;
  padding: 0.25rem 0.4rem; font-size: 0.7rem; line-height: 1.15; white-space: normal;
}
/* Persistent "already built" marker above a week's Rebuild button. */
.cal-week-action .built-badge {
  font-size: 0.6rem; font-weight: 700; text-align: center; color: #047857;
  text-transform: uppercase; letter-spacing: 0.03em;
}
