/*
Theme Name: AABEA New England
Theme URI: https://aabeane.org
Author: AABEA New England Chapter
Description: Custom block theme for the AABEA New England chapter. Brand tokens are defined in theme.json; layout lives in templates/ and parts/; editor-facing layouts live in patterns/. Content is managed entirely in wp-admin.
Version: 1.11.1
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: aabea-ne
Tags: block-theme, full-site-editing, accessibility-ready, custom-colors
*/

/* ---------------------------------------------------------------
   theme.json handles colors, typography, spacing and block styles.
   Only what the block system cannot express belongs in this file.
   --------------------------------------------------------------- */

/* Skip link — keyboard users land here first */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 999;
  padding: 0.75rem 1.25rem;
  background: var(--wp--preset--color--brand-indigo);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
}
.skip-link:focus { left: 0; }

/* Visible focus ring everywhere — the default is too faint on our blues */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--wp--preset--color--brand-gold);
  outline-offset: 2px;
}

/* Sidebar panels ---------------------------------------------- */
.aabea-panel {
  border: 1px solid var(--wp--preset--color--line);
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
}
.aabea-panel__title {
  background: var(--wp--preset--color--surface);
  border-bottom: 1px solid var(--wp--preset--color--line);
  margin: 0;
  padding: 0.8rem 1rem;
  text-align: center;
  font-size: 1.15rem;
}
.aabea-panel .wp-block-post-template { margin: 0; }
.aabea-panel li { border-bottom: 1px solid var(--wp--preset--color--line); padding: 0.75rem 1rem; }
.aabea-panel li:last-child { border-bottom: 0; }

/* Event date chip --------------------------------------------- */
.aabea-datechip {
  flex: none;
  width: 58px;
  text-align: center;
  border-radius: 3px;
  padding: 0.5rem 0;
  background: var(--wp--preset--color--blue-700);
  color: #fff;
  line-height: 1.15;
}

/* Cards -------------------------------------------------------- */
.aabea-card {
  border: 1px solid var(--wp--preset--color--line);
  border-radius: 5px;
  background: #fff;
  height: 100%;
}

/* Section heading with rule ------------------------------------ */
.aabea-sectiontitle {
  display: flex;
  align-items: center;
  gap: 0.9rem;
}
.aabea-sectiontitle::after {
  content: "";
  flex: 1;
  height: 2px;
  background: var(--wp--preset--color--line);
}

/* Gold is a FILL colour only — never text on a light background.
   Contrast on white is 1.54:1 and fails WCAG. Enforced here as a
   backstop in case a future editor overrides theme.json. */
.has-brand-gold-color:not(.has-background) { color: var(--wp--preset--color--brand-indigo) !important; }

/* Print — event pages get printed and pinned to noticeboards */
@media print {
  .aabea-utility, .aabea-nav, .wp-block-post-navigation-link, .aabea-panel { display: none !important; }
  body { color: #000; }
}

/* Event date shown beneath titles in listings ------------------ */
.aabea-event-meta {
  margin: 0.25rem 0 0;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--wp--preset--color--blue-600);
}
.aabea-panel .aabea-event-meta { padding: 0 1rem 0.75rem; margin-top: -0.4rem; }

/* Event detail line on a single event page */
.aabea-event-summary {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--wp--preset--color--blue-700);
  border-left: 4px solid var(--wp--preset--color--brand-gold);
  padding-left: 1rem;
  margin: 1rem 0 1.5rem;
}

/* Read More rendered as a gold button inside the hero */
.wp-block-cover .wp-block-read-more {
  display: inline-block;
  background: var(--wp--preset--color--brand-gold);
  color: #2A1D00;
  padding: 0.75rem 1.5rem;
  border-radius: 3px;
  font-weight: 700;
  text-decoration: none;
}
.wp-block-cover .wp-block-read-more:hover { background: #E8B517; text-decoration: none; }

/* Hero: the linked event title must stay white on the indigo cover.
   Without this it inherits the link colour and drops to ~2:1 contrast. */
.wp-block-cover .wp-block-post-title a,
.wp-block-cover .wp-block-post-title a:hover { color: #fff; text-decoration: none; }
.wp-block-cover .wp-block-post-title a:hover { text-decoration: underline; }

/* The date chip is redundant in the hero, where the full summary line
   already states the date. Suppress it there only. */
.wp-block-cover .aabea-event-meta { display: none; }

/* Past-event photo cards ---------------------------------------- */
.aabea-photocard img { border-radius: 5px; transition: opacity .18s ease; }
.aabea-photocard a:hover img { opacity: .85; }
.aabea-photocard .wp-block-post-title { line-height: 1.35; }
.aabea-photocard .wp-block-post-title a { text-decoration: none; }
.aabea-photocard .wp-block-post-title a:hover { text-decoration: underline; }

/* Hide the registration button when an event has no registration URL.
   The binding yields an empty value, leaving an anchor with no href. */
.wp-block-buttons:has(> .wp-block-button > a.wp-block-button__link:not([href])),
.wp-block-buttons:has(> .wp-block-button > a.wp-block-button__link[href=""]) { display: none; }
.wp-block-button__link:not([href]),
.wp-block-button__link[href=""] { display: none; }


/* Caption for the featured image. The core Featured Image block cannot render
   one, so the template pulls it through a binding instead. Collapses when the
   image has no caption. */
.aabea-figcaption {
  font-size: 0.85rem;
  color: var(--wp--preset--color--muted);
  font-style: italic;
  margin-top: 0;
  margin-bottom: var(--wp--preset--spacing--40);
}
.aabea-figcaption:empty { display: none; }

/* Hero ---------------------------------------------------------- */
.aabea-hero .wp-block-post-title a { color: #fff; text-decoration: none; }
.aabea-hero .wp-block-post-title a:hover { text-decoration: underline; }
.aabea-hero .wp-block-post-featured-image { margin: 0; }
.aabea-hero .wp-block-post-featured-image img { border-radius: 4px; width: 100%; height: auto; }
/* Collapse the poster column when an event has no featured image */
.aabea-hero .wp-block-post-featured-image:empty { display: none; }
.aabea-hero .wp-block-read-more {
  display: inline-block; background: var(--wp--preset--color--brand-gold);
  color: #2A1D00; padding: 0.7rem 1.4rem; border-radius: 3px;
  font-weight: 700; text-decoration: none; margin-top: 0.5rem;
}
.aabea-hero .wp-block-read-more:hover { background: #E8B517; }
@media (max-width: 781px) {
  .aabea-hero .wp-block-columns { gap: 1.25rem; }
}

/* Hero ---------------------------------------------------------- */
.aabea-hero .wp-block-post-title a { color: #fff; text-decoration: none; }
.aabea-hero .wp-block-post-title a:hover { text-decoration: underline; }
.aabea-hero .wp-block-post-featured-image { margin: 0; }
.aabea-hero .wp-block-post-featured-image img { border-radius: 4px; width: 100%; height: auto; }
/* Collapse the poster column when an event has no featured image */
.aabea-hero .wp-block-post-featured-image:empty { display: none; }
.aabea-hero .wp-block-read-more {
  display: inline-block; background: var(--wp--preset--color--brand-gold);
  color: #2A1D00; padding: 0.7rem 1.4rem; border-radius: 3px;
  font-weight: 700; text-decoration: none; margin-top: 0.5rem;
}
.aabea-hero .wp-block-read-more:hover { background: #E8B517; }
@media (max-width: 781px) {
  .aabea-hero .wp-block-columns { gap: 1.25rem; }
}

/* Masthead: logo and chapter wordmark read as one lockup, not two things
   pinned to opposite edges of the page. */

/* The date chip is redundant wherever the summary line already states the
   date -- the hero is a group now, not a cover, so scope it to both. */
.aabea-hero .aabea-event-meta { display: none; }


/* ===== Header =================================================
   One row: logo + chapter wordmark on the left, navigation right.
   The separate blue nav band is gone, so the page starts higher. */
.aabea-utility { font-size: 0.8rem; }
.aabea-utility a { color: #C3B9DD; text-decoration: none; }
.aabea-utility a:hover { color: #fff; text-decoration: underline; }

.aabea-masthead { border-bottom: 3px solid var(--wp--preset--color--brand-gold); gap: 1.25rem; }

.aabea-lockup { gap: 0.9rem; align-items: center; }
.aabea-lockup .wp-block-site-logo { margin: 0; }
.aabea-lockup .wp-block-site-logo img { height: 58px; width: auto; }
.aabea-wordmark {
  border-left: 2px solid var(--wp--preset--color--line);
  padding-left: 0.9rem;
}
.aabea-wordmark p { margin: 0; line-height: 1.2; }

/* Navigation, now inline with the lockup */
.aabea-nav { gap: 0.15rem; }
.aabea-nav .wp-block-navigation-item__content {
  color: var(--wp--preset--color--brand-indigo);
  font-weight: 600;
  font-size: 0.95rem;
  padding: 0.5rem 0.7rem;
  border-radius: 3px;
  text-decoration: none;
}
.aabea-nav .wp-block-navigation-item__content:hover,
.aabea-nav .current-menu-item > .wp-block-navigation-item__content {
  background: var(--wp--preset--color--surface);
  color: var(--wp--preset--color--blue-700);
}
.aabea-nav .wp-block-navigation__submenu-container {
  border: 1px solid var(--wp--preset--color--line);
  border-radius: 4px;
  box-shadow: 0 6px 20px rgba(15,25,45,.12);
  padding: 0.25rem;
}
.aabea-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  font-weight: 500;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .aabea-lockup .wp-block-site-logo img { height: 46px; }
  .aabea-wordmark { border-left: 0; padding-left: 0; }
  .aabea-wordmark p:first-child { font-size: 0.95rem; }
}

/* Draft notes left for the committee. Deliberately conspicuous so nobody
   mistakes them for finished copy — delete the block once actioned. */
.aabea-editnote {
  background: #FFF8E1;
  border-left: 4px solid var(--wp--preset--color--brand-gold);
  padding: 0.9rem 1.1rem;
  font-size: 0.9rem;
  color: #6b5d20;
  border-radius: 0 3px 3px 0;
}

/* Committee member cards ---------------------------------------- */
.aabea-person { text-align: center; }
.aabea-person .wp-block-post-featured-image { margin: 0 auto 0.6rem; width: 128px; }
.aabea-person .wp-block-post-featured-image img { border-radius: 50%; object-fit: cover; }
.aabea-person .wp-block-post-title { margin: 0; line-height: 1.3; }
.aabea-person .wp-block-post-title a { text-decoration: none; }
.aabea-person .wp-block-post-title a:hover { text-decoration: underline; }
.aabea-person__role {
  margin: 0;
  color: var(--wp--preset--color--muted);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 0.78rem;
}

/* Sections that should disappear rather than advertise their own emptiness.
   A visitor should never be told a section has nothing in it, and should never
   see instructions written for editors. */
.aabea-optional:has(.wp-block-query-no-results) { display: none; }

/* Clickable cards. The heading carries the only real link, and a stretched
   pseudo-element makes the whole card a target - so mouse users get a big hit
   area while screen readers and keyboards still see one clean link. */
.aabea-card--link { position: relative; transition: border-color .15s ease, box-shadow .15s ease; }
.aabea-card--link:hover { border-color: var(--wp--preset--color--blue-300); box-shadow: 0 3px 14px rgba(15,25,45,.09); }
.aabea-card--link h3 { margin-top: 0; }
.aabea-card--link h3 a { text-decoration: none; color: var(--wp--preset--color--brand-indigo); }
.aabea-card--link h3 a::after { content: ""; position: absolute; inset: 0; }
.aabea-card--link:hover h3 a { text-decoration: underline; }
.aabea-card--link h3 a:focus-visible { outline: none; }
.aabea-card--link:has(h3 a:focus-visible) { outline: 3px solid var(--wp--preset--color--brand-gold); outline-offset: 2px; }

/* Visually hidden, still read by screen readers and indexed by search engines.
   The homepage needs an h1 naming the organisation; visually that job is done
   by the logo, which is an image. */
.aabea-srt {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
  white-space: nowrap; border: 0;
}

/* Donate reads as an action, not a destination, so it is styled as a button
   rather than a seventh navigation link competing with the other six. */
.aabea-nav .aabea-navcta .wp-block-navigation-item__content {
  background: var(--wp--preset--color--brand-gold);
  color: #2A1D00;
  font-weight: 700;
  padding: 0.5rem 1.1rem;
  border-radius: 3px;
  margin-left: 0.4rem;
}
.aabea-nav .aabea-navcta .wp-block-navigation-item__content:hover {
  background: #E8B517;
  color: #2A1D00;
}
