/* ==========================================
   CSS Custom Properties (Design Tokens)
   Single source of truth for all colors,
   spacing, typography, and transitions
   ========================================== */

:root {
    /* Colors - Orange & Black Theme */
    --color-primary: #ffffff;
    --color-secondary: #1a1a1a;
    --color-accent: #e67e22;
    --color-accent-hover: #d35400;
    --color-accent-light: rgba(230, 126, 34, 0.1);
    --color-whatsapp: #25D366;
    --color-instagram: #E4405F;
    --color-bg-alt: #f8f9fa;
    --color-border: #eeeeee;
    --color-text: #1a1a1a;
    --color-text-light: #555555;
    --color-text-muted: #777777;
    --color-footer-bg: #111111;
    --color-footer-text: #cccccc;

    /* Status colors */
    --color-success-bg: #d4edda;
    --color-success-text: #155724;
    --color-error-bg: #f8d7da;
    --color-error-text: #721c24;

    /* Accent colors */
    --color-star: #f5a623;
    --color-overlay: rgba(0, 0, 0, 0.5);
    --color-overlay-label: rgba(0, 0, 0, 0.6);
    --color-reviews-bg: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    --color-reviews-fade: #f1f3f5;

    /* Typography */
    --font-family: 'Poppins', sans-serif;
    --font-size-base: 16px;
    --font-size-sm: 0.9rem;
    --font-size-md: 1.1rem;
    --font-size-lg: 1.4rem;
    --font-size-xl: 1.6rem;
    --font-size-2xl: 1.9rem;
    --font-size-3xl: 2.8rem;
    --font-size-hero: 3.5rem;
    --line-height-base: 1.8;
    --line-height-tight: 1.2;
    --line-height-relaxed: 1.7;

    /* Spacing */
    --space-xs: 5px;
    --space-sm: 10px;
    --space-md: 15px;
    --space-lg: 20px;
    --space-xl: 30px;
    --space-2xl: 40px;
    --space-3xl: 60px;
    --space-section: 80px;

    /* Layout */
    --max-width: 1200px;
    --border-radius: 10px;
    --border-radius-sm: 5px;

    /* Shadows */
    --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 10px 25px rgba(0, 0, 0, 0.07);
    --shadow-lg: 0 15px 30px rgba(0, 0, 0, 0.08);
    --shadow-float: 0 4px 15px rgba(0, 0, 0, 0.2);

    /* Transitions */
    --transition-fast: 0.3s ease;
    --transition-slow: 0.4s ease-in-out;

    /* Z-index layers */
    --z-float: 999;
    --z-header: 1000;
    --z-hamburger: 1001;
}
