/*
Theme Name: ALC NYC
Theme URI: https://agilelearningcenternyc.org
Author: ALC NYC
Description: Block theme for Agile Learning Center NYC. Five-value palette sampled from the logo, Jost display / Literata body, setback-rule dividers. Built for two maintainers and static content.
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: alc-nyc
Tags: education, block-patterns, full-site-editing, one-column, wide-blocks, accessibility-ready
*/

/* Skip link */
.alc-skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 999;
  background: var(--wp--preset--color--signal); color: #fff;
  padding: 1rem 1.5rem; font-family: var(--wp--preset--font-family--utility);
  font-size: 0.8125rem; letter-spacing: 0.08em; text-transform: uppercase; text-decoration: none;
}
.alc-skip-link:focus { left: 1rem; top: 1rem; }

/* Visible keyboard focus on signal */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--wp--preset--color--signal);
  outline-offset: 2px;
}

/* ---- The setback rule. One accessory. Three scales. ---- */
.alc-setback { display: block; width: 100%; height: 16px; border: 0; margin: 0; padding: 0;
  background: none; color: inherit; }
.alc-setback svg { display: block; width: 100%; height: 100%; }
.alc-setback--mark { width: 64px; height: 12px; }

/* Utility type role */
.alc-utility {
  font-family: var(--wp--preset--font-family--utility);
  font-size: var(--wp--preset--font-size--small);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Display type: caps, tight tracking */
h1, h2, h3, .wp-block-post-title {
  letter-spacing: -0.02em;
  text-transform: uppercase;
  text-wrap: balance;
}
p { text-wrap: pretty; }

/* ---- Header: floats on every page, every viewport ---- */
/* Sticky fails if any ancestor clips or transforms, so neutralise the usual
   suspects. WordPress and Jetpack both add overflow rules in places. */
html { scroll-padding-top: 7rem; }
html, body, .wp-site-blocks, .wp-site-blocks > .wp-block-group,
main.wp-block-group, #alc-content {
  overflow: visible !important;
}

.alc-header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 500;
  background: #fff;
  transition: padding 220ms ease;
}
/* Template parts render the header inside a wrapper on some setups. */
.wp-site-blocks > header:has(.alc-header),
.wp-site-blocks > div:has(> .alc-header) {
  position: sticky;
  top: 0;
  z-index: 500;
}
.alc-header-spacer { display: block; }
.admin-bar .alc-header { top: 32px; }
@media screen and (max-width: 782px) {
  .admin-bar .alc-header { top: 46px; }
}

.alc-header .alc-header__tagline { transition: opacity 160ms ease, max-height 220ms ease; }
.alc-header.is-compact { box-shadow: 0 1px 0 var(--wp--preset--color--rule); }
.alc-header.is-compact .alc-header__tagline { opacity: 0; max-height: 0; overflow: hidden; }
.alc-header .alc-header__mark { width: 44px; height: 44px; background: var(--wp--preset--color--signal); flex: none; transition: width 220ms ease, height 220ms ease; }
.alc-header.is-compact .alc-header__mark { width: 26px; height: 26px; }
.alc-header.is-compact .wp-block-site-title { font-size: 0.9375rem; }
.alc-header.is-compact > .wp-block-group { padding-top: 0.75rem !important; padding-bottom: 0.75rem !important; }
.alc-header.is-compact .alc-setback { height: 6px; }

@media (prefers-reduced-motion: reduce) {
  .alc-header, .alc-header *, .alc-header .alc-setback { transition: none !important; }
}

/* Submenus in the floating bar */
.alc-header .wp-block-navigation__submenu-container {
  border: 1px solid var(--wp--preset--color--rule);
  background: #fff;
  border-radius: 0;
  min-width: 16rem;
}
.alc-header .wp-block-navigation__submenu-container a { padding: 0.75rem 1rem; }

/* Buttons: square, signal, uppercase utility */
.wp-block-button__link, .wp-block-search__button, .wp-block-file__button,
.wp-block-jetpack-contact-form button, .wp-block-jetpack-button button {
  border-radius: 0 !important;
  font-family: var(--wp--preset--font-family--utility);
  font-size: 0.9375rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 1.125rem 2rem;
}

/* Jetpack Forms, styled to the system */
.wp-block-jetpack-contact-form .grunion-field-label,
.wp-block-jetpack-contact-form label {
  font-family: var(--wp--preset--font-family--utility);
  font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wp--preset--color--signal-text);
  font-weight: 400;
}
.wp-block-jetpack-contact-form input[type="text"],
.wp-block-jetpack-contact-form input[type="email"],
.wp-block-jetpack-contact-form input[type="tel"],
.wp-block-jetpack-contact-form input[type="url"],
.wp-block-jetpack-contact-form input[type="date"],
.wp-block-jetpack-contact-form select,
.wp-block-jetpack-contact-form textarea {
  border-radius: 0;
  border: 1px solid var(--wp--preset--color--rule);
  background: #fff;
  font-family: var(--wp--preset--font-family--body);
  font-size: 1rem;
  padding: 0.875rem;
}
.wp-block-jetpack-contact-form .contact-form__input-container { margin-bottom: 1.5rem; }

/* Sites-of-learning and card grids: no rounded corners, no shadows */
.wp-block-image img, .wp-block-cover, .wp-block-group { border-radius: 0; }

/* Nav: utility face */
.wp-block-navigation { font-family: var(--wp--preset--font-family--utility); font-size: 0.8125rem; letter-spacing: 0.06em; text-transform: uppercase; }
.wp-block-navigation a { text-decoration: none; }
.wp-block-navigation a:hover { text-decoration: underline; text-underline-offset: 4px; }
.wp-block-navigation .current-menu-item > a { color: var(--wp--preset--color--signal-text); border-bottom: 2px solid var(--wp--preset--color--signal); padding-bottom: 3px; }

/* Empty state block: an invitation, not an apology */
.alc-empty { border: 1px solid var(--wp--preset--color--rule); padding: 2.5rem; max-width: var(--wp--style--global--content-size); }

/* ---- Accordion. Core details blocks, styled as a list that opens. ---- */
.wp-block-details {
  border-bottom: 1px solid var(--wp--preset--color--rule);
  padding: 0;
}
.wp-block-details > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: baseline;
  gap: 1rem;
  padding: 1.25rem 0;
  font-family: var(--wp--preset--font-family--display);
  font-size: 1.25rem;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  line-height: 1.25;
}
.wp-block-details > summary::-webkit-details-marker { display: none; }
.wp-block-details > summary::before {
  content: "";
  flex: none;
  width: 14px; height: 14px;
  margin-top: 0.35em;
  border-left: 2px solid var(--wp--preset--color--signal);
  border-bottom: 2px solid var(--wp--preset--color--signal);
  transform: rotate(-45deg);
  transform-origin: 55% 55%;
  transition: transform 180ms ease;
}
.wp-block-details[open] > summary::before { transform: rotate(135deg); }
.wp-block-details > summary:hover { color: var(--wp--preset--color--signal-text); }
.wp-block-details > *:not(summary) {
  margin: 0 0 1.25rem 2rem;
  max-width: 42rem;
}
.wp-block-details + .wp-block-details { margin-top: 0; }
/* First item gets a top rule so a run of them reads as one list */
.wp-block-details:first-of-type { border-top: 1px solid var(--wp--preset--color--rule); }

@media (prefers-reduced-motion: reduce) {
  .wp-block-details > summary::before { transition: none; }
}
