/**
 * Milyon.az Bootstrap
 * Saytın öz kiçik "bootstrap" faylı - CSS reset, əsas dəyişənlər (rənglər, boşluqlar,
 * breakpoint-lər), grid/utility class-ları. style.css bu fayldan sonra yüklənir və
 * konkret komponentləri (kart, form, header və s.) təyin edir.
 */

/* ===== Reset ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
img, svg { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a { text-decoration: none; color: inherit; }
ul, ol { list-style: none; }

/* ===== Dəyişənlər (rənglər, boşluq şkalası, breakpoint-lər) ===== */
:root {
    --primary: #ff6600;
    --primary-dark: #e55a00;
    --teal: #00838f;
    --dark: #1a1a1a;
    --gray-900: #1f2937;
    --gray-600: #6b7280;
    --gray-300: #d1d5db;
    --gray-100: #f3f4f6;
    --gray-50: #f9fafb;
    --white: #ffffff;
    --radius: 8px;
    --radius-lg: 14px;
    --shadow: 0 1px 3px rgba(0,0,0,0.08);
    --shadow-hover: 0 4px 16px rgba(0,0,0,0.12);

    /* Boşluq şkalası (spacing scale) */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 24px;
    --space-6: 32px;
    --space-7: 48px;

    /* Kateqoriya ikon rəngləri (canlı, tap.az-vari palitra) */
    --icon-blue: #2563eb;   --icon-blue-bg: #dbeafe;
    --icon-green: #16a34a;  --icon-green-bg: #dcfce7;
    --icon-orange: #ea580c; --icon-orange-bg: #ffedd5;
    --icon-purple: #9333ea; --icon-purple-bg: #f3e8ff;
    --icon-pink: #db2777;   --icon-pink-bg: #fce7f3;
    --icon-teal: #0d9488;   --icon-teal-bg: #ccfbf1;
    --icon-red: #dc2626;    --icon-red-bg: #fee2e2;
    --icon-amber: #d97706;  --icon-amber-bg: #fef3c7;
}

body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif; color: var(--gray-900); background: var(--gray-50); line-height: 1.5; }

/* ===== Grid sistemi ===== */
.container { max-width: 1280px; margin: 0 auto; padding: 0 16px; }
.grid { display: grid; gap: var(--space-4); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
.grid-6 { grid-template-columns: repeat(6, 1fr); }
.flex { display: flex; }
.flex-col { display: flex; flex-direction: column; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.gap-1 { gap: var(--space-1); } .gap-2 { gap: var(--space-2); } .gap-3 { gap: var(--space-3); } .gap-4 { gap: var(--space-4); }

/* ===== Utility class-lar ===== */
.text-center { text-align: center; }
.text-muted { color: var(--gray-600); }
.font-bold { font-weight: 700; }
.rounded { border-radius: var(--radius); }
.shadow { box-shadow: var(--shadow); }
.hidden { display: none !important; }

/* ===== Breakpoint-lər (referans - media query-lər style.css-də) =====
   --bp-mobile:  0    - 640px
   --bp-tablet:  641  - 860px
   --bp-desktop: 861px +
*/