/* Hallmark · genre: editorial · macrostructure: Catalogue / Narrative Workflow
 * Hallmark · pre-emit critique: P5 H4 E4 S4 R4 V4
 * design-system: design.md · designed-as-app · nav: N6 · footer: Ft1
 * Directory extension of the forum's selected topic palette and shared publication system.
 * Plugin-owned routes, inventory, disclosures, forms, and interaction states remain intact.
 */

body.aigenforums-directory {
  --color-canvas: var(--color-publication-paper);
  --color-surface: var(--color-publication-surface);
  --color-surface-subtle: var(--color-publication-soft);
  --color-surface-strong: var(--color-publication-accent-soft);
  --color-ink: var(--color-publication-ink);
  --color-ink-2: var(--color-publication-ink-2);
  --color-neutral: var(--color-publication-muted);
  --color-muted: var(--color-publication-muted);
  --color-rule: var(--color-publication-rule);
  --color-rule-strong: var(--color-publication-rule-strong);
  --color-accent: var(--color-publication-accent);
  --color-accent-hover: var(--color-publication-accent-hover);
  --color-accent-soft: var(--color-publication-accent-soft);
  --color-accent-ink: var(--color-publication-paper);
  --color-focus: var(--color-publication-ink);
  --color-ink-surface: var(--color-publication-ink);
  --color-ink-surface-2: var(--color-publication-ink-2);
  --color-ink-surface-text: var(--color-publication-paper);
  --color-ink-surface-muted: var(--color-publication-reverse-muted);
  --color-ink-surface-rule: var(--color-publication-rule-strong);
  --color-success: var(--color-publication-success);
  --color-success-soft: var(--color-publication-success-soft);
  --font-display: var(--font-publication-display);
  --font-body: var(--font-publication-body);
  --font-code: var(--font-publication-body);
  --content-wide: var(--content-publication);
  --content-directory: var(--content-publication);
  --display-weight: 600;
  --radius-xs: 2px;
  --radius-sm: 0px;
  --radius-md: 0px;
  --text-2xl: clamp(1.75rem, 2.5vw, 2.25rem);
  --text-3xl: clamp(2rem, 3.6vw, 3.25rem);
  background: var(--color-canvas);
  color: var(--color-ink-2);
}

.aigenforums-directory :is(h1, h2, h3) { font-weight: 600; font-style: normal; }
.aigenforums-directory :is(p, dd, li) { overflow-wrap: anywhere; }
.aigenforums-directory :is(input, textarea)::placeholder { color: var(--color-muted); opacity: 1; }
.aigenforums-directory [hidden] { display: none !important; }
.aigenforums-directory :is(a, button, input, textarea, select, summary) { transition: none; }
body.aigenforums-directory :is(a, button, input, textarea, select, summary):focus-visible {
  outline: var(--rule-strong) solid var(--color-focus); outline-offset: var(--rule-strong);
}
/* Attribute selectors in Astra otherwise outrank the legacy :where() fields. */
.aigenforums-directory .af-dir-field :is(input, textarea, select),
.aigenforums-directory .af-dir-command__field input {
  border: var(--rule-hair) solid var(--color-rule-strong); border-radius: var(--radius-xs);
  background: var(--color-surface); color: var(--color-ink); box-shadow: none;
  outline: var(--rule-strong) solid var(--color-transparent); outline-offset: var(--rule-strong);
  transition: none;
}
.aigenforums-directory .af-dir-field :is(input, textarea, select):focus-visible,
.aigenforums-directory .af-dir-command__field input:focus-visible {
  outline: var(--rule-strong) solid var(--color-focus); border-color: var(--color-ink);
}
.aigenforums-directory .af-dir-field :is(input, textarea, select)[aria-invalid="true"] {
  border-color: var(--color-error); background: var(--color-error-soft); color: var(--color-ink);
}
.aigenforums-directory .af-dir-field :is(input, textarea, select)[data-state="success"] {
  border-color: var(--color-success); background: var(--color-success-soft); color: var(--color-ink);
}

/* The same inverse, compact, separator-free masthead as the forum. */
.af-dir-appbar {
  --color-canvas: var(--color-publication-ink);
  --color-surface: var(--color-publication-ink-2);
  --color-surface-subtle: var(--color-publication-ink-2);
  --color-surface-strong: var(--color-publication-ink-2);
  --color-ink: var(--color-publication-paper);
  --color-ink-2: var(--color-publication-reverse-muted);
  --color-neutral: var(--color-publication-paper);
  --color-muted: var(--color-publication-reverse-muted);
  --color-rule: var(--color-publication-rule-strong);
  --color-accent: var(--color-publication-paper);
  --color-accent-ink: var(--color-publication-ink);
  --color-accent-hover: var(--color-publication-soft);
  --color-accent-soft: var(--color-publication-ink-2);
  --color-focus: var(--color-publication-paper);
  width: 100%; border: 0; background: var(--color-canvas); color: var(--color-ink);
}
.aigenforums-directory .af-dir-appbar :is(a, button, [role="button"]) { transition: none !important; }
.af-dir-appbar__inner {
  display: grid; grid-template-areas: "brand brand" "search actions";
  grid-template-columns: minmax(0, 1fr) auto; align-items: center;
  width: 100%; max-width: none; min-height: 0;
  gap: var(--space-2xs); padding: var(--space-sm) var(--publication-gutter) var(--space-2xs);
}
.af-dir-brand {
  grid-area: brand; display: block; width: fit-content; min-width: 0; min-height: 0; max-width: 100%;
  margin-inline: auto; padding: 0; color: var(--color-ink); text-align: center;
}
.af-dir-appbar .af-dir-brand:is(:hover, :focus, :active) { color: var(--color-ink); text-decoration: none; }
.af-dir-brand span { overflow: visible; white-space: normal; text-overflow: clip; }
.af-dir-brand .af-dir-brand__name {
  display: block; font-size: var(--text-publication-brand); font-weight: 600;
  line-height: var(--line-publication-brand); letter-spacing: -0.045em; overflow-wrap: anywhere;
}
.af-dir-brand .af-dir-brand__descriptor {
  display: block; margin-top: var(--space-3xs); color: var(--color-ink-2);
  font-family: var(--font-body); font-size: var(--text-xs); font-weight: 500;
  line-height: var(--line-publication-descriptor); letter-spacing: 0.24em; text-transform: uppercase;
}
.af-dir-search-trigger {
  grid-area: search; display: inline-flex; align-items: center; justify-self: start;
  width: auto; min-width: var(--control-height); height: var(--control-height);
  gap: var(--space-2xs); padding: 0; border: 0; border-radius: 0;
  background: var(--color-transparent); color: var(--color-ink);
  font: 400 var(--text-sm)/1 var(--font-body); white-space: nowrap; cursor: pointer;
  box-shadow: none;
}
.af-dir-appbar__actions { grid-area: actions; gap: var(--space-sm); justify-content: end; }
.af-dir-account-link, .af-dir-business-link {
  align-items: center; min-height: var(--control-height);
  color: var(--color-ink); font: 400 var(--text-sm)/1 var(--font-body); text-decoration: none;
}
.af-dir-account-link { display: inline-flex; padding: 0; }
/* Keep Astra's generic link interaction colors off the inverse header surface. */
.af-dir-appbar .af-dir-account-link { color: var(--color-ink); }
.af-dir-business-link {
  display: none; padding-inline: var(--space-sm); border: var(--rule-hair) solid var(--color-ink);
  border-radius: 0; background: var(--color-ink); color: var(--color-canvas);
}
.af-dir-mobile-trigger, .af-dir-icon-button {
  flex-shrink: 0; border-color: var(--color-rule-strong); border-radius: 0;
  background: var(--color-transparent); color: var(--color-ink);
}
.af-dir-primary-nav {
  display: flex; justify-content: center; flex-wrap: wrap; gap: 0 var(--space-lg);
  width: 100%; padding-inline: var(--publication-gutter);
  border: 0;
}
.af-dir-primary-nav a {
  position: relative; display: inline-flex; align-items: center;
  min-height: var(--control-height); padding: 0;
  color: var(--color-ink-2); font-size: var(--text-sm); font-weight: 400; line-height: 1; text-decoration: none;
}
.af-dir-primary-nav a.is-active { box-shadow: none; color: var(--color-accent); font-weight: 700; }
.af-dir-primary-nav a.is-active::after {
  content: ""; position: absolute; inset: auto 0 0; height: 3px; background: var(--color-accent);
}

/* The local-data warning remains explicit without becoming a second masthead. */
.af-dir-demo { border-color: var(--color-rule); background: var(--color-surface-subtle); color: var(--color-muted); }
.af-dir-demo__inner {
  width: min(100% - var(--publication-gutter) * 2, var(--content-publication));
  padding: var(--space-2xs) 0; gap: var(--space-3xs) var(--space-sm);
}
.af-dir__frame {
  width: min(100% - var(--publication-gutter) * 2, var(--content-publication));
  padding: var(--space-sm) 0 var(--space-2xl); gap: var(--space-lg);
}
.af-dir-breadcrumbs { overflow: visible; }
.af-dir-breadcrumbs ol { flex-wrap: wrap; gap: 0 var(--space-2xs); }
.af-dir-breadcrumbs li { min-height: var(--control-height); }
.af-dir-breadcrumbs a { display: inline-flex; align-items: center; min-height: var(--control-height); }
.af-dir-breadcrumbs :is(a, span[aria-current]) { max-width: min(70vw, 24rem); }
.af-dir-hero, .af-dir-flow-head, .af-dir-upgrade-hero {
  padding-block: var(--space-sm) var(--space-lg); gap: var(--space-md);
  border-bottom: var(--rule-strong) solid var(--color-ink);
}
.af-dir-hero h1 { max-width: 25ch; font-size: var(--text-publication-discovery); line-height: 1.08; }
.af-dir-section-head { gap: var(--space-xs); }
.af-dir-country strong { font-size: var(--text-publication-title); font-weight: 600; }
.af-dir-market-index li > a > span:first-child, .af-dir-place-list li > a > span:first-child {
  font-family: var(--font-display); font-size: var(--text-xl); line-height: 1.2; font-weight: 600;
}
.af-dir-country, .af-dir-market-index li > a, .af-dir-place-list li > a { padding-block: var(--space-sm); }
.af-dir-business-cta {
  --color-ink: var(--color-publication-paper);
  --color-ink-2: var(--color-publication-reverse-muted);
  --color-muted: var(--color-publication-reverse-muted);
  --color-accent: var(--color-publication-paper);
  --color-accent-hover: var(--color-publication-reverse-muted);
  --color-canvas: var(--color-publication-ink);
  --color-focus: var(--color-publication-paper);
  padding: var(--space-lg); border: 0;
  background: var(--color-publication-ink); color: var(--color-ink-2);
}
.af-dir-business-cta h2 { font-size: var(--text-publication-section); color: var(--color-ink); }
.aigenforums-directory .af-dir-business-cta .af-dir-button {
  border-color: var(--color-publication-paper); background: var(--color-publication-paper); color: var(--color-publication-ink);
}
.aigenforums-directory .af-dir-business-cta .af-dir-button:is(:hover, :focus, :active) {
  border-color: var(--color-publication-accent-soft); background: var(--color-publication-accent-soft); color: var(--color-publication-ink);
}
.af-dir-market-scope { align-self: stretch; align-content: end; }
.af-dir-guidance { gap: var(--space-xs); padding-block: 0 var(--space-lg); border-top: 0; }
.af-dir-guidance h2 { font-family: var(--font-body); font-size: var(--text-md); font-weight: 700; letter-spacing: normal; }
.af-dir-guidance ul { font-size: var(--text-sm); }

/* Flat paid profiles and a quieter Basic register. Inventory order is untouched. */
.af-dir-premium-card {
  overflow: visible; border: 0; border-bottom: var(--rule-hair) solid var(--color-rule);
  background: var(--color-transparent); color: var(--color-ink-2);
}
.af-dir-premium-card__media { aspect-ratio: 16 / 10; border: 0; }
.af-dir-premium-card__body { padding: var(--space-sm) 0 var(--space-md); gap: var(--space-xs); }
.af-dir-premium-card__body h3 { font-size: var(--text-publication-title); }
.af-dir-premium-card__logo, .af-dir-profile-logo { border-radius: 0; }
.af-dir-basic__title-row h3 { font-size: var(--text-xl); }
.af-dir-sponsored {
  border: 0; padding-inline: 0; background: var(--color-transparent); color: var(--color-ink);
}
.af-dir-verification { padding-inline: var(--space-2xs); }
.af-dir-specialties li, .af-dir-service-list li { border-radius: 0; }
.af-dir-filters { padding: var(--space-md); border-color: var(--color-rule); }
.af-dir-disclosure { gap: var(--space-sm); }
.af-dir-disclosure h2 { font-family: var(--font-body); font-size: var(--text-md); font-weight: 700; letter-spacing: normal; }
.af-dir-disclosure dd { font-size: var(--text-sm); }

/* Business media is data, not editorial decoration or an endorsement. */
.af-dir-profile-hero {
  overflow: visible; gap: var(--space-md); border: 0;
  padding-bottom: var(--space-lg); border-bottom: var(--rule-strong) solid var(--color-ink);
  background: var(--color-transparent); color: var(--color-ink-2);
}
.af-dir-profile-hero__media { border: 0; }
.af-dir-profile-hero__panel { padding: 0; gap: var(--space-xs); align-content: center; }
.af-dir-profile-hero h1 { font-size: var(--text-publication-lead); }
.af-dir-profile-facts {
  padding: var(--space-md) 0 0; border: 0; border-top: var(--rule-hair) solid var(--color-rule);
  background: var(--color-transparent); color: var(--color-ink-2);
}
.af-dir-profile-main > section { padding-bottom: var(--space-lg); }
.af-dir-profile-main h2 { font-size: var(--text-publication-title); }
.af-dir-gallery figure { border-radius: 0; border: 0; }
.af-dir-faq summary { font-family: var(--font-body); font-weight: 600; }

/* Existing workflow state styles inherit the same publication vocabulary. */
.af-dir-button { border-radius: 0; font-weight: 500; }
.aigenforums-directory .af-dir-button { box-shadow: none; transform: none; }
.aigenforums-directory .af-dir-button--primary { border-color: var(--color-ink); background: var(--color-ink); color: var(--color-canvas); }
.aigenforums-directory .af-dir-button--primary[data-state="error"] { background: var(--color-error-soft); color: var(--color-error); }
.aigenforums-directory .af-dir-button--primary[data-state="success"] { background: var(--color-success-soft); color: var(--color-success); }
/* Astra's generic button hover/focus must not flip text on a light control. */
.aigenforums-directory .af-dir-button:not(.af-dir-button--primary):is(:hover, :focus, :active) {
  background: var(--color-surface-subtle); color: var(--color-ink);
}
.aigenforums-directory :is(.af-dir-search-trigger, .af-dir-mobile-trigger, .af-dir-icon-button):is(:hover, :focus, :active) {
  background: var(--color-transparent); color: var(--color-ink);
}
.aigenforums-directory .af-dir-text-link { background: var(--color-transparent); color: var(--color-accent); }
.af-dir-flow-card, .af-dir-review-state {
  padding: var(--space-md) 0; border-inline: 0; border-bottom: 0;
  background: var(--color-transparent); color: var(--color-ink-2);
}
.af-dir-flow-aside { border: 0; }
.af-dir-flow-card > .af-dir-button, .af-dir-review-state > .af-dir-button, .af-dir-account-section > .af-dir-button { justify-self: start; }
.af-dir-flow-head__promise { border: 0; border-top: var(--rule-hair) solid var(--color-rule); padding: var(--space-sm) 0; background: var(--color-transparent); color: var(--color-ink-2); }
.af-dir-flow-head__free, .af-dir-upgrade-hero__label { padding-inline: 0; border: 0; }
.af-dir-progress li { padding-inline: 0; }
.af-dir-progress li > strong { white-space: normal; overflow: visible; text-overflow: clip; }
.af-dir-capacity { border-color: var(--color-rule); background: var(--color-surface-subtle); color: var(--color-ink-2); }
.af-dir-capacity__meter { width: 10rem; max-width: 100%; border-radius: 0; }
.af-dir-price strong { line-height: 1; }
.af-dir-comparison__table { border-inline: 0; background: var(--color-transparent); color: var(--color-ink-2); }
.af-dir-comparison__row { padding: var(--space-sm) var(--space-xs); }
.af-dir-comparison__head { background: var(--color-surface-subtle); color: var(--color-ink); }
.af-dir-billing { padding: var(--space-lg); }
.af-dir-account-nav { flex-wrap: wrap; overflow: visible; gap: var(--space-2xs) var(--space-md); }
.af-dir-analytics dl > div { padding-inline: 0; }
.af-dir-dialog__head h2 { font-size: var(--text-xl); }
.af-dir-dialog__surface { align-content: start; }
.af-dir-mobile-nav nav a.is-primary { border-color: var(--color-ink); background: var(--color-ink); color: var(--color-canvas); }

/* Mast-headed close, with the existing non-endorsement disclaimer and links. */
.af-dir-footer {
  --color-ink: var(--color-publication-paper);
  --color-ink-2: var(--color-publication-reverse-muted);
  --color-muted: var(--color-publication-reverse-muted);
  --color-accent: var(--color-publication-paper);
  --color-focus: var(--color-publication-paper);
  --color-rule: var(--color-publication-rule-strong);
  width: 100%; max-width: none;
  gap: var(--space-md); padding: var(--space-xl) var(--publication-gutter) var(--space-md);
  border: 0; background: var(--color-publication-ink); color: var(--color-muted);
}
.af-dir-footer > * { width: min(100%, var(--content-publication)); margin-inline: auto; }
.af-dir-footer__identity { display: grid; gap: var(--space-2xs); }
.af-dir-footer .af-dir-footer__identity > a {
  width: fit-content; max-width: 100%; color: var(--color-ink);
  font: 600 var(--text-publication-section)/1.15 var(--font-display);
  white-space: normal; text-decoration: none;
}
.af-dir-footer__trust { grid-template-columns: minmax(0, 1fr); gap: var(--space-3xs); }
.af-dir-footer__line { border-top: var(--rule-hair) solid var(--color-rule); padding-top: var(--space-sm); }
.af-dir-footer__line nav a { display: inline-flex; align-items: center; text-decoration: none; }

@media (hover: hover) and (pointer: fine) {
  .aigenforums-directory .af-dir-button--primary:hover, .af-dir-business-link:hover, .af-dir-mobile-nav nav a.is-primary:hover {
    border-color: var(--color-accent-hover); background: var(--color-accent-hover); color: var(--color-canvas);
  }
  .af-dir-search-trigger:hover { background: var(--color-transparent); color: var(--color-accent); }
  .af-dir-primary-nav a:hover, .af-dir-account-link:hover, .af-dir-footer a:hover { color: var(--color-accent); text-decoration: underline; }
  .aigenforums-directory .af-dir-field :is(input, textarea, select):not([aria-invalid="true"]):not([data-state="success"]):hover,
  .aigenforums-directory .af-dir-command__field input:hover { background: var(--color-surface-subtle); color: var(--color-ink); }
}
@media (min-width: 40rem) {
  .af-dir-business-link { display: inline-flex; }
  .af-dir-mobile-trigger { display: none; }
  .af-dir-disclosure dl { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-md); }
  .af-dir-footer__line { grid-template-columns: minmax(0, 1fr) auto; }
}
@media (min-width: 60rem) {
  .af-dir-profile-hero { grid-template-columns: minmax(0, 1.2fr) minmax(22rem, 1fr); gap: var(--space-lg); }
  .af-dir-profile-hero__media { min-height: 25rem; border: 0; }
  .af-dir-profile-facts { padding: 0 0 0 var(--space-md); border-top: 0; border-left: var(--rule-hair) solid var(--color-rule); }
  .af-dir-guidance ul { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-lg); }
  .af-dir-spec-sheet > div { grid-template-columns: minmax(8rem, 0.8fr) minmax(0, 1.2fr); gap: var(--space-2xs) var(--space-sm); }
  .af-dir-spec-sheet small { grid-column: 2; }
}
@media (min-width: 68rem) {
  .af-dir-appbar__inner {
    grid-template-areas: "search brand actions";
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: var(--space-md); padding-block: var(--space-2xs);
  }
  .af-dir-brand .af-dir-brand__name { max-width: 38rem; }
  .af-dir-demo__inner { display: flex; flex-wrap: wrap; }
  .af-dir[data-af-directory-view="root"] > .af-dir__frame { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.7fr); gap: var(--space-xl); }
  .af-dir[data-af-directory-view="root"] > .af-dir__frame > * { grid-column: 1 / -1; }
  .af-dir[data-af-directory-view="root"] .af-dir-country-index { grid-column: 1; align-content: start; }
  .af-dir[data-af-directory-view="root"] .af-dir-market-index { grid-column: 2; }
  .af-dir-country-index .af-dir-country-grid { grid-template-columns: minmax(0, 1fr); }
  .af-dir-country-index .af-dir-country { padding-inline: 0; border-inline: 0; }
  .af-dir-market-index { padding-inline-start: var(--space-lg); border-inline-start: var(--rule-hair) solid var(--color-rule); }
}
@media (max-width: 39.99rem) {
  .af-dir-primary-nav { gap: 0 var(--space-2xs); }
  .af-dir-appbar__actions { gap: var(--space-xs); }
  .af-dir-comparison__row { font-size: var(--text-sm); padding-inline: 0; gap: var(--space-2xs); }
  .af-dir-billing { padding: var(--space-md); }
  .af-dir-filters { padding-inline: var(--space-sm); }
  .af-dir-business-cta { padding: var(--space-md); }
}
@media (prefers-reduced-motion: reduce) {
  .aigenforums-directory *, .aigenforums-directory *::before, .aigenforums-directory *::after {
    animation: none !important; transition: none !important; scroll-behavior: auto !important;
  }
}