/* ==========================================================================
   MAYRA — Tasarım tokenları (TEK KAYNAK)
   Katmanlar: 1 Primitive · 2 Semantic · 3 Ölçekler · 4 Component
   PHP karşılığı: config/brand.php (BrandParityTest eşitliği denetler)
   ========================================================================== */

/* Yazı tipleri ------------------------------------------------------------ */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url('../fonts/inter-latin-ext-tr.woff2') format('woff2');
  unicode-range: U+011E-011F, U+0130-0131, U+015E-015F, U+20BA; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url('../fonts/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+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url('../fonts/jakarta-latin-ext-tr.woff2') format('woff2');
  unicode-range: U+011E-011F, U+0130-0131, U+015E-015F, U+20BA; }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url('../fonts/jakarta-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  /* 1. Primitive ---------------------------------------------------------- */
  --p-red-500: #E2232A;
  --p-red-600: #C51E25;
  --p-red-700: #A52326;
  --p-red-50:  #FDF0F1;
  --p-ink-900: #201C1D;
  --p-ink-800: #2E2829;
  --p-ink-700: #3A3436;
  --p-ink-600: #4A4446;
  --p-ink-500: #6D696A;
  --p-ink-400: #948D8F;
  --p-ink-300: #C3BDBE;
  --p-ink-250: #D6D0D1;
  --p-ink-200: #E7E3E4;
  --p-ink-100: #EFECEC;
  --p-ink-50:  #F8F7F7;
  --p-white:   #FFFFFF;

  /* 2. Semantic ----------------------------------------------------------- */
  --color-brand: #E2232A;
  --color-brand-hover: #C51E25;
  --color-brand-text: #A52326;
  --color-brand-soft: #FDF0F1;
  --color-on-brand: #FFFFFF;
  --color-ink: #201C1D;
  --color-text: #201C1D;
  --color-text-secondary: #4A4446;
  --color-text-muted: #6D696A;
  --color-surface: #FFFFFF;
  --color-surface-alt: #F8F7F7;
  --color-border: #E7E3E4;
  --color-border-strong: #D6D0D1;
  --color-focus: rgba(226, 35, 42, .35);
  --color-success: #1A7F37;
  --color-success-soft: #ECFDF3;
  --color-success-border: #BBF7D0;
  --color-success-text: #166534;
  --color-warning: #B45309;
  --color-warning-soft: #FFFBEB;
  --color-warning-border: #FDE68A;
  --color-warning-text: #92400E;
  --color-danger: #BB272B;
  --color-danger-soft: #FDF0F1;
  --color-danger-border: #F5C2C5;
  --color-danger-text: #A52326;
  --color-info: #2563EB;
  --color-info-soft: #EFF6FF;
  --color-info-border: #BFDBFE;
  --color-info-text: #1E40AF;
  --color-star: #F59E0B;
  /* İkinci el (Proje B) için ayrılmış; değerler orada netleşir */
  --condition-new: var(--color-success);
  --condition-refurbished: var(--color-info);
  --condition-good: var(--color-warning);
  --condition-fair: var(--color-text-muted);
  --color-warranty: var(--color-success-text);

  /* 3. Ölçekler ----------------------------------------------------------- */
  --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-heading: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --text-xs: 12px;  --text-sm: 13px;  --text-md: 14px;  --text-base: 16px;
  --text-lg: 18px;  --text-xl: 20px;  --text-2xl: 24px; --text-3xl: 32px;
  --text-4xl: clamp(28px, 4vw, 42px);  --text-5xl: clamp(34px, 5vw, 58px);
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px; --space-5: 20px;
  --space-6: 24px; --space-8: 32px; --space-12: 48px; --space-16: 64px; --space-24: 96px;
  --radius-sm: 8px; --radius-md: 10px; --radius-lg: 12px; --radius-xl: 20px; --radius-full: 999px;
  --shadow-sm: 0 1px 2px rgba(32, 28, 29, .06);
  --shadow-md: 0 8px 24px rgba(32, 28, 29, .10);
  --shadow-lg: 0 25px 60px rgba(0, 0, 0, .12);
  --shadow-glow-brand: 0 10px 26px rgba(226, 35, 42, .28);
  --z-sticky: 20; --z-backdrop: 40; --z-header: 50; --z-drawer: 200; --z-overlay: 205; --z-sheet: 210; --z-modal: 300; --z-toast: 400;
  --dur-fast: 150ms; --dur: 200ms; --dur-slow: 300ms;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --container: 1320px; --gutter: 24px; --header-h: 76px;

  /* 4. Component ---------------------------------------------------------- */
  --btn-radius: var(--radius-md);
  --btn-bg: var(--color-brand); --btn-fg: var(--color-on-brand); --btn-bd: var(--color-brand);
  --btn-shadow: var(--shadow-glow-brand);
  --card-bg: var(--color-surface); --card-bd: var(--color-border); --card-radius: var(--radius-lg); --card-shadow: var(--shadow-sm);
  --input-bg: var(--color-surface); --input-bd: var(--color-border-strong); --input-radius: var(--radius-md);
  --badge-radius: var(--radius-full);
  --header-bg: rgba(255, 255, 255, .92); --header-fg: var(--color-text); --header-bd: var(--color-border);
  --topbar-bg: var(--color-ink); --topbar-fg: var(--p-ink-300);
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur: 0ms; --dur-slow: 0ms; }
}
