:root {
    --primary-color: #263e0f;
    --primary-rgb: 38, 62, 15;
    --secondary-color: #c0c0c0;
    --accent-color: #669c35;

    /* Global Color Palette — the 4 consistent theme roles */
    --color-primary: #c0c0c0;
    --color-primary-rgb: 192, 192, 192;
    --color-secondary: #669c35;
    --color-secondary-rgb: 102, 156, 53;
        --bg-image-url: url('http://www.mytrendylooks.com/uploads/bg_1784907266.png');
    }

/* Storefront theme tokens (Website Background Color + the single global
   color-text role) — scoped to the public storefront only. The admin console
   keeps its own fixed dark design system (body.admin-shell), so this never
   affects admin readability. Every container (filter sidebar, promotional
   banner, product cards, auth card, modal, etc.) resolves to the SAME
   color-primary background and the SAME color-text text color, which is the
   consistency fix: no more mismatched per-component background/text colors. */
body:not(.admin-shell) {
    --color-background: #ebebeb;
    --color-text: #14171c;
    --color-text-rgb: 20, 23, 28;

    --bg-primary: var(--color-background);
    --bg-secondary: var(--color-primary);
    --dark-bg: var(--color-background);
    --dark-card: var(--color-primary);
    --dark-border: rgba(var(--color-text-rgb), 0.15);
    --text-primary: var(--color-text);
    --text-secondary: var(--color-text);
    --text-muted: var(--color-text);
}