/* ============================================================
   Connect @ RSC Saudi East — theme token sets
   Three previewable looks. Accent blue (#1ea7db) is the shared
   brand thread. Pick one, then delete the other two blocks.
   ============================================================ */

/* ---------- logo variant per theme ---------- */
.logo--light { display: none; }
[data-theme="neon"] .logo--navy  { display: none; }
[data-theme="neon"] .logo--light { display: block; }

/* ============================================================
   1. NEON GLASS  — dark, frosted, violet/teal glow
   ============================================================ */
[data-theme="neon"] {
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: var(--font);
  --display-tracking: -0.02em;

  --bg: #0a0a16;
  --bg-glow-1: rgba(124, 58, 237, .35);
  --bg-glow-2: rgba(30, 167, 219, .30);
  --bg-glow-3: rgba(37, 211, 102, .10);

  --blob-1: #7c3aed;
  --blob-2: #1ea7db;
  --blob-3: #2563eb;
  --blob-opacity: .5;
  --shape-opacity: .85;

  --surface: rgba(22, 22, 42, .55);
  --surface-border: rgba(255, 255, 255, .12);
  --surface-blur: 18px;
  --sheen: rgba(255, 255, 255, .14);
  --shadow-card: 0 40px 90px -34px rgba(0, 0, 0, .85);

  --text: #f2f3ff;
  --text-dim: #b7bad9;
  --text-faint: #797ca6;

  --accent: #1ea7db;
  --accent-2: #7c3aed;

  --field-bg: rgba(255, 255, 255, .05);
  --field-border: rgba(255, 255, 255, .16);
  --focus-ring: rgba(30, 167, 219, .30);

  --select-bg: #171833;
  --select-text: #f2f3ff;
  --select-scheme: dark;

  --chip-bg: rgba(30, 167, 219, .12);
  --chip-border: rgba(30, 167, 219, .32);

  --radius: 22px;
  --radius-sm: 13px;

  --err: #ff6b6b;
  --ok: #34d399;
  --ok-bg: rgba(52, 211, 153, .16);
}

/* ============================================================
   2. PASTEL AIRY  — light, soft blobs, rounded, playful
   ============================================================ */
[data-theme="pastel"] {
  --font: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: var(--font);
  --display-tracking: -0.01em;

  --bg: #f5f3ff;
  --bg-glow-1: rgba(255, 182, 209, .55);
  --bg-glow-2: rgba(30, 167, 219, .26);
  --bg-glow-3: rgba(190, 167, 255, .45);

  --blob-1: #ffd1e8;
  --blob-2: #b8e2ff;
  --blob-3: #ddccff;
  --blob-opacity: .8;
  --shape-opacity: .7;

  --surface: rgba(255, 255, 255, .72);
  --surface-border: rgba(27, 28, 80, .09);
  --surface-blur: 12px;
  --sheen: rgba(255, 255, 255, .6);
  --shadow-card: 0 30px 60px -24px rgba(108, 92, 231, .35);

  --text: #23244d;
  --text-dim: #5c5d88;
  --text-faint: #9b9cbb;

  --accent: #1ea7db;
  --accent-2: #6c5ce7;

  --field-bg: #ffffff;
  --field-border: #e5e2f4;
  --focus-ring: rgba(30, 167, 219, .20);

  --select-bg: #ffffff;
  --select-text: #23244d;
  --select-scheme: light;

  --chip-bg: #ffffff;
  --chip-border: rgba(30, 167, 219, .28);

  --radius: 26px;
  --radius-sm: 16px;

  --err: #e5484d;
  --ok: #22a06b;
  --ok-bg: rgba(34, 160, 107, .14);
}

/* ============================================================
   3. BOLD BRUTALIST  — big type, hard contrast, offset shadows
   ============================================================ */
[data-theme="brutal"] {
  --font: "Space Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: var(--font);
  --display-tracking: -0.03em;

  --bg: #f4f4ec;
  --bg-glow-1: rgba(30, 167, 219, .12);
  --bg-glow-2: rgba(27, 28, 80, .08);
  --bg-glow-3: rgba(255, 212, 0, .12);

  --blob-1: #1ea7db;
  --blob-2: #1b1c50;
  --blob-3: #ffd400;
  --blob-opacity: .22;
  --shape-opacity: 1;

  --surface: #ffffff;
  --surface-border: #1b1c50;
  --surface-blur: 0px;
  --sheen: transparent;
  --shadow-card: 12px 12px 0 #1b1c50;

  --text: #14152e;
  --text-dim: #45465f;
  --text-faint: #8a8b9c;

  --accent: #1ea7db;
  --accent-2: #1b1c50;

  --field-bg: #ffffff;
  --field-border: #1b1c50;
  --focus-ring: rgba(27, 28, 80, .28);

  --select-bg: #ffffff;
  --select-text: #14152e;
  --select-scheme: light;

  --chip-bg: #ffd400;
  --chip-border: #1b1c50;

  --radius: 4px;
  --radius-sm: 3px;

  --err: #d61f1f;
  --ok: #0a7d3c;
  --ok-bg: #d3ffe3;

  --btn-bg: #1b1c50;
  --btn-text: #ffffff;
  --btn-border: 3px solid #14152e;
  --btn-shadow: 6px 6px 0 #1ea7db;
}
[data-theme="brutal"] .kicker { color: #1b1c50; font-weight: 800; }
[data-theme="brutal"] .card { border-width: 3px; }
[data-theme="brutal"] input[type="text"],
[data-theme="brutal"] input[type="tel"],
[data-theme="brutal"] select,
[data-theme="brutal"] .check__box { border-width: 2.5px; }
[data-theme="brutal"] .hero h1 { font-weight: 700; }
[data-theme="brutal"] .wa-btn { border: 3px solid #14152e; box-shadow: 6px 6px 0 #1b1c50; border-radius: 3px; }
[data-theme="brutal"] .submit:hover { transform: translate(-2px, -2px); box-shadow: 9px 9px 0 #1ea7db; }