/*
Theme Name: History Theatre
Theme URI: https://www.historytheatre.com/
Description: Accessible block theme recreating the History Theatre look (rebuilt from the legacy Umlando/Drupal design). Self-hosted fonts, dual-coral accessible palette, WCAG-minded components.
Author: History Theatre / Matthew Foster
Version: 0.3.4
Requires at least: 6.6
Tested up to: 7.0
Requires PHP: 7.4
Text Domain: history-theatre
*/

/* Body-copy sizes pinned (WP fluid typography otherwise inflates 17px to 20px on wide screens) */
:root{--wp--preset--font-size--medium:17px;--wp--preset--font-size--small:14px}

/* ---- Accessibility baseline ---- */
.screen-reader-text{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip-path:inset(50%);white-space:nowrap;border:0
}
.skip-link{position:absolute;left:-9999px;top:0;z-index:100000;background:var(--wp--preset--color--teal);color:#fff;padding:.75rem 1rem;font-family:var(--wp--preset--font-family--figtree);font-weight:700}
.skip-link:focus{left:.5rem;top:.5rem;outline:3px solid var(--wp--preset--color--coral-vivid)}

/* Visible, consistent focus for keyboard users (never remove outlines) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
.wp-block-button__link:focus-visible,summary:focus-visible{
  outline:3px solid var(--wp--preset--color--coral-vivid);outline-offset:2px;border-radius:2px
}

/* ---- Buttons: "Buy Tickets" (coral) + "Book a Group" (teal) ---- */
.wp-block-button.is-style-tickets .wp-block-button__link{background:var(--wp--preset--color--coral-text);color:#fff}
.wp-block-button.is-style-tickets .wp-block-button__link:hover{background:var(--wp--preset--color--teal)}
.wp-block-button.is-style-group .wp-block-button__link{background:var(--wp--preset--color--teal);color:#fff}
.wp-block-button.is-style-group .wp-block-button__link:hover{background:var(--wp--preset--color--teal-dark)}
.wp-block-button__link{text-transform:none}

/* ---- Header search (compact white field on the dark topbar) ---- */
.ht-topbar .wp-block-search__inside-wrapper{background:#fff;border:0;border-radius:4px;padding:2px}
.ht-topbar .wp-block-search__input{border:0;padding:.35rem .6rem;font-family:var(--wp--preset--font-family--figtree);font-size:.95rem;background:transparent}
.ht-topbar .wp-block-search__button{background:transparent;color:#1f1f1f;border:0;margin:0;padding:.25rem .5rem;cursor:pointer}
.ht-topbar .wp-block-search__button:hover{color:var(--wp--preset--color--coral-text)}

/* ---- Archive grids (production + season archives reuse the season-card look) ---- */
.ht-archive-grid .wp-block-post-template{gap:1.75rem 1.5rem}
.ht-archive-grid .wp-block-post{text-align:center}
.ht-archive-grid .ht-card-poster{margin:0 0 .6rem}
.ht-archive-grid .ht-card-poster img{width:100%;height:auto;aspect-ratio:6/5;object-fit:cover;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.ht-archive-grid h2.ht-card-title{font-size:1.2rem;line-height:1.25;margin:0;border:0;padding:0}
.ht-card-title a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.ht-card-title a:hover,.ht-card-title a:focus{color:var(--wp--preset--color--coral-text)}
.ht-archive-grid .wp-block-query-pagination{margin-top:2rem;justify-content:center;font-family:var(--wp--preset--font-family--figtree)}

/* ---- Show-subtitle accent (was Dancing Script; now italic Figtree per In-Fin) ---- */
.ht-script{font-family:var(--wp--preset--font-family--figtree);font-style:italic;font-weight:600;color:var(--wp--preset--color--coral-text);font-size:1.15em;line-height:1.2}

/* ---- Header utilities (social + donate) ---- */
.ht-topbar .wp-block-site-logo img{max-height:50px;width:auto}
.ht-utilities{display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap}
.ht-social{display:flex;align-items:center;gap:.5rem}
.ht-social a{display:inline-flex}
.ht-social img{display:block}
.ht-donate{background:#2f6b2c;color:#fff !important;font-family:var(--wp--preset--font-family--figtree);font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:.45rem .95rem;border-radius:4px;text-decoration:none}
.ht-donate:hover,.ht-donate:focus{background:#24521f}

/* ---- Rainbow nav bar (original vibrant colors, white text; labels must stay >=18.66px BOLD so the large-text 3:1 contrast threshold applies) ---- */
/* z-index keeps open dropdowns above page content (carousel animations create stacking contexts) */
.ht-navbar{padding:0;position:relative;z-index:100}
.ht-nav.wp-block-navigation,.ht-nav .wp-block-navigation__responsive-container-content,.ht-nav .wp-block-navigation__container{width:100%}
.ht-nav .wp-block-navigation__container{display:flex;gap:0;flex-wrap:nowrap;margin:0}
/* each top-level item is an equal-width colored segment; label + chevron centered as a unit */
/* thin warm-white dotted separators between segments and at both outer edges (as on prod) */
.ht-nav .wp-block-navigation__container{border-right:1px dotted #FFF8E7}
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item{flex:1 1 0;text-align:center;justify-content:center;align-items:center;border-left:1px dotted #FFF8E7}
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item .wp-block-navigation__submenu-icon{margin-left:.3rem}
.ht-nav .wp-block-navigation-item a,.ht-nav .wp-block-navigation-item .wp-block-navigation-item__content,.ht-nav .wp-block-navigation__submenu-icon{
  color:#fff;font-family:var(--wp--preset--font-family--figtree);font-weight:700;font-size:1.25rem
}
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item > a,
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content{
  display:flex;justify-content:center;align-items:center;width:auto;padding:.7rem .25rem .7rem .5rem
}
/* segment colors (nudged only where large-bold 3:1 required it; Box Office = crimson, 5.9:1) */
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:nth-child(1){background:#E96F45}
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:nth-child(2){background:#C8102E}
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:nth-child(3){background:#E04C1A}
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:nth-child(4){background:#EA4D74}
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:nth-child(5){background:#A93914}
/* Open/hover segment matches production: black with gold label (#F19B09 on black ≈ 9:1) */
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:hover,
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:focus-within{background:#000}
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:hover > a,
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:focus-within > a,
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:focus-within > .wp-block-navigation-item__content,
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:hover .wp-block-navigation__submenu-icon,
.ht-nav .wp-block-navigation__container > .wp-block-navigation-item:focus-within .wp-block-navigation__submenu-icon{color:#F19B09}

/* ---- Dropdown submenus (white Bootstrap-style panel, matching production) ---- */
.ht-nav .wp-block-navigation__submenu-container{
  background:#fff;border:1px solid rgba(0,0,0,.15);border-radius:4px;
  box-shadow:0 6px 12px rgba(0,0,0,.176);min-width:190px;padding:5px 0;text-align:left;z-index:110
}
.ht-nav .wp-block-navigation__submenu-container .wp-block-navigation-item{background:none !important}
.ht-nav .wp-block-navigation__submenu-container .wp-block-navigation-item a,
.ht-nav .wp-block-navigation__submenu-container .wp-block-navigation-item .wp-block-navigation-item__content{
  color:#292929;font-family:var(--wp--preset--font-family--figtree);
  font-weight:400;font-size:14px;line-height:1.45;justify-content:flex-start;padding:5px 20px;width:100%
}
.ht-nav .wp-block-navigation__submenu-container .wp-block-navigation-item a:hover,
.ht-nav .wp-block-navigation__submenu-container .wp-block-navigation-item a:focus,
.ht-nav .wp-block-navigation__submenu-container .wp-block-navigation-item .wp-block-navigation-item__content:hover,
.ht-nav .wp-block-navigation__submenu-container .wp-block-navigation-item .wp-block-navigation-item__content:focus{
  background:#f5f5f5;color:var(--wp--preset--color--ink)
}
/* group divider (recreates the Drupal menu "Separator" rules) */
.ht-nav .wp-block-navigation__submenu-container .ht-divider-above{
  border-top:1px solid #e5e5e5;margin-top:9px;padding-top:9px
}
/* mobile: stack segments full-width (separators become horizontal) */
@media (max-width:781px){
  .ht-nav .wp-block-navigation__container{flex-wrap:wrap;border-right:0}
  .ht-nav .wp-block-navigation__container > .wp-block-navigation-item{flex:1 1 100%;border-left:0;border-top:1px dotted #FFF8E7}
}

/* ---- Mobile overlay menu: dark like production, but accessible (white on ink, not gray-on-black) ---- */
.wp-block-navigation.ht-nav .wp-block-navigation__responsive-container.is-menu-open,
.wp-block-navigation:not(.has-background).ht-nav .wp-block-navigation__responsive-container.is-menu-open{
  background:var(--wp--preset--color--ink);color:#fff
}
.ht-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{border-right:0}
.ht-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item{background:none;border-left:0;border-top:0}
.ht-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a,
.ht-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item .wp-block-navigation-item__content{color:#fff}
.ht-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container{
  background:none;border:0;border-radius:0;box-shadow:none;padding:0 0 0 1rem;min-width:0
}
.ht-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item a,
.ht-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item .wp-block-navigation-item__content{
  color:#fff;font-size:1rem;padding:.5rem 0
}
.ht-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item a:hover,
.ht-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item a:focus,
.ht-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item .wp-block-navigation-item__content:hover,
.ht-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item .wp-block-navigation-item__content:focus{
  background:none;color:#F19B09;text-decoration:underline
}
.ht-nav .wp-block-navigation__responsive-container.is-menu-open .ht-divider-above{border-top-color:rgba(255,255,255,.3)}
.ht-nav .wp-block-navigation__responsive-container.is-menu-open button{color:#fff}
/* hamburger + close icons sit on the teal bar / dark overlay: keep them white */
.ht-nav .wp-block-navigation__responsive-container-open,
.ht-nav .wp-block-navigation__responsive-container-close{color:#fff}

/* ---- Sidebar ticket CTAs (colors/sizes from the original .btn-tickets) ---- */
.ht-cta{text-align:center;margin:0 0 18px}
.ht-btn{
  display:block;font-family:var(--wp--preset--font-family--figtree);font-weight:400;
  color:#fff !important;text-decoration:none;border-radius:4px;padding:10px 16px;line-height:1.33
}
.ht-btn:hover,.ht-btn:focus{color:#fff !important}
.ht-btn-buy{background:#e04c1a;font-size:26px}
.ht-btn-buy:hover,.ht-btn-buy:focus{background:#a93914}
.ht-btn-group{background:var(--wp--preset--color--teal);font-size:22px}
.ht-btn-group:hover,.ht-btn-group:focus{background:var(--wp--preset--color--teal-dark)}
.ht-cart{display:inline-block;vertical-align:-.08em;margin-right:.35em}
.ht-cta-preview a{font-family:var(--wp--preset--font-family--figtree);font-size:1rem;text-decoration:none}
.ht-cta-preview a:hover,.ht-cta-preview a:focus{text-decoration:underline}

/* ---- Sidebar price table (original .table-tickets look) ---- */
.ht-ticket-table{
  width:100%;border-collapse:collapse;margin:6px 0 0;
  font-family:var(--wp--preset--font-family--figtree)
}
.ht-ticket-table th,.ht-ticket-table td{border:1px solid #ddd;text-align:center;padding:4px 6px}
.ht-ticket-table thead th{font-weight:700;font-size:1rem}
.ht-ticket-table tbody th{font-weight:700;font-size:1rem;white-space:nowrap}
.ht-ticket-table td{font-size:1.125rem}
.ht-ticket-table .ht-vmid{vertical-align:middle}
.ht-ticket-table .ht-cell-na{background:#aaa}
.ht-tix-notes{font-family:var(--wp--preset--font-family--figtree);font-size:1rem;margin-top:12px}
.ht-tix-notes p{margin:0 0 .5em}
.ht-tix-grouplink{
  font-family:var(--wp--preset--font-family--figtree);font-size:1.25rem;text-align:center;
  margin-top:12px;padding-top:12px;border-top:1px dotted #999
}
.ht-tix-grouplink p{margin:0}

/* ---- Performance calendar (accessible replacement for the old JPEG grids) ---- */
.ht-perfcal-wrap{margin:1.5rem 0}
.ht-perfcal-head{
  font-family:var(--wp--preset--font-family--figtree);color:var(--wp--preset--color--coral-text);
  font-size:1.375rem;line-height:1.3;margin:0 0 .75rem
}
.ht-perfcal{width:100%;border-collapse:collapse;font-family:var(--wp--preset--font-family--figtree)}
.ht-perfcal th,.ht-perfcal td{border:1px solid #d9d2c3;padding:.45rem .55rem;text-align:left;font-size:1rem}
.ht-perfcal thead th{background:var(--wp--preset--color--teal);color:#fff;font-weight:700;text-transform:uppercase;font-size:.85rem;letter-spacing:.03em}
.ht-perfcal tbody tr:nth-child(even){background:var(--wp--preset--color--paper-warm)}
.ht-perfcal-date{font-weight:700;margin-right:.15rem}
.ht-perfcal abbr{text-decoration:none;font-weight:700;color:var(--wp--preset--color--coral-text)}
.ht-perfcal-note{font-size:.85rem;color:var(--wp--preset--color--muted)}
.ht-perfcal-legend{font-family:var(--wp--preset--font-family--figtree);font-size:.9rem;color:var(--wp--preset--color--muted);margin:.5rem 0 0}
/* small screens: the grid becomes a stacked list, one day per row */
@media (max-width:600px){
  .ht-perfcal thead{position:absolute;left:-9999px}
  .ht-perfcal,.ht-perfcal tbody,.ht-perfcal tr,.ht-perfcal td{display:block;width:100%}
  .ht-perfcal td{border:0;padding:.3rem 0}
  .ht-perfcal td:empty{display:none}
  .ht-perfcal tr{border-bottom:1px dotted #d9d2c3;padding:.2rem 0}
}

/* ---- "Opens / Now playing" — cheerful yellow sticky-note ribbon ---- */
.ht-nowplaying{background:#f5d33f;color:#1f1f1f;text-align:center;padding:.85rem 1rem;border-radius:4px;transform:rotate(-1.8deg);box-shadow:0 3px 8px rgba(0,0,0,.18);margin-bottom:1.25rem}
.ht-nowplaying p{margin:0}
.ht-np-label{font-family:var(--wp--preset--font-family--figtree);font-weight:400;font-size:24px;line-height:1.33;color:#1f1f1f}

/* ---- Coral section headings (accessible dark coral) ---- */
.ht-body :is(h2,h3,h4,h5),.ht-side-head{
  font-family:var(--wp--preset--font-family--figtree);color:var(--wp--preset--color--coral-text)
}
/* body-copy heading scale close to the original (prod section heads are 19px Titillium) */
.ht-body h2{font-size:1.375rem;line-height:1.3;margin:1.5rem 0 .5rem}
.ht-body h3{font-size:1.2rem;line-height:1.3;margin:1.25rem 0 .4rem}
.ht-body :is(h4,h5){font-size:1.05rem;line-height:1.3;margin:1.1rem 0 .35rem}

/* ---- Blockquote callout (Bootstrap-style, as on the original site) ---- */
.ht-body blockquote{padding:10px 20px;margin:0 0 1.25rem;border-left:5px solid #eee}
.ht-body blockquote :is(h2,h3,h4,h5){margin:0}
.ht-body blockquote :last-child{margin-bottom:0}
.ht-side-head{font-size:1.15rem;margin:1.5rem 0 .6rem}
.ht-showlen{font-family:var(--wp--preset--font-family--figtree);color:var(--wp--preset--color--muted);margin:1rem 0}
.ht-side-body{line-height:1.6}

/* ---- Footer ---- */
.ht-legal{text-align:center;font-family:var(--wp--preset--font-family--figtree);font-size:.85rem;margin-top:.6rem}
.ht-legal a{color:#fff;text-decoration:underline;text-underline-offset:2px}
.ht-legal a:hover,.ht-legal a:focus{color:var(--wp--preset--color--coral-vivid)}
.ht-footer-logo{max-width:260px;height:auto;margin-bottom:1rem}
.ht-funders{display:flex;gap:1rem;align-items:flex-start;margin-bottom:.75rem}
.ht-funders img{height:90px;width:auto}

/* ---- Production meta (byline / directed-by / premiere / dates — Titillium 23px like prod) ---- */
.ht-creditline,.ht-rundates{
  font-family:var(--wp--preset--font-family--figtree);font-weight:400;font-style:normal;
  font-size:23px;line-height:1.4;color:#363635
}
.ht-creditline p{margin:0 0 10px}

/* Links get a clear underline (don't rely on color alone) */
.entry-content a,.ht-body a{text-underline-offset:2px}

/* Images placed by staff never overflow */
.entry-content img,.ht-inline{max-width:100%;height:auto}

/* ---- Home carousel (accessible: buttons, pause control, reduced-motion aware) ---- */
.ht-carousel{position:relative;margin-bottom:2rem}
.ht-car-slide img{display:block;width:100%;height:auto;border-radius:4px}
.ht-car-slide.is-active img{animation:ht-fade .45s ease}
@keyframes ht-fade{from{opacity:.25}to{opacity:1}}
.ht-car-btn{
  position:absolute;display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;padding:0;border:0;border-radius:50%;cursor:pointer;
  background:rgba(0,0,0,.55);color:#fff
}
.ht-car-btn:hover{background:rgba(0,0,0,.8)}
.ht-car-btn svg{width:22px;height:22px}
.ht-car-prev{left:.75rem;top:50%;transform:translateY(-50%)}
.ht-car-next{right:.75rem;top:50%;transform:translateY(-50%)}
.ht-car-toggle{right:.75rem;bottom:.75rem}
.ht-carousel.is-rotating .ht-icon-play{display:none}
.ht-carousel:not(.is-rotating) .ht-icon-pause{display:none}

/* ---- Season grid (front page) ---- */
.ht-season-heading{text-align:center;margin-bottom:1.5rem}
.ht-season-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1.75rem 1.5rem;margin-bottom:2.5rem}
.ht-season-card{text-align:center}
.ht-card-link{display:block;text-decoration:none}
.ht-card-poster{display:block;margin-bottom:.6rem}
.ht-card-poster img{display:block;width:100%;height:auto;aspect-ratio:6/5;object-fit:cover;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.ht-card-link:hover .ht-card-poster img,.ht-card-link:focus .ht-card-poster img{outline:3px solid var(--wp--preset--color--coral-vivid);outline-offset:2px}
.ht-card-title{
  display:block;font-family:var(--wp--preset--font-family--figtree);font-weight:700;
  font-size:1.2rem;line-height:1.25;color:var(--wp--preset--color--teal);text-decoration:underline;text-underline-offset:2px
}
.ht-card-link:hover .ht-card-title,.ht-card-link:focus .ht-card-title{color:var(--wp--preset--color--coral-text)}
.ht-card-dates{margin:.25rem 0 0;font-weight:400;color:var(--wp--preset--color--muted)}

/* ---- Respect reduced-motion (carousels/animations) ---- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}
}

/* ---- Two-column page layout: main content left, aside (e.g. board list) right ---- */
/* Wrap page content in .ht-twocol with two child divs; stacks to one column on small screens */
.ht-twocol{display:grid;grid-template-columns:2fr 1fr;gap:0 3rem;align-items:start}
.ht-twocol > *{min-width:0}
.ht-twocol .ht-page-aside h2:first-child{margin-top:1.5rem}
@media (max-width:781px){.ht-twocol{grid-template-columns:1fr}}