/* ============================================================
   YaqinJoy — dizayn tokenlari (mockuplardan 1:1 olingan)
   Rang o'zgartirish = faqat shu fayl. Boshqa hech narsa buzilmaydi.
   ============================================================ */
:root {
  /* Asosiy aksent — mockupdagi yorqin ko'k */
  --blue: #2563eb;
  --blue-strong: #1d4ed8;
  --blue-soft: rgba(37, 99, 235, 0.12);

  --green: #22c55e;
  --green-soft: rgba(34, 197, 94, 0.14);
  --yellow: #facc15;
  --orange: #f59e0b;
  --red: #ef4444;
  --purple: #a855f7;

  /* Radiuslar (mockup: hammasi yumaloq) */
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 18px;
  --r-xl: 24px;
  --r-full: 999px;

  --shadow-card: 0 2px 14px rgba(15, 23, 42, 0.06);
  --shadow-float: 0 8px 28px rgba(15, 23, 42, 0.16);

  --font: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", Roboto,
          "Helvetica Neue", Arial, sans-serif;

  --nav-h: 64px;
  --page-max: 520px; /* mobile-first: markazda telefon kengligi */

  /* ── LIGHT tema (3-mockup) ── */
  --bg: #f4f6fb;
  --bg-card: #ffffff;
  --bg-input: #f1f3f9;
  --bg-chip: #ffffff;
  --bg-navy: #0f1b3d;        /* banner */
  --text: #0f172a;
  --text-2: #64748b;
  --text-3: #94a3b8;
  --border: #e5e9f2;
  --nav-bg: rgba(255, 255, 255, 0.92);
}

/* ── DARK tema (1- va 2-mockup) ── */
[data-theme="dark"] {
  --bg: #0a0f1e;
  --bg-card: #131a2e;
  --bg-input: #1a2138;
  --bg-chip: #151c31;
  --bg-navy: #131a2e;
  --text: #f1f5f9;
  --text-2: #8b93a7;
  --text-3: #5b6478;
  --border: #232b45;
  --nav-bg: rgba(10, 15, 30, 0.92);
  --shadow-card: 0 2px 14px rgba(0, 0, 0, 0.35);
  --shadow-float: 0 8px 28px rgba(0, 0, 0, 0.5);
}

/* Xarita ekrani va biznes-qo'shish oqimi mockupda doim dark —
   .force-dark klassi tema tanlovidan qat'i nazar dark tokenlarni beradi */
.force-dark {
  color: #f1f5f9;
  background: #0a0f1e;
  --bg: #0a0f1e;
  --bg-card: #131a2e;
  --bg-input: #1a2138;
  --bg-chip: #151c31;
  --bg-navy: #131a2e;
  --text: #f1f5f9;
  --text-2: #8b93a7;
  --text-3: #5b6478;
  --border: #232b45;
  --nav-bg: rgba(10, 15, 30, 0.92);
  --shadow-card: 0 2px 14px rgba(0, 0, 0, 0.35);
  --shadow-float: 0 8px 28px rgba(0, 0, 0, 0.5);
}