/*!
 * HB Tema 1.0.1 — tasarım token'ları ve yazı tipleri (sıfırlama içermez; Bootstrap gibi çerçevelerle güvenle birlikte yüklenir)
 * 5 palet (data-theme) × açık/koyu (data-mode). Uygulamalar renk kodu yazmaz, yalnız var(--hb-...) kullanır.
 * Mod çözümlemesi hb-tema.js içinde yapılır; <html> her zaman data-mode="light|dark" taşır.
 * Yeni palet: aşağıya bir açık + bir koyu blok ekleyin, hb-tema.js içindeki PALETLER listesine bir satır yazın.
 */

/* ---------- Yazı tipleri (kendi sunucumuzda) ---------- */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("fontlar/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("fontlar/inter-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Playfair Display";
  font-style: normal;
  font-weight: 500 800;
  font-display: swap;
  src: url("fontlar/playfair-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Playfair Display";
  font-style: normal;
  font-weight: 500 800;
  font-display: swap;
  src: url("fontlar/playfair-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ---------- Palet bağımsız token'lar ---------- */
:root {
  --hb-font-sans: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --hb-font-serif: "Playfair Display", Georgia, Cambria, "Times New Roman", serif;
  --hb-font-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;

  --hb-text-xs: 0.75rem;
  --hb-text-sm: 0.875rem;
  --hb-text-md: 1rem;
  --hb-text-lg: 1.125rem;
  --hb-text-xl: 1.375rem;
  --hb-text-2xl: clamp(1.6rem, 1.2rem + 1.6vw, 2.25rem);
  --hb-text-3xl: clamp(2.2rem, 1.4rem + 3.4vw, 3.9rem);

  --hb-space-1: 0.25rem;
  --hb-space-2: 0.5rem;
  --hb-space-3: 0.75rem;
  --hb-space-4: 1rem;
  --hb-space-5: 1.5rem;
  --hb-space-6: 2rem;
  --hb-space-7: 3rem;
  --hb-space-8: 4.5rem;

  --hb-radius-sm: 8px;
  --hb-radius-md: 12px;
  --hb-radius-lg: 18px;
  --hb-radius-xl: 26px;
  --hb-radius-pill: 999px;

  --hb-container: 1200px;
  --hb-ease: cubic-bezier(.2, .7, .2, 1);
  --hb-dur: 180ms;
}

/* =====================================================================
   1) Lacivert-Turkuaz (varsayılan)
   ===================================================================== */
:root,
[data-theme="lacivert-turkuaz"] {
  color-scheme: light;
  --hb-bg: #F6F7F9;
  --hb-surface: #FFFFFF;
  --hb-surface-2: #EEF1F5;
  --hb-border: #E0E5EC;
  --hb-border-strong: #C9D1DC;
  --hb-text: #101C32;
  --hb-text-muted: #556175;
  --hb-primary: #101C32;
  --hb-primary-hover: #1B2B48;
  --hb-on-primary: #FFFFFF;
  --hb-accent: #14B8A6;
  --hb-accent-strong: #0F766E;
  --hb-on-accent: #072B27;
  --hb-accent-soft: rgba(20, 184, 166, .12);
  --hb-band: #101C32;
  --hb-on-band: #E9EEF6;
  --hb-on-band-muted: #A9B4C6;
  --hb-up: #0F7A4F;
  --hb-down: #C0362C;
  --hb-warn: #9A6200;
  --hb-focus: #14B8A6;
  --hb-glow-1: rgba(20, 184, 166, .22);
  --hb-glow-2: rgba(16, 28, 50, .10);
  --hb-shadow-sm: 0 1px 2px rgba(16, 28, 50, .06), 0 1px 1px rgba(16, 28, 50, .04);
  --hb-shadow-md: 0 8px 24px -10px rgba(16, 28, 50, .18), 0 2px 6px rgba(16, 28, 50, .05);
  --hb-shadow-lg: 0 24px 60px -24px rgba(16, 28, 50, .32);
  --hb-theme-color: #101C32;
}
[data-theme="lacivert-turkuaz"][data-mode="dark"],
:root[data-mode="dark"]:not([data-theme]) {
  color-scheme: dark;
  --hb-bg: #0A1222;
  --hb-surface: #111B2E;
  --hb-surface-2: #17233A;
  --hb-border: #22304A;
  --hb-border-strong: #31415F;
  --hb-text: #E8EDF5;
  --hb-text-muted: #9EAABD;
  --hb-primary: #2DD4BF;
  --hb-primary-hover: #5EEAD4;
  --hb-on-primary: #052421;
  --hb-accent: #2DD4BF;
  --hb-accent-strong: #5EEAD4;
  --hb-on-accent: #052421;
  --hb-accent-soft: rgba(45, 212, 191, .12);
  --hb-band: #0D1A30;
  --hb-on-band: #E8EDF5;
  --hb-on-band-muted: #9EAABD;
  --hb-up: #34D399;
  --hb-down: #F87171;
  --hb-warn: #FBBF24;
  --hb-focus: #5EEAD4;
  --hb-glow-1: rgba(45, 212, 191, .18);
  --hb-glow-2: rgba(59, 130, 246, .10);
  --hb-shadow-sm: 0 1px 2px rgba(0, 0, 0, .35);
  --hb-shadow-md: 0 10px 28px -12px rgba(0, 0, 0, .6);
  --hb-shadow-lg: 0 26px 60px -24px rgba(0, 0, 0, .75);
  --hb-theme-color: #0A1222;
}

/* =====================================================================
   2) Klasik Mavi (bugünkü sitenin renkleri)
   ===================================================================== */
[data-theme="klasik"] {
  color-scheme: light;
  --hb-bg: #F6F7F4;
  --hb-surface: #FFFFFF;
  --hb-surface-2: #EDF0EE;
  --hb-border: #DFE3E0;
  --hb-border-strong: #C7CDC9;
  --hb-text: #142033;
  --hb-text-muted: #56606E;
  --hb-primary: #1F5FBF;
  --hb-primary-hover: #194FA0;
  --hb-on-primary: #FFFFFF;
  --hb-accent: #1F5FBF;
  --hb-accent-strong: #1A55AD;
  --hb-on-accent: #FFFFFF;
  --hb-accent-soft: rgba(31, 95, 191, .10);
  --hb-band: #142033;
  --hb-on-band: #EAF0F8;
  --hb-on-band-muted: #A9B6C8;
  --hb-up: #0F7A4F;
  --hb-down: #C0362C;
  --hb-warn: #9A6200;
  --hb-focus: #1F5FBF;
  --hb-glow-1: rgba(31, 95, 191, .18);
  --hb-glow-2: rgba(20, 32, 51, .08);
  --hb-shadow-sm: 0 1px 2px rgba(20, 32, 51, .06);
  --hb-shadow-md: 0 8px 24px -10px rgba(20, 32, 51, .18);
  --hb-shadow-lg: 0 24px 60px -24px rgba(20, 32, 51, .3);
  --hb-theme-color: #142033;
}
[data-theme="klasik"][data-mode="dark"] {
  color-scheme: dark;
  --hb-bg: #0B1220;
  --hb-surface: #121B2D;
  --hb-surface-2: #18233A;
  --hb-border: #243149;
  --hb-border-strong: #33425F;
  --hb-text: #E7ECF4;
  --hb-text-muted: #9DA9BC;
  --hb-primary: #6EA8FF;
  --hb-primary-hover: #94BFFF;
  --hb-on-primary: #08152B;
  --hb-accent: #6EA8FF;
  --hb-accent-strong: #94BFFF;
  --hb-on-accent: #08152B;
  --hb-accent-soft: rgba(110, 168, 255, .12);
  --hb-band: #101A2E;
  --hb-on-band: #E7ECF4;
  --hb-on-band-muted: #9DA9BC;
  --hb-up: #34D399;
  --hb-down: #F87171;
  --hb-warn: #FBBF24;
  --hb-focus: #94BFFF;
  --hb-glow-1: rgba(110, 168, 255, .16);
  --hb-glow-2: rgba(110, 168, 255, .06);
  --hb-shadow-sm: 0 1px 2px rgba(0, 0, 0, .35);
  --hb-shadow-md: 0 10px 28px -12px rgba(0, 0, 0, .6);
  --hb-shadow-lg: 0 26px 60px -24px rgba(0, 0, 0, .75);
  --hb-theme-color: #0B1220;
}

/* =====================================================================
   3) Antrasit-Altın
   ===================================================================== */
[data-theme="antrasit-altin"] {
  color-scheme: light;
  --hb-bg: #F7F5F0;
  --hb-surface: #FFFFFF;
  --hb-surface-2: #EFECE4;
  --hb-border: #E3DED2;
  --hb-border-strong: #CFC8B8;
  --hb-text: #1A1A1F;
  --hb-text-muted: #5E5B54;
  --hb-primary: #1A1A1F;
  --hb-primary-hover: #2C2C33;
  --hb-on-primary: #FFFFFF;
  --hb-accent: #C9A227;
  --hb-accent-strong: #7D6210;
  --hb-on-accent: #1A1A1F;
  --hb-accent-soft: rgba(201, 162, 39, .14);
  --hb-band: #1A1A1F;
  --hb-on-band: #F2EEE4;
  --hb-on-band-muted: #B7B0A0;
  --hb-up: #0F7A4F;
  --hb-down: #B3362C;
  --hb-warn: #8A5A00;
  --hb-focus: #C9A227;
  --hb-glow-1: rgba(201, 162, 39, .22);
  --hb-glow-2: rgba(26, 26, 31, .08);
  --hb-shadow-sm: 0 1px 2px rgba(26, 26, 31, .06);
  --hb-shadow-md: 0 8px 24px -10px rgba(26, 26, 31, .2);
  --hb-shadow-lg: 0 24px 60px -24px rgba(26, 26, 31, .32);
  --hb-theme-color: #1A1A1F;
}
[data-theme="antrasit-altin"][data-mode="dark"] {
  color-scheme: dark;
  --hb-bg: #121214;
  --hb-surface: #1B1B20;
  --hb-surface-2: #232329;
  --hb-border: #2F2F37;
  --hb-border-strong: #3E3E48;
  --hb-text: #F0EDE6;
  --hb-text-muted: #ADA899;
  --hb-primary: #D9B43A;
  --hb-primary-hover: #E8C85E;
  --hb-on-primary: #17140A;
  --hb-accent: #D9B43A;
  --hb-accent-strong: #E8C85E;
  --hb-on-accent: #17140A;
  --hb-accent-soft: rgba(217, 180, 58, .13);
  --hb-band: #1B1B20;
  --hb-on-band: #F0EDE6;
  --hb-on-band-muted: #ADA899;
  --hb-up: #34D399;
  --hb-down: #F87171;
  --hb-warn: #FBBF24;
  --hb-focus: #E8C85E;
  --hb-glow-1: rgba(217, 180, 58, .16);
  --hb-glow-2: rgba(217, 180, 58, .05);
  --hb-shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
  --hb-shadow-md: 0 10px 28px -12px rgba(0, 0, 0, .65);
  --hb-shadow-lg: 0 26px 60px -24px rgba(0, 0, 0, .8);
  --hb-theme-color: #121214;
}

/* =====================================================================
   4) Fenerbahçe — yalnız renkler (amblem, logo, kulüp yazı tipi yok)
   ===================================================================== */
[data-theme="fenerbahce"] {
  color-scheme: light;
  --hb-bg: #F7F7F4;
  --hb-surface: #FFFFFF;
  --hb-surface-2: #EEF0F4;
  --hb-border: #DEE2EA;
  --hb-border-strong: #C5CCD9;
  --hb-text: #00205B;
  --hb-text-muted: #4B5876;
  --hb-primary: #00205B;
  --hb-primary-hover: #0A2F78;
  --hb-on-primary: #FFED00;
  --hb-accent: #F5D90A;
  --hb-accent-strong: #00205B;
  --hb-on-accent: #00205B;
  --hb-accent-soft: rgba(245, 217, 10, .22);
  --hb-band: #00205B;
  --hb-on-band: #FFFFFF;
  --hb-on-band-muted: #B7C3DD;
  --hb-up: #0F7A4F;
  --hb-down: #C0362C;
  --hb-warn: #8A5A00;
  --hb-focus: #00205B;
  --hb-glow-1: rgba(245, 217, 10, .30);
  --hb-glow-2: rgba(0, 32, 91, .10);
  --hb-shadow-sm: 0 1px 2px rgba(0, 32, 91, .07);
  --hb-shadow-md: 0 8px 24px -10px rgba(0, 32, 91, .22);
  --hb-shadow-lg: 0 24px 60px -24px rgba(0, 32, 91, .34);
  --hb-theme-color: #00205B;
}
[data-theme="fenerbahce"][data-mode="dark"] {
  color-scheme: dark;
  --hb-bg: #00102E;
  --hb-surface: #001A44;
  --hb-surface-2: #022353;
  --hb-border: #0B2F66;
  --hb-border-strong: #1A3F7A;
  --hb-text: #F2F4F8;
  --hb-text-muted: #AFBCD6;
  --hb-primary: #FFED00;
  --hb-primary-hover: #FFF35A;
  --hb-on-primary: #00205B;
  --hb-accent: #FFED00;
  --hb-accent-strong: #FFED00;
  --hb-on-accent: #00205B;
  --hb-accent-soft: rgba(255, 237, 0, .12);
  --hb-band: #001A44;
  --hb-on-band: #F2F4F8;
  --hb-on-band-muted: #AFBCD6;
  --hb-up: #34D399;
  --hb-down: #FF8A80;
  --hb-warn: #FFED00;
  --hb-focus: #FFED00;
  --hb-glow-1: rgba(255, 237, 0, .14);
  --hb-glow-2: rgba(40, 90, 200, .14);
  --hb-shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
  --hb-shadow-md: 0 10px 28px -12px rgba(0, 0, 0, .65);
  --hb-shadow-lg: 0 26px 60px -24px rgba(0, 0, 0, .8);
  --hb-theme-color: #00102E;
}

/* =====================================================================
   5) Konyaspor — yalnız renkler (amblem, logo yok)
   ===================================================================== */
[data-theme="konyaspor"] {
  color-scheme: light;
  --hb-bg: #F5F8F5;
  --hb-surface: #FFFFFF;
  --hb-surface-2: #EAF1EB;
  --hb-border: #DAE5DC;
  --hb-border-strong: #BFD0C3;
  --hb-text: #0D2416;
  --hb-text-muted: #4E6455;
  --hb-primary: #0E7C3A;
  --hb-primary-hover: #0A5C2B;
  --hb-on-primary: #FFFFFF;
  --hb-accent: #0E7C3A;
  --hb-accent-strong: #0A5C2B;
  --hb-on-accent: #FFFFFF;
  --hb-accent-soft: rgba(14, 124, 58, .11);
  --hb-band: #0A5C2B;
  --hb-on-band: #FFFFFF;
  --hb-on-band-muted: #C3DCCB;
  --hb-up: #0E7C3A;
  --hb-down: #C0362C;
  --hb-warn: #8A5A00;
  --hb-focus: #0E7C3A;
  --hb-glow-1: rgba(14, 124, 58, .20);
  --hb-glow-2: rgba(10, 92, 43, .08);
  --hb-shadow-sm: 0 1px 2px rgba(10, 92, 43, .07);
  --hb-shadow-md: 0 8px 24px -10px rgba(10, 92, 43, .2);
  --hb-shadow-lg: 0 24px 60px -24px rgba(10, 92, 43, .3);
  --hb-theme-color: #0A5C2B;
}
[data-theme="konyaspor"][data-mode="dark"] {
  color-scheme: dark;
  --hb-bg: #07140C;
  --hb-surface: #0D1F14;
  --hb-surface-2: #13291B;
  --hb-border: #1B3524;
  --hb-border-strong: #284A33;
  --hb-text: #E9F3EC;
  --hb-text-muted: #9FB8A7;
  --hb-primary: #3CCB75;
  --hb-primary-hover: #6BDD97;
  --hb-on-primary: #03140A;
  --hb-accent: #3CCB75;
  --hb-accent-strong: #6BDD97;
  --hb-on-accent: #03140A;
  --hb-accent-soft: rgba(60, 203, 117, .12);
  --hb-band: #0D1F14;
  --hb-on-band: #E9F3EC;
  --hb-on-band-muted: #9FB8A7;
  --hb-up: #4ADE80;
  --hb-down: #F87171;
  --hb-warn: #FBBF24;
  --hb-focus: #6BDD97;
  --hb-glow-1: rgba(60, 203, 117, .15);
  --hb-glow-2: rgba(60, 203, 117, .05);
  --hb-shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
  --hb-shadow-md: 0 10px 28px -12px rgba(0, 0, 0, .65);
  --hb-shadow-lg: 0 26px 60px -24px rgba(0, 0, 0, .8);
  --hb-theme-color: #07140C;
}
