/*
 * Almanac dark theme
 * Loaded after the established route styles. The home-specific composition is
 * intentionally left to theme-home.css, which follows this file on that route.
 */

:root {
  --theme-header-height: 88px;
  --theme-dark: #151719;
  --theme-raised: #1e2123;
  --theme-ink: #090a0a;
  --theme-offwhite: #f1f2ee;
  --theme-muted: #bdc3c3;
  --theme-hairline: #343a3d;
  --theme-lime: #92de02;
}

body.theme-dark {
  background: var(--theme-dark);
  color: var(--theme-offwhite);
  color-scheme: dark;
  font-family: var(--body);
}

body.theme-dark ::selection {
  background: var(--theme-lime);
  color: var(--theme-ink);
}

body.theme-dark :is(h1, h2, h3, h4, h5, h6) {
  color: inherit;
  font-family: var(--headline) !important;
  font-weight: 400 !important;
}

body.theme-dark :focus-visible {
  outline: 3px solid var(--theme-lime);
  outline-offset: 4px;
}

body.theme-dark .skip-link {
  z-index: 120;
  background: var(--theme-lime);
  color: var(--theme-ink);
}

body.theme-dark .eyebrow,
body.theme-dark .support-kicker,
body.theme-dark .reading-label {
  color: var(--theme-muted);
}

body.theme-dark .text-link,
body.theme-dark .underlined,
body.theme-dark .back-link,
body.theme-dark .support-text-link {
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

body.theme-dark .text-link:hover,
body.theme-dark .underlined:hover,
body.theme-dark .back-link:hover,
body.theme-dark .support-text-link:hover {
  color: var(--theme-lime);
  opacity: 1;
}

/* Shared chrome ---------------------------------------------------------- */

body.theme-dark:not(.home-document) .site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  min-height: var(--theme-header-height);
  border-bottom-color: var(--theme-hairline);
  background: rgb(21 23 25 / 0.94);
  color: var(--theme-offwhite);
  backdrop-filter: blur(16px);
}

body.theme-dark:not(.home-document) .header-inner {
  min-height: var(--theme-header-height);
}

/* These are the shared SVG wordmarks only; report and portrait images are untouched. */
body.theme-dark .site-brand img,
body.theme-dark .footer-wordmark img {
  filter: invert(1);
}

body.theme-dark .primary-navigation .destination-route {
  color: var(--theme-muted);
}

body.theme-dark .primary-navigation a:hover,
body.theme-dark .primary-navigation a[aria-current="page"] {
  color: var(--theme-lime);
  text-decoration-color: var(--theme-lime);
}

body.theme-dark .menu-toggle {
  color: var(--theme-offwhite);
}

body.theme-dark .button,
body.theme-dark .support-button,
body.theme-dark .purchase-button {
  min-height: 48px;
  border: 1px solid var(--theme-lime);
  border-radius: 999px;
  background: var(--theme-lime);
  color: var(--theme-ink);
  font-family: var(--body);
  font-weight: 700;
  text-decoration: none;
}

body.theme-dark .button:hover,
body.theme-dark .support-button:hover,
body.theme-dark .purchase-button:hover {
  border-color: var(--theme-offwhite);
  background: var(--theme-offwhite);
  color: var(--theme-ink);
  opacity: 1;
  text-decoration: none;
  transform: none;
}

body.theme-dark .button:disabled,
body.theme-dark .support-button:disabled,
body.theme-dark .purchase-button:disabled {
  cursor: not-allowed;
  border-color: var(--theme-hairline);
  background: var(--theme-hairline);
  color: var(--theme-muted);
}

body.theme-dark .header-cta span {
  border-left-color: rgb(9 10 10 / 0.35);
}

body.theme-dark .site-footer,
body.theme-dark .site-footer.footer-compact {
  border-top: 0;
  background: var(--theme-ink);
  color: var(--theme-offwhite);
}

body.theme-dark .site-footer.footer-compact > .footer-primary {
  color: var(--theme-offwhite);
}

body.theme-dark .site-footer.footer-compact > .footer-secondary {
  border-top-color: var(--theme-hairline);
  color: var(--theme-muted);
}

body.theme-dark .site-footer.footer-compact > .footer-credit {
  color: var(--theme-muted);
}

body.theme-dark .footer-compact .privacy-choices {
  color: var(--theme-offwhite);
}

body.theme-dark .footer-compact :is(a, .privacy-choices):hover {
  color: var(--theme-lime);
}

/* Dark native controls and transactional feedback ----------------------- */

body.theme-dark
  :is(
    .support-form input,
    .support-form textarea,
    .support-form select,
    .purchase-form-panel input:not([type="checkbox"]),
    .purchase-form-panel select
  ) {
  border-color: var(--theme-hairline);
  background: var(--theme-ink);
  color: var(--theme-offwhite);
  caret-color: var(--theme-lime);
}

body.theme-dark
  :is(
    .support-form input,
    .support-form textarea,
    .support-form select,
    .purchase-form-panel input:not([type="checkbox"]),
    .purchase-form-panel select
  )::placeholder {
  color: var(--theme-muted);
  opacity: 1;
}

body.theme-dark
  :is(.support-form input, .purchase-form-panel input):-webkit-autofill {
  -webkit-text-fill-color: var(--theme-offwhite);
  box-shadow: 0 0 0 1000px var(--theme-ink) inset;
  caret-color: var(--theme-lime);
}

body.theme-dark :is(.support-form select, .purchase-form-panel select) {
  color-scheme: dark;
}

body.theme-dark :is(.support-form select, .purchase-form-panel select) option {
  background: var(--theme-raised);
  color: var(--theme-offwhite);
}

body.theme-dark
  :is(.terms-check input, input[type="checkbox"], input[type="radio"]) {
  accent-color: var(--theme-lime);
}

body.theme-dark
  :is(
    .support-form input[aria-invalid="true"],
    .support-form textarea[aria-invalid="true"],
    .support-form select[aria-invalid="true"],
    .purchase-form-panel input[aria-invalid="true"],
    .purchase-form-panel select[aria-invalid="true"]
  ) {
  border-color: #ff8f8f;
  box-shadow: 0 0 0 1px #ff8f8f;
}

body.theme-dark .purchase-status,
body.theme-dark .test-notice {
  border-color: var(--theme-hairline);
  background: var(--theme-ink);
  color: var(--theme-offwhite);
}

body.theme-dark .purchase-status {
  border-left-color: var(--theme-lime);
}

body.theme-dark .checkout-toast {
  border: 1px solid var(--theme-hairline);
  background: var(--theme-ink);
  color: var(--theme-offwhite);
  box-shadow: 0 12px 32px rgb(0 0 0 / 0.38);
}

/* Information, destination, contact, legal, and campaign pages ---------- */

body.theme-dark .support-page {
  overflow: clip;
  background: var(--theme-dark);
  color: var(--theme-offwhite);
}

body.theme-dark .support-page .support-hero--ink,
body.theme-dark .support-page .support-section--ink {
  background: var(--theme-ink);
  color: var(--theme-offwhite);
}

body.theme-dark .support-page .support-hero--photo,
body.theme-dark .support-page .support-legal-hero,
body.theme-dark .support-page .support-section--grey {
  background: var(--theme-raised);
  color: var(--theme-offwhite);
}

body.theme-dark
  .support-page
  .support-section:not(.support-section--ink):not(.support-section--grey) {
  background: var(--theme-dark);
}

body.theme-dark
  .support-page
  :is(
    .support-hero__lede,
    .support-hero__intro,
    .support-prose,
    .support-theme__copy,
    .support-step p,
    .support-principles p,
    .support-return__steps p
  ) {
  color: var(--theme-offwhite);
}

body.theme-dark
  .support-page
  :is(
    .support-small,
    .support-disclosure,
    .support-form__note,
    .support-theme__report > figcaption:not(.support-theme__copy),
    .support-theme__report > .support-theme__copy p
  ) {
  color: var(--theme-muted);
}

body.theme-dark
  .support-page
  .support-section--ink
  :is(.support-small, .support-disclosure, .support-text-link) {
  color: var(--theme-muted);
}

body.theme-dark .support-page .support-section--ink .support-text-link:hover {
  color: var(--theme-lime);
}

body.theme-dark
  .support-page
  :is(
    .support-steps,
    .support-step,
    .support-channel-list,
    .support-channel-list li,
    .support-principles article,
    .support-legal section,
    .support-legal-contents,
    .support-legal__contents
  ) {
  border-color: var(--theme-hairline);
}

body.theme-dark .support-page .support-step__number,
body.theme-dark .support-page .support-return__steps span {
  color: var(--theme-lime);
}

body.theme-dark .support-page .support-callout {
  background: var(--theme-lime);
  color: var(--theme-ink);
}

body.theme-dark
  .support-page
  .support-callout
  :is(.support-kicker, .support-small) {
  color: var(--theme-ink);
}

body.theme-dark .support-page .support-callout .support-button--dark {
  border-color: var(--theme-ink);
  background: var(--theme-ink);
  color: var(--theme-offwhite);
}

body.theme-dark .support-page .support-callout .support-button--dark:hover {
  border-color: var(--theme-offwhite);
  background: var(--theme-offwhite);
  color: var(--theme-ink);
}

body.theme-dark .support-page .support-button--dark {
  border-color: var(--theme-hairline);
  background: var(--theme-raised);
  color: var(--theme-offwhite);
}

body.theme-dark .support-page .support-button--dark:hover {
  border-color: var(--theme-lime);
  background: var(--theme-lime);
  color: var(--theme-ink);
}

body.theme-dark .support-page .support-photo,
body.theme-dark .support-page .support-proof {
  background: var(--theme-ink);
}

body.theme-dark .support-page .support-photo figcaption {
  background: var(--theme-ink);
  color: var(--theme-offwhite);
}

body.theme-dark .support-page .support-form label,
body.theme-dark .support-page .support-form label > span {
  color: var(--theme-offwhite);
  opacity: 1;
}

body.theme-dark .support-page .support-form label > span {
  color: var(--theme-muted);
}

body.theme-dark .support-page .support-legal :is(p, li) {
  color: var(--theme-offwhite);
}

body.theme-dark
  .support-page
  :is(.support-legal-contents ol, .support-legal__contents ul) {
  color: var(--theme-muted);
}

body.theme-dark .support-page .support-legal code {
  background: var(--theme-ink);
  color: var(--theme-offwhite);
}

body.theme-dark .support-page .support-legal a,
body.theme-dark .support-page .support-legal-contents a,
body.theme-dark .support-page .support-legal__contents a {
  color: var(--theme-lime);
}

/* Original report collection and detail pages --------------------------- */

body.theme-dark :is(.page-examples, .page-example-detail) {
  overflow: clip;
  background: var(--theme-dark);
  color: var(--theme-offwhite);
}

body.theme-dark
  .page-examples
  :is(
    .page-intro > p,
    .collection-heading .eyebrow,
    .collection-context,
    .example-context,
    .example-card-copy .eyebrow,
    .example-place,
    .example-finding,
    .cover-caption,
    .disclosure
  ),
body.theme-dark
  .page-example-detail
  :is(
    .example-detail-intro > div > p:not(.eyebrow),
    .original-period,
    .original-context,
    .original-report-title,
    .source-page-reference,
    .reading-block > p:last-child,
    .disclosure
  ) {
  color: var(--theme-muted);
}

body.theme-dark
  .page-examples
  :is(.collection-heading, .examples-collection + .examples-collection),
body.theme-dark .page-example-detail .original-report-title {
  border-color: var(--theme-hairline);
}

body.theme-dark .page-examples .example-method.section-dark,
body.theme-dark .page-examples .section-dark {
  background: var(--theme-raised);
  color: var(--theme-offwhite);
}

body.theme-dark
  .page-examples
  .section-dark
  :is(.split-intro .eyebrow, .split-intro > p, .method-points p) {
  color: var(--theme-muted);
}

body.theme-dark .page-examples .method-points p {
  border-color: var(--theme-hairline);
}

body.theme-dark .page-examples .method-points span {
  color: var(--theme-lime);
}

/* Report sheets remain their original image assets: only surrounding UI changes. */
body.theme-dark
  :is(
    .page-examples .example-cover,
    .page-example-detail .detail-cover-frame,
    .page-example-detail .example-page-frame
  ) {
  background: transparent;
}

body.theme-dark .page-example-detail .report-zoom {
  border-color: var(--theme-hairline);
  border-radius: 999px;
  background: var(--theme-raised);
  color: var(--theme-offwhite);
}

body.theme-dark .page-example-detail .report-zoom:hover {
  border-color: var(--theme-lime);
  background: var(--theme-lime);
  color: var(--theme-ink);
}

body.theme-dark .page-example-detail .reading-implication {
  border-color: var(--theme-hairline);
}

body.theme-dark .page-example-detail .recommendation-block {
  border-color: var(--theme-lime);
}

body.theme-dark :is(.page-examples, .page-example-detail) .page-cta {
  background: var(--theme-raised);
  color: var(--theme-offwhite);
}

body.theme-dark
  :is(.page-examples, .page-example-detail)
  .page-cta
  p:not(.eyebrow) {
  color: var(--theme-muted);
}

body.theme-dark :is(.page-examples, .page-example-detail) .page-cta .button {
  border-color: var(--theme-lime);
  background: var(--theme-lime);
  color: var(--theme-ink);
}

body.theme-dark
  :is(.page-examples, .page-example-detail)
  .page-cta
  .button:hover {
  border-color: var(--theme-offwhite);
  background: var(--theme-offwhite);
  color: var(--theme-ink);
}

/* Report modal: dark chrome around the unchanged original document image. */
body.theme-dark .report-dialog {
  border: 1px solid var(--theme-hairline);
  background: var(--theme-raised);
  color: var(--theme-offwhite);
  box-shadow: 0 28px 80px rgb(0 0 0 / 0.58);
}

body.theme-dark .report-dialog::backdrop,
body.theme-dark .privacy-dialog::backdrop {
  background: rgb(0 0 0 / 0.76);
  backdrop-filter: blur(6px);
}

body.theme-dark .dialog-topbar {
  border-bottom-color: var(--theme-hairline);
}

body.theme-dark .dialog-close {
  color: var(--theme-offwhite);
}

body.theme-dark .dialog-image-wrap {
  background: var(--theme-ink);
}

body.theme-dark .dialog-copy > p:not(.eyebrow),
body.theme-dark .dialog-copy .eyebrow {
  color: var(--theme-muted);
}

/* Buy, private order, and 404 ------------------------------------------- */

body.theme-dark :is(.purchase-page, .order-page) {
  background: var(--theme-dark);
  color: var(--theme-offwhite);
}

body.theme-dark .purchase-intro > p:not(.eyebrow),
body.theme-dark .purchase-small,
body.theme-dark .order-lead,
body.theme-dark .purchase-page .purchase-price span,
body.theme-dark .purchase-proof figcaption,
body.theme-dark .order-page .order-details dt,
body.theme-dark .purchase-total small,
body.theme-dark .purchase-form-panel label > span#website-help {
  color: var(--theme-muted);
}

body.theme-dark .purchase-inclusions,
body.theme-dark .purchase-inclusions li,
body.theme-dark .order-page .order-details,
body.theme-dark .order-page .order-details > div,
body.theme-dark .purchase-total {
  border-color: var(--theme-hairline);
}

body.theme-dark .purchase-form-panel {
  border-color: var(--theme-hairline);
  background: var(--theme-raised);
  color: var(--theme-offwhite);
}

body.theme-dark .purchase-form-panel label,
body.theme-dark .purchase-form-panel .terms-check {
  color: var(--theme-offwhite);
}

body.theme-dark .order-page .order-details {
  background: var(--theme-raised);
}

body.theme-dark .order-page .button {
  border-color: var(--theme-lime);
  background: var(--theme-lime);
  color: var(--theme-ink);
}

/* Consent controls are created after page load, so retain explicit dark UI. */
body.theme-dark .privacy-banner,
body.theme-dark .privacy-dialog {
  border-color: var(--theme-hairline);
  background: var(--theme-raised);
  color: var(--theme-offwhite);
  box-shadow: 0 16px 42px rgb(0 0 0 / 0.45);
}

body.theme-dark .privacy-choice-actions button {
  border-color: var(--theme-hairline);
  border-radius: 999px;
  background: var(--theme-ink);
  color: var(--theme-offwhite);
}

body.theme-dark .privacy-choice-actions button:last-child,
body.theme-dark .privacy-choice-actions button:hover {
  border-color: var(--theme-lime);
  background: var(--theme-lime);
  color: var(--theme-ink);
}

body.theme-dark .privacy-dialog > button {
  color: var(--theme-offwhite);
}

body.theme-dark .privacy-banner a,
body.theme-dark .privacy-dialog a {
  color: var(--theme-lime);
}

/* Comfortable shared page rhythm outside the homepage composition. ------- */

body.theme-dark:not(.home-document)
  :is(
    .section,
    .support-page .support-section,
    .support-page .support-legal,
    .purchase-page,
    .order-page
  ) {
  padding-top: 96px;
  padding-bottom: 96px;
}

body.theme-dark:not(.home-document)
  .support-page
  :is(.support-hero, .support-legal-hero) {
  padding-top: clamp(96px, 9vw, 132px);
  padding-bottom: clamp(96px, 9vw, 132px);
}

body.theme-dark:not(.home-document)
  :is(
    .support-hero__grid,
    .support-split,
    .support-founder,
    .support-form-layout,
    .support-statement,
    .support-return,
    .support-theme,
    .example-detail-intro,
    .example-reading,
    .page-intro,
    .purchase-page
  ) {
  gap: clamp(48px, 6vw, 80px);
}

body.theme-dark:not(.home-document) .page-examples .example-grid {
  gap: clamp(32px, 4vw, 56px);
}

/* Tablet and phone ------------------------------------------------------- */

@media (max-width: 1024px) {
  body.theme-dark:not(.home-document)
    :is(
      .section,
      .support-page .support-section,
      .support-page .support-legal,
      .purchase-page,
      .order-page
    ) {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  body.theme-dark:not(.home-document)
    .support-page
    :is(.support-hero, .support-legal-hero) {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

@media (max-width: 760px) {
  :root {
    --theme-header-height: 72px;
  }

  body.theme-dark:not(.home-document) .header-inner {
    min-height: var(--theme-header-height);
  }

  body.theme-dark:not(.home-document) .primary-navigation {
    border-bottom-color: var(--theme-hairline);
    background: var(--theme-raised);
    color: var(--theme-offwhite);
    box-shadow: 0 18px 32px rgb(0 0 0 / 0.35);
  }

  body.theme-dark:not(.home-document) .primary-navigation a {
    border-bottom-color: var(--theme-hairline);
  }

  body.theme-dark:not(.home-document) .primary-navigation .destination-route {
    color: var(--theme-muted);
  }

  body.theme-dark:not(.home-document)
    :is(
      .section,
      .support-page .support-section,
      .support-page .support-legal,
      .purchase-page,
      .order-page
    ) {
    padding-top: 48px;
    padding-bottom: 48px;
  }

  body.theme-dark:not(.home-document)
    .support-page
    :is(.support-hero, .support-legal-hero) {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  body.theme-dark:not(.home-document)
    :is(
      .support-hero__grid,
      .support-split,
      .support-founder,
      .support-form-layout,
      .support-statement,
      .support-return,
      .support-theme,
      .example-detail-intro,
      .example-reading,
      .page-intro,
      .purchase-page
    ) {
    gap: 32px;
  }

  body.theme-dark
    :is(
      .support-page .support-display,
      .support-page h1,
      .page-examples .page-intro h1,
      .page-example-detail .example-detail-intro h1,
      .purchase-page .purchase-intro h1,
      .order-page h1
    ) {
    font-size: clamp(42px, 11.8vw, 62px) !important;
    line-height: 0.98;
    text-wrap: balance;
  }

  body.theme-dark .privacy-banner {
    background: var(--theme-raised);
  }

  body.theme-dark .privacy-choice-actions button {
    min-height: 46px;
  }
}

@media (max-width: 380px) {
  body.theme-dark
    :is(
      .support-page .support-display,
      .support-page h1,
      .page-examples .page-intro h1,
      .page-example-detail .example-detail-intro h1,
      .purchase-page .purchase-intro h1,
      .order-page h1
    ) {
    font-size: clamp(38px, 11.3vw, 46px) !important;
  }
}

/* Arrival is decorative only: content is visible at every animation phase. */
@keyframes theme-section-arrive {
  from {
    opacity: 0.92;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

body.theme-dark .theme-section-entering {
  animation: theme-section-arrive 600ms ease-out both;
}

@media (prefers-reduced-motion: reduce) {
  body.theme-dark .theme-section-entering {
    animation: none;
    opacity: 1;
    transform: none;
  }
}

/* Explicitly replace inherited light fields and high-specificity focus rules. */
body.theme-dark .page-example-detail .example-reading {
  background: var(--theme-raised);
  color: var(--theme-offwhite);
}

body.theme-dark .editorial-home .home-report-link:focus-visible {
  outline: 3px solid var(--theme-lime);
  outline-offset: 6px;
}

body.theme-dark :is(.report-dialog, .privacy-dialog).dialog-fallback[open] {
  position: fixed;
  z-index: 100;
  inset: 50% auto auto 50%;
  margin: 0;
  max-height: 85vh;
  overflow: auto;
  transform: translate(-50%, -50%);
}
