/*
 * ADC Calendar UI — canonical stylesheet
 * Version: 1.0
 *
 * IMPORTANT
 * ---------
 * This file is the single source of truth for the visible clinic calendar.
 * Do not add calendar font/layout overrides to style.css.
 *
 * Scope:
 * - top-page clinic calendar
 * - guide-page clinic calendar
 * - month selector
 * - weekday/day typography
 * - clinic-hours legend
 *
 * The calendar switching logic remains in the plugin and is not changed here.
 */

/* =========================================================
   1. CALENDAR GRID
   ========================================================= */

.clinic-calendar {
  min-width: 0;
}

/* Plugin's own legend is hidden because the site uses the right-hand legend. */
.clinic-calendar .adc-calendar__legend,
.clinic-calendar .adc-calendar-legend,
.clinic-calendar .adc-legend,
.clinic-calendar [class*="calendar-legend"] {
  display: none !important;
}

/* Keep the calendar at the full width of its column. */
.clinic-calendar .adc-calendar,
.clinic-calendar .adc-calendar__grid {
  width: 100%;
  max-width: none;
}

/* Weekday labels: 日 月 火 水 木 金 土 */
.clinic-calendar .adc-calendar__dow {
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}

/* Calendar date number. */
.clinic-calendar .adc-calendar__day,
.clinic-calendar .adc-calendar__day strong {
  font-size: 17px !important;
  font-weight: 700 !important;
}

/* Small status text inside a date cell, e.g. 休診. */
.clinic-calendar .adc-calendar__day small {
  font-size: 10px !important;
  line-height: 1.25 !important;
}

/* Weekday/date colors. */
.clinic-calendar .adc-calendar__dow--sun,
.clinic-calendar .adc-calendar__dow--thu {
  color: #d74444 !important;
}
.clinic-calendar .adc-calendar__dow--sat {
  color: #1675cf !important;
}
.clinic-calendar .adc-calendar__day--sat:not(.adc-calendar__day--holiday):not(.adc-calendar__day--closed) {
  background: #e9f5fd !important;
  color: #1675cf !important;
}
.clinic-calendar .adc-calendar__day--closed {
  background: #fff0f0 !important;
  color: #d74444 !important;
}
.clinic-calendar .adc-calendar__day--holiday {
  background: #fff8dc !important;
  color: #9b7410 !important;
}

/* =========================================================
   2. MONTH TITLE / MONTH BUTTONS
   ========================================================= */

/* Month title such as 2026年10月. */
.schedule-heading__month .adc-calendar__title,
.clinic-calendar .adc-calendar__title {
  font-weight: 800 !important;
}

/* Top-page month selector buttons. */
.schedule-heading__month .adc-calendar__nav button {
  font-weight: 800 !important;
}

/* Current month = dark green / white. */
.schedule-heading__month .adc-calendar__nav button.is-current,
.schedule-heading__month .adc-calendar__nav button[aria-pressed="true"] {
  background: #17543c !important;
  border-color: #17543c !important;
  color: #fff !important;
}

/* Other months = white / green. */
.schedule-heading__month .adc-calendar__nav button:not(.is-current):not([aria-pressed="true"]) {
  background: #fff !important;
  color: #17543c !important;
}

/* =========================================================
   3. CALENDAR + LEGEND TWO-COLUMN LAYOUT
   ========================================================= */

.clinic-schedule-body {
  display: grid;
  grid-template-columns: minmax(350px, 1.35fr) minmax(260px, .9fr);
  gap: 28px;
  align-items: stretch;
}

/* Guide page uses exactly the same vertical alignment as the top page. */
.guide-clinic-schedule-body {
  margin-top: 20px;
}

/* =========================================================
   4. CLINIC-HOURS LEGEND
   ========================================================= */

.clinic-hours-legend {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
}

.clinic-hours-row {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) minmax(115px, auto);
  gap: 14px;
  align-items: center;
  min-height: 68px;
  padding: 12px 16px;
  border: 1px solid transparent;
  border-radius: 12px;
}

/* The old square color chip is not used; the whole row carries the color. */
.clinic-hours-color {
  display: none !important;
}

/* Legend day/category label. */
.clinic-hours-row strong {
  font-size: 17px !important;
  font-weight: 800 !important;
  line-height: 1.45 !important;
}

/* Small parenthetical text in weekday label. */
.clinic-hours-row strong small {
  font-size: 14px !important;
  font-weight: 700 !important;
}

/* Legend time/status. */
.clinic-hours-row > span:last-child {
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.65 !important;
  text-align: right;
}

/* Weekday = pale green. */
.clinic-hours-weekday {
  background: #eef8f1;
  border-color: #cfe6d6;
  color: #254d3b;
}

/* Saturday = pale blue, including label and time. */
.clinic-hours-saturday {
  background: #edf7fd;
  border-color: #c8e1f2;
}
.clinic-hours-saturday strong,
.clinic-hours-saturday > span:last-child {
  color: #1675cf !important;
}

/* Thu/Sun closed = pale red. */
.clinic-hours-closed {
  background: #fff0f0;
  border-color: #f3c1c1;
}
.clinic-hours-closed strong,
.clinic-hours-closed > span:last-child {
  color: #d74444 !important;
}

/* Holiday = pale yellow. */
.clinic-hours-holiday {
  background: #fff8dc;
  border-color: #ecd16d;
}
.clinic-hours-holiday strong {
  color: #9b7410 !important;
}
.clinic-hours-holiday > span:last-child {
  color: #725f26 !important;
}

/* =========================================================
   5. TABLET / MOBILE
   ========================================================= */

@media (max-width: 760px) {
  .clinic-schedule-body {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  /* Keep calendar text comfortably readable on phones. */
  .clinic-calendar .adc-calendar__dow {
    font-size: 14px !important;
  }
  .clinic-calendar .adc-calendar__day,
  .clinic-calendar .adc-calendar__day strong {
    font-size: 14px !important;
  }
  .clinic-calendar .adc-calendar__day small {
    font-size: 9px !important;
  }

  .clinic-hours-row {
    grid-template-columns: minmax(115px, 1fr) minmax(105px, auto);
    min-height: 60px;
    padding: 10px 13px;
  }
  .clinic-hours-row strong {
    font-size: 14px !important;
  }
  .clinic-hours-row strong small {
    font-size: 11px !important;
  }
  .clinic-hours-row > span:last-child {
    font-size: 14px !important;
  }
}


/* =========================================================
   v43.2 — Legend time/status only
   =========================================================
   Increase only the right-side legend text by one step.
   This includes weekday/Saturday/holiday hours and "休診".
   All other calendar typography/layout remains unchanged.
   ========================================================= */
.clinic-hours-row > span:last-child {
  font-size: 18px !important;
}

@media (max-width: 760px) {
  .clinic-hours-row > span:last-child {
    font-size: 17px !important;
  }
}


/* =========================================================
   v43.3 — Guide page calendar heading/navigation
   =========================================================
   The guide page now uses the same schedule-heading structure
   as the top page. Calendar typography and legend sizes are
   intentionally unchanged from v43.2.
   ========================================================= */
.guide-schedule-heading {
  margin-bottom: 0;
}
