/* ============================================================
   variables.css - متغیرهای یکپارچه تم ipketab
   پالت رنگی: سبز تیره + طلایی لوکس
   آخرین به‌روزرسانی: 2026-08-13
   ============================================================ */

:root {
    /* ==========================================================
       1. رنگ‌های اصلی (Primary) - سبز تیره
       ========================================================== */
    --color-primary-dark: #031E1D;
    --color-primary: #0A2E2A;
    --color-primary-light: #123C37;
    
    /* ==========================================================
       2. رنگ‌های طلایی (Gold)
       ========================================================== */
    --color-gold-dark: #A67C33;
    --color-gold: #C9A45A;
    --color-gold-light: #E3C88A;
    --color-gold-hover: #F0D79E;
    
    /* ==========================================================
       3. رنگ‌های پس‌زمینه (Backgrounds)
       ========================================================== */
    --bg-main: #021716;
    --bg-card: #082523;
    --bg-section: #0C2B29;
    --bg-light: #133A36;
    --bg-soft: #0A2E2A;
    --bg-white: #F5F1E8;
    
    /* ==========================================================
       4. رنگ‌های متن (Text Colors)
       ========================================================== */
    --text-primary: #F5F1E8;
    --text-secondary: #D8CDB8;
    --text-muted: #A79D8B;
    --text-light: #8A7E6B;
    --text-white: #F5F1E8;
    --text-dark: #0A1A18;
    
    /* ==========================================================
       5. رنگ‌های مرزی (Border Colors)
       ========================================================== */
    --border-gold: #B8914A;
    --border-dark: #20433F;
    --border-light: #2A4D48;
    --border-soft: rgba(201, 164, 90, 0.15);
    
    /* ==========================================================
       6. رنگ‌های دکمه (Button Colors)
       ========================================================== */
    --btn-primary: #C9A45A;
    --btn-primary-hover: #D8B46A;
    --btn-text: #0A1A18;
    
    /* ==========================================================
       7. گرادینت‌ها (Gradients)
       ========================================================== */
    --gradient-header: linear-gradient(135deg, #021716 0%, #0A2E2A 35%, #123C37 100%);
    --gradient-gold: linear-gradient(135deg, #A67C33 0%, #C9A45A 50%, #E3C88A 100%);
    --gradient-gold-dark: linear-gradient(135deg, #A67C33 0%, #C9A45A 100%);
    --gradient-gold-light: linear-gradient(135deg, #C9A45A 0%, #E3C88A 100%);
    
    /* ==========================================================
       8. افکت‌های درخشان (Glow Effects)
       ========================================================== */
    --glow-gold: rgba(201, 164, 90, 0.35);
    --glow-green: rgba(18, 60, 55, 0.45);
    
    /* ==========================================================
       9. رنگ‌های ثانویه - برای حفظ سازگاری با ماژول‌های موجود
       ========================================================== */
    --color-secondary: #C9A45A;
    --color-secondary-dark: #A67C33;
    --color-secondary-light: #E3C88A;
    --color-secondary-gradient: linear-gradient(135deg, #A67C33 0%, #C9A45A 50%, #E3C88A 100%);
    --color-secondary-gradient-reverse: linear-gradient(135deg, #E3C88A 0%, #C9A45A 50%, #A67C33 100%);
    
    /* ==========================================================
       10. رنگ‌های وضعیت (Status Colors)
       ========================================================== */
    --color-success: #48bb78;
    --color-success-dark: #38a169;
    --color-success-light: #f0fff4;
    --color-success-border: #c6f6d5;
    --color-danger: #e53e3e;
    --color-danger-dark: #c53030;
    --color-danger-light: #fff5f5;
    --color-danger-border: #fecaca;
    --color-warning: #f6ad55;
    --color-warning-light: #fffbeb;
    --color-warning-border: #f6e05e;
    --color-info: #3182ce;
    --color-info-light: #ebf8ff;
    --color-star: #C9A45A;
    --color-star-empty: #4A6B65;

    /* ==========================================================
       11. فونت‌ها (Typography)
       ========================================================== */
    --font-family: 'OpenCartFarsi', 'Tahoma', 'Segoe UI', system-ui, -apple-system, sans-serif;
    --font-family-alt: 'OpenCartFarsi', 'Tahoma', sans-serif;
    
    --font-size-xs: 10px;
    --font-size-sm: 12px;
    --font-size-base: 14px;
    --font-size-md: 15px;
    --font-size-lg: 16px;
    --font-size-xl: 18px;
    --font-size-2xl: 20px;
    --font-size-3xl: 22px;
    --font-size-4xl: 24px;
    
    --font-normal: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;

    /* ==========================================================
       12. سایه‌ها (Shadows)
       ========================================================== */
    --shadow-none: none;
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.2);
    --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.4);
    --shadow-xl: 0 20px 60px rgba(0, 0, 0, 0.5);
    --shadow-2xl: 0 50px 100px rgba(0, 0, 0, 0.6);
    --shadow-secondary: 0 4px 20px rgba(201, 164, 90, 0.3);
    --shadow-secondary-lg: 0 8px 30px rgba(201, 164, 90, 0.4);
    --shadow-primary: 0 4px 20px rgba(10, 46, 42, 0.3);
    --shadow-primary-lg: 0 8px 35px rgba(10, 46, 42, 0.4);
    --shadow-primary-sm: 0 2px 12px rgba(10, 46, 42, 0.25);
    --shadow-success: 0 8px 30px rgba(72, 187, 120, 0.30);
    --shadow-danger: 0 4px 12px rgba(229, 62, 62, 0.30);
    --shadow-gold: 0 4px 20px rgba(201, 164, 90, 0.3);
    --shadow-gold-lg: 0 8px 35px rgba(201, 164, 90, 0.4);

    /* ==========================================================
       13. فاصله‌های گرد (Border Radius)
       ========================================================== */
    --radius-none: 0;
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 10px;
    --radius-xl: 12px;
    --radius-2xl: 14px;
    --radius-3xl: 16px;
    --radius-4xl: 20px;
    --radius-5xl: 24px;
    --radius-full: 9999px;
    --radius-circle: 50%;

    /* ==========================================================
       14. Z-Index لایه‌ها
       ========================================================== */
    --z-base: 1;
    --z-dropdown: 100;
    --z-sticky: 200;
    --z-header: 300;
    --z-modal-backdrop: 900;
    --z-modal: 1000;
    --z-overlay: 5000;
    --z-toast: 9999;
    --z-max: 99999;

    /* ==========================================================
       15. انیمیشن‌ها و transitions
       ========================================================== */
    --transition-fast: 0.2s ease;
    --transition-base: 0.3s ease;
    --transition-slow: 0.5s ease;
    --transition-bounce: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-smooth: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-spring: 0.5s cubic-bezier(0.2, 1.3, 0.7, 1);

    /* ==========================================================
       16. ابعاد و اندازه‌ها
       ========================================================== */
    --container-max: 1200px;
    --container-padding: 20px;
    --header-height: 60px;
    --header-top-height: 40px;
    --footer-height: 300px;

    /* ==========================================================
       17. فاصله‌گذاری (Spacing)
       ========================================================== */
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 12px;
    --spacing-lg: 16px;
    --spacing-xl: 20px;
    --spacing-2xl: 24px;
    --spacing-3xl: 30px;
    --spacing-4xl: 40px;

    /* ==========================================================
       18. متغیرهای اختصاصی محصول (Product Specific)
       ========================================================== */
    --p-primary: #C9A45A;
    --p-secondary: #A67C33;
    --p-text: #F5F1E8;
    --p-muted: #A79D8B;
    --p-border: #20433F;
    --p-bg: #082523;
    --p-bg-soft: #0A2E2A;
    --p-radius: var(--radius-3xl);
    --p-shadow: var(--shadow-md);
    --p-shadow-hover: var(--shadow-lg);
    --p-transition: var(--transition-base);

    /* ==========================================================
       19. متغیرهای اختصاصی برند (Brand Specific)
       ========================================================== */
    --brand-primary: #C9A45A;
    --brand-primary-dark: #A67C33;
    --brand-primary-light: #E3C88A;
    --brand-secondary: #A67C33;
    --brand-gradient: linear-gradient(135deg, #A67C33 0%, #C9A45A 50%, #E3C88A 100%);
    --brand-gradient-dark: linear-gradient(135deg, #A67C33 0%, #C9A45A 100%);
    --brand-bg: #082523;
    --brand-border: #20433F;
    --brand-bg-soft: #0A2E2A;
    --brand-text: #F5F1E8;
    --brand-muted: #A79D8B;
    --brand-shadow: 0 2px 12px rgba(201, 164, 90, 0.08);
    --brand-shadow-hover: 0 20px 60px rgba(201, 164, 90, 0.08);
    --brand-radius: var(--radius-3xl);
    --brand-transition: var(--transition-smooth);

    /* ==========================================================
       20. متغیرهای اختصاصی هدر (Header Specific)
       ========================================================== */
    --h-primary: #C9A45A;
    --h-secondary: #A67C33;
    --h-text: #F5F1E8;
    --h-muted: #D8CDB8;
    --h-border: #20433F;
    --h-bg: linear-gradient(135deg, #021716 0%, #0A2E2A 35%, #123C37 100%);
    --h-bg-soft: rgba(18, 60, 55, 0.45);
    --h-gold-light: #E3C88A;
    --h-glow: rgba(201, 164, 90, 0.35);
    --h-radius: var(--radius-2xl);
    --h-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
    --h-shadow-hover: 0 12px 40px rgba(0, 0, 0, 0.4);
    --h-transition: var(--transition-smooth);
}