/* Qamqor-Sharapat App — design tokens
   iOS minimalism · brand green+gold · bereavement-appropriate calm palette.
   Reused brand hues from the website, extended with iOS-native scale. */
:root {
  /* ---- Brand (from site) ---- */
  --green-900: #0c3b2a;
  --green-800: #10543b;
  --green-700: #15694a;   /* primary */
  --green-600: #1a8460;
  --green-500: #2aa877;
  --green-300: #8fd1b3;
  --green-100: #dff1e8;
  --gold: #c2a14e;
  --gold-soft: #d9bf7d;

  /* ---- iOS neutrals (light) ---- */
  --bg: #f2f3f5;          /* grouped-table background (iOS systemGroupedBackground) */
  --card: #ffffff;        /* cell / card surface */
  --ink: #1c1c1e;         /* label */
  --ink-2: #3a3a3c;       /* secondary label */
  --muted: #8a8a8e;       /* tertiary label */
  --line: rgba(60, 60, 67, 0.12);   /* separator */
  --line-strong: rgba(60, 60, 67, 0.22);
  --fill: rgba(118, 118, 128, 0.08);/* input fill */

  /* semantic */
  --primary: var(--green-700);
  --primary-press: var(--green-800);
  --danger: #c0392b;
  --on-primary: #ffffff;

  /* ---- Radius (iOS) ---- */
  --r-s: 10px;
  --r-m: 14px;
  --r-l: 20px;
  --r-card: 16px;

  /* ---- Spacing scale ---- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;

  /* ---- Shadows (subtle, iOS-like) ---- */
  --shadow-card: 0 1px 3px rgba(12, 59, 42, 0.06), 0 8px 24px -16px rgba(12, 59, 42, 0.18);
  --shadow-fab: 0 8px 24px -8px rgba(21, 105, 74, 0.5);
  --shadow-bar: 0 -0.5px 0 var(--line);

  /* ---- Type scale (iOS) ---- */
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;
  --large-title: 700 34px/1.15 var(--font);
  --title-1: 700 28px/1.2 var(--font);
  --title-2: 600 22px/1.25 var(--font);
  --title-3: 600 20px/1.3 var(--font);
  --headline: 600 17px/1.35 var(--font);
  --body: 400 17px/1.45 var(--font);
  --callout: 400 16px/1.4 var(--font);
  --subhead: 400 15px/1.4 var(--font);
  --footnote: 400 13px/1.35 var(--font);
  --caption: 400 12px/1.3 var(--font);

  /* ---- Motion ---- */
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --dur: 220ms;

  /* ---- Layout ---- */
  --tabbar-h: 56px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}
