/* ============================================
   OTTICA ZANETTI - CONFIGURATION
   Customizable colors, fonts, themes, and backgrounds
   ============================================ */

:root {
    /* ============ PROFESSIONAL & CORPORATE ============ */
    
    /* PRIMARY COLOR - Deep Blue */
    --color-primary: #1E3A5F;
    --color-primary-dark: #152A47;
    
    /* SECONDARY COLOR - Bright Blue */
    --color-secondary: #0066CC;
    
    /* ACCENT COLOR - Orange Red */
    --color-accent: #FF6B35;
    
    /* TEXT COLORS */
    --color-text: #2C3E50;
    --color-text-light: #555555;
    
    /* BACKGROUND COLORS */
    --color-bg: #FFFFFF;
    --color-bg-light: #F0F4F8;
    
    /* ============ TYPOGRAPHY ============ */
    
    /* Font Family - Body Text */
    --font-family-body: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    
    /* Font Family - Headings */
    --font-family-heading: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    
    /* ============ ALTERNATIVE THEME COLORS ============ */
    /* Use these if you want to switch themes easily */
    
    /* Warm/Welcoming theme (warm earth tones):
    --color-primary: #8B6F47;
    --color-primary-dark: #6B5735;
    --color-secondary: #C97757;
    --color-accent: #D4A574;
    --color-text: #333333;
    --color-text-light: #666666;
    --color-bg: #FFFAF5;
    --color-bg-light: #FFF5E6;
    */
    
    /* Professional & Corporate theme (currently active):
    Primary: Deep blue (#1E3A5F)
    Secondary: Bright blue (#0066CC)
    Accent: Orange red (#FF6B35)
    Background: White/light blue (#FFFFFF, #F0F4F8)
    */
}

/* ============================================
   THEME OVERRIDE EXAMPLES
   Uncomment to apply different themes
   ============================================ */


   /* THEME: Professional & Corporate
   Uncomment the block below to use: */

/* :root {
    --color-primary: #1E3A5F;
    --color-primary-dark: #152A47;
    --color-secondary: #0066CC;
    --color-accent: #FF6B35;
    --color-text: #2C3E50;
    --color-text-light: #555555;
    --color-bg: #FFFFFF;
    --color-bg-light: #F0F4F8;
} */



   /* THEME: Natural & Green
   Uncomment the block below to use: */

/* :root {
    --color-primary: #2D5016;
    --color-primary-dark: #1F3A0F;
    --color-secondary: #6B8E23;
    --color-accent: #9DC53A;
    --color-text: #333333;
    --color-text-light: #666666;
    --color-bg: #F7F9F3;
    --color-bg-light: #EDF1E4;
} */



   /* THEME: Modern & Minimalist
   Uncomment the block below to use: */

/* :root {
    --color-primary: #4A4A4A;
    --color-primary-dark: #2B2B2B;
    --color-secondary: #FF6B6B;
    --color-accent: #FFD93D;
    --color-text: #1F1F1F;
    --color-text-light: #5A5A5A;
    --color-bg: #FAFAFA;
    --color-bg-light: #F0F0F0;
} */


/* ============================================
   CUSTOM PROPERTY GROUPS
   ============================================ */

/* Spacing */
:root {
    --spacing-xs: 0.5rem;
    --spacing-sm: 1rem;
    --spacing-md: 1.5rem;
    --spacing-lg: 2rem;
    --spacing-xl: 3rem;
}

/* Border Radius */
:root {
    --border-radius-sm: 4px;
    --border-radius-md: 8px;
    --border-radius-lg: 12px;
    --border-radius-full: 9999px;
}

/* Box Shadows */
:root {
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.12);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.15);
}

/* Transitions */
:root {
    --transition-fast: 0.15s ease;
    --transition-base: 0.3s ease;
    --transition-slow: 0.5s ease;
}

/* Screen Sizes (for reference in media queries) */
:root {
    --breakpoint-sm: 600px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 1024px;
    --breakpoint-xl: 1200px;
}

/* ============================================
   QUICK CUSTOMIZATION GUIDE
   ============================================ */

/*
1. COLOR SCHEME
   To change the color scheme:
   - Update --color-primary, --color-secondary, --color-accent
   - Both light and dark variants are available
   - See THEME OVERRIDE EXAMPLES above for preset themes

2. FONTS
   To change fonts:
   - Update --font-family-body for main text
   - Update --font-family-heading for titles
   - Then import the font in the CSS (e.g., @import url(...))

3. SPACING
   Predefined spacing values for consistency:
   - --spacing-xs: 0.5rem
   - --spacing-sm: 1rem
   - --spacing-md: 1.5rem
   - --spacing-lg: 2rem
   - --spacing-xl: 3rem

4. SHADOWS & BORDERS
   - Adjust --shadow-* for depth
   - Adjust --border-radius-* for roundness

Example: To use theme colors in style.css:
   background-color: var(--color-primary);
   color: var(--color-text-light);
   box-shadow: var(--shadow-md);
   border-radius: var(--border-radius-md);
*/