/**
 * @file library-hours.css
 * Unified Library Hours page — Day / Week / Month tab views.
 */

/* ── Page wrapper ─────────────────────────────────────────────────────── */
.library-hours-page {
  max-width: var(--max-width, 1280px);
  margin: 0 auto;
  padding: 0 3%;
}

/* ── Tab switcher ─────────────────────────────────────────────────────── */
.library-hours__tabs {
  display: flex;
  gap: 0;
  border-bottom: 3px solid var(--gmu-primary-green, #005239);
  margin: 1.5rem 0 0 0;
}

.library-hours__tab {
  background: var(--gmu-light-gray, #f0f0f0);
  color: var(--gmu-primary-green, #005239);
  border: 1px solid #ddd;
  border-bottom: none;
  border-radius: 6px 6px 0 0;
  padding: 0.65rem 1.5rem;
  font-family: var(--font-heading, 'Montserrat', sans-serif);
  font-size: 0.9375rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
  position: relative;
  bottom: -1px;
}

.library-hours__tab:hover {
  background: var(--gmu-primary-green, #005239);
  color: #fff;
}

.library-hours__tab--active,
.library-hours__tab[aria-selected="true"] {
  background: var(--gmu-primary-green, #005239);
  color: #fff;
  border-color: var(--gmu-primary-green, #005239);
  z-index: 1;
}

/* ── Panels ───────────────────────────────────────────────────────────── */
.library-hours__panel {
  background: #fff;
  border: 1px solid #ddd;
  border-top: none;
  border-radius: 0 0 8px 8px;
  padding: 2rem;
  min-height: 320px;
}

/* ── Loading text ─────────────────────────────────────────────────────── */
.library-hours__loading {
  color: #666;
  font-style: italic;
  text-align: center;
  padding: 2rem 0;
}

/* ═══════════════════════════════════════════════════════════════════════
   DAY VIEW — override LibCal today widget
═══════════════════════════════════════════════════════════════════════ */

/* Hide the LibCal "Display of Opening hours" screen-reader caption — it
   appears as visible text on our page because LibCal's own CSS is not
   loaded here.                                                          */
#lc-hours-day .s-lc-w-sr-only {
  display: none !important;
}

/* Hide "View all Hours" link at the bottom of the today widget */
#lc-hours-day .s-lc-w-today-view-all {
  display: none !important;
}

/* Make LibCal today table full-width */
#lc-hours-day .s-lc-w-today {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-body, 'Open Sans', sans-serif);
  font-size: 0.95rem;
}

/* Header row */
#lc-hours-day .s-lc-w-head {
  background: var(--gmu-primary-green, #005239);
  color: #fff;
  padding: 0.75rem 1rem;
  text-align: center;
  font-size: 1rem;
}

/* Prev/Next day navigation buttons */
#lc-hours-day .s-lc-w-btn {
  background: var(--gmu-accent-yellow, #ffc733);
  color: #000;
  border: none;
  border-radius: 4px;
  padding: 0.35rem 0.75rem;
  font-size: 0.8125rem;
  font-weight: 700;
  cursor: pointer;
  margin: 0 0.5rem;
}

#lc-hours-day .s-lc-w-btn:hover {
  background: #e6b000;
}

/* Location rows */
#lc-hours-day .s-lc-w-times td {
  padding: 0.55rem 1rem;
  border-bottom: 1px solid #eee;
}

#lc-hours-day .s-lc-w-location td {
  background: #fff;
}

#lc-hours-day .s-lc-w-location td.s-lc-w-name {
  font-weight: 700;
  color: var(--gmu-primary-green, #005239);
}

/* Department sub-rows (e.g. Fenwick Lobby) */
#lc-hours-day .s-lc-w-department td {
  background: #fafafa;
}

#lc-hours-day .s-lc-w-department td.s-lc-w-name {
  padding-left: 2rem;
  font-size: 0.875rem;
  color: #555;
}

/* Closed / hours text */
#lc-hours-day .s-lc-closed {
  color: #c0392b;
  font-weight: 600;
}

#lc-hours-day .s-lc-time {
  color: #1a5f3f;
  font-weight: 600;
}

#lc-hours-day .no_time {
  color: #999;
}

/* ═══════════════════════════════════════════════════════════════════════
   WEEK VIEW — override LibCal weekly grid
═══════════════════════════════════════════════════════════════════════ */

/* Scrollable on mobile */
#lc-hours-week {
  overflow-x: auto;
}

#lc-hours-week .s-lc-whw {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-body, 'Open Sans', sans-serif);
  font-size: 0.875rem;
}

/* Hide Research Poster Printing row (lid 11430) */
#lc-hours-week .s-lc-whw-loc-tr-11430 {
  display: none;
}

/* Week navigation prev/next */
#lc-hours-week .s-lc-whw-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}

#lc-hours-week .s-lc-whw-nav a,
#lc-hours-week #s-lc-whw-next-0,
#lc-hours-week #s-lc-whw-prev-0 {
  background: var(--gmu-accent-yellow, #ffc733);
  color: #000;
  border: none;
  border-radius: 4px;
  padding: 0.35rem 0.75rem;
  font-size: 0.8125rem;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
}

#lc-hours-week #s-lc-whw-next-0:hover,
#lc-hours-week #s-lc-whw-prev-0:hover {
  background: #e6b000;
}

/* Table head */
#lc-hours-week .s-lc-whw thead th,
#lc-hours-week .s-lc-whw thead {
  background: var(--gmu-primary-green, #005239);
  color: #fff;
}

#lc-hours-week .s-lc-whw th {
  padding: 0.6rem 0.75rem;
  text-align: center;
  font-weight: 700;
}

/* Today column highlight */
#lc-hours-week .s-lc-whw-today-h {
  background: rgba(255, 199, 51, 0.15) !important;
}

#lc-hours-week .s-lc-whw-today {
  background: rgba(255, 199, 51, 0.08) !important;
}

/* Location name column */
#lc-hours-week .s-lc-whw-locname {
  font-weight: 700;
  color: var(--gmu-primary-green, #005239);
}

#lc-hours-week .s-lc-whw-sublocname {
  padding-left: 1.5rem !important;
  color: #555;
  font-size: 0.85rem;
}

/* Hours cells */
#lc-hours-week .s-lc-whw td {
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid #eee;
  text-align: center;
  vertical-align: middle;
}

#lc-hours-week .s-lc-whw-locname-td {
  text-align: left !important;
}

#lc-hours-week .s-lc-whw-bh {
  text-align: right;
  white-space: nowrap;
}

/* "Closed" text */
#lc-hours-week .s-lc-whw-closed {
  color: #c0392b;
  font-size: 0.8125rem;
}

/* Alternating rows */
#lc-hours-week .s-lc-whw tbody tr:nth-child(even) {
  background: #fafafa;
}

/* Footnotes */
#lc-hours-week .s-lc-whw-footnote {
  color: #666;
  font-size: 0.8rem;
}

#lc-hours-week .s-lc-whw-footnote td:hover {
  background: #fff !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   MONTH VIEW — full Bootstrap replacement + GMU brand overrides

   The month calendar HTML uses Bootstrap 3 classes but Bootstrap CSS is
   not loaded on our page (LibCal only includes it on their own domain).
   We re-implement the needed Bootstrap bits here, scoped to the panel.
═══════════════════════════════════════════════════════════════════════ */

/* ── Outer containers: fill the full panel width ── */
#lc-hours-month #s-lc-mhw-cont {
  width: 100%;
  font-family: var(--font-body, 'Open Sans', sans-serif);
  font-size: 0.875rem;
}

/* Bootstrap .table-responsive — must be block + overflow for mobile */
#lc-hours-month .table-responsive {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ── The calendar table itself ── */
#lc-hours-month .s-lc-mhw-tb {
  width: 100%;
  /* Fixed layout = all 7 day columns share equal width */
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
}

/* ── Table borders (Bootstrap table-bordered) ── */
#lc-hours-month .s-lc-mhw-tb,
#lc-hours-month .s-lc-mhw-tb th,
#lc-hours-month .s-lc-mhw-tb td {
  border: 1px solid #dee2e6;
}

/* ── Month header row (Prev «  March 2026  Next ») ── */
#lc-hours-month .s-lc-mhw-header {
  background: var(--gmu-primary-green, #005239);
  color: #fff;
  text-align: center;
  padding: 0.6rem 0.5rem;
  /* Use flexbox instead of Bootstrap's float-based layout */
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

/* Month name */
#lc-hours-month .s-lc-mhw-header-date {
  flex: 1;
  font-weight: 700;
  font-size: 1rem;
  text-align: center;
}

/* Bootstrap .btn (Prev / Next month buttons) */
#lc-hours-month .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  padding: 0.3rem 0.6rem;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  background: var(--gmu-accent-yellow, #ffc733);
  color: #000;
  transition: background 0.15s;
  white-space: nowrap;
  flex-shrink: 0;
}

#lc-hours-month .btn:hover:not(:disabled) {
  background: #e6b000;
}

#lc-hours-month .btn:disabled,
#lc-hours-month .btn[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}

/* Bootstrap .pull-left / .pull-right — replaced by flex above, but
   reset the floats so they don't break the flex layout              */
#lc-hours-month .pull-left,
#lc-hours-month .pull-right {
  float: none !important;
}

/* ── Day-of-week header row ── */
#lc-hours-month .s-lc-mhw-days th {
  background: #f0f4f0;
  color: var(--gmu-primary-green, #005239);
  text-align: center;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.45rem 0.25rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

/* ── Day cells ── */
#lc-hours-month .s-lc-mhw-day {
  vertical-align: top;
  padding: 0.5rem 0.5rem;
  min-width: 0;       /* allow cell to shrink within fixed layout */
}

/* Empty / out-of-month cells */
#lc-hours-month .s-lc-mhw-noday {
  background: #f8f9fa;
  padding: 0.5rem;
}

/* Day number badge */
#lc-hours-month .s-lc-mhw-day-l {
  font-size: 0.875rem;
  font-weight: 700;
  color: #444;
  margin-bottom: 0.4rem;
  line-height: 1;
}

/* Today: highlight the cell */
#lc-hours-month .s-lc-mhw-today .s-lc-mhw-day-l,
#lc-hours-month .s-lc-mhw-day.s-lc-mhw-today .s-lc-mhw-day-l {
  background: var(--gmu-accent-yellow, #ffc733);
  color: #000;
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  line-height: 1.5rem;
  text-align: center;
  border-radius: 50%;
}

/* ── Location entries inside each day cell ── */
#lc-hours-month .s-lc-mhw-loc {
  margin-top: 0.25rem;
  padding: 0.2rem 0.3rem;
  border-radius: 2px;
  line-height: 1.25;
}

/* Location name label */
#lc-hours-month .s-lc-mhw-loc-name {
  font-size: 0.78rem;
  font-weight: 700;
  color: #333;
  line-height: 1.3;
  word-break: break-word;
}

/* Hours / Closed time text */
#lc-hours-month .s-lc-mhw-tb .s-lc-time {
  display: block;
  font-size: 0.76rem;
  color: #1a5f3f;
  font-weight: 600;
  word-break: break-word;
}

#lc-hours-month .s-lc-mhw-tb .s-lc-closed {
  display: block;
  font-size: 0.76rem;
  color: #c0392b;
  font-weight: 600;
}

/* Sub-locations (Fenwick Lobby, Research Poster Printing) */
#lc-hours-month .s-lc-mhw-sub-loc {
  margin-top: 0.15rem;
  padding-left: 0.35rem;
  border-left: 2px solid #ddd;
}

/* Hide Research Poster Printing (loc_11430) everywhere in month view */
#lc-hours-month .loc_11430 {
  display: none !important;
}

/* Location accent colors via left border on the top-level loc divs */
#lc-hours-month .s-lc-mhw-locf-1415  { border-left: 3px solid #005239; padding-left: 0.25rem; } /* Fenwick */
#lc-hours-month .s-lc-mhw-locf-20339 { border-left: 3px solid #006990; padding-left: 0.25rem; } /* Mason Square */
#lc-hours-month .s-lc-mhw-locf-2621  { border-left: 3px solid #8b1a1a; padding-left: 0.25rem; } /* Mercer */
#lc-hours-month .s-lc-mhw-locf-21167 { border-left: 3px solid #6b4e9e; padding-left: 0.25rem; } /* SCRC */
#lc-hours-month .s-lc-mhw-locf-1417  { border-left: 3px solid #b35c00; padding-left: 0.25rem; } /* Virtual Reference */

/* Bootstrap sr-only — already hidden from view in Bootstrap, but
   LibCal puts it in the month calendar too; hide it here.           */
#lc-hours-month .sr-only {
  display: none !important;
}

/* ── Additional hours / body content section ──────────────────────────── */
.library-hours__body-content {
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 3px solid var(--gmu-accent-yellow, #ffc733);
}

.library-hours__body-content h2 {
  font-family: var(--font-heading, 'Montserrat', sans-serif);
  color: var(--gmu-primary-green, #005239);
  font-size: 1.25rem;
  margin: 0 0 1rem 0;
}

/* Style the static hour tables that exist in the node body */
.library-hours__body-content .hrstab,
.library-hours__body-content table.table {
  width: 100%;
  max-width: 480px;
  border-collapse: collapse;
  margin: 1rem 0 1.5rem 0;
  font-size: 0.9rem;
}

.library-hours__body-content .hrstab caption,
.library-hours__body-content table.table caption {
  font-weight: 700;
  color: var(--gmu-primary-green, #005239);
  text-align: left;
  padding: 0 0 0.35rem 0;
  caption-side: top;
}

.library-hours__body-content .hrstab th,
.library-hours__body-content table.table th {
  background: #f0f0f0;
  padding: 0.4rem 0.75rem;
  text-align: left;
  font-weight: 600;
  border: 1px solid #ddd;
}

.library-hours__body-content .hrstab td,
.library-hours__body-content table.table td {
  padding: 0.4rem 0.75rem;
  border: 1px solid #ddd;
}

/* ── Responsive ───────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .library-hours__tab {
    padding: 0.55rem 0.85rem;
    font-size: 0.85rem;
  }

  .library-hours__panel {
    padding: 1rem;
  }

  /* On mobile, keep text legible but slightly tighter */
  #lc-hours-month .s-lc-mhw-days th {
    font-size: 0.7rem;
    padding: 0.35rem 0.15rem;
  }

  #lc-hours-month .s-lc-mhw-day {
    padding: 0.35rem 0.3rem;
  }

  #lc-hours-month .s-lc-mhw-loc-name {
    font-size: 0.7rem;
  }

  #lc-hours-month .s-lc-mhw-tb .s-lc-time,
  #lc-hours-month .s-lc-mhw-tb .s-lc-closed {
    font-size: 0.68rem;
  }
}
