/* ============================================================
   Local Guy (המדריך לעסקים מקומיים) — design tokens
   Generated by brand-kit-builder on 2026-10-18, Path A (extraction)
   from the Claude Design prototypes (Locals.zip, Apr 2026) and the
   staging build at locals.ussl.co.

   Source of truth. theme.json and the plugin/theme CSS derive from it.
   Naming is by ROLE, never by hue. Enqueue before any other stylesheet.
   ============================================================ */

:root {
  /* --- Brand -------------------------------------------------- */
  --color-brand:            #2563eb;  /* fills, graphics, hero gradient start */
  --color-brand-deep:       #1d4ed8;  /* links, primary buttons, text on light */
  --color-brand-hover:      #1e40af;
  --color-brand-tint:       #eaf1fe;  /* soft fills, selected pills */
  --color-on-brand:         #ffffff;
  --color-on-brand-deep:    #ffffff;

  --color-secondary:        #1e3a5f;  /* deep navy: archive hero, CTA band start */
  --color-secondary-hover:  #16304f;
  --color-secondary-tint:   #e8eef6;
  --color-on-secondary:     #ffffff;

  --color-accent:           #f59e0b;  /* recommended star, ratings. Pops only */
  --color-on-accent:        #3d2600;

  --color-whatsapp:         #25d366;  /* WhatsApp brand fill, icon + ink label */
  --color-on-whatsapp:      #0b1220;

  /* --- Ink ---------------------------------------------------- */
  --color-ink:              #0b1220;
  --color-ink-muted:        #475569;
  --color-ink-on-dark:      #ffffff;
  --color-ink-on-dark-muted:#c7d2e3;

  /* --- Surface ------------------------------------------------ */
  --color-surface:          #fafaf7;  /* warm paper page background */
  --color-surface-raised:   #ffffff;  /* cards, header, forms */
  --color-surface-subtle:   #f3f2ed;  /* alternating sections, pills */
  --color-surface-inverse:  #0b1220;  /* footer, dark bands */

  /* --- Line --------------------------------------------------- */
  --color-line:             #e7e5e0;
  --color-line-strong:      #8a8577;  /* form field borders (3:1 UI) */
  --color-focus:            #2563eb;

  /* --- Status ------------------------------------------------- */
  --color-success:          #15803d;  /* open-now badge, confirmations */
  --color-on-success:       #ffffff;
  --color-warning:          #b45309;  /* 24/7 and emergency labels text */
  --color-warning-tint:     #fef3c7;
  --color-error:            #b91c1c;
  --color-info:             #1d4ed8;

  /* --- Disabled ----------------------------------------------- */
  --color-disabled-bg:      #ecebe6;
  --color-disabled-ink:     #6b7280;

  /* --- Type --------------------------------------------------- */
  --font-display: "Heebo", "Assistant", "Arial Hebrew", system-ui, sans-serif;
  --font-body:    "Heebo", "Assistant", "Arial Hebrew", system-ui, sans-serif;
  --font-utility: ui-monospace, "SF Mono", Menlo, monospace;

  --text-2xs:  0.75rem;                              /* 12 badges only */
  --text-xs:   0.8125rem;                            /* 13 meta */
  --text-sm:   0.9375rem;                            /* 15 secondary, cards */
  --text-base: 1.0625rem;                            /* 17 body (Hebrew) */
  --text-lg:   clamp(1.125rem, 1.05rem + 0.35vw, 1.25rem);   /* 18→20 lead */
  --text-xl:   clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);      /* 20→24 h3 */
  --text-2xl:  clamp(1.5rem, 1.3rem + 1vw, 2rem);            /* 24→32 h2 */
  --text-3xl:  clamp(1.875rem, 1.5rem + 1.8vw, 2.75rem);     /* 30→44 title */
  --text-4xl:  clamp(2.25rem, 1.6rem + 3vw, 3.75rem);        /* 36→60 */
  --text-5xl:  clamp(2.5rem, 1.6rem + 4.4vw, 4.75rem);       /* 40→76 home display */

  --leading-display: 1.12;
  --leading-body:    1.65;
  --tracking-display: normal;
  --tracking-eyebrow: 0.04em;

  --weight-body:    400;
  --weight-medium:  600;
  --weight-display: 800;

  /* --- Space -------------------------------------------------- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-section: clamp(3rem, 2rem + 4vw, 5.5rem);
  --measure: 66ch;
  --container: 1240px;
  --header-h: 68px;

  /* --- Shape and depth ---------------------------------------- */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 28px;
  --radius-pill: 999px;

  --shadow-1: 0 1px 2px rgba(11,18,32,.06), 0 2px 4px rgba(11,18,32,.04);
  --shadow-2: 0 4px 14px rgba(11,18,32,.08), 0 2px 6px rgba(11,18,32,.04);
  --shadow-3: 0 20px 50px -12px rgba(11,18,32,.18), 0 8px 20px -6px rgba(11,18,32,.08);

  /* --- Motion ------------------------------------------------- */
  --duration-fast: 150ms;
  --duration-base: 250ms;
  --duration-slow: 400ms;
  --ease-standard: cubic-bezier(.2,.8,.2,1);
  --ease-entrance: cubic-bezier(0,0,.2,1);
}

/* --- Dark theme: same roles, night values -------------------- */
[data-theme="dark"] {
  --color-brand:            #3b82f6;
  --color-brand-deep:       #60a5fa;
  --color-brand-hover:      #93c5fd;
  --color-brand-tint:       #15233f;
  --color-on-brand-deep:    #0a0f1d;
  --color-secondary:        #0f1a33;
  --color-secondary-tint:   #141c30;
  --color-accent:           #fbbf24;
  --color-ink:              #e8ecf4;
  --color-ink-muted:        #a3b0c4;
  --color-surface:          #0a0f1d;
  --color-surface-raised:   #131a2c;
  --color-surface-subtle:   #0f1628;
  --color-surface-inverse:  #050812;
  --color-line:             #1f2a44;
  --color-line-strong:      #5b6b8c;
  --color-focus:            #60a5fa;
  --color-success:          #4ade80;
  --color-on-success:       #052e16;
  --color-on-brand:         #0a0f1d;
  --color-warning:          #fbbf24;
  --color-warning-tint:     #2a2210;
  --color-error:            #f87171;
  --color-disabled-bg:      #1a2238;
  --color-disabled-ink:     #7d8aa3;
  --shadow-1: 0 1px 2px rgba(0,0,0,.4);
  --shadow-2: 0 4px 14px rgba(0,0,0,.45);
  --shadow-3: 0 20px 50px -12px rgba(0,0,0,.6);
  color-scheme: dark;
}

html { direction: rtl; }

body {
  font-family: var(--font-body);
  font-weight: var(--weight-body);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink);
  background: var(--color-surface);
  text-align: start;
}

h1, h2, h3, .display {
  font-family: var(--font-display);
  font-weight: var(--weight-display);
  line-height: var(--leading-display);
  letter-spacing: var(--tracking-display);
}
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3, [dir="rtl"] .display { letter-spacing: normal; }

td, th, dd, li, blockquote { unicode-bidi: plaintext; }
code, kbd, samp, .ltr { direction: ltr; unicode-bidi: isolate; text-align: start; }

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ============================================================
   Signature — "הדופק המקומי" (the local pulse)
   A small green dot with a breathing ring that marks something
   live: a business open right now, the weekly count of new
   listings. Never decorative; never on more than two places in
   one viewport.
   ============================================================ */
.lg-pulse {
  inline-size: 8px; block-size: 8px; border-radius: 50%;
  background: var(--color-success);
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--color-success) 55%, transparent);
  animation: lg-pulse 1.8s var(--ease-standard) infinite;
  display: inline-block; flex-shrink: 0;
}
@keyframes lg-pulse {
  0%   { box-shadow: 0 0 0 0 color-mix(in srgb, var(--color-success) 55%, transparent); }
  70%  { box-shadow: 0 0 0 8px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}