/* 
 * ps-theme.css 
 * BindasLook Master Theme Variables
 * -------------------------------------------------------------------------
 * This file contains the master color palette and design tokens based on 
 * the BindasLook Visual Identity Guide.
 * -------------------------------------------------------------------------
 */

:root {
    /* Primary Brand Colors */
    --ps-primary: #4B2138;        /* Deep Plum - Rich, feminine, confident */
    --ps-secondary: #B76E79;      /* Rose Clay - Warm, soft, modern */
    
    /* Background & Surfaces */
    --ps-bg-ivory: #FAF6EF;       /* Warm Ivory - Breathable, premium base */
    --ps-bg-taupe: #D8CEC3;       /* Mist Taupe - Subtle neutral for sections */
    --ps-white: #FFFFFF;
    
    /* Text & Neutrals */
    --ps-text-main: #252326;      /* Charcoal Ink - Clear, readable body text */
    --ps-text-muted: #5A5459;     /* Soft charcoal for secondary info */
    
    /* Accent & Functional */
    --ps-accent-gold: #D99A2B;    /* Marigold Gold - Festive warmth, premium cues */
    --ps-cta-coral: #C94F44;      /* Sindoor Coral - High-energy CTA, energetic */
    --ps-success: #56725D;        /* Mehendi Green - Trust, natural fabric cues */
    --ps-error: #B94A48;          /* Muted red for errors */
    
    /* Shadows & Effects (Luxury Feeling) */
    --ps-shadow-sm: 0 2px 4px rgba(75, 33, 56, 0.05);
    --ps-shadow-md: 0 10px 30px rgba(75, 33, 56, 0.08);
    --ps-shadow-lg: 0 20px 50px rgba(75, 33, 56, 0.12);
    --ps-glass-bg: rgba(250, 246, 239, 0.85);
    
    /* Transitions */
    --ps-transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
    
    /* Border Radius */
    --ps-radius-sm: 4px;
    --ps-radius-md: 8px;
    --ps-radius-lg: 16px;
    --ps-radius-full: 9999px;
}

html {
    max-width: 100vw;
    position: relative;
}

body {
    max-width: 100vw;
    overflow-x: hidden;
    position: relative;
}

/* Global Root Assignments for Tailwind Interop (if needed) */
:root {
    --primary: var(--ps-primary);
    --secondary: var(--ps-secondary);
}

.ps-grad-text {
    background-image: linear-gradient(to right, #ff974f 0, #E91E63 36%, #E91E63 65%, #ff5752 100%);
    font-weight: 600;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 5px;
}

::-webkit-scrollbar-track {
    background: #FAF6EF;
}

::-webkit-scrollbar-thumb {
    background: var(--ps-primary);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--ps-secondary);
}

/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--ps-primary) #FAF6EF;
}