/* =====================================================================
   FILE: tokens.css
   ROLE: Layer 0 token contract.
   PURPOSE:
   - Own project-wide `--iss-*` custom property definitions.
   - Provide semantic defaults consumed by style.css, primitives.css,
     renderer contracts, skins, and page exceptions.
   - Stay free of selectors that style layout, components, pages, or
     WordPress-generated markup.

   LOAD ORDER:
   theme.json -> tokens.css -> style.css -> cards.css -> primitives.css
   -> patterns.css -> renderer/page/skin CSS -> plugin CSS
   ===================================================================== */

:root {
  /* Core colors - mapped to theme.json presets. */
  --iss-red: #e81d25;
  --iss-white: #f9f9fa;
  --iss-black: #1e1e1e;
  --iss-grey: #c0b8b5;
  --iss-green: #579e7d;
  --iss-blue: #869fba;
  --iss-yellow: #ebbc1e;
  --iss-brown: #753a18;
  --iss-accent: var(--iss-red);
  --iss-accent-rgb: 232, 29, 37;
  --iss-accent-soft: rgba(var(--iss-accent-rgb), 0.16);
  --iss-accent-border: rgba(var(--iss-accent-rgb), 0.28);

  /* Layout and spacing. */
  --iss-content-width: 1720px;
  --iss-container-pad: 1.25rem;
  --iss-gap: 1.35rem;
  --iss-header-height: 5.5rem;
  --iss-space-2xs: 0.35rem;
  --iss-space-xs: 0.5rem;
  --iss-space-sm: 0.75rem;
  --iss-space-md: 1rem;
  --iss-space-lg: 1.5rem;
  --iss-space-xl: 2.5rem;
  --iss-space-2xl: 4rem;
  --iss-section-pad-y: clamp(1.75rem, 3.4vw, 3.5rem);
  --iss-section-pad-y-tight: clamp(1rem, 2.2vw, 2rem);

  /* Border and radius. */
  --iss-border: rgba(30, 30, 30, 0.12);
  --iss-border-strong: rgba(30, 30, 30, 0.2);
  --iss-radius-sm: 4px;
  --iss-radius-md: 6px;
  --iss-radius-lg: 10px;
  --iss-radius-pill: 999px;

  /* Surfaces and typography-facing semantic colors. */
  --iss-surface-base: #ffffff;
  --iss-surface-paper: #ffffff;
  --iss-surface-panel: #f6f6f7;
  --iss-surface-inset: #f4f4f5;
  --iss-surface-archive: #f1f1f2;
  --iss-surface-dark: #201d1b;
  --iss-surface-map: #efefee;
  --iss-surface-overlay: rgba(255, 255, 255, 0.94);
  --iss-surface-bg: var(--iss-surface-base);
  --iss-surface-fg: var(--iss-black);
  --iss-surface-muted: rgba(30, 30, 30, 0.72);
  --iss-surface-subtle: rgba(30, 30, 30, 0.56);
  --iss-surface-rule: var(--iss-border);
  --iss-heading-title-color: var(--iss-surface-fg);
  --iss-heading-text-color: var(--iss-surface-muted);
  --iss-kicker-accent: var(--iss-accent);
  --iss-kicker-color: var(--iss-surface-fg);

  /* Effects. */
  --iss-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24);
  --iss-transition: 0.2s ease;

  /* Legacy aliases for older classes/templates. Keep until old markup is fully retired. */
  --is--color-red: var(--iss-red);
  --is--color-white: var(--iss-white);
  --is--color-black: var(--iss-black);
  --is--color-grey: var(--iss-grey);
  --is--color-green: var(--iss-green);
  --is--color-blue: var(--iss-blue);
  --is--color-yellow: var(--iss-yellow);
  --is--color-brown: var(--iss-brown);
  --is--radius-sm: var(--iss-radius-sm);
  --is--radius-md: var(--iss-radius-md);
  --is--radius-lg: var(--iss-radius-lg);
  --is--radius-pill: var(--iss-radius-pill);
  --is--transition: var(--iss-transition);
  --is--container-pad: var(--iss-container-pad);
  --is--content-width: var(--iss-content-width);

  /* Link and button semantic defaults. */
  --iss-link-fg: var(--iss-accent);
  --iss-link-hover-fg: var(--iss-black);
  --iss-button-fg: var(--iss-black);
  --iss-button-bg: transparent;
  --iss-button-accent: var(--iss-accent);
  --iss-button-fill-bg: var(--iss-accent-soft);
  --iss-button-border: var(--iss-border);
  --iss-button-fill-border: var(--iss-accent-border);
  --iss-button-hover-bg: var(--iss-accent-soft);
  --iss-button-hover-border: var(--iss-accent);
  --iss-button-hover-fg: var(--iss-black);
  --iss-button-primary-bg: var(--iss-accent);
  --iss-button-primary-fg: var(--iss-white);
  --iss-button-primary-border: var(--iss-accent);
  --iss-button-primary-hover-bg: var(--iss-black);
  --iss-button-primary-hover-border: var(--iss-black);
  --iss-button-primary-hover-fg: var(--iss-white);

  /* Site chrome tokens. */
  --iss-site-header-pad-top: 0.1rem;
  --iss-site-header-pad-bottom: 1rem;
  --iss-site-logo-size: 120px;
  --iss-site-logo-bottom: calc(var(--iss-site-header-pad-top) + var(--iss-site-logo-size));
}