@import url("https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400;12..96,600;12..96,700;12..96,800&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;0,8..60,700;1,8..60,400&family=IBM+Plex+Mono:wght@400;500;600&display=swap");

/* ==========================================================================
   Coffee Home Brewing — design tokens
   Ported from the reference theme (reference/assets/css/main.css).

   Two jobs:
   1. Declare the palette / type / space scale as --ch-* tokens.
   2. Re-point the Arq Blocks --wp--preset--* variables at those tokens, so
      every core block and every theme.json-generated rule inherits the new
      design without needing a theme.json write (which is outside the MCP
      allowlist).
   ========================================================================== */

:root {
  /* --- Surface: cool bone paper, deliberately not cream ------------------ */
  --ch-paper:       #F6F6F3;
  --ch-paper-2:     #EDEEE9;
  --ch-surface:     #FFFFFF;
  --ch-surface-2:   #FAFAF8;

  /* --- Ink -------------------------------------------------------------- */
  --ch-ink:         #14161A;
  --ch-ink-2:       #3A3F44;
  --ch-muted:       #6B6F6A;
  --ch-rule:        #DFE0DA;
  --ch-rule-2:      #C9CBC3;

  /* --- Green coffee: structural dark, near-neutral ----------------------- */
  --ch-verde:       #1F4739;
  --ch-verde-2:     #3C7A5E;
  --ch-verde-wash:  #EAF1ED;

  /* --- Coffee cherry: signal only. Never decorative. --------------------- */
  --ch-cherry:      #C22E3F;
  --ch-cherry-dk:   #9B1F2E;
  --ch-cherry-wash: #FBEDEE;

  /* --- Type ------------------------------------------------------------- */
  --ch-display: "Bricolage Grotesque", "Archivo", system-ui, -apple-system, sans-serif;
  --ch-body:    "Source Serif 4", Georgia, "Times New Roman", serif;
  --ch-mono:    "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --ch-fs-body: 1.1875rem;  /* 19px */
  --ch-lh-body: 1.72;
  --ch-measure: 68ch;

  /* --- Space (8px base) ------------------------------------------------- */
  --ch-s1: 0.25rem;
  --ch-s2: 0.5rem;
  --ch-s3: 0.75rem;
  --ch-s4: 1rem;
  --ch-s5: 1.5rem;
  --ch-s6: 2rem;
  --ch-s7: 3rem;
  --ch-s8: 4.5rem;
  --ch-s9: 6.5rem;

  --ch-r-sm: 3px;
  --ch-r-md: 6px;

  --ch-shadow:      0 1px 2px rgb(20 22 26 / 4%), 0 8px 24px -12px rgb(20 22 26 / 14%);
  --ch-shadow-lift: 0 2px 4px rgb(20 22 26 / 5%), 0 18px 40px -18px rgb(20 22 26 / 24%);

  --ch-wrap: 1240px;
  --ch-header-h: 68px;

  /* --- Arq Blocks compatibility shims ----------------------------------- */
  --arq-radius-card: var(--ch-r-md);
  --arq-radius-control: var(--ch-r-sm);
  --arq-shadow-card: var(--ch-shadow);
}

/* --------------------------------------------------------------------------
   Re-point the block-theme presets.

   theme.json emits rules like `body { background-color: var(--wp--preset--color--background) }`
   with higher specificity / later source order than a child stylesheet. Rather
   than fight that, we redefine the variables themselves — so core blocks,
   editor colour pickers and theme.json global styles all resolve to the
   Coffee Home Brewing palette.
   -------------------------------------------------------------------------- */
:root,
body,
.editor-styles-wrapper {
  --wp--preset--color--background: var(--ch-paper);
  --wp--preset--color--canvas: var(--ch-paper-2);
  --wp--preset--color--surface: var(--ch-surface);
  --wp--preset--color--ink: var(--ch-ink);
  --wp--preset--color--muted: var(--ch-muted);
  --wp--preset--color--primary: var(--ch-verde);
  --wp--preset--color--accent: var(--ch-cherry);
  --wp--preset--color--foreground: var(--ch-ink);

  --wp--preset--font-family--display: var(--ch-display);
  --wp--preset--font-family--body: var(--ch-body);
  --wp--preset--font-family--mono: var(--ch-mono);

  --wp--preset--spacing--20: var(--ch-s2);
  --wp--preset--spacing--30: var(--ch-s3);
  --wp--preset--spacing--40: var(--ch-s4);
  --wp--preset--spacing--50: var(--ch-s5);
  --wp--preset--spacing--60: var(--ch-s6);
  --wp--preset--spacing--70: var(--ch-s7);
  --wp--preset--spacing--80: var(--ch-s8);

  --wp--style--global--content-size: 68ch;
  --wp--style--global--wide-size: var(--ch-wrap);
}
