/*
Theme Name: Rehab Treatment Finder
Theme URI: https://rehabtreatmentfinder.com/
Author: ProDigital Healthcare
Description: Block theme for the Rehab Treatment Finder directory. Design system lives in theme.json; this file holds only the named utility classes the generated pages use and the few things theme.json cannot express.
Version: 0.1.1
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 8.1
License: GNU General Public License v2 or later
Text Domain: rtf
*/

/* ---- Base ------------------------------------------------------------------ */
h1, h2, h3 { text-wrap: balance; }
a:focus-visible, button:focus-visible, .wp-block-button__link:focus-visible { outline: 3px solid var(--wp--preset--color--teal); outline-offset: 2px; }
.wp-block-table table { border-collapse: collapse; }
.wp-block-table td, .wp-block-table th { border: 1px solid var(--wp--preset--color--line); padding: .6rem .9rem; vertical-align: top; }
.wp-block-table th { background: var(--wp--preset--color--sand); text-align: left; font-weight: 700; }
@media (max-width: 640px) { .wp-block-table { overflow-x: auto; } }

/* ---- Facility page utilities (classes written by the pipeline's block generator) ---- */
.rtf-facts { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); }
.rtf-muted { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); }
.rtf-about { font-size: var(--wp--preset--font-size--medium); }
.rtf-contact { background: var(--wp--preset--color--base); border: 1px solid var(--wp--preset--color--line); border-radius: 12px; padding: var(--wp--preset--spacing--40); margin-bottom: var(--wp--preset--spacing--50); }
.rtf-contact .wp-block-buttons { margin-bottom: var(--wp--preset--spacing--20); }
.rtf-contact .wp-block-button__link { width: 100%; text-align: center; }
.rtf-address { font-size: var(--wp--preset--font-size--small); }
.rtf-levels li, .rtf-chips li { display: inline-block; margin: 0 .5rem .5rem 0; padding: .2rem .7rem; border-radius: 6px; background: var(--wp--preset--color--sand); font-size: var(--wp--preset--font-size--small); font-weight: 700; }
.rtf-levels, .rtf-chips { list-style: none; padding-left: 0; }
.rtf-ledger td:first-child { font-weight: 700; }
.rtf-ledger a, .rtf-hours td { font-size: var(--wp--preset--font-size--small); }
.rtf-claim { background: var(--wp--preset--color--base); border: 1px solid var(--wp--preset--color--line); border-radius: 12px; padding: var(--wp--preset--spacing--40); margin-top: var(--wp--preset--spacing--50); }
.rtf-disclaimer { font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--muted); margin-top: var(--wp--preset--spacing--50); }

/* Two-column facility layout on wide screens: main column plus the contact aside first in source. */
@media (min-width: 900px) {
  /* The generated blocks live inside the post-content wrapper, so the grid goes on that. */
  .rtf-facility-body .wp-block-post-content { display: grid; grid-template-columns: minmax(0, 1fr) 340px; column-gap: var(--wp--preset--spacing--60); align-items: start; max-width: none; }
  /* Core's constrained layout centers children with important auto margins; as grid items that
     shrinks them to content width and centers them in the track. Stretch them instead. */
  .rtf-facility-body .wp-block-post-content.is-layout-constrained > * { grid-column: 1; justify-self: stretch; width: 100%; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }
  .rtf-facility-body .wp-block-post-content > .rtf-contact { grid-column: 2; grid-row: 1 / span 60; position: sticky; top: 1rem; }
}

/* ---- City page cards ---------------------------------------------------------- */
.rtf-card { background: var(--wp--preset--color--base); border: 1px solid var(--wp--preset--color--line); border-radius: 12px; padding: var(--wp--preset--spacing--40); margin-bottom: var(--wp--preset--spacing--30); }
.rtf-card h3 { margin-top: 0; }
.rtf-card .rtf-chips { margin: .25rem 0 .5rem; }
.rtf-sponsored { font-size: var(--wp--preset--font-size--x-small); font-weight: 700; color: var(--wp--preset--color--muted); }
.rtf-verified { font-size: var(--wp--preset--font-size--x-small); font-weight: 700; color: var(--wp--preset--color--teal); }
.rtf-howitworks { background: var(--wp--preset--color--sand); border-radius: 12px; padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40); font-size: var(--wp--preset--font-size--small); }
.rtf-howitworks p { margin: 0; }
.rtf-line-list { font-size: var(--wp--preset--font-size--small); padding-left: 1.1rem; }
.rtf-line-list li { margin-bottom: .35rem; }
.rtf-stats--row { margin-top: var(--wp--preset--spacing--30); }
/* City page: one consistent column for every child, including shortcode output, so nothing
   sits at a different width than its neighbours. */
.rtf-city-main.is-layout-constrained > *:not(.alignwide):not(.alignfull) { max-width: var(--wp--style--global--content-size) !important; }
.rtf-featured { margin: var(--wp--preset--spacing--40) 0; }

/* ---- Header ---------------------------------------------------------------------- */
.rtf-header { position: relative; z-index: 50; --rtf-measure: 1120px; }
.rtf-brand { gap: .6rem; }
.rtf-brand__mark { display: inline-flex; line-height: 0; }
.rtf-navwrap { gap: var(--wp--preset--spacing--40); }
.rtf-header-cta .wp-block-button__link { padding: .45rem 1rem; font-size: .95rem; border-color: var(--wp--preset--color--teal-pale); color: var(--wp--preset--color--teal-pale); }
.rtf-header-cta .wp-block-button__link:hover { background: var(--wp--preset--color--teal-pale); color: var(--wp--preset--color--ink); }
.rtf-nav .wp-block-navigation-item__content { padding-block: .4rem; font-weight: 700; }
.rtf-nav .wp-block-navigation__submenu-icon { color: var(--wp--preset--color--teal-pale); }

/* ---- Mega menu ------------------------------------------------------------------- */
/* Built on core's navigation-submenu markup. The second level becomes the panel's
   columns; the third level is the link list in each column, forced static so it is
   always visible. WordPress puts the block className on BOTH the <li> and its <ul>, so
   every rule is qualified by tag. The .wp-block-navigation prefix outranks core's own
   .has-child rules. Same technique as the Lugo Law build. */
/* The panel must anchor to the full-width header, so nothing between the header and the
   mega <li> may establish a positioning context. */
.rtf-headbar, .rtf-navwrap, .rtf-nav.wp-block-navigation, .rtf-nav .wp-block-navigation__responsive-container,
.rtf-nav .wp-block-navigation__responsive-container-content, .rtf-nav .wp-block-navigation__container,
.rtf-nav .wp-block-navigation__responsive-dialog:not(.is-menu-open .wp-block-navigation__responsive-dialog) { position: static !important; }
.rtf-nav.wp-block-navigation li.rtf-mega { position: static !important; }
.rtf-nav.wp-block-navigation li.rtf-mega > ul.wp-block-navigation__submenu-container {
  position: absolute; left: 0; right: 0; top: 100%;
  height: auto !important; overflow: visible !important;
  width: auto !important; min-width: 0 !important; max-height: none !important;
  display: grid; grid-template-columns: repeat(var(--rtf-mega-cols, 3), minmax(0, 1fr)); gap: 20px 40px;
  padding: 26px max(24px, calc((100% - var(--rtf-measure)) / 2 + 24px)) 18px;
  background: var(--wp--preset--color--base); color: var(--wp--preset--color--ink);
  border: 0; border-top: 1px solid var(--wp--preset--color--line); border-radius: 0;
  box-shadow: 0 26px 50px -34px rgba(28, 43, 51, .55);
}
/* Core lays every menu item out as a horizontal flex row (label beside submenu). A panel
   column is a heading above a list, so the column <li> becomes a plain block. */
.rtf-nav.wp-block-navigation li.rtf-mega > ul > li { position: static; width: auto; display: block !important; align-items: initial; }
.rtf-nav.wp-block-navigation li.rtf-mega ul ul li { display: block !important; }
.rtf-nav.wp-block-navigation li.rtf-mega ul ul a { display: block; }
.rtf-nav.wp-block-navigation li.rtf-mega > ul > li > .wp-block-navigation-item__content {
  display: flex; align-items: center; gap: .55rem; padding: 0 0 .5rem; margin-bottom: .45rem;
  font-family: var(--wp--preset--font-family--display); font-size: 1rem; font-weight: 700; white-space: nowrap;
  color: var(--wp--preset--color--ink); border-bottom: 1px solid var(--wp--preset--color--line);
}
/* Column icon, injected by rtf_mega_icons() keyed to the column label. */
.rtf-mega-ico { flex: 0 0 auto; width: 22px; height: 22px; color: var(--wp--preset--color--teal); }
/* Long link lists (cities, counties) run in two text columns so the panel stays short. */
.rtf-nav.wp-block-navigation li.rtf-mega > ul > li.rtf-col--2 ul ul,
.rtf-nav.wp-block-navigation li.rtf-mega > ul > li.rtf-col--2 > ul.wp-block-navigation__submenu-container { columns: 2; column-gap: 24px; }
.rtf-nav.wp-block-navigation li.rtf-mega > ul > li.rtf-col--2 ul li { break-inside: avoid; }
.rtf-nav.wp-block-navigation li.rtf-mega > ul > li.rtf-col--2 { grid-column: span 2; }
/* Wider panel on wide screens: the largest-cities column takes two tracks, so five tracks total. */
@media (min-width: 1200px) { .rtf-nav.wp-block-navigation li.rtf-mega > ul.wp-block-navigation__submenu-container { --rtf-mega-cols: 5; } }
@media (min-width: 1000px) and (max-width: 1199px) { .rtf-nav.wp-block-navigation li.rtf-mega > ul.wp-block-navigation__submenu-container { --rtf-mega-cols: 4; } }
.rtf-nav.wp-block-navigation li.rtf-mega ul ul.wp-block-navigation__submenu-container {
  position: static !important; opacity: 1 !important;
  /* "inherit", never "visible": a forced-visible descendant of a hidden panel is still
     hit-testable and turns the closed panel into a hover trap over the page. */
  visibility: inherit !important;
  display: block !important; width: auto !important; min-width: 0 !important;
  height: auto !important; max-height: none !important; overflow: visible !important;
  inset: auto !important; padding: 0; border: 0; border-radius: 0; box-shadow: none;
  background: transparent; transform: none;
}
.rtf-nav.wp-block-navigation li.rtf-mega ul ul a { padding: .25rem 0; font-size: .95rem; font-weight: 400; color: var(--wp--preset--color--ink); }
.rtf-nav.wp-block-navigation li.rtf-mega ul ul a:hover { color: var(--wp--preset--color--teal); text-decoration: underline; }
.rtf-nav.wp-block-navigation li.rtf-mega .rtf-mega__all a { margin-top: .35rem; font-weight: 700; color: var(--wp--preset--color--teal); }
.rtf-nav.wp-block-navigation li.rtf-mega ul .wp-block-navigation__submenu-icon { display: none; }
.rtf-nav.wp-block-navigation li.rtf-mega > ul > li.rtf-megarow {
  grid-column: 1 / -1; margin-top: .5rem; padding-top: .9rem; border-top: 1px solid var(--wp--preset--color--line);
  font-size: .95rem; color: var(--wp--preset--color--muted);
}
.rtf-megarow p { margin: 0; }
.rtf-megarow a { color: var(--wp--preset--color--teal); }

/* Mobile overlay: the panel flows inline, columns stack. */
.wp-block-navigation__responsive-container.is-menu-open li.rtf-mega > ul.wp-block-navigation__submenu-container {
  position: static; display: block; padding: 0 0 0 .75rem; box-shadow: none; background: transparent; border: 0; color: inherit;
}
.wp-block-navigation__responsive-container.is-menu-open li.rtf-megarow { display: none !important; }
.wp-block-navigation__responsive-container.is-menu-open li.rtf-mega > ul > li > .wp-block-navigation-item__content { color: inherit; border-color: rgba(255,255,255,.2); }
.wp-block-navigation__responsive-container.is-menu-open li.rtf-mega ul ul a { color: inherit; }
.rtf-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--base); }

/* overlayMenu is "always"; restore the inline bar above 1000px (core's own 600px is too low for this menu). */
@media (min-width: 1000px) {
  .rtf-nav .wp-block-navigation__responsive-container.hidden-by-default:not(.is-menu-open) {
    /* static, not relative: a relative container here would become the mega panel's anchor */
    display: block; position: static; width: auto; background: transparent; color: inherit;
  }
  .rtf-nav .wp-block-navigation__responsive-container.hidden-by-default:not(.is-menu-open) .wp-block-navigation__responsive-container-close { display: none; }
  .rtf-nav .wp-block-navigation__responsive-container-open.always-shown { display: none; }
}
@media (max-width: 999px) {
  /* Core's per-block CSS loads after this file, so the selector needs the extra weight. */
  .rtf-header .wp-block-buttons.rtf-header-cta { display: none !important; }
}

/* ---- Breadcrumbs ------------------------------------------------------------------- */
.rtf-breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem; }
.rtf-breadcrumbs li + li::before { content: "/"; margin-right: .35rem; color: var(--wp--preset--color--line); }
.rtf-breadcrumbs a { color: var(--wp--preset--color--teal); text-decoration: none; }
.rtf-breadcrumbs a:hover { text-decoration: underline; }

/* ---- Term chips on cards (post-terms block) ------------------------------------------ */
.rtf-card .wp-block-post-terms.rtf-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: .25rem 0 .75rem; }
.rtf-card .wp-block-post-terms.rtf-chips .wp-block-post-terms__separator { display: none; }
.rtf-card .wp-block-post-terms.rtf-chips a { display: inline-block; padding: .15rem .6rem; border-radius: 6px; background: var(--wp--preset--color--sand); color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--x-small); font-weight: 700; text-decoration: none; }
.rtf-card .wp-block-post-excerpt__more-link { font-weight: 700; }

/* ---- Footer ----------------------------------------------------------------------- */
.rtf-footer-head { color: var(--wp--preset--color--teal-pale); margin: 0 0 .6rem; font-family: var(--wp--preset--font-family--body); font-weight: 700; letter-spacing: .01em; }
.rtf-footer-links { list-style: none; margin: 0; padding: 0; font-size: var(--wp--preset--font-size--small); }
.rtf-footer-links li { margin: 0 0 .4rem; }
.rtf-footer-links a { color: var(--wp--preset--color--line); text-decoration: none; }
.rtf-footer-links a:hover { color: var(--wp--preset--color--base); text-decoration: underline; }
.rtf-footer-bottom p { max-width: 540px; margin: 0; }
@media (max-width: 781px) { .rtf-footer-cols .wp-block-column { flex-basis: 48% !important; } }

/* ---- Hub and home pages ------------------------------------------------------------- */
.rtf-lede { font-size: var(--wp--preset--font-size--medium); line-height: 1.5; max-width: 70ch; }
/* Inside a card or a hub section, constrained-layout children should fill the card, not center in it. */
.rtf-card.is-layout-constrained > *, .rtf-hero.is-layout-constrained > *, .rtf-claim.is-layout-constrained > *, .rtf-contact.is-layout-constrained > * { margin-left: 0 !important; margin-right: 0 !important; max-width: none !important; }
.rtf-hero h1 { max-width: 22ch; }
.rtf-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: var(--wp--preset--spacing--40) 0; }
.rtf-stats.is-layout-constrained > * { margin: 0 !important; max-width: none !important; }
.rtf-stats p { margin: 0; padding: 14px 16px; background: var(--wp--preset--color--base); border: 1px solid var(--wp--preset--color--line); border-radius: 10px; font-size: var(--wp--preset--font-size--small); }
.rtf-stats strong { display: block; font-family: var(--wp--preset--font-family--display); font-size: 1.6rem; font-weight: 800; color: var(--wp--preset--color--teal); line-height: 1.1; }
.rtf-citylist { columns: 3; column-gap: 32px; list-style: none; padding: 0; }
.rtf-citylist li { break-inside: avoid; margin: 0 0 .35rem; }
@media (max-width: 700px) { .rtf-citylist { columns: 2; } }
.rtf-chips a { text-decoration: none; }
.rtf-hero { padding: var(--wp--preset--spacing--50) 0 var(--wp--preset--spacing--40); }
.rtf-hero h1 { max-width: 20ch; }
.rtf-citygrid { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.rtf-citygrid a { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; background: var(--wp--preset--color--base); border: 1px solid var(--wp--preset--color--line); border-radius: 10px; text-decoration: none; color: var(--wp--preset--color--ink); }
.rtf-citygrid a:hover { border-color: var(--wp--preset--color--teal); }
.rtf-citygrid__name { font-weight: 700; }
.rtf-citygrid__count { font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--muted); }

/* ---- Crisis band (footer) ------------------------------------------------------ */
.rtf-crisis { background: var(--wp--preset--color--ink-soft); color: var(--wp--preset--color--base); border-radius: 10px; padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40); }
.rtf-crisis a { color: var(--wp--preset--color--base); }