/*
Theme Name: Mellizhai
Theme URI: https://mellizhai.com
Author: Mellizhai Design Studio
Author URI: https://mellizhai.com
Description: Custom WooCommerce theme for Mellizhai — Indian ethnic fashion brand. Royal Blue + White palette, mobile-first, SEO optimized.
Version: 1.2.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mellizhai
Tags: woocommerce, fashion, e-commerce, custom-logo, custom-menu, responsive-layout
WooCommerce: 8.0
*/

/* ===== CSS RESET ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{min-height:100vh;line-height:1.6;-webkit-font-smoothing:antialiased}
img,picture,video,canvas,svg{display:block;max-width:100%}
input,button,textarea,select{font:inherit}
p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}
a{text-decoration:none;color:inherit}
ul,ol{list-style:none}
button{cursor:pointer;border:none;background:none}

/* ===== DESIGN TOKENS ===== */
:root{
  --c-primary:#1a3a8f;
  --c-primary-dark:#0f2461;
  --c-primary-light:#2d5fcf;
  --c-primary-rgb:26,58,143;
  --c-accent:#c9a84c;
  --c-accent-light:#dfc472;
  --c-white:#ffffff;
  --c-bg:#ffffff;
  --c-surface:#f8f9fc;
  --c-surface-alt:#f0f2f8;
  --c-text:#1a1a2e;
  --c-text-secondary:#6b7280;
  --c-text-light:#9ca3af;
  --c-border:#e5e7eb;
  --c-border-light:#f3f4f6;
  --c-success:#059669;
  --c-error:#dc2626;
  --c-warning:#d97706;
  --ff-heading:'Playfair Display',Georgia,serif;
  --ff-body:'Inter',system-ui,-apple-system,sans-serif;
  --fw-normal:400;
  --fw-medium:500;
  --fw-semibold:600;
  --fw-bold:700;
  --fs-xs:.75rem;
  --fs-sm:.875rem;
  --fs-base:1rem;
  --fs-md:1.125rem;
  --fs-lg:1.25rem;
  --fs-xl:1.5rem;
  --fs-2xl:2rem;
  --fs-3xl:2.5rem;
  --fs-4xl:3rem;
  --fs-5xl:3.5rem;
  --lh-tight:1.2;
  --lh-normal:1.6;
  --lh-relaxed:1.8;
  --space-xs:.25rem;
  --space-sm:.5rem;
  --space-md:1rem;
  --space-lg:1.5rem;
  --space-xl:2rem;
  --space-2xl:3rem;
  --space-3xl:4rem;
  --space-4xl:6rem;
  --radius-sm:4px;
  --radius-md:8px;
  --radius-lg:12px;
  --radius-xl:16px;
  --radius-full:50%;
  --shadow-sm:0 1px 2px rgba(0,0,0,.05);
  --shadow-md:0 4px 6px rgba(0,0,0,.07);
  --shadow-lg:0 10px 25px rgba(0,0,0,.1);
  --shadow-xl:0 20px 50px rgba(0,0,0,.12);
  --max-w:1320px;
  --header-h:72px;
  --transition:all .3s ease;
  --transition-fast:all .15s ease;
}

/* ===== TYPOGRAPHY ===== */
body{font-family:var(--ff-body);font-size:var(--fs-base);color:var(--c-text);background:var(--c-bg);font-weight:var(--fw-normal);line-height:var(--lh-normal)}
h1,h2,h3,h4,h5,h6{font-family:var(--ff-heading);font-weight:var(--fw-bold);line-height:var(--lh-tight);color:var(--c-text)}
h1{font-size:var(--fs-3xl)}
h2{font-size:var(--fs-2xl)}
h3{font-size:var(--fs-xl)}
h4{font-size:var(--fs-lg)}
h5{font-size:var(--fs-md)}
h6{font-size:var(--fs-base)}
p{margin-bottom:var(--space-md);color:var(--c-text-secondary)}
.text-accent{color:var(--c-accent)}

@media(min-width:768px){
  h1{font-size:var(--fs-4xl)}
  h2{font-size:var(--fs-3xl)}
  h3{font-size:var(--fs-2xl)}
}
@media(min-width:1200px){
  h1{font-size:var(--fs-5xl)}
}

/* ===== LAYOUT ===== */
.container{width:100%;max-width:var(--max-w);margin:0 auto;padding:0 var(--space-md)}
@media(min-width:768px){.container{padding:0 var(--space-xl)}}
.section{padding:var(--space-xl) 0}
@media(min-width:768px){.section{padding:var(--space-3xl) 0}}
@media(min-width:1024px){.section{padding:var(--space-4xl) 0}}
.grid{display:grid;gap:var(--space-lg)}
.flex{display:flex;align-items:center}
.flex-between{display:flex;align-items:center;justify-content:space-between}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* ===== BUTTONS ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:.875rem 2rem;font-family:var(--ff-body);font-size:var(--fs-sm);font-weight:var(--fw-semibold);letter-spacing:.05em;text-transform:uppercase;border-radius:var(--radius-sm);transition:var(--transition);cursor:pointer;border:2px solid transparent;line-height:1}
.btn-primary{background:var(--c-primary);color:var(--c-white);border-color:var(--c-primary)}
.btn-primary:hover{background:var(--c-primary-dark);border-color:var(--c-primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.btn-outline{background:transparent;color:var(--c-primary);border-color:var(--c-primary)}
.btn-outline:hover{background:var(--c-primary);color:var(--c-white)}
.btn-white{background:var(--c-white);color:var(--c-primary);border-color:var(--c-white)}
.btn-white:hover{background:transparent;color:var(--c-white)}
.btn-sm{padding:.625rem 1.25rem;font-size:var(--fs-xs)}
.btn-lg{padding:1rem 2.5rem;font-size:var(--fs-base)}
.btn-icon{width:44px;height:44px;padding:0;border-radius:var(--radius-full);display:inline-flex;align-items:center;justify-content:center}

/* ===== FORMS ===== */
.form-group{margin-bottom:var(--space-lg)}
.form-label{display:block;font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-text);margin-bottom:var(--space-sm)}
.form-input,.form-textarea,.form-select{width:100%;padding:.75rem 1rem;border:1px solid var(--c-border);border-radius:var(--radius-md);font-size:var(--fs-base);color:var(--c-text);background:var(--c-white);transition:var(--transition-fast)}
.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px rgba(var(--c-primary-rgb),.1)}
.form-textarea{min-height:120px;resize:vertical}