/*
Theme Name: Choice Plus Spices
Theme URI: https://choiceplusspices.com
Author: Antigravity
Description: A premium WordPress theme for Choice Plus - Zayka To Your Food. Featuring authentic Indian spices with modern e-commerce design.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: choice-plus
*/

/* Font Imports */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700;800&family=Poppins:wght@300;400;500;600;700&display=swap');

/* CSS Variables */
:root {
    /* Spice Brand Colors */
    --background: 45 30% 98%;
    --foreground: 20 30% 15%;

    --card: 45 40% 97%;
    --card-foreground: 20 30% 15%;

    --popover: 45 40% 97%;
    --popover-foreground: 20 30% 15%;

    /* Saffron/Turmeric Primary */
    --primary: 35 90% 50%;
    --primary-foreground: 0 0% 100%;

    /* Chili Red Secondary */
    --secondary: 10 85% 45%;
    --secondary-foreground: 0 0% 100%;

    /* Earthy Muted */
    --muted: 35 25% 90%;
    --muted-foreground: 20 20% 40%;

    /* Golden Accent */
    --accent: 45 100% 55%;
    --accent-foreground: 20 30% 15%;

    --destructive: 0 84.2% 60.2%;
    --destructive-foreground: 210 40% 98%;

    --border: 35 30% 85%;
    --input: 35 30% 85%;
    --ring: 35 90% 50%;

    --radius: 0.75rem;

    /* Custom Spice Colors */
    --turmeric: 45 95% 55%;
    --saffron: 35 90% 50%;
    --chili: 10 85% 45%;
    --cumin: 30 40% 35%;
    --cardamom: 140 35% 40%;
    --cinnamon: 15 60% 35%;

    /* Gradients */
    --gradient-hero: linear-gradient(135deg, hsl(10 85% 45%) 0%, hsl(35 90% 50%) 50%, hsl(45 95% 55%) 100%);
    --gradient-warm: linear-gradient(180deg, hsl(35 90% 50% / 0.1) 0%, hsl(45 40% 98%) 100%);
    --gradient-spice: linear-gradient(135deg, hsl(10 85% 45% / 0.9) 0%, hsl(35 90% 50% / 0.9) 100%);

    /* Shadows */
    --shadow-warm: 0 10px 40px -10px hsl(35 90% 50% / 0.3);
    --shadow-card: 0 4px 20px -5px hsl(20 30% 15% / 0.1);
    --shadow-hover: 0 20px 50px -15px hsl(35 90% 50% / 0.4);
}

/* Base Styles */
body {
    background-color: hsl(var(--background));
    color: hsl(var(--foreground));
    font-family: 'Poppins', sans-serif;
    margin: 0;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Playfair Display', serif;
}

/* Component Classes that rely on raw CSS if Tailwind utility is missed */
.font-display {
    font-family: 'Playfair Display', serif;
}

.font-sans {
    font-family: 'Poppins', sans-serif;
}

.gradient-hero {
    background: var(--gradient-hero);
}
