/*
Theme Name: LuxeNails
Theme URI: https://luxenails.store
Author: LuxeNails Studio
Author URI: https://luxenails.store
Description: LuxeNails is an ultra-luxury, high-conversion Press-On Nails & Beauty Boutique WooCommerce WordPress theme crafted with a dark couture aesthetic, mobile app-like PWA experience, and desktop web-app performance.
Version: 6.3.1
Requires at least: 6.0
Tested up to: 6.7
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: luxenails
Tags: e-commerce, beauty, nails, press-on-nails, cosmetics, luxury, custom-colors, custom-menu, featured-images, full-width-template, translation-ready, woocommerce
*/

/* ==========================================================================
   LuxeNails Haute Couture Design Tokens & CSS Variables
   ========================================================================== */
:root {
  /* Brand Luxury Palette */
  --luxe-gold: #D5AA6D;                   /* Warm Champagne Gold primary */
  --luxe-gold-hover: #C4985B;             /* Deep Rich Gold */
  --luxe-gold-deep: #9C7238;              /* Burnished Bronze Gold */
  --luxe-gold-light: #F4E8D7;             /* Soft Champagne Silk tint */
  --luxe-gold-glow: rgba(213, 170, 109, 0.28);
  --luxe-gold-gradient: linear-gradient(135deg, #E5C396 0%, #D5AA6D 50%, #B8894A 100%);
  --luxe-gold-btn-gradient: linear-gradient(135deg, #DEB887 0%, #C4985B 100%);

  /* Dusty Rose / Blush Pink Accent */
  --luxe-rose: #E5989B;                   /* Dusty Rose accent */
  --luxe-rose-hover: #D47B80;
  --luxe-rose-soft: #F9EBEA;              /* Soft blush tint */
  --luxe-rose-gradient: linear-gradient(135deg, #F2B5B8 0%, #D47B80 100%);

  /* Dark Luxury Elements (Header, Hero & Footer) */
  --luxe-dark: #0C0C0E;                   /* Obsidian header & footer */
  --luxe-dark-surface: #141418;           /* Dark cards & inputs */
  --luxe-dark-card: #18181D;
  --luxe-dark-border: #26262C;
  --luxe-dark-muted: #A1A1AA;

  /* Surfaces & Backgrounds (Clean Warm Cream) */
  --luxe-bg: #FAF8F5;                     /* Warm Alabaster pearl */
  --luxe-cream: #FAF8F5;
  --luxe-surface: #FFFFFF;                /* Crisp white cards */
  --luxe-surface-alt: #F5EFEB;            /* Warm soft stone */
  --luxe-border: #EDE6DE;
  --luxe-border-soft: #F3ECE5;

  /* Typography Colors */
  --luxe-text: #18181B;                   /* Deep Charcoal main text */
  --luxe-text-muted: #6B6865;             /* Warm muted grey */
  --luxe-muted: #6B6865;
  --luxe-text-light: #948F8A;

  /* Typography Stacks */
  --luxe-font-serif: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  --luxe-font-sans: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Elevations & Shadows */
  --luxe-shadow-sm: 0 4px 14px rgba(12, 12, 14, 0.04);
  --luxe-shadow-md: 0 12px 32px rgba(12, 12, 14, 0.08);
  --luxe-shadow-lg: 0 22px 50px rgba(12, 12, 14, 0.14);
  --luxe-shadow-gold: 0 8px 24px rgba(213, 170, 109, 0.35);
  --luxe-shadow-rose: 0 8px 24px rgba(229, 152, 155, 0.35);

  /* Radii */
  --luxe-radius-sm: 8px;
  --luxe-radius-md: 12px;
  --luxe-radius-lg: 18px;
  --luxe-radius-xl: 24px;
  --luxe-radius-pill: 9999px;

  /* Transitions */
  --luxe-transition: 0.3s cubic-bezier(0.16, 1, 0.3, 1);

  /* System Backwards Compatibility (Guarantees ZERO Orange/Legacy Clashes) */
  --nailpro-primary: var(--luxe-gold);
  --nailpro-primary-hover: var(--luxe-gold-hover);
  --nailpro-primary-soft: var(--luxe-gold-light);
  --nailpro-primary-gradient: var(--luxe-gold-gradient);
  --nailpro-btn-gradient: var(--luxe-gold-btn-gradient);
  --nailpro-gold: var(--luxe-gold);
  --nailpro-dark: var(--luxe-dark);
  --nailpro-bg: var(--luxe-bg);
  --nailpro-surface: var(--luxe-surface);
  --nailpro-border: var(--luxe-border);
  --pv-primary: var(--luxe-gold);
  --pv-primary-hover: var(--luxe-gold-hover);
  --pv-primary-light: var(--luxe-gold-light);
  --pv-secondary: var(--luxe-dark);
  --pv-surface: var(--luxe-surface);
  --pv-surface-alt: var(--luxe-surface-alt);
  --pv-border: var(--luxe-border);
  --pv-text: var(--luxe-text);
  --pv-muted: var(--luxe-text-muted);
  --petvixa-primary: var(--luxe-gold);
  --petvixa-primary-hover: var(--luxe-gold-hover);
  --petvixa-secondary: var(--luxe-dark);
  --petvixa-bg: var(--luxe-bg);
  --petvixa-surface: var(--luxe-surface);
  --petvixa-text-main: var(--luxe-text);
  --petvixa-border: var(--luxe-border);
}

/* ==========================================================================
   Base Elements Reset & Luxury Foundation
   ========================================================================== */
*, *::before, *::after {
  box-sizing: border-box;
}

::selection {
  background-color: rgba(213, 170, 109, 0.28);
  color: #0C0C0E;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
  scroll-padding-top: 90px;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  padding: 0;
  font-family: var(--luxe-font-sans);
  font-size: 0.95rem;
  line-height: 1.65;
  color: var(--luxe-text);
  background-color: var(--luxe-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--luxe-font-serif);
  font-weight: 600;
  line-height: 1.22;
  color: var(--luxe-text);
  margin-top: 0;
  letter-spacing: -0.01em;
}

h1 { font-size: clamp(2.2rem, 4.5vw, 3.4rem); }
h2 { font-size: clamp(1.75rem, 3.2vw, 2.5rem); }
h3 { font-size: clamp(1.25rem, 2vw, 1.7rem); }
h4 { font-size: 1.15rem; }

p {
  margin-top: 0;
  margin-bottom: 1rem;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color 0.2s ease;
}

a:hover {
  color: var(--luxe-gold-hover);
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
}

button {
  cursor: pointer;
  border: none;
  background: none;
}

.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}

.luxe-container, .nailpro-container, .pv-container {
  width: 100%;
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}