/* Bunte Toner - CSS Variables */

:root {
    /* ===== MASTER COLOR PALETTE ===== */
    /* TonerPartner.de inspired - Tüm siteyi buradan kontrol edin! */
    
    /* Primary Brand Color - Blue Buttons */
    --brand-primary: #3B6BA8;        /* Ana marka rengi - Mavi Buton */
    --brand-primary-dark: #2E5C8E;   /* Hover/Active durumlar */
    --brand-primary-light: #E8F0F8;  /* Arka planlar */
    
    /* Text Colors */
    --text-primary: #333333;         /* Ana metin */
    --text-secondary: #666666;       /* İkincil metin */
    --text-tertiary: #999999;        /* Üçüncül metin */
    
    /* Background Colors */
    --bg-page: #DDDDDD;              /* Sayfa arka planı - Açık Gri */
    --bg-card: #FFFFFF;              /* Kart/Panel arka planı */
    --bg-hover: #F5F5F5;             /* Hover arka planı */
    --bg-input: #FFFFFF;             /* Input arka planı */
    
    /* Border Colors */
    --border-light: #CCCCCC;         /* Hafif çizgiler */
    --border-medium: #BBBBBB;        /* Orta çizgiler */
    --border-dark: #999999;          /* Koyu çizgiler */
    
    /* Status Colors */
    --success: #28A745;              /* Başarı - Yeşil */
    --danger: #DC3545;               /* Hata/Silme */
    --warning: #FFC107;              /* Uyarı */
    --info: #3B6BA8;                 /* Bilgi - Mavi */
    
    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.07);
    --shadow-lg: 0 10px 15px rgba(0,0,0,0.1);
    
    /* === Geriye dönük uyumluluk === */
    --primary: var(--brand-primary);
    --primary-dark: var(--brand-primary-dark);
    --black: var(--text-primary);
    --gray-700: var(--text-secondary);
    --gray-500: var(--text-tertiary);
    --gray-300: var(--border-light);
    --gray-100: var(--bg-hover);
    --white: var(--bg-card);
    --bunte-orange: var(--brand-primary);
    --bunte-black: var(--text-primary);
    --bunte-gray: var(--text-secondary);
    --bunte-light-gray: var(--border-light);
    --bunte-white: var(--bg-card);
    --bunte-cream: var(--bg-page);
    --bunte-green: var(--success);
    --bunte-red: var(--danger);
    
    /* Spacing */
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;
    --spacing-2xl: 40px;
    --spacing-3xl: 60px;
    
    /* Typography */
    --font-family: 'Graphik Webfont', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --font-size-xs: 12px;
    --font-size-sm: 13px;
    --font-size-base: 14px;
    --font-size-md: 15px;
    --font-size-lg: 16px;
    --font-size-xl: 18px;
    --font-size-2xl: 24px;
    --font-size-3xl: 28px;
    --font-size-4xl: 36px;
    
    /* Border Radius - FLAT DESIGN (No curves!) */
    --border-radius: 0px;
    --border-radius-sm: 0px;
    --border-radius-lg: 0px;
    --border-radius-pill: 0px;
    --border-radius-full: 0px;
    
    /* Shadows */
    --box-shadow: 0 1px 4px rgba(0,0,0,0.12);
    --box-shadow-md: 0 4px 12px rgba(0,0,0,0.15);
    --box-shadow-lg: 0 8px 24px rgba(0,0,0,0.18);
    
    /* Transitions */
    --transition-fast: 0.15s;
    --transition-base: 0.2s;
    --transition-slow: 0.3s;
    
    /* Layout */
    --max-width: 1400px;
    --container-padding: 20px;
    --header-height: 80px;
    
    /* Breakpoints (for reference in media queries) */
    --breakpoint-mobile: 768px;
    --breakpoint-tablet: 968px;
    --breakpoint-desktop: 1440px;
}

* {
    box-sizing: border-box;
}

body {
    font-family: var(--font-family);
    background: var(--bunte-cream);
    color: var(--bunte-black);
    margin: 0;
    padding: 0;
    line-height: 1.6;
    font-size: var(--font-size-base);
}