/* Design tokens — BRAND_SHEET'ten türetilmiş HSL palette.
   Tüm renkler buradan; hardcoded hex'leri minimize et. */

:root {
  /* Core palette */
  --brass: hsl(38, 65%, 52%);              /* premium altın-pirinç (CTA + vurgular) */
  --brass-bright: hsl(40, 80%, 62%);
  --brass-deep: hsl(34, 55%, 42%);

  --felt: hsl(155, 38%, 22%);              /* kahvehane çuhası — yeşil */
  --felt-deep: hsl(155, 42%, 14%);
  --felt-bright: hsl(155, 35%, 32%);

  --pomegranate: hsl(355, 75%, 48%);       /* Türk narı — accent */
  --pomegranate-bright: hsl(355, 80%, 60%);

  --sky-tile: hsl(210, 60%, 38%);          /* İznik mavi — info / link */
  --sky-tile-bright: hsl(210, 65%, 55%);

  /* Neutrals — koyu zemin */
  --night: hsl(220, 24%, 8%);              /* en koyu — body bg */
  --night-card: hsl(220, 22%, 12%);        /* kart bg */
  --night-elevated: hsl(220, 20%, 16%);    /* modal / panel */
  --line: hsl(220, 14%, 22%);              /* divider */
  --line-strong: hsl(220, 14%, 32%);

  /* Text */
  --cream: hsl(40, 25%, 94%);              /* primary text */
  --cream-muted: hsl(40, 12%, 75%);        /* secondary */
  --cream-faint: hsl(40, 8%, 55%);         /* tertiary */

  /* Categorical (tab + tile accent) */
  --cat-classic: hsl(38, 65%, 52%);        /* brass */
  --cat-skill: hsl(265, 65%, 65%);         /* mor — strateji/beceri */
  --cat-mini: hsl(355, 70%, 60%);          /* nar — şans/mini */
  --cat-sport: hsl(155, 50%, 45%);         /* yeşil — spor */

  /* Semantic */
  --success: hsl(155, 65%, 42%);
  --warning: hsl(38, 90%, 55%);
  --danger: hsl(355, 75%, 50%);

  /* Effects */
  --glow-brass: 0 0 24px hsla(38, 65%, 52%, 0.35);
  --glow-felt: 0 0 18px hsla(155, 38%, 32%, 0.4);
  --shadow-card: 0 8px 24px hsla(220, 30%, 4%, 0.6);
  --shadow-elevated: 0 16px 48px hsla(220, 30%, 2%, 0.7);

  /* Border radius scale */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 16px;
  --r-xl: 22px;

  /* Type scale — display=serif kahvehane, numeric=condensed casino, body=sans */
  --font-display: 'Cormorant Garamond', 'Plus Jakarta Sans', Georgia, serif;
  --font-numeric: 'Bebas Neue', 'Plus Jakarta Sans', sans-serif;
  --font-body: 'Plus Jakarta Sans', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, "Cascadia Mono", "JetBrains Mono", monospace;

  /* Per-game accent (default = brass; oyunlar override eder) */
  --accent: var(--brass);
  --accent-bright: var(--brass-bright);
  --accent-deep: var(--brass-deep);
  /* CRITICAL: 'transparent' bir COLOR'dur, background-image içinde GEÇERSİZ → tüm bg discarded.
     Themed bloklar bunu radial-gradient ile override eder. Override etmeyenler 'none' (valid image value) alır. */
  --game-bg-tint: none;
}

/* ─── Per-game tematik accent — body[data-game-theme="..."] ile aktive ───
   Her oyun benzersiz hisseder, lobide/kategoride ayrı bir kimliği olur. */

/* ─── Fallback gradient (Tier 1.3) ───
 * 41 oyun specific block'a sahip değil. body{background} shorthand (0,0,1) override etmesin diye !important.
 * Specific block'lar (0,1,1) source-order ile bunu yenebilmek için aşağıda zaten background-image
 * (longhand) ile yazılmış — ama source order'da bu rule'dan önce olsalar dahi !important burda kazanır.
 * Kontrol: specific block'larda da !important yok → 41 unthemed bunu alır, 26 themed kendi rule'unu alır.
 * Tradeoff: themed olanlar bu fallback'i de overridelamak için !important veya daha specific selector lazım.
 * Çözüm: specific block'larda da !important kullan (aşağıda 26 yerde patch). */
body[data-game-theme]:not([data-game-theme=""]) {
  background-image:
    radial-gradient(900px 500px at 50% 0%, hsla(38, 50%, 22%, 0.25), transparent 65%),
    var(--game-bg-tint, none) !important;
  background-attachment: fixed !important;
}


body[data-game-theme="pisti"],
body[data-game-theme="batak"],
body[data-game-theme="king"],
body[data-game-theme="bric"] {
  --accent: hsl(155, 50%, 45%);
  --accent-bright: hsl(155, 60%, 58%);
  --accent-deep: hsl(155, 50%, 28%);
  --game-bg-tint: radial-gradient(900px 500px at 50% 0%, hsla(155, 50%, 22%, 0.35), transparent 70%);
}

body[data-game-theme="tavla"],
body[data-game-theme="okey"],
body[data-game-theme="okey-101"] {
  --accent: hsl(28, 65%, 52%);
  --accent-bright: hsl(30, 75%, 62%);
  --accent-deep: hsl(28, 60%, 38%);
  --game-bg-tint: radial-gradient(800px 480px at 50% 0%, hsla(28, 60%, 22%, 0.4), transparent 65%);
}

body[data-game-theme="holdem"],
body[data-game-theme="omaha"],
body[data-game-theme="turk-pokeri"],
body[data-game-theme="bj-be-dealer"] {
  --accent: hsl(355, 70%, 52%);
  --accent-bright: hsl(355, 80%, 62%);
  --accent-deep: hsl(355, 65%, 38%);
  --game-bg-tint:
    radial-gradient(800px 500px at 50% 0%, hsla(355, 60%, 22%, 0.3), transparent 65%),
    radial-gradient(900px 500px at 50% 100%, hsla(155, 40%, 18%, 0.25), transparent 70%);
}

body[data-game-theme="mines"],
body[data-game-theme="crash"],
body[data-game-theme="amiral-batti"] {
  --accent: hsl(210, 65%, 55%);
  --accent-bright: hsl(210, 70%, 65%);
  --accent-deep: hsl(210, 60%, 40%);
  --game-bg-tint: radial-gradient(900px 500px at 50% 0%, hsla(210, 50%, 22%, 0.3), transparent 65%);
}

body[data-game-theme="bilardo"] {
  --accent: hsl(38, 70%, 55%);
  --accent-bright: hsl(40, 80%, 65%);
  --accent-deep: hsl(34, 60%, 40%);
  --game-bg-tint: radial-gradient(1000px 600px at 50% 30%, hsla(155, 60%, 18%, 0.55), transparent 60%);
}

body[data-game-theme="tetris-race"],
body[data-game-theme="snake-duel"] {
  --accent: hsl(265, 65%, 65%);
  --accent-bright: hsl(265, 75%, 72%);
  --accent-deep: hsl(265, 60%, 48%);
  --game-bg-tint: radial-gradient(900px 500px at 50% 0%, hsla(265, 50%, 22%, 0.35), transparent 65%);
}

body[data-game-theme="tabanca-duello"],
body[data-game-theme="reaction-duel"],
body[data-game-theme="dovus"] {
  --accent: hsl(20, 80%, 55%);
  --accent-bright: hsl(28, 85%, 65%);
  --accent-deep: hsl(15, 75%, 38%);
  --game-bg-tint: radial-gradient(900px 500px at 50% 0%, hsla(15, 60%, 22%, 0.4), transparent 65%);
}

body[data-game-theme="masa-tenisi"],
body[data-game-theme="tenis"],
body[data-game-theme="padel"],
body[data-game-theme="penalti"],
body[data-game-theme="okculuk"],
body[data-game-theme="bowling"] {
  --accent: hsl(155, 60%, 50%);
  --accent-bright: hsl(160, 70%, 60%);
  --accent-deep: hsl(155, 55%, 35%);
  --game-bg-tint: radial-gradient(900px 500px at 50% 0%, hsla(155, 50%, 22%, 0.35), transparent 65%);
}

body[data-game-theme] {
  background-image:
    var(--game-bg-tint),
    radial-gradient(1200px 600px at 20% -10%, hsla(38, 60%, 30%, 0.12), transparent 60%);
  background-attachment: fixed;
}

/* ─── Per-game derinleştirilmiş art (top oyunlar için custom layer) ─── */

/* Tavla — ahşap doku + krem highlight */
body[data-game-theme="tavla"] {
  background-image:
    repeating-linear-gradient(45deg, hsla(28, 35%, 25%, 0.05) 0 2px, transparent 2px 14px),
    var(--game-bg-tint),
    radial-gradient(1200px 600px at 20% -10%, hsla(28, 60%, 35%, 0.18), transparent 60%);
}

/* Bilardo — derin yeşil çuha + chalk dust */
body[data-game-theme="bilardo"] {
  background-image:
    radial-gradient(2px 2px at 20% 30%, hsla(40, 100%, 90%, 0.04), transparent 50%),
    radial-gradient(2px 2px at 70% 80%, hsla(40, 100%, 90%, 0.04), transparent 50%),
    radial-gradient(2px 2px at 90% 20%, hsla(40, 100%, 90%, 0.04), transparent 50%),
    var(--game-bg-tint),
    radial-gradient(1200px 600px at 50% -20%, hsla(155, 60%, 22%, 0.4), transparent 60%);
  background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%;
}

/* Mines/Crash — neon grid */
body[data-game-theme="mines"],
body[data-game-theme="crash"] {
  background-image:
    linear-gradient(hsla(210, 60%, 35%, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, hsla(210, 60%, 35%, 0.04) 1px, transparent 1px),
    var(--game-bg-tint);
  background-size: 32px 32px, 32px 32px, 100% 100%;
}

/* Okey — felt texture */
body[data-game-theme="okey"],
body[data-game-theme="okey-101"] {
  background-image:
    repeating-radial-gradient(circle at 50% 50%, hsla(28, 55%, 22%, 0.03) 0 1px, transparent 1px 4px),
    var(--game-bg-tint),
    radial-gradient(1200px 600px at 50% -20%, hsla(28, 60%, 30%, 0.25), transparent 65%);
  background-size: 6px 6px, 100% 100%, 100% 100%;
}

/* Pişti / kart oyunları — felt + subtle pattern */
body[data-game-theme="pisti"],
body[data-game-theme="batak"],
body[data-game-theme="king"],
body[data-game-theme="bric"],
body[data-game-theme="hoskin"],
body[data-game-theme="bezik"] {
  background-image:
    repeating-linear-gradient(45deg, hsla(155, 50%, 18%, 0.06) 0 1px, transparent 1px 8px),
    var(--game-bg-tint),
    radial-gradient(1200px 600px at 50% -20%, hsla(155, 55%, 20%, 0.32), transparent 65%);
  background-size: 12px 12px, 100% 100%, 100% 100%;
}

/* Tetris/Snake — synthwave grid */
body[data-game-theme="tetris-race"],
body[data-game-theme="snake-duel"] {
  background-image:
    linear-gradient(hsla(265, 60%, 50%, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, hsla(265, 60%, 50%, 0.05) 1px, transparent 1px),
    var(--game-bg-tint);
  background-size: 24px 24px, 24px 24px, 100% 100%;
}

/* Hold'em / poker — derin felt + subtle leather */
body[data-game-theme="holdem"],
body[data-game-theme="omaha"],
body[data-game-theme="turk-pokeri"],
body[data-game-theme="bj-be-dealer"] {
  background-image:
    repeating-linear-gradient(135deg, hsla(355, 60%, 22%, 0.04) 0 1px, transparent 1px 6px),
    var(--game-bg-tint),
    radial-gradient(1200px 600px at 50% -20%, hsla(355, 50%, 25%, 0.28), transparent 65%);
  background-size: 12px 12px, 100% 100%, 100% 100%;
}