/**
 * Zookzy — Google minimal + Sri Lanka (3 brand colors).
 * Ocean · Tea · Saffron + Google neutrals (var(--z-text-headline) / var(--z-text-body) / var(--z-surface-page)).
 */
:root {
  /* ── Google neutrals ── */
  --z-text-headline: #202124;
  --z-text-body: #5f6368;
  --z-text-muted: #80868b;
  --z-border-soft: #dadce0;
  --z-surface-white: #ffffff;
  --z-surface-page: #f8f9fa;

  /* ── 3 brand colors (SL tourism) ── */
  --z-brand-ocean: #0a7575;
  --z-brand-ocean-dark: #047a7c;
  --z-brand-ocean-light: #14b0b3;
  --z-brand-ocean-soft: #e8f4fc;

  --z-brand-tea: #599a78;
  --z-brand-tea-dark: #3d7a5c;
  --z-brand-tea-soft: #eaf5ee;

  --z-brand-saffron: #d69d30;
  --z-brand-saffron-dark: #b8841f;
  --z-brand-saffron-soft: #fff8e7;

  /* Legacy aliases (do not add new colors — map to brand 3) */
  --z-sl-ocean: var(--z-brand-ocean);
  --z-sl-ocean-dark: var(--z-brand-ocean-dark);
  --z-sl-ocean-light: var(--z-brand-ocean-light);
  --z-sl-ocean-soft: var(--z-brand-ocean-soft);
  --z-sl-tea: var(--z-brand-tea);
  --z-sl-tea-dark: var(--z-brand-tea-dark);
  --z-sl-tea-soft: var(--z-brand-tea-soft);
  --z-sl-saffron: var(--z-brand-saffron);
  --z-sl-saffron-dark: var(--z-brand-saffron-dark);
  --z-sl-saffron-soft: var(--z-brand-saffron-soft);
  --z-sl-lotus: #ee6d8a;
  --z-sl-lotus-dark: #d65c7a;
  --z-sl-lotus-soft: #fdf2f5;
  --z-sl-sand: #fef7e0;

  /* Semantic surfaces — only soft tints of brand 3 */
  --z-surface-sky: var(--z-brand-ocean-soft);
  --z-surface-mint: var(--z-brand-tea-soft);
  --z-surface-cream: var(--z-brand-saffron-soft);
  --z-surface-peach: var(--z-brand-saffron-soft);
  --z-surface-sand: var(--z-brand-saffron-soft);

  /* Actions */
  --z-action-primary: #ffce1b;
  --z-action-primary-hover: #f6db79;
  --z-action-accent: var(--z-brand-saffron);
  --z-action-accent-hover: var(--z-brand-saffron-dark);
  --z-action-focus-ring: rgba(61, 122, 153, 0.28);
  --z-action-blue: #1a73e8;
  --z-action-blue-hover: #1765cc;
  --z-action-blue-ring: rgba(26, 115, 232, 0.25);

  /* Shape — Google Material light */
  --z-radius-card: 20px;
  --z-radius-pill: 9999px;
  --z-shadow-card: 0 1px 2px rgba(60, 64, 67, 0.06), 0 1px 3px rgba(60, 64, 67, 0.04);
  --z-shadow-card-hover: 0 2px 8px rgba(60, 64, 67, 0.1), 0 1px 3px rgba(60, 64, 67, 0.06);
  --z-shadow-none: none;

  --z-home-canvas: var(--z-surface-page);
  --color-bg: var(--z-surface-page);

  /* Bridge to style.css */
  --color-primary: var(--z-brand-ocean);
  --color-primary-dark: var(--z-brand-ocean-dark);
  --color-primary-light: var(--z-brand-ocean-light);
  --color-primary-subtle: var(--z-brand-ocean-soft);
  --color-accent: var(--z-brand-saffron);
  --color-accent-dark: var(--z-brand-saffron-dark);
  --color-success: var(--z-brand-tea);
  --color-warning: var(--z-brand-saffron);
  --color-info: var(--z-brand-ocean-light);
  --color-light: var(--z-surface-page);
  --color-white: var(--z-surface-white);
  --color-gray: var(--z-text-body);
  --color-gray-light: var(--z-border-soft);
  --z-heading-color: var(--z-text-headline);
  --z-surface-text-color: var(--z-text-headline);

  --z-card-outer-ring: 0 1px 3px rgba(0, 0, 0, 0.04);
  --z-card-outer-ring-hover: 0 4px 16px rgba(0, 0, 0, 0.08);
  --z-card-radius: 20px;
  --z-card-gap: 0px;
  --z-card-photo-radius: 0;
  --z-card-photo-bottom-radius: var(--z-card-radius);
  --z-card-photo-clip: inset(0 round 0 0 var(--z-card-photo-bottom-radius) var(--z-card-photo-bottom-radius));
  --shadow-card: var(--z-shadow-card);
  --shadow-card-hover: var(--z-shadow-card-hover);
  --shadow-colored: var(--z-shadow-card-hover);
  --shadow-colored-hover: var(--z-shadow-card-hover);

  /* Flat solids — no decorative gradients */
  --gradient-primary: var(--z-brand-ocean);
  --gradient-secondary: var(--z-brand-tea);
  --gradient-accent: var(--z-brand-saffron);
  --gradient-dark: var(--z-brand-ocean-dark);
  --gradient-light: var(--z-surface-white);
  --gradient-tours: var(--z-brand-tea);
  --gradient-hotels: var(--z-brand-ocean);
  --gradient-transport: var(--z-brand-saffron);
  --gradient-apartments: var(--z-brand-tea);
  --gradient-services: var(--z-brand-ocean);
  --gradient-food: var(--z-brand-saffron);
  --gradient-entertainment: var(--z-brand-saffron);
  --gradient-other: var(--z-text-muted);

  /* Category stripe accents — 4-tone SL cycle */
  --z-cat-1-surface: var(--z-sl-ocean-soft);
  --z-cat-1-accent: var(--z-sl-ocean);
  --z-cat-2-surface: var(--z-sl-tea-soft);
  --z-cat-2-accent: var(--z-sl-tea);
  --z-cat-3-surface: var(--z-sl-saffron-soft);
  --z-cat-3-accent: var(--z-sl-saffron);
  --z-cat-4-surface: var(--z-sl-lotus-soft);
  --z-cat-4-accent: var(--z-sl-lotus);

  /* Listing / catalog strip theme (inherits Design Studio overrides) */
  --theme-from: var(--z-brand-ocean);
  --theme-to: var(--z-brand-tea);
  --theme-accent: var(--z-brand-ocean-dark);

  /* ── Extended palette (Design Studio full coverage) ── */
  /* Slate/Gray scale */
  --z-gray-900: #0f172a;
  --z-gray-950: #000000;
  --z-gray-100: #f1f5f9;
  --z-gray-600: #475569;
  --z-gray-700: #334155;
  --z-gray-300: #cbd5e1;
  --z-gray-400: #9ca3af;
  --z-gray-800: #1a1a1a;
  --z-gray-500: #6b7280;
  /* Green scale */
  --z-green-600: #059669;
  --z-green-500: #10b981;
  --z-green-700: #047857;
  --z-green-800: #166534;
  --z-green-400: #22c55e;
  --z-green-alt: #2e7d32;
  --z-green-deep: #15803d;
  --z-green-bright: #16a34a;
  /* Blue scale */
  --z-blue-600: #2563eb;
  --z-blue-500: #3b82f6;
  --z-blue-800: #1d4ed8;
  --z-blue-700: #0369a1;
  /* Indigo/Purple */
  --z-indigo-500: #6366f1;
  --z-indigo-700: #4338ca;
  --z-purple-300: #a78bfa;
  --z-purple-600: #7c3aed;
  --z-purple-aff: #6c5ce7;
  /* Extra neutrals (text/border) */
  --z-text-secondary: #64748b;
  --z-text-dark: #1e293b;
  --z-text-dim: #94a3b8;
  --z-border-light: #e2e8f0;
  /* Amber/Orange */
  --z-amber-600: #d97706;
  --z-amber-500: #f59e0b;
  --z-amber-400: #fbbf24;
  --z-amber-900: #92400e;
  --z-amber-800: #b45309;
  --z-amber-bg: #fffbeb;
  /* Red scale */
  --z-red-500: #ef4444;
  --z-red-600: #dc2626;
  --z-red-alert: #e76f51;
  /* Teal/Cyan */
  --z-teal-600: #0d9488;
  --z-teal-700: #0f766e;
  --z-teal-500: #14b8a6;
  --z-teal-dark: #0891b2;
  /* Orange deep */
  --z-orange-deep: #e65100;
  --z-orange-600: #ea580c;

  /* Recruitment widget / glass panels (Design Studio palette) */
  --aff-border: rgba(108, 92, 231, 0.1);
  --buses-primary-soft: rgba(26, 115, 232, 0.08);
  --cb-bg-card: rgba(15, 23, 42, 0.85);
  --cb-bg-glass: rgba(255, 255, 255, 0.04);
  --cb-border: rgba(255, 255, 255, 0.08);
  --trains-primary-soft: rgba(26, 115, 232, 0.08);
  --zw-border: rgba(255, 255, 255, 0.2);
  --zw-ge-border: rgba(255, 255, 255, 0.18);
  --zw-ge-glass: rgba(15, 23, 42, 0.52);
  --zw-ge-muted: rgba(226, 232, 240, 0.78);
  --zw-glass: rgba(15, 23, 42, 0.48);
  --zw-muted: rgba(226, 232, 240, 0.78);
  --zw-r-badge: rgb(190, 81, 3);
  --zw-r-badge-text: #ffffff;
  --zw-r-border: rgba(255, 255, 255, 0.18);
  --zw-r-glass: rgba(15, 23, 42, 0.56);
  --zw-r-muted: rgba(226, 232, 240, 0.78);
}