/* Mureeh design tokens. Source: Mureeh Design System.dc.html (BUILD-SPEC §3). */
:root {
  /* Brand */
  --navy: #1F3C46;
  --navy-hover: #2C5260;
  --teal: #537B7B;
  --teal-hover: #466B6B;
  --mustard: #AE7E35;
  --cream: #E6D6B9;
  --offwhite: #EEF1E9;
  --greyblue: #7A9097;

  /* Functional */
  --sale: #B5533C;
  --sale-tint: #F6ECE8;
  --success: #5E8A6B;
  --success-tint: #E1EBE3;
  --success-ink: #2F5A3C;
  --low-tint: #EBDFCB;
  --muted-text: rgba(31, 60, 70, .75);
  --disabled-bg: #C9D2D0;
  --disabled-fg: #5A6F75;
  --disabled-field: #E4E8E5;
  --soldout-bg: #D9DFDE;
  --line: rgba(122, 144, 151, .35);
  --line-strong: rgba(122, 144, 151, .5);

  /* Admin */
  --admin-bg: #F4F6F1;
  --admin-card: #fff;

  /* Type */
  --font-display: 'Shrikhand', serif;
  --font-body: 'DM Sans', system-ui, sans-serif;
  --font-mono: 'DM Mono', ui-monospace, monospace;

  /* Space (4px base) */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px; --s9: 96px;

  /* Shape */
  --r-input: 8px;
  --r-card: 16px;
  --r-modal: 24px;
  --r-pill: 999px;
  --r-admin: 14px;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(31, 60, 70, .08);
  --shadow-md: 0 1px 2px rgba(31, 60, 70, .06), 0 8px 24px rgba(31, 60, 70, .10);
  --shadow-lg: 0 2px 4px rgba(31, 60, 70, .06), 0 24px 48px rgba(31, 60, 70, .16);

  /* Layout */
  --content-max: 1280px;
  --gutter: 24px;
  --margin: 80px;
}

@media (max-width: 759px) {
  :root { --gutter: 16px; --margin: 20px; }
}