/*
Theme Name: FAL Collection
Theme URI: https://fal-collection.com
Author: FAL Collection
Description: Thème luxe élégant pour boutique e-commerce FAL Collection — Sacs, Cosmétiques, Abayas, Bijoux, Parfums.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 8.0
Tested PHP: 8.5
License: GNU General Public License v2 or later
Text Domain: fal
Tags: e-commerce, luxury, fashion, woocommerce, custom-colors
*/

:root {
  --gold: #B8903C;
  --gold-light: #C9A84C;
  --gold-pale: #f5e9c8;
  --text-dark: #2C2416;
  --text-muted: #9a9082;
  --bg: #FDFCF9;
  --bg2: #F7F4EF;
  --bg3: #EFECE6;
  --white: #ffffff;
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: var(--bg); color: var(--text-dark); font-family: 'Montserrat', sans-serif; font-weight: 300; overflow-x: hidden; }

a { color: var(--gold); text-decoration: none; transition: color 0.3s; }
a:hover { color: var(--gold-light); }
img { max-width: 100%; height: auto; display: block; }

/* TYPOGRAPHY */
h1,h2,h3,h4,h5,h6 { font-family: 'Cormorant Garamond', serif; font-weight: 300; color: var(--text-dark); line-height: 1.2; }
p { line-height: 1.8; color: rgba(44,36,22,0.7); }

/* CONTAINER */
.container { max-width: 1280px; margin: 0 auto; padding: 0 40px; }
@media (max-width: 768px) { .container { padding: 0 20px; } }

/* BUTTONS */
.btn-gold { display: inline-block; background: var(--gold); color: #fff; padding: 14px 36px; font-size: 10px; letter-spacing: 3px; text-transform: uppercase; font-family: 'Montserrat', sans-serif; font-weight: 500; border: none; cursor: pointer; transition: background 0.3s, transform 0.2s; }
.btn-gold:hover { background: var(--gold-light); color: #fff; transform: translateY(-2px); }
.btn-outline { display: inline-block; color: var(--text-dark); padding: 14px 36px; font-size: 10px; letter-spacing: 3px; text-transform: uppercase; font-family: 'Montserrat', sans-serif; font-weight: 400; border: 1px solid rgba(44,36,22,0.2); cursor: pointer; transition: border-color 0.3s, color 0.3s; background: transparent; }
.btn-outline:hover { border-color: var(--gold); color: var(--gold); }

/* SECTION TITLES */
.section-eyebrow { font-size: 10px; letter-spacing: 5px; text-transform: uppercase; color: var(--gold); margin-bottom: 12px; display: block; }
.section-title { font-family: 'Cormorant Garamond', serif; font-size: clamp(28px, 4vw, 48px); font-weight: 300; }
.section-title em { font-style: italic; color: var(--gold); }
.section-rule { width: 60px; height: 1px; background: var(--gold); margin: 20px auto 0; }
.section-header { text-align: center; margin-bottom: 56px; }

/* NAVBAR */
.site-header { position: sticky; top: 0; z-index: 500; background: rgba(253,252,249,0.96); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(184,144,60,0.14); }
.header-inner { display: flex; align-items: center; justify-content: space-between; padding: 20px 60px; }
.site-logo { font-family: 'Cormorant Garamond', serif; font-size: 22px; font-weight: 300; letter-spacing: 4px; color: var(--gold); text-transform: uppercase; text-decoration: none; }
.site-logo span { font-style: italic; color: var(--text-dark); }
.main-nav ul { display: flex; gap: 32px; list-style: none; }
.main-nav a { color: var(--text-dark); font-size: 10px; letter-spacing: 3px; text-transform: uppercase; font-weight: 400; position: relative; padding-bottom: 4px; transition: color 0.3s; }
.main-nav a::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 1px; background: var(--gold); transition: width 0.3s; }
.main-nav a:hover, .main-nav .current-menu-item a { color: var(--gold); }
.main-nav a:hover::after, .main-nav .current-menu-item a::after { width: 100%; }
.header-actions { display: flex; gap: 18px; align-items: center; }
.header-actions a { color: var(--text-dark); font-size: 10px; letter-spacing: 2px; text-transform: uppercase; display: flex; align-items: center; gap: 6px; transition: color 0.3s; }
.header-actions a:hover { color: var(--gold); }
.cart-count { background: var(--gold); color: #fff; font-size: 8px; width: 16px; height: 16px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; }
.menu-toggle { display: none; background: none; border: none; cursor: pointer; padding: 4px; }
.menu-toggle span { display: block; width: 22px; height: 1px; background: var(--text-dark); margin: 5px 0; transition: all 0.3s; }

/* HERO */
.hero { min-height: 90vh; display: flex; align-items: center; background: linear-gradient(135deg, #FDFCF9 0%, #F5EDD8 45%, #FDFCF9 100%); position: relative; overflow: hidden; }
.hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 70% at 70% 50%, rgba(184,144,60,0.09) 0%, transparent 70%); }
.hero-content { position: relative; z-index: 2; max-width: 600px; padding: 80px 60px; }
.hero-eyebrow { font-size: 10px; letter-spacing: 5px; text-transform: uppercase; color: var(--gold); margin-bottom: 20px; display: flex; align-items: center; gap: 14px; }
.hero-eyebrow::before { content: ''; width: 36px; height: 1px; background: var(--gold); }
.hero-title { font-family: 'Cormorant Garamond', serif; font-size: clamp(48px, 7vw, 88px); font-weight: 300; line-height: 1.05; margin-bottom: 6px; }
.hero-title em { font-style: italic; color: var(--gold); display: block; }
.hero-sub { font-size: 11px; letter-spacing: 4px; text-transform: uppercase; color: var(--text-muted); margin-bottom: 24px; }
.hero-desc { font-size: 13px; line-height: 1.9; color: rgba(44,36,22,0.6); margin-bottom: 40px; max-width: 420px; }
.hero-ctas { display: flex; gap: 16px; flex-wrap: wrap; }
.hero-image-side { position: absolute; right: 0; top: 0; bottom: 0; width: 42%; background: linear-gradient(135deg, #F0E4C8 0%, #E4D4A8 50%, #ECD8B8 100%); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.hero-image-side img { width: 100%; height: 100%; object-fit: cover; }
.hero-image-side .hero-decor { font-family: 'Cormorant Garamond', serif; font-size: 200px; font-weight: 300; color: rgba(184,144,60,0.06); pointer-events: none; }

/* MARQUEE */
.marquee-bar { padding: 16px 0; background: var(--gold); overflow: hidden; }
.marquee-track { display: flex; animation: marquee 22s linear infinite; white-space: nowrap; }
.marquee-item { display: inline-flex; align-items: center; gap: 18px; padding: 0 28px; font-size: 10px; letter-spacing: 4px; text-transform: uppercase; color: #fff; font-weight: 500; }
.marquee-dot { width: 4px; height: 4px; background: rgba(255,255,255,0.5); border-radius: 50%; }
@keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* CATEGORIES GRID */
.categories-section { padding: 80px 60px; background: var(--bg); }
.cat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; }
.cat-card { position: relative; aspect-ratio: 4/3; overflow: hidden; cursor: pointer; text-decoration: none; display: block; }
.cat-card:first-child { grid-column: span 2; aspect-ratio: auto; min-height: 320px; }
.cat-img { position: absolute; inset: 0; transition: transform 0.7s ease; background-size: cover; background-position: center; }
.cat-card:hover .cat-img { transform: scale(1.05); }
.cat-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(28,20,8,0.65) 0%, transparent 65%); }
.cat-content { position: absolute; bottom: 0; left: 0; right: 0; padding: 28px 22px; }
.cat-title { font-family: 'Cormorant Garamond', serif; font-size: 22px; font-weight: 300; color: #fff; margin-bottom: 5px; }
.cat-count { font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: var(--gold-pale); }
.cat-arrow { position: absolute; top: 20px; right: 20px; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,0.35); display: flex; align-items: center; justify-content: center; opacity: 0; transform: translateY(-6px); transition: opacity 0.3s, transform 0.3s; color: #fff; font-size: 16px; }
.cat-card:hover .cat-arrow { opacity: 1; transform: translateY(0); }

/* PRODUCTS */
.products-section { padding: 80px 60px; background: var(--bg2); }
.currency-bar { display: flex; justify-content: flex-end; align-items: center; gap: 12px; padding: 12px 60px; background: var(--bg3); border-bottom: 1px solid rgba(184,144,60,0.1); }
.currency-label { font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: var(--text-muted); }
.currency-btns { display: flex; gap: 4px; }
.currency-btn { padding: 5px 14px; font-size: 10px; letter-spacing: 2px; font-family: 'Montserrat', sans-serif; border: 1px solid rgba(44,36,22,0.14); background: transparent; color: var(--text-muted); cursor: pointer; transition: all 0.25s; }
.currency-btn.active, .currency-btn:hover { border-color: var(--gold); color: var(--gold); background: rgba(184,144,60,0.07); }
.products-filter { display: flex; gap: 4px; justify-content: center; margin-bottom: 48px; flex-wrap: wrap; }
.filter-btn { padding: 9px 22px; font-size: 10px; letter-spacing: 3px; text-transform: uppercase; border: 1px solid rgba(44,36,22,0.14); background: transparent; color: var(--text-muted); cursor: pointer; transition: all 0.3s; font-family: 'Montserrat', sans-serif; }
.filter-btn.active, .filter-btn:hover { border-color: var(--gold); color: var(--gold); background: rgba(184,144,60,0.06); }
.products-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.product-card { cursor: pointer; }
.product-img-wrap { aspect-ratio: 3/4; position: relative; overflow: hidden; background: var(--bg3); margin-bottom: 14px; }
.product-img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.product-card:hover .product-img-wrap img { transform: scale(1.04); }
.product-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 64px; opacity: 0.4; transition: opacity 0.4s; }
.product-card:hover .product-placeholder { opacity: 0.6; }
.p-badge { position: absolute; top: 14px; left: 14px; background: var(--gold); color: #fff; font-size: 8px; letter-spacing: 2px; text-transform: uppercase; padding: 5px 10px; font-weight: 600; z-index: 2; }
.p-badge.new { background: var(--text-dark); }
.p-badge.sale { background: #c94c4c; }
.p-actions { position: absolute; bottom: 14px; left: 0; right: 0; display: flex; justify-content: center; gap: 8px; opacity: 0; transform: translateY(8px); transition: opacity 0.3s, transform 0.3s; z-index: 2; }
.product-card:hover .p-actions { opacity: 1; transform: translateY(0); }
.p-action-btn { width: 38px; height: 38px; background: rgba(253,252,249,0.95); border: 1px solid rgba(184,144,60,0.3); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background 0.2s; font-size: 14px; color: var(--text-dark); text-decoration: none; }
.p-action-btn:hover { background: var(--gold); color: #fff; }
.p-action-cart { padding: 0 18px; width: auto; font-size: 9px; letter-spacing: 2px; text-transform: uppercase; font-family: 'Montserrat', sans-serif; white-space: nowrap; }
.product-name { font-family: 'Cormorant Garamond', serif; font-size: 18px; font-weight: 300; margin-bottom: 4px; color: var(--text-dark); }
.product-sub { font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: var(--text-muted); margin-bottom: 8px; }
.product-price { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.price-main { font-family: 'Cormorant Garamond', serif; font-size: 20px; color: var(--gold); font-weight: 400; }
.price-old { font-size: 13px; color: var(--text-muted); text-decoration: line-through; }
.price-alts { display: flex; gap: 6px; margin-top: 4px; flex-wrap: wrap; }
.price-alt { font-size: 10px; color: var(--text-muted); background: var(--bg3); padding: 2px 7px; border-radius: 2px; }
.product-stars { margin-top: 6px; font-size: 11px; }

/* SINGLE PRODUCT */
.single-product-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; padding: 80px 60px; max-width: 1280px; margin: 0 auto; }
.product-gallery { position: relative; }
.product-gallery-main { aspect-ratio: 4/5; background: var(--bg2); overflow: hidden; margin-bottom: 12px; }
.product-gallery-main img { width: 100%; height: 100%; object-fit: cover; }
.product-gallery-thumbs { display: flex; gap: 8px; }
.product-gallery-thumbs img { width: 80px; height: 80px; object-fit: cover; cursor: pointer; opacity: 0.6; transition: opacity 0.3s; border: 1px solid transparent; }
.product-gallery-thumbs img.active, .product-gallery-thumbs img:hover { opacity: 1; border-color: var(--gold); }
.product-info-wrap { padding-top: 20px; }
.product-info-wrap .product-name { font-size: 38px; margin-bottom: 10px; }
.product-info-wrap .product-sub { margin-bottom: 20px; }
.product-info-wrap .product-price { margin-bottom: 28px; }
.product-info-wrap .price-main { font-size: 28px; }
.product-description { font-size: 13px; line-height: 1.9; color: rgba(44,36,22,0.65); margin-bottom: 32px; }
.product-meta { margin-bottom: 32px; }
.product-meta-item { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; font-size: 12px; }
.product-meta-label { font-weight: 500; text-transform: uppercase; letter-spacing: 2px; font-size: 10px; color: var(--text-muted); min-width: 80px; }
.quantity-wrap { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; }
.quantity-input { display: flex; align-items: center; border: 1px solid rgba(44,36,22,0.14); }
.quantity-input button { width: 36px; height: 36px; background: none; border: none; cursor: pointer; font-size: 16px; color: var(--text-dark); transition: color 0.3s; }
.quantity-input button:hover { color: var(--gold); }
.quantity-input input { width: 48px; height: 36px; text-align: center; border: none; border-left: 1px solid rgba(44,36,22,0.14); border-right: 1px solid rgba(44,36,22,0.14); font-family: 'Montserrat', sans-serif; font-size: 13px; }
.add-to-cart-btn { flex: 1; }

/* PROMO BANNER */
.promo-banner { padding: 80px 60px; background: linear-gradient(135deg, #F5EDD8, #EDE0C0, #F2E8D0); position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.promo-banner::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 50% 100% at 30% 50%, rgba(184,144,60,0.12) 0%, transparent 70%); pointer-events: none; }
.promo-left { position: relative; z-index: 1; max-width: 500px; }
.promo-tag { display: inline-block; font-size: 9px; letter-spacing: 4px; text-transform: uppercase; color: #fff; background: var(--gold); padding: 5px 14px; margin-bottom: 20px; font-weight: 500; }
.promo-title { font-family: 'Cormorant Garamond', serif; font-size: clamp(32px, 4vw, 52px); font-weight: 300; margin-bottom: 16px; color: var(--text-dark); }
.promo-title strong { font-weight: 600; color: var(--gold); display: block; }
.promo-text { font-size: 13px; color: rgba(44,36,22,0.6); line-height: 1.8; margin-bottom: 28px; }
.promo-stats { position: relative; z-index: 1; display: flex; gap: 14px; flex-shrink: 0; }
.promo-stat { text-align: center; padding: 24px 20px; border: 1px solid rgba(184,144,60,0.22); background: rgba(255,255,255,0.65); min-width: 110px; }
.promo-num { font-family: 'Cormorant Garamond', serif; font-size: 44px; font-weight: 300; color: var(--gold); display: block; line-height: 1; }
.promo-label { font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: var(--text-muted); margin-top: 6px; display: block; }

/* TESTIMONIALS */
.testi-section { padding: 80px 60px; background: var(--bg); }
.testi-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.testi-card { padding: 36px 28px; background: var(--bg2); border: 1px solid rgba(184,144,60,0.1); transition: border-color 0.3s, box-shadow 0.3s; }
.testi-card:hover { border-color: rgba(184,144,60,0.3); box-shadow: 0 8px 32px rgba(184,144,60,0.07); }
.testi-quote { font-family: 'Cormorant Garamond', serif; font-size: 56px; color: rgba(184,144,60,0.2); line-height: 0.6; margin-bottom: 14px; }
.testi-text { font-family: 'Cormorant Garamond', serif; font-size: 16px; font-style: italic; color: rgba(44,36,22,0.8); line-height: 1.7; margin-bottom: 24px; }
.testi-author { display: flex; align-items: center; gap: 12px; }
.testi-avatar { width: 42px; height: 42px; border-radius: 50%; background: linear-gradient(135deg,#EDE0C4,#D4C4A0); border: 1px solid rgba(184,144,60,0.3); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.testi-avatar img { width: 100%; height: 100%; object-fit: cover; }
.testi-name { font-size: 12px; font-weight: 500; color: var(--text-dark); }
.testi-loc { font-size: 9px; letter-spacing: 2px; text-transform: uppercase; color: var(--text-muted); }

/* NEWSLETTER */
.newsletter-section { padding: 70px 60px; background: var(--gold); text-align: center; }
.newsletter-title { font-family: 'Cormorant Garamond', serif; font-size: 38px; font-weight: 300; color: #fff; margin-bottom: 10px; }
.newsletter-sub { font-size: 12px; color: rgba(255,255,255,0.7); margin-bottom: 32px; letter-spacing: 1px; }
.newsletter-form { display: flex; justify-content: center; max-width: 460px; margin: 0 auto; }
.newsletter-form input { flex: 1; padding: 14px 20px; background: rgba(255,255,255,0.2); border: 1px solid rgba(255,255,255,0.35); border-right: none; color: #fff; font-family: 'Montserrat', sans-serif; font-size: 12px; outline: none; }
.newsletter-form input::placeholder { color: rgba(255,255,255,0.5); }
.newsletter-form button { padding: 14px 28px; background: #fff; color: var(--gold); border: none; cursor: pointer; font-size: 10px; letter-spacing: 3px; text-transform: uppercase; font-family: 'Montserrat', sans-serif; font-weight: 500; transition: background 0.3s; }
.newsletter-form button:hover { background: var(--bg2); }

/* FOOTER */
.site-footer { padding: 70px 60px 36px; background: var(--text-dark); }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 50px; margin-bottom: 50px; }
.footer-logo { font-family: 'Cormorant Garamond', serif; font-size: 26px; font-weight: 300; color: var(--gold-light); letter-spacing: 4px; text-transform: uppercase; margin-bottom: 14px; }
.footer-about { font-size: 12px; color: rgba(253,252,249,0.45); line-height: 1.8; max-width: 260px; margin-bottom: 24px; }
.footer-social { display: flex; gap: 10px; }
.social-link { width: 34px; height: 34px; border: 1px solid rgba(184,144,60,0.22); display: flex; align-items: center; justify-content: center; color: rgba(253,252,249,0.45); font-size: 12px; text-decoration: none; transition: all 0.3s; }
.social-link:hover { border-color: var(--gold); color: var(--gold); }
.footer-col-title { font-size: 10px; letter-spacing: 4px; text-transform: uppercase; color: var(--gold); margin-bottom: 20px; font-weight: 500; }
.footer-links { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-links a { color: rgba(253,252,249,0.45); font-size: 12px; text-decoration: none; transition: color 0.3s; }
.footer-links a:hover { color: rgba(253,252,249,0.9); }
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.07); padding-top: 26px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.footer-copy { font-size: 10px; color: rgba(253,252,249,0.35); letter-spacing: 1px; }
.footer-payments { display: flex; gap: 8px; }
.payment-badge { padding: 3px 9px; border: 1px solid rgba(255,255,255,0.1); font-size: 9px; color: rgba(253,252,249,0.35); letter-spacing: 1px; }

/* SHOP PAGE */
.shop-page { padding: 60px; }
.shop-header { margin-bottom: 40px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; }
.shop-title { font-family: 'Cormorant Garamond', serif; font-size: 36px; font-weight: 300; }
.shop-sort select { padding: 8px 16px; border: 1px solid rgba(44,36,22,0.14); background: transparent; font-family: 'Montserrat', sans-serif; font-size: 11px; color: var(--text-dark); outline: none; cursor: pointer; }
.shop-layout { display: grid; grid-template-columns: 240px 1fr; gap: 40px; }
.shop-sidebar { }
.sidebar-widget { margin-bottom: 36px; }
.sidebar-title { font-size: 10px; letter-spacing: 4px; text-transform: uppercase; color: var(--gold); margin-bottom: 16px; padding-bottom: 10px; border-bottom: 1px solid rgba(184,144,60,0.15); }
.sidebar-cats { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.sidebar-cats a { color: var(--text-dark); font-size: 12px; display: flex; justify-content: space-between; transition: color 0.3s; padding: 4px 0; }
.sidebar-cats a:hover { color: var(--gold); }
.sidebar-cats .count { color: var(--text-muted); font-size: 11px; }
.price-filter { display: flex; flex-direction: column; gap: 10px; }
.price-range { width: 100%; accent-color: var(--gold); }
.price-range-display { font-size: 12px; color: var(--text-muted); }

/* BREADCRUMBS */
.breadcrumbs { padding: 16px 60px; background: var(--bg2); border-bottom: 1px solid rgba(184,144,60,0.08); font-size: 11px; color: var(--text-muted); }
.breadcrumbs a { color: var(--text-muted); transition: color 0.3s; }
.breadcrumbs a:hover { color: var(--gold); }
.breadcrumbs .sep { margin: 0 8px; }

/* CART */
.cart-page { padding: 60px; max-width: 1000px; margin: 0 auto; }
.cart-table { width: 100%; border-collapse: collapse; margin-bottom: 40px; }
.cart-table th { font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: var(--gold); padding: 12px 16px; text-align: left; border-bottom: 1px solid rgba(184,144,60,0.15); }
.cart-table td { padding: 16px; border-bottom: 1px solid rgba(184,144,60,0.08); vertical-align: middle; font-size: 13px; }
.cart-product-img { width: 64px; height: 64px; object-fit: cover; }
.cart-totals { background: var(--bg2); padding: 28px; border: 1px solid rgba(184,144,60,0.12); }
.cart-totals h3 { font-size: 14px; letter-spacing: 3px; text-transform: uppercase; color: var(--gold); margin-bottom: 20px; }
.cart-total-row { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid rgba(184,144,60,0.08); font-size: 13px; }
.cart-total-row.total { font-size: 16px; font-weight: 500; border-bottom: none; padding-top: 16px; }

/* CHECKOUT */
.checkout-page { padding: 60px; display: grid; grid-template-columns: 1fr 400px; gap: 48px; max-width: 1100px; margin: 0 auto; }
.form-group { margin-bottom: 20px; }
.form-group label { display: block; font-size: 10px; letter-spacing: 3px; text-transform: uppercase; color: var(--text-muted); margin-bottom: 8px; }
.form-group input, .form-group select, .form-group textarea { width: 100%; padding: 12px 16px; border: 1px solid rgba(44,36,22,0.14); background: var(--bg); font-family: 'Montserrat', sans-serif; font-size: 13px; color: var(--text-dark); outline: none; transition: border-color 0.3s; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color: var(--gold); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

/* ACCOUNT */
.account-page { padding: 60px; display: grid; grid-template-columns: 220px 1fr; gap: 48px; max-width: 1100px; margin: 0 auto; }
.account-menu { list-style: none; display: flex; flex-direction: column; gap: 4px; }
.account-menu a { display: block; padding: 10px 16px; font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: var(--text-muted); transition: all 0.3s; border-left: 2px solid transparent; }
.account-menu a:hover, .account-menu a.active { color: var(--gold); border-left-color: var(--gold); background: rgba(184,144,60,0.05); }

/* DIALOGUE / CHAT */
.chat-bubble { position: fixed; bottom: 28px; right: 28px; z-index: 9000; }
.chat-toggle { width: 56px; height: 56px; border-radius: 50%; background: var(--gold); border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 22px; color: #fff; box-shadow: 0 4px 20px rgba(184,144,60,0.4); transition: transform 0.3s, background 0.3s; }
.chat-toggle:hover { background: var(--gold-light); transform: scale(1.08); }
.chat-window { position: absolute; bottom: 70px; right: 0; width: 320px; background: #fff; border: 1px solid rgba(184,144,60,0.18); box-shadow: 0 12px 48px rgba(44,36,22,0.15); display: none; flex-direction: column; overflow: hidden; }
.chat-window.open { display: flex; }
.chat-header { padding: 16px 20px; background: var(--gold); color: #fff; display: flex; justify-content: space-between; align-items: center; }
.chat-header-title { font-family: 'Cormorant Garamond', serif; font-size: 16px; font-weight: 300; letter-spacing: 2px; }
.chat-header-sub { font-size: 10px; opacity: 0.8; }
.chat-close { background: none; border: none; color: #fff; cursor: pointer; font-size: 18px; }
.chat-messages { flex: 1; padding: 16px; max-height: 280px; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; }
.chat-msg { max-width: 80%; font-size: 12px; line-height: 1.6; padding: 10px 14px; border-radius: 2px; }
.chat-msg.bot { background: var(--bg2); color: var(--text-dark); align-self: flex-start; }
.chat-msg.user { background: var(--gold); color: #fff; align-self: flex-end; }
.chat-input-wrap { padding: 12px 16px; border-top: 1px solid rgba(184,144,60,0.12); display: flex; gap: 8px; }
.chat-input { flex: 1; padding: 8px 12px; border: 1px solid rgba(44,36,22,0.14); font-family: 'Montserrat', sans-serif; font-size: 12px; outline: none; }
.chat-input:focus { border-color: var(--gold); }
.chat-send { padding: 8px 14px; background: var(--gold); color: #fff; border: none; cursor: pointer; font-size: 16px; transition: background 0.3s; }
.chat-send:hover { background: var(--gold-light); }

/* RESPONSIVE */
@media (max-width: 1024px) {
  .header-inner { padding: 16px 30px; }
  .main-nav { display: none; }
  .menu-toggle { display: block; }
  .hero-content { padding: 60px 30px 30px; }
  /* Hero image visible sur mobile : empilée sous le texte */
  .hero { flex-direction: column; min-height: auto; }
  .hero-image-side { position: static; width: 100%; height: 300px; order: 2; }
  .hero-image-side img { width: 100%; height: 100%; object-fit: cover; }
  .categories-section, .products-section, .promo-banner, .testi-section, .newsletter-section { padding-left: 30px; padding-right: 30px; }
  .cat-grid { grid-template-columns: repeat(2, 1fr); }
  .cat-card:first-child { grid-column: span 1; }
  .products-grid { grid-template-columns: repeat(2, 1fr); }
  .testi-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px; }
  .promo-banner { flex-direction: column; }
  .shop-layout { grid-template-columns: 1fr; }
  .single-product-layout { grid-template-columns: 1fr; gap: 36px; padding: 40px 30px; }
  .checkout-page { grid-template-columns: 1fr; }
  .account-page { grid-template-columns: 1fr; }
  .currency-bar { padding: 10px 30px; }
}
@media (max-width: 600px) {
  .products-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .footer-grid { grid-template-columns: 1fr; }
  .cart-page, .shop-page { padding: 30px 20px; }
}

/* PAGINATION (gros catalogues) */
.woocommerce-pagination ul, .page-numbers { list-style: none; display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; padding: 0; }
.woocommerce-pagination .page-numbers li { margin: 0; }
.page-numbers a, .page-numbers span.current, span.page-numbers.dots { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 12px; border: 1px solid rgba(44,36,22,0.14); font-size: 12px; font-family: 'Montserrat', sans-serif; color: var(--text-dark); text-decoration: none; transition: all 0.25s; }
.page-numbers a:hover { border-color: var(--gold); color: var(--gold); }
.page-numbers span.current { background: var(--gold); border-color: var(--gold); color: #fff; }

/* Grille produits : hauteur d'image fixe pour un rendu uniforme avec des centaines de photos différentes */
.product-img-wrap img { aspect-ratio: 3/4; object-fit: cover; }

/* ── RESPONSIVE IMAGES : adaptation à tous les téléphones ── */
.product-img-wrap img, .product-gallery-main img, .cat-img { max-width: 100%; height: auto; }
.product-gallery-main img { width: 100%; height: 100%; object-fit: cover; }

/* Petits téléphones (iPhone SE, etc.) */
@media (max-width: 400px) {
  .products-grid { grid-template-columns: 1fr; gap: 20px; }
  .product-img-wrap { aspect-ratio: 1/1; }
  .cat-grid { grid-template-columns: 1fr; }
  .cat-card:first-child { grid-column: span 1; }
  .cat-card { aspect-ratio: 16/10; }
  .single-product-layout { padding: 24px 16px; }
  .product-gallery-thumbs img { width: 64px; height: 64px; }
}

/* Téléphones standards (400–600px) */
@media (min-width: 401px) and (max-width: 600px) {
  .products-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .cat-grid { grid-template-columns: repeat(2, 1fr); }
  .cat-card:first-child { grid-column: span 2; }
}

/* Écrans très larges : limite la taille pour garder la netteté */
@media (min-width: 1600px) {
  .products-grid { max-width: 1400px; margin: 0 auto; }
}

/* ── FORMULAIRES WOOCOMMERCE : Mon compte, Connexion, Inscription, Checkout ── */
.woocommerce form.login, .woocommerce form.register,
.woocommerce-form-login, .woocommerce-form-register {
  max-width: 460px; padding: 32px; border: 1px solid rgba(184,144,60,0.2) !important;
  border-radius: 0 !important; background: #FDFCF9;
}
.woocommerce form .form-row { display: block; margin-bottom: 18px; }
.woocommerce form .form-row label {
  display: block; font-size: 10px; letter-spacing: 3px; text-transform: uppercase;
  color: #9a9082; margin-bottom: 8px; float: none; width: 100%;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row input[type="email"],
.woocommerce form .form-row input[type="password"],
.woocommerce form .form-row input[type="text"],
.woocommerce form .form-row input[type="tel"],
.woocommerce form .form-row select, .woocommerce form .form-row textarea {
  width: 100%; padding: 13px 16px; border: 1px solid rgba(44,36,22,0.16);
  background: #fff; font-family: 'Montserrat', sans-serif; font-size: 13px;
  color: #2C2416; outline: none; border-radius: 0; box-sizing: border-box;
}
.woocommerce form .form-row input:focus { border-color: #B8903C; }
.woocommerce form .form-row .show-password-input { top: 12px; }
.woocommerce button.button, .woocommerce a.button,
.woocommerce-page button.button, .woocommerce input.button,
button[name="login"], button[name="register"] {
  background: #B8903C !important; color: #fff !important;
  padding: 14px 34px !important; font-size: 10px !important;
  letter-spacing: 3px !important; text-transform: uppercase !important;
  font-family: 'Montserrat', sans-serif !important; font-weight: 500 !important;
  border: none !important; border-radius: 0 !important; cursor: pointer;
  transition: background 0.3s;
}
.woocommerce button.button:hover, .woocommerce a.button:hover { background: #C9A84C !important; }
.woocommerce-form__label-for-checkbox { display: flex !important; align-items: center; gap: 8px; font-size: 12px !important; text-transform: none !important; letter-spacing: 0 !important; }
.woocommerce .lost_password { margin-top: 14px; font-size: 12px; }
.woocommerce .lost_password a { color: #B8903C; }

/* Mon compte : navigation latérale */
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.woocommerce-MyAccount-navigation ul li a {
  display: block; padding: 11px 16px; font-size: 11px; letter-spacing: 2px;
  text-transform: uppercase; color: #9a9082; text-decoration: none;
  border-left: 2px solid transparent; transition: all 0.3s;
}
.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li a:hover {
  color: #B8903C; border-left-color: #B8903C; background: rgba(184,144,60,0.05);
}
.woocommerce-MyAccount-content { font-size: 13px; line-height: 1.8; }

/* Tableau des commandes (suivi) */
.woocommerce-orders-table { width: 100%; border-collapse: collapse; }
.woocommerce-orders-table th {
  font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: #B8903C;
  padding: 12px; text-align: left; border-bottom: 1px solid rgba(184,144,60,0.2);
}
.woocommerce-orders-table td { padding: 14px 12px; border-bottom: 1px solid rgba(184,144,60,0.08); font-size: 13px; }

/* Messages WooCommerce */
.woocommerce-message, .woocommerce-info, .woocommerce-error {
  border-top-color: #B8903C !important; background: #F7F4EF !important;
  color: #2C2416 !important; border-radius: 0;
}
.woocommerce-message::before, .woocommerce-info::before { color: #B8903C !important; }

/* Page Mon compte responsive */
@media (max-width: 768px) {
  .woocommerce-account .woocommerce { display: block; }
  .woocommerce form.login, .woocommerce form.register { padding: 20px; max-width: 100%; }
}
