/**
 * ============================================================
 * UNIVERSAL THEME ENGINE
 * ============================================================
 * Define design tokens for various themes.
 */

:root {
    /* Default Variables (Corporate) */
    --admin-primary: #6366f1;
    --admin-bg: #f8fafc;
    --admin-bg-alt: #ffffff;
    --admin-sidebar: #1e293b;
    --admin-card-radius: 16px;
    --admin-btn-radius: 12px;
    --admin-text: #1e293b;
    --admin-text-dim: #64748b;
    
    /* Mapping for Storefront compatibility */
    --primary-color: var(--admin-primary);
}

/* ---------------------------------------------------------
 * THEME: STITCH ELECTRONICS (inspired by project #963468944)
 * --------------------------------------------------------- */
:root[data-design-theme="stitch-electronics"],
[data-design-theme="stitch-electronics"] {
    --admin-primary: #4f46e5;
    --admin-bg: #eff6ff;
    --admin-bg-alt: #ffffff;
    --admin-sidebar: #0f172a;
    --admin-card-radius: 36px;
    --admin-btn-radius: 100px; /* Pillow buttons for Stitch */
    --admin-text: #020617;
    --admin-text-dim: #64748b;
    --font-family: 'Outfit', 'Inter', sans-serif;
    
    /* Force Override Primary for Storefront */
    --primary-color: #4f46e5 !important;
}

/* ---------------------------------------------------------
 * GLOBAL OVERRIDES FOR STITCH DESIGN
 * --------------------------------------------------------- */
:root[data-design-theme="stitch-electronics"] body,
[data-design-theme="stitch-electronics"] body {
    background-color: var(--admin-bg) !important;
    font-family: var(--font-family) !important;
}

/* Force rounding on all typically boxed elements */
:root[data-design-theme="stitch-electronics"] .data-card,
:root[data-design-theme="stitch-electronics"] .bg-white,
:root[data-design-theme="stitch-electronics"] .rounded-2xl,
:root[data-design-theme="stitch-electronics"] .rounded-3xl,
:root[data-design-theme="stitch-electronics"] .product-card,
:root[data-design-theme="stitch-electronics"] section > div {
    border-radius: var(--admin-card-radius) !important;
}

:root[data-design-theme="stitch-electronics"] .btn,
:root[data-design-theme="stitch-electronics"] button,
:root[data-design-theme="stitch-electronics"] .rounded-full,
:root[data-design-theme="stitch-electronics"] .rounded-xl {
    border-radius: var(--admin-btn-radius) !important;
}

/* Dark Mode Overrides for Stitch */
html.dark[data-design-theme="stitch-electronics"] {
    --admin-bg: #020617;
    --admin-bg-alt: #0f172a;
    --admin-text: #f8fafc;
    --admin-text-dim: #64748b;
}

html.dark[data-design-theme="stitch-electronics"] .bg-white,
html.dark[data-design-theme="stitch-electronics"] .bg-slate-50,
html.dark[data-design-theme="stitch-electronics"] .bg-slate-900 {
    background-color: var(--admin-bg-alt) !important;
}

/* ---------------------------------------------------------
 * THEME: DARK MODE (Standard Corporate)
 * --------------------------------------------------------- */
html.dark:not([data-design-theme="stitch-electronics"]) {
    --admin-bg: #0f172a;
    --admin-bg-alt: #1e293b;
    --admin-text: #f8fafc;
    --admin-text-dim: #94a3b8;
}

/* Helper Classes */
.theme-card {
    background: var(--admin-bg-alt);
    border-radius: var(--admin-card-radius);
    color: var(--admin-text);
}
.theme-primary-btn {
    background: var(--admin-primary);
    border-radius: var(--admin-btn-radius);
}