:root {
    /* ========================
       🎨 BRAND COLORS
    ======================== */
    /*--color-primary: #f59e0b;*/
    --color-primary: #BA6827;
    --color-primary-hover: #d97706;
    --color-primary-active: #b45309;
    --color-primary-light: rgba(245, 158, 11, 0.15);

    --color-accent: #fbbf24;
    --color-accent-hover: #f59e0b;

    --gradient-primary: linear-gradient(
            135deg,
            #b45309 0%,
            #d97706 50%,
            #f59e0b 100%
    );
    /* ========================
       🔘 BUTTONS
    ======================== */
    --btn-primary-bg: var(--color-primary);
    --btn-primary-hover: var(--color-primary-hover);
    --btn-primary-text: #ffffff;

    --btn-secondary-bg: #111827;
    --btn-secondary-hover: #000000;
    --btn-secondary-text: #ffffff;

    --btn-outline-border: #d1d5db;
    --btn-outline-hover: #f3f4f6;

    /* ========================
       🧩 UI ELEMENTS
    ======================== */
    --card-bg: #ffffff;
    --card-border: #e5e7eb;

    --input-bg: #ffffff;
    --input-border: #d1d5db;
    --input-focus-border: #f59e0b;
    --input-placeholder: #9ca3af;

    /* ========================
       🌫️ EFFECTS
    ======================== */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.15);

    /* ========================
       🔗 LINKS
    ======================== */
    --link-color: #f59e0b;
    --link-hover: #d97706;

    /* ========================
       🚫 DISABLED
    ======================== */
    --color-disabled-bg: #f3f4f6;
    --color-disabled-text: #9ca3af;
    --color-disabled-border: #e5e7eb;
}