/* 
 * ============================================================
 * Color Palette — La Grotta Restaurant & Coffee
 * Extracted from: Restaurant_logo.png
 * Theme: Rustic Cave · Monochrome · Stone & Charcoal
 * ============================================================
 *
 * Logo analysis result:
 *   Dominant #1 → Pure White  #fefefe / #ffffff  (76 % of logo pixels)
 *   Dominant #2 → Pure Black  #000000 / #141615  (23 % of logo pixels)
 *   No hue detected — strict black-and-white identity
 *
 * Design decision:
 *   We honour the logo's monochrome identity and layer warm
 *   stone/cave tones on top to create a rustic-cozy atmosphere
 *   without introducing colours that clash with the brand mark.
 * ============================================================
 */

:root {

    /* ----------------------------------------------------------
       PRIMARY BRAND COLORS
       Deep charcoal / cave-black — mirrors the logo's ink tones
    ---------------------------------------------------------- */
    --menu-primary:        #1c1c1c;   /* Main dark surface (cave wall) */
    --menu-primary-light:  #2e2b28;   /* Slightly warm dark — stone in shadow */
    --menu-primary-dark:   #0f0f0f;   /* Near-black depth */
    --menu-primary-darker: #000000;   /* Pure black — logo anchor */

    /* ----------------------------------------------------------
       SECONDARY BRAND COLORS
       Off-white / aged paper — mirrors the logo's white field
    ---------------------------------------------------------- */
    --menu-secondary:       #f0ece4;  /* Warm off-white — aged parchment */
    --menu-secondary-light: #faf8f4;  /* Bright near-white — highlights */
    --menu-secondary-dark:  #d8d0c4;  /* Muted warm grey — worn stone */

    /* ----------------------------------------------------------
       ACCENT COLORS
       Mid-tone stone greys — cave rock texture
    ---------------------------------------------------------- */
    --menu-accent:       #5a5550;     /* Warm mid grey — rough stone */
    --menu-accent-light: #7a7470;     /* Lighter warm grey — sandstone */
    --menu-accent-dark:  #3a3530;     /* Dark warm grey — slate */

    /* ----------------------------------------------------------
       BACKGROUND COLORS
       Used by the CSS stone-texture gradient layers
    ---------------------------------------------------------- */
    --background-dark:    #0f0e0c;                       /* Cave mouth — deepest */
    --background-medium:  #1c1a17;                       /* Inner stone wall */
    --background-light:   #2e2b25;                       /* Lit stone surface */
    --background-overlay: rgba(12, 11, 9, 0.88);         /* Scrim over texture */

    /* ----------------------------------------------------------
       TEXT COLORS
    ---------------------------------------------------------- */
    --text-color:         #f0ece4;   /* Primary text — warm off-white */
    --text-color-light:   #faf8f4;   /* Brightest text — headings */
    --text-color-dark:    #b0a898;   /* Subdued text — captions */
    --text-color-primary: #1c1c1c;  /* Dark text on light surfaces */

    /* ----------------------------------------------------------
       BUTTON GRADIENTS
       Monochrome — three distinct treatments for the three language
       buttons while staying within the black-white-stone range
    ---------------------------------------------------------- */
    /* Black button (Arabic) */
    --gradient-primary:   linear-gradient(145deg, #1c1a17 0%, #2e2b25 100%);
    /* Cream button (English) */
    --gradient-secondary: linear-gradient(145deg, #f0ece4 0%, #faf8f4 100%);
    /* Stone-grey button (Kurdish) */
    --gradient-accent:    linear-gradient(145deg, #5a5550 0%, #7a7470 100%);

    /* ----------------------------------------------------------
       SHADOW COLORS
    ---------------------------------------------------------- */
    --shadow-primary:   rgba(0, 0, 0, 0.70);            /* Deep cast shadow */
    --shadow-secondary: rgba(240, 236, 228, 0.18);      /* Soft warm glow */
    --shadow-dark:      rgba(0, 0, 0, 0.90);            /* Heaviest shadow */

    /* ----------------------------------------------------------
       BORDER COLORS
    ---------------------------------------------------------- */
    --border-primary:   rgba(240, 236, 228, 0.28);      /* Warm off-white line */
    --border-secondary: rgba(240, 236, 228, 0.16);      /* Subtle off-white line */
    --border-light:     rgba(250, 248, 244, 0.10);      /* Barely-there line */

    /* ----------------------------------------------------------
       HOVER STATE COLORS
    ---------------------------------------------------------- */
    --hover-primary:    #2e2b25;     /* Lighter cave-stone on hover */
    --hover-secondary:  #faf8f4;    /* Brightest cream on hover */
    --hover-accent:     #7a7470;    /* Lighter sandstone on hover */

    /* ----------------------------------------------------------
       STONE TEXTURE — CSS gradient layers used in indexStyle.css
       These variables let the texture be tuned from one place.
    ---------------------------------------------------------- */
    --stone-layer-1: rgba(255, 255, 255, 0.012);   /* faint bright vein */
    --stone-layer-2: rgba(0,   0,   0,   0.18);    /* dark crack shadow */
    --stone-layer-3: rgba(180, 165, 140, 0.06);    /* warm mineral glint */

}