/* ==========================================================================
   Theme: Elevated Light (District)
   --------------------------------------------------------------------------
   Keeps the existing District palette — violet #6D49FD on near-white — but
   rebuilt on the same token contract as the dark variant, with a proper text
   ramp, softer elevation and honest state colours. Pairs with
   shared/css/base.css, which contains all the structure.

   Contrast checked against --bg / --surface at AA (4.5:1 body, 3:1 UI).
   ========================================================================== */
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");

:root {
  color-scheme: light;

  --font: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system,
    "Segoe UI", sans-serif;
  --font-display: "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;

  /* Surfaces ------------------------------------------------------------- */
  --bg: radial-gradient(
      1100px 560px at 8% -14%,
      rgba(109, 73, 253, 0.1),
      transparent 60%
    ),
    radial-gradient(
      760px 420px at 100% 0%,
      rgba(23, 178, 106, 0.07),
      transparent 55%
    ),
    #f6f7fb;
  --surface: #ffffff;
  --surface-2: #f4f5fa;
  --surface-3: #e9ebf4;
  --line: #e6e9f2;
  --line-2: #d8dced;

  --appbar-bg: rgba(255, 255, 255, 0.86);
  --actionbar-bg: rgba(255, 255, 255, 0.92);
  --seatmap-bg: linear-gradient(180deg, #fbfbfe 0%, #f3f4fa 100%);
  --input-bg: #fbfbfe;
  --toast-bg: #171a26;
  --toast-fg: #ffffff;

  /* Text ----------------------------------------------------------------- */
  --text: #141722; /* 15.4:1 on white */
  --text-2: #414a60; /*  8.4:1 */
  /* Tertiary text has to clear 4.5:1 on the *darkest* surface it lands on —
     a tinted card inside a muted panel — not just on white. */
  --text-3: #5b6478; /*  5.9:1 on white, 4.8:1 on --brand-soft over --surface-2 */

  /* Brand + semantics ---------------------------------------------------- */
  --brand: #6d49fd;
  --brand-2: #5b37ee;
  --on-brand: #ffffff;
  --brand-soft: rgba(109, 73, 253, 0.1);
  --brand-text: #5b37ee; /* 5.2:1 on --brand-soft; the raw brand only makes 4.2 */
  --ring: #6d49fd;

  /* Each of these is checked against its own tinted background as well as
     against white — a green pill on a green wash is the tightest pairing. */
  --ok: #0f7052; /* 6.1:1 on white, 5.2:1 on --ok-soft */
  --ok-soft: rgba(15, 112, 82, 0.11);
  --warn: #8a5c08; /* 5.8:1 on white, 5.3:1 on --warn-soft */
  --warn-soft: rgba(245, 179, 66, 0.16);
  --danger: #c62740; /* 5.6:1 on white, 4.8:1 on --danger-soft */
  --danger-soft: rgba(198, 39, 64, 0.09);

  /* Seat map ------------------------------------------------------------- */
  --seat-free: #ffffff;
  --seat-free-line: #b9c0d6;
  --tier-b: #d8e7ff;
  --tier-b-line: #93b4e8;
  --seat-sel: #6d49fd;
  --seat-sold: #e4e7f0;
  --seat-sold-line: #dadeeb;

  --stage-bg: linear-gradient(180deg, #262b3d 0%, #171a26 100%);
  --stage-fg: #f4f4fb;
  --stage-glow: 0 16px 34px -18px rgba(23, 26, 38, 0.55);

  /* Elevation + glow ------------------------------------------------------ */
  --sh-1: 0 1px 2px rgba(20, 23, 34, 0.05);
  --sh-2: 0 16px 36px -20px rgba(20, 23, 34, 0.28);
  --sh-3: 0 -12px 34px -20px rgba(20, 23, 34, 0.24);
  --glow-brand: 0 8px 22px -10px rgba(109, 73, 253, 0.55);
  --glow-ok: 0 10px 28px -12px rgba(15, 112, 82, 0.4);

  --select-caret: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%235b6478' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");
}

/* Light-variant treatments ------------------------------------------------ */
.card {
  box-shadow: 0 1px 2px rgba(20, 23, 34, 0.04),
    0 12px 30px -24px rgba(20, 23, 34, 0.3);
}

.seatmap {
  box-shadow: inset 0 1px 0 #ffffff;
}

.seat:disabled {
  /* Sold seats read as texture, not as a colour the eye chases. */
  background-image: linear-gradient(
    135deg,
    transparent 44%,
    #cdd2e0 44%,
    #cdd2e0 56%,
    transparent 56%
  );
}

.appbar__brand {
  color: var(--text);
}
