/* ============================================================
   USA HOLIDAYS PAGES  (added 2026-10-11)
   Used by holidays.php for /holidays/ and /holidays-YYYY/.
   Brand navy #1E3A8A, same grays as the rest of the site.
   ============================================================ */
.hol-page-wrap { max-width: 1000px; margin: 0 auto; padding: 0 16px 40px; }

.hol-intro h1 { font-size: 1.75rem; font-weight: 700; color: #111827; margin: 8px 0 8px; }
.hol-intro p  { color: #374151; font-size: 1rem; line-height: 1.65; margin: 0 0 16px; max-width: 820px; }

/* Year picker */
.hol-toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 14px; }
.hol-toolbar-label, .hol-filter label { font-size: 0.85rem; font-weight: 600; color: #374151; }
.hol-hint { font-size: 0.85rem; color: #6b7280; }
.hol-select {
    padding: 8px 32px 8px 12px; font-size: 0.92rem; font-family: inherit; color: #111827;
    border: 1px solid #d1d5db; border-radius: 6px; min-width: 150px; cursor: pointer; appearance: none;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M3 4.5l3 3 3-3z'/%3E%3C/svg%3E") no-repeat right 10px center;
}
input.hol-select { background-image: none; padding-right: 12px; cursor: text; }
.hol-select:focus { outline: none; border-color: #1e3a8a; box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.15); }

/* Next holiday note */
.hol-next {
    margin: 0 0 16px; padding: 12px 16px; border-radius: 8px;
    background: #eff6ff; border: 1px solid #bfdbfe; color: #1e3a8a; font-size: 0.95rem;
}
.hol-next b { color: #111827; }

/* Quick facts */
.hol-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0 0 20px; }
.hol-fact { background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; padding: 14px 16px; }
.hol-fact b { display: block; font-size: 1.6rem; line-height: 1.1; color: #1e3a8a; }
.hol-fact span { font-size: 0.85rem; color: #4b5563; }

/* Sections */
.hol-section { margin: 0 0 20px; padding: 20px; background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; }
.hol-section > h2 { font-size: 1.25rem; font-weight: 700; color: #111827; margin: 0 0 10px; }
.hol-section > p { color: #4b5563; line-height: 1.6; margin: 0 0 12px; }
.hol-prose h3 { font-size: 1rem; font-weight: 600; color: #111827; margin: 16px 0 6px; }
.hol-prose p { color: #374151; line-height: 1.65; margin: 0 0 10px; }
.hol-prose ul { margin: 4px 0 0 20px; padding: 0; color: #374151; line-height: 1.65; list-style: disc; }
.hol-prose li { margin: 0 0 6px; }
.hol-section a { color: #1e3a8a; }

/* Tables */
.hol-table-wrap { overflow-x: auto; border: 1px solid #e5e7eb; border-radius: 8px; }
.hol-table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.hol-table thead { background: #f9fafb; }
.hol-table th, .hol-table td { text-align: left; padding: 10px 12px; border-bottom: 1px solid #f1f5f9; vertical-align: top; }
.hol-table thead th { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.03em; color: #374151; white-space: nowrap; border-bottom: 1px solid #e5e7eb; }
.hol-table tbody tr:last-child td { border-bottom: none; }
.hol-table small { display: block; font-size: 0.78rem; color: #6b7280; font-weight: 400; }
.hol-name { font-weight: 600; color: #111827; }
.hol-date { white-space: nowrap; font-weight: 500; color: #111827; }
.hol-day, .hol-rule, .hol-muted { color: #6b7280; }
.hol-table tr.is-shifted td { background: #fffbeb; }
.hol-moved { display: inline-block; margin-left: 4px; font-size: 0.72rem; font-weight: 600; color: #92400e; background: #fef3c7; border-radius: 4px; padding: 1px 6px; }

/* Matrix on the hub */
.hol-matrix { font-size: 0.82rem; table-layout: fixed; min-width: 760px; }
.hol-matrix th, .hol-matrix td { padding: 8px 4px; }
.hol-matrix th[scope="row"] { width: 150px; padding-left: 12px; font-weight: 600; color: #111827; }
.hol-matrix thead th:first-child { width: 150px; padding-left: 12px; }
.hol-matrix td { text-align: center; }
.hol-matrix thead th { text-align: center; }
.hol-matrix thead th:first-child { text-align: left; }
.hol-matrix td.is-shifted { background: #fffbeb; }
.hol-matrix td em { display: block; font-style: normal; font-size: 0.7rem; line-height: 1.25; color: #92400e; margin-top: 2px; }

/* Year cards */
.hol-year-cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.hol-year-card {
    display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border: 1px solid #e5e7eb; border-radius: 10px;
    text-decoration: none; color: #4b5563; font-size: 0.82rem; transition: border-color .15s, box-shadow .15s;
}
.hol-year-card:hover { border-color: #1e3a8a; box-shadow: 0 2px 8px rgba(30, 58, 138, 0.12); }
.hol-year-card-y { font-size: 1.2rem; font-weight: 700; color: #1e3a8a; margin-bottom: 2px; }

/* Long weekends */
.hol-long { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.hol-long li {
    display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 2fr) auto; align-items: center; gap: 12px;
    padding: 10px 14px; border: 1px solid #e5e7eb; border-radius: 8px;
}
.hol-long-name { font-weight: 600; color: #111827; }
.hol-long-when { color: #374151; font-size: 0.92rem; }
.hol-long-tag { font-size: 0.78rem; font-weight: 700; color: #1e3a8a; background: #eff6ff; border-radius: 999px; padding: 3px 10px; white-space: nowrap; }
.hol-long-tag.is-bridge { color: #065f46; background: #d1fae5; }
.hol-long-tag.is-mid { color: #6b7280; background: #f3f4f6; }

/* Filters + full list */
.hol-filters { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; margin: 0 0 12px; }
.hol-filter { display: flex; flex-direction: column; gap: 4px; }
.hol-filter-search { flex: 1 1 200px; }
.hol-filter-search input { width: 100%; }
.hol-reset {
    padding: 8px 14px; font-size: 0.88rem; font-family: inherit; border-radius: 6px; cursor: pointer;
    border: 1px solid #1e3a8a; background: #fff; color: #1e3a8a; font-weight: 600;
}
.hol-reset:hover { background: #eff6ff; }
.hol-count { margin: 0 0 0 auto; font-size: 0.85rem; color: #6b7280; align-self: center; }
.hol-count strong { color: #111827; }
.hol-list tr.hol-mrow th {
    background: #f1f5f9; color: #1e3a8a; font-size: 0.85rem; font-weight: 700; padding: 8px 12px;
    text-transform: none; letter-spacing: 0;
}
.hol-tag { display: inline-block; font-size: 0.74rem; font-weight: 600; padding: 2px 8px; border-radius: 4px; white-space: nowrap; }
.hol-tag-federal    { background: #fee2e2; color: #991b1b; }
.hol-tag-state      { background: #eff6ff; color: #1e40af; }
.hol-tag-religious  { background: #f3e8ff; color: #6b21a8; }
.hol-tag-observance { background: #f3f4f6; color: #374151; }
.hol-tag-season     { background: #ecfdf5; color: #065f46; }
.hol-empty { padding: 28px 16px; text-align: center; color: #6b7280; margin: 0; }
.hol-note { font-size: 0.82rem; color: #6b7280; margin: 10px 0 0; }

/* Year links */
.hol-year-nav-links { display: flex; flex-wrap: wrap; gap: 8px; }
.hol-year-link { padding: 6px 12px; background: #f3f4f6; color: #1e3a8a; border-radius: 6px; font-size: 0.88rem; font-weight: 500; text-decoration: none; }
.hol-year-link:hover { background: #e5e7eb; }
.hol-year-link.is-active { background: #1e3a8a; color: #fff; }
.hol-related { margin: 12px 0 0; color: #4b5563; font-size: 0.92rem; }

@media (max-width: 820px) {
    .hol-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hol-year-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hol-long li { grid-template-columns: minmax(0, 1fr) auto; }
    .hol-long-when { grid-column: 1 / 2; grid-row: 2; }
    .hol-long-tag { grid-row: 1 / 3; grid-column: 2; }
}
@media (max-width: 640px) {
    .hol-intro h1 { font-size: 1.45rem; }
    .hol-section { padding: 16px 14px; }
    .hol-table { font-size: 0.85rem; }
    .hol-table th, .hol-table td { padding: 8px 9px; }
    .hol-filter { flex: 1 1 140px; }
    .hol-filter .hol-select { width: 100%; min-width: 0; }
    .hol-count { margin: 0; width: 100%; }
}
@media print {
    .hol-toolbar, .hol-filters, .hol-next, .hol-year-nav { display: none !important; }
    .hol-section { border: none; padding: 0; }
}
