/* SchoolDay v236.15: the public class chips, and today on Manage Calendars.

   Loaded last on both site/index.html and site/admin.html, because both things
   below have to beat rules that already carry !important. !important beats
   specificity outright, so being later in the cascade is not enough on its own
   -- these carry it too, and win the tie on source order. */

/* ---------------------------------------------------------------------------
   Public page: the class chips under each key stage.
   ---------------------------------------------------------------------------
   They were sized to their own text, so "Cedar" and "Willow" came out
   different widths, and the row was pinned left by

     .public-index .public-class-buttons { justify-content: flex-start !important }

   which is why the later "justify-content: center" written without !important
   never applied. Same width, centred label, centred row. */
.public-index .public-ks-group h3 {
  text-align: center !important;
}
.public-index .public-class-buttons {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: .45rem !important;
}
.public-index .filter-button[data-class-id] {
  flex: 0 0 auto !important;
  min-width: 8.5rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  white-space: normal !important;
}
/* A single group is already centred and stretched by the v149 rules; keep the
   chips inside it the same shape as everywhere else. */
.public-index .public-ks-groups.single-public-ks-group .public-class-buttons {
  justify-content: center !important;
}
@media (max-width: 520px) {
  .public-index .filter-button[data-class-id] {
    min-width: 6.5rem !important;
  }
}

/* ---------------------------------------------------------------------------
   Manage Calendars: today.
   ---------------------------------------------------------------------------
   Today was a yellow cell, which is also what an inset day is, so the two read
   as the same thing. White with a red outline instead: it marks the date
   without claiming a day type. This is the treatment the printed year calendar
   already uses. */
#tab-master-calendar .day-cell.today-date,
.year-calendar-body .day-cell.today-date {
  background: #ffffff !important;
  color: var(--ink, #15213a) !important;
  border: 2px solid #d92d20 !important;
  font-weight: 900 !important;
  box-shadow: none !important;
}
#tab-master-calendar .data-table tr.today-row td {
  background-color: #ffffff !important;
  box-shadow: inset 0 -2px 0 #d92d20 !important;
}
/* The standalone year calendar draws its own ring over the date number. Make
   the cell behind it white so the ring is the only marking. */
.year-month-table td.today-calendar-date {
  background: #ffffff !important;
}
.year-month-table td.today-calendar-date::after {
  border-color: #d92d20 !important;
}
.year-calendar-body .today-calendar-date strong {
  border-color: #d92d20 !important;
}