/* History CHQ theme. Admins can change the two brand colours in the dashboard (Site Settings);
   those values are added after this file and replace the variables below.
   Main colour (primary, brown): header, main buttons, active menu item.
   Second colour (secondary, blue): links, focus ring, highlights. */
:root {
  --chq-primary: #5A2400;
  --chq-primary-dark: #3f1900;
  --chq-tint: #efe9e5;
  --chq-secondary: #003258;
  --chq-secondary-dark: #00233e;
  --chq-accent: #003258;
  --chq-bg: #fbfaf7;
  --chq-text: #222222;
  --chq-muted: #5c5c5c;
  --chq-border: #d9d5cc;
  --chq-font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --chq-heading-font: Georgia, "Times New Roman", serif;
  --bs-link-color: var(--chq-secondary);
  --bs-link-hover-color: var(--chq-secondary-dark);
}

body { background: var(--chq-bg); color: var(--chq-text); font-family: var(--chq-font); font-size: 1.0625rem; }
h1, h2, h3, h4 { font-family: var(--chq-heading-font); }
a { color: var(--chq-secondary); }
a:hover { color: var(--chq-secondary-dark); }
.site-header { background: var(--chq-primary); color: #fff; }
.site-header a { color: #fff; text-decoration: none; }
.site-header .brand { font-family: var(--chq-heading-font); font-size: 1.5rem; font-weight: 700; }
.site-header .nav-link { color: #fff; }
.site-header .nav-link:hover, .site-header .nav-link:focus { text-decoration: underline; }
.site-footer { border-top: 1px solid var(--chq-border); color: var(--chq-muted); font-size: .95rem; }
.btn-primary { --bs-btn-bg: var(--chq-primary); --bs-btn-border-color: var(--chq-primary);
  --bs-btn-hover-bg: var(--chq-primary-dark); --bs-btn-hover-border-color: var(--chq-primary-dark);
  --bs-btn-active-bg: var(--chq-primary-dark); --bs-btn-active-border-color: var(--chq-primary-dark);
  --bs-btn-disabled-bg: var(--chq-primary); --bs-btn-disabled-border-color: var(--chq-primary); }
.btn-outline-primary { --bs-btn-color: var(--chq-secondary); --bs-btn-border-color: var(--chq-secondary);
  --bs-btn-hover-bg: var(--chq-secondary); --bs-btn-hover-border-color: var(--chq-secondary);
  --bs-btn-active-bg: var(--chq-secondary); --bs-btn-active-border-color: var(--chq-secondary); }
.nav-tabs .nav-link.active { color: var(--chq-primary); border-bottom-color: transparent; font-weight: 600; }
.page-link { color: var(--chq-secondary); }
.skip-link { position: absolute; left: -999px; top: 0; background: #fff; color: #000; padding: .5rem 1rem; z-index: 2000; }
.skip-link:focus { left: 0; }
:focus-visible { outline: 3px solid var(--chq-accent); outline-offset: 2px; }

/* Dashboard */
.dash-nav .nav-link { color: var(--chq-text); border-radius: .4rem; }
.dash-nav .nav-link.active { background: var(--chq-primary); color: #fff; }
.form-two-col th.form-label-cell { width: 32%; font-weight: 600; vertical-align: top; padding-top: .6rem; }
.form-narrow { max-width: 760px; }
.read-two-col th { width: 38%; font-weight: 600; color: var(--chq-muted); vertical-align: top; }
.edit-card .card-header { background: #f1efe9; }
.chq-checks { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; }
.chq-checks > div { display: flex; align-items: center; gap: .4rem; }
.chq-checks input { margin: 0; }
@media (max-width: 575.98px) {
  .form-two-col th, .form-two-col td, .form-two-col tr { display: block; width: 100% !important; }
  .form-two-col th.form-label-cell { padding-bottom: 0; }
}
.qr-box svg { width: 220px; height: 220px; background: #fff; padding: 8px; border: 1px solid var(--chq-border); }

/* Public directory */
.org-logo { width: 64px; height: 64px; object-fit: contain; }
.org-logo-lg { max-width: 120px; max-height: 120px; object-fit: contain; }
.org-card:hover, .org-card:focus-within { border-color: var(--chq-primary); box-shadow: 0 2px 8px rgba(0,0,0,.08); }

/* Public calendar */
.cal-grid { table-layout: fixed; background: #fff; }
.cal-grid td { height: 7.5rem; vertical-align: top; padding: .25rem; font-size: .85rem; }
.cal-grid th { font-size: .85rem; }
.cal-out { background: #f4f2ec; color: var(--chq-muted); }
.cal-today { outline: 3px solid var(--chq-accent); outline-offset: -3px; }
.cal-daynum { font-weight: 600; margin-bottom: .15rem; }
.cal-event { display: block; margin-bottom: .2rem; padding: .1rem .3rem; border-radius: .25rem; background: var(--chq-tint); color: var(--chq-primary-dark); text-decoration: none; line-height: 1.2; }
.cal-event:hover, .cal-event:focus { background: var(--chq-primary); color: #fff; }
.cal-time { font-weight: 600; }
.event-date { width: 3.5rem; padding: .3rem; border: 1px solid var(--chq-border); border-radius: .4rem; background: #fff; color: var(--chq-primary-dark); }
.event-card:hover, .event-card:focus-within { border-color: var(--chq-primary); box-shadow: 0 2px 8px rgba(0,0,0,.08); }