/*
Theme Name:   Greatfood Child
Theme URI:    https://www.greatfood.it
Description:  Child theme custom per Greatfood S.r.l. — Soluzioni di ristorazione per la grande velocità. Costruito su GeneratePress.
Author:       Studio DUM_5
Author URI:   https://www.greatfood.it
Template:     generatepress
Version:      1.0.0
License:      Proprietary
Text Domain:  greatfood
*/

/* ==========================================================================
   CSS CUSTOM PROPERTIES — Design Tokens
   Estratti dal mockup Greatfood. Unica fonte di verità per tutto il sito.
   ========================================================================== */

:root {
    /* ── Colori primari ── */
    --gf-orange:          #C67D4A;
    --gf-orange-hover:    #A8683D;
    --gf-orange-light:    #F8F0E8;

    /* ── Neutri ── */
    --gf-black:           #1A1A1A;
    --gf-dark:            #2C2C2C;
    --gf-gray-900:        #333333;
    --gf-gray-700:        #555555;
    --gf-gray-500:        #888888;
    --gf-gray-300:        #CCCCCC;
    --gf-gray-200:        #E5E5E5;
    --gf-gray-100:        #F4F4F4;
    --gf-white:           #FFFFFF;

    /* ── Overlay ── */
    --gf-overlay-dark:    rgba(0, 0, 0, 0.55);
    --gf-overlay-light:   rgba(0, 0, 0, 0.35);

    /* ── Tipografia ── */
    --gf-font-primary:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --gf-font-heading:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    /* ── Scale tipografica (desktop) ── */
    --gf-text-xs:         0.75rem;    /* 12px */
    --gf-text-sm:         0.875rem;   /* 14px */
    --gf-text-base:       1rem;       /* 16px */
    --gf-text-lg:         1.125rem;   /* 18px */
    --gf-text-xl:         1.25rem;    /* 20px */
    --gf-text-2xl:        1.5rem;     /* 24px */
    --gf-text-3xl:        1.875rem;   /* 30px */
    --gf-text-4xl:        2.25rem;    /* 36px */
    --gf-text-5xl:        3rem;       /* 48px */

    /* ── Spacing scale (8px base) ── */
    --gf-space-1:         0.25rem;    /* 4px */
    --gf-space-2:         0.5rem;     /* 8px */
    --gf-space-3:         0.75rem;    /* 12px */
    --gf-space-4:         1rem;       /* 16px */
    --gf-space-5:         1.5rem;     /* 24px */
    --gf-space-6:         2rem;       /* 32px */
    --gf-space-7:         2.5rem;     /* 40px */
    --gf-space-8:         3rem;       /* 48px */
    --gf-space-9:         4rem;       /* 64px */
    --gf-space-10:        5rem;       /* 80px */
    --gf-space-11:        6rem;       /* 96px */
    --gf-space-12:        8rem;       /* 128px */

    /* ── Layout ── */
    --gf-container-max:   1200px;
    --gf-container-pad:   var(--gf-space-5);
    --gf-border-radius:   6px;
    --gf-border-radius-lg: 10px;

    /* ── Transizioni ── */
    --gf-transition:      300ms ease;
    --gf-transition-fast: 150ms ease;

    /* ── Ombre ── */
    --gf-shadow-sm:       0 1px 3px rgba(0, 0, 0, 0.08);
    --gf-shadow-md:       0 4px 12px rgba(0, 0, 0, 0.1);
    --gf-shadow-lg:       0 8px 30px rgba(0, 0, 0, 0.12);
    --gf-shadow-hover:    0 8px 25px rgba(0, 0, 0, 0.15);

    /* ── Z-index scale ── */
    --gf-z-header:        100;
    --gf-z-overlay:       200;
    --gf-z-modal:         300;
}

/* ── Breakpoints (riferimento, usati nei media query) ──
   Mobile:   < 768px   (stili base, mobile-first)
   Tablet:   768px     @media (min-width: 768px)
   Desktop:  1024px    @media (min-width: 1024px)
   Wide:     1280px    @media (min-width: 1280px)
   ========================================================= */
