/*
Theme Name: Spectacle Lake Lodge
Theme URI: https://www.spectaclelakelodge.com/
Description: A modern, warm, and premium WordPress theme for Spectacle Lake Lodge — a four-season lakeside resort near Algonquin Park. Built for Elementor, with editable branding, custom booking integration, and full accessibility.
Author: Custom Development
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.1
License: Proprietary
Text Domain: sll
*/

/* =====================================================================
   CSS CUSTOM PROPERTIES — All brand tokens editable via Customizer
   ===================================================================== */
:root {
    /* Brand Colors — overridden by Customizer via inline CSS */
    --color-primary:        #2D5016;
    --color-primary-dark:   #1e370f;
    --color-primary-light:  #3d6b1f;
    --color-accent:         #C8860A;
    --color-accent-dark:    #a06d08;
    --color-accent-light:   #e09b0c;
    --color-neutral-50:     #faf9f7;
    --color-neutral-100:    #f2ede6;
    --color-neutral-200:    #e3d9cc;
    --color-neutral-400:    #a89880;
    --color-neutral-600:    #6b5a47;
    --color-neutral-800:    #2e251c;
    --color-neutral-900:    #1a130c;
    --color-white:          #ffffff;
    --color-black:          #0d0d0d;

    /* Semantic color aliases used throughout main.css */
    --color-text:           #2e251c;
    --color-text-muted:     #6b5a47;
    --color-bg-light:       #f2ede6;
    --color-border:         #e3d9cc;

    /* Typography — overridden by Customizer */
    --font-heading:         'Playfair Display', Georgia, serif;
    --font-body:            'Lato', 'Helvetica Neue', Arial, sans-serif;

    /* Font size scale */
    --text-xs:    0.75rem;
    --text-sm:    0.875rem;
    --text-base:  1rem;
    --text-lg:    1.125rem;
    --text-xl:    1.25rem;
    --text-2xl:   1.5rem;
    --text-3xl:   1.875rem;
    --text-4xl:   2.25rem;
    --text-5xl:   3rem;

    /* Numeric spacing scale (0.25rem per step) */
    --space-1:   0.25rem;
    --space-2:   0.5rem;
    --space-3:   0.75rem;
    --space-4:   1rem;
    --space-5:   1.25rem;
    --space-6:   1.5rem;
    --space-7:   1.75rem;
    --space-8:   2rem;
    --space-9:   2.25rem;
    --space-10:  2.5rem;
    --space-11:  2.75rem;
    --space-12:  3rem;
    --space-14:  3.5rem;
    --space-16:  4rem;
    --space-20:  5rem;
    --space-24:  6rem;

    /* Legacy named aliases */
    --space-xs:   0.5rem;
    --space-sm:   1rem;
    --space-md:   1.5rem;
    --space-lg:   2.5rem;
    --space-xl:   4rem;
    --space-2xl:  6rem;
    --space-3xl:  8rem;

    /* Container widths */
    --container-max:   1280px;
    --container-wide:  1440px;
    --container-prose: 780px;

    /* Transitions */
    --transition-fast:   150ms ease;
    --transition-base:   250ms ease;
    --transition-slow:   400ms ease;

    /* Shadows */
    --shadow-sm:   0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.08);
    --shadow-md:   0 4px 12px rgba(0,0,0,.12), 0 2px 6px rgba(0,0,0,.08);
    --shadow-lg:   0 10px 30px rgba(0,0,0,.15), 0 4px 12px rgba(0,0,0,.10);
    --shadow-xl:   0 20px 50px rgba(0,0,0,.20);

    /* Border radius */
    --radius-sm:   4px;
    --radius-md:   8px;
    --radius-lg:   16px;
    --radius-xl:   24px;
    --radius-full: 9999px;
    --radius-pill: 9999px;

    /* Z-index scale */
    --z-base:     1;
    --z-dropdown: 100;
    --z-sticky:   200;
    --z-header:   300;
    --z-overlay:  400;
    --z-modal:    500;
    --z-toast:    600;
}