/**
 * LD Jewellers — Centralized Design System
 *
 * All color tokens for the LD Jewellers theme.
 * Never hardcode colors in section files — always use these variables.
 *
 * @package LDJewellers
 * @since 1.0.0
 */

:root {
    /* ============================
       Primary Brand Colors
       ============================ */
    --ld-primary: #5F1919;
    --ld-primary-dark: #4A1113;
    --ld-primary-light: #7A2D2D;

    /* ============================
       Background Colors
       ============================ */
    --ld-bg: #FFFFFF;
    --ld-bg-section: #FBF0EA;
    --ld-bg-card: #FFFFFF;
    --ld-bg-dark: #4A1113;

    /* ============================
       Border Colors
       ============================ */
    --ld-border: #EADCD5;
    --ld-border-light: #F0E6E0;
    --ld-border-dark: #D4C4BC;

    /* ============================
       Text Colors
       ============================ */
    --ld-text: #2A2A2A;
    --ld-text-light: #666666;
    --ld-text-muted: #999999;
    --ld-text-on-primary: #FFFFFF;
    --ld-text-on-dark: #E8D5D5;

    /* ============================
       Interactive States
       ============================ */
    --ld-hover: #4A1113;
    --ld-focus: #3D0D0F;
    --ld-active: #3D0D0F;

    /* ============================
       Accent / Functional
       ============================ */
    --ld-accent: #5F1919;
    --ld-accent-gradient: linear-gradient(135deg, #5F1919, #4A1113);
    --ld-success: #10b981;
    --ld-shadow-primary: rgba(95, 25, 25, 0.2);
    --ld-shadow-primary-strong: rgba(95, 25, 25, 0.4);

    /* ============================
       Header / Footer Specific
       ============================ */
    --ld-header-bg: #5F1919;
    --ld-header-text: #FFFFFF;
    --ld-header-link: #E8D5D5;
    --ld-header-link-hover: #FFFFFF;
    --ld-footer-bg: #4A1113;
    --ld-footer-text: #FFFFFF;
    --ld-footer-link: #D4B5B5;
    --ld-footer-link-hover: #FFFFFF;
    --ld-footer-muted: #A08080;
    --ld-footer-border: rgba(255, 255, 255, 0.15);
}

/* ============================
   Focus Visibility (Accessibility)
   ============================ */
*:focus-visible {
    outline: 2px solid var(--ld-primary);
    outline-offset: 2px;
}

/* ============================
   Selection Colors
   ============================ */
::selection {
    background-color: var(--ld-primary);
    color: var(--ld-text-on-primary);
}

::-moz-selection {
    background-color: var(--ld-primary);
    color: var(--ld-text-on-primary);
}