/**
 * ShopMaster Color Themes
 *
 * To switch themes, copy the desired theme's variables
 * and paste them into the :root selector in styles.css
 */

/* ========================================
   THEME 1: Professional Blue (Current/Default)
   ======================================== */
:root {
    /* Primary Brand Colors - Professional Blue */
    --primary-50: #eff6ff;
    --primary-100: #dbeafe;
    --primary-200: #bfdbfe;
    --primary-300: #93c5fd;
    --primary-400: #60a5fa;
    --primary-500: #3b82f6;
    --primary-600: #2563eb;
    --primary-700: #1d4ed8;
    --primary-800: #1e40af;
    --primary-900: #1e3a8a;
}

/* ========================================
   THEME 2: Fresh Teal (Modern SaaS)
   ======================================== */
/* Uncomment to use:
:root {
    --primary-50: #f0fdfa;
    --primary-100: #ccfbf1;
    --primary-200: #99f6e4;
    --primary-300: #5eead4;
    --primary-400: #2dd4bf;
    --primary-500: #14b8a6;
    --primary-600: #0d9488;
    --primary-700: #0f766e;
    --primary-800: #115e59;
    --primary-900: #134e4a;
}
*/

/* ========================================
   THEME 3: Deep Purple (Premium)
   ======================================== */
/* Uncomment to use:
:root {
    --primary-50: #faf5ff;
    --primary-100: #f3e8ff;
    --primary-200: #e9d5ff;
    --primary-300: #d8b4fe;
    --primary-400: #c084fc;
    --primary-500: #a855f7;
    --primary-600: #9333ea;
    --primary-700: #7e22ce;
    --primary-800: #6b21a8;
    --primary-900: #581c87;
}
*/

/* ========================================
   THEME 4: Emerald Green (Growth)
   ======================================== */
/* Uncomment to use:
:root {
    --primary-50: #ecfdf5;
    --primary-100: #d1fae5;
    --primary-200: #a7f3d0;
    --primary-300: #6ee7b7;
    --primary-400: #34d399;
    --primary-500: #10b981;
    --primary-600: #059669;
    --primary-700: #047857;
    --primary-800: #065f46;
    --primary-900: #064e3b;
}
*/

/* ========================================
   THEME 5: Sunset Orange (Energetic)
   ======================================== */
/* Uncomment to use:
:root {
    --primary-50: #fff7ed;
    --primary-100: #ffedd5;
    --primary-200: #fed7aa;
    --primary-300: #fdba74;
    --primary-400: #fb923c;
    --primary-500: #f97316;
    --primary-600: #ea580c;
    --primary-700: #c2410c;
    --primary-800: #9a3412;
    --primary-900: #7c2d12;
}
*/

/* ========================================
   THEME 6: Rose Pink (Friendly)
   ======================================== */
/* Uncomment to use:
:root {
    --primary-50: #fff1f2;
    --primary-100: #ffe4e6;
    --primary-200: #fecdd3;
    --primary-300: #fda4af;
    --primary-400: #fb7185;
    --primary-500: #f43f5e;
    --primary-600: #e11d48;
    --primary-700: #be123c;
    --primary-800: #9f1239;
    --primary-900: #881337;
}
*/

/* ========================================
   USAGE INSTRUCTIONS
   ========================================

   1. Choose your desired theme above
   2. Copy the :root { ... } block
   3. Open styles.css
   4. Replace the Primary Brand Colors section with your chosen theme
   5. Save and refresh your browser

   The rest of the color system (neutrals, success, warning, error)
   remains the same across all themes for consistency.
*/