/*
Theme Name: Luxe Candle
Theme URI: https://example.com/luxe-candle
Author: Your Studio
Author URI: https://example.com
Description: A bold, dark-luxury WooCommerce theme built for candle and home-fragrance e-commerce brands. Black & gold palette, elegant serif/sans pairing, custom product cards, and a ready-to-edit homepage.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.6
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: luxe-candle
Tags: e-commerce, custom-menu, featured-images, translation-ready, one-column, two-columns

This theme, like WordPress, is licensed under the GPL.
*/

/* =========================================================
   0. RESET & BASE
========================================================= */
:root{
  --color-bg:#0b0b0b;
  --color-bg-alt:#141311;
  --color-bg-card:#181713;
  --color-border:#2b2822;
  --color-gold:#c9a227;
  --color-gold-light:#e8cf7a;
  --color-gold-dim:#8a7220;
  --color-cream:#f4efe6;
  --color-text:#ece7dd;
  --color-muted:#9a9488;
  --font-serif:'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-sans:'Jost','Helvetica Neue',Arial,sans-serif;
  --container:1240px;
  --radius:2px;
  --transition:.25s ease;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--color-bg);
  color:var(--color-text);
  font-family:var(--font-sans);
  font-size:16px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--color-gold-light); text-decoration:none; transition:color var(--transition); }
a:hover{ color:var(--color-gold); }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3,h4,h5{
  font-family:var(--font-serif);
  color:var(--color-cream);
  font-weight:600;
  letter-spacing:.01em;
  margin:0 0 .5em;
}
h1{ font-size:clamp(2.2rem,4vw,3.4rem); }
h2{ font-size:clamp(1.8rem,3vw,2.4rem); }
h3{ font-size:1.4rem; }
p{ margin:0 0 1.2em; color:var(--color-text); }
.container{ max-width:var(--container); margin:0 auto; padding:0 24px; }
.eyebrow{
  display:inline-block; font-family:var(--font-sans); letter-spacing:.25em;
  text-transform:uppercase; font-size:.72rem; color:var(--color-gold);
  margin-bottom:14px;
}
.btn{
  display:inline-block; padding:14px 32px; border:1px solid var(--color-gold);
  color:var(--color-gold-light); background:transparent; font-family:var(--font-sans);
  letter-spacing:.12em; text-transform:uppercase; font-size:.78rem; cursor:pointer;
  border-radius:var(--radius); transition:all var(--transition);
}
.btn:hover{ background:var(--color-gold); color:#0b0b0b; }
.btn-solid{ background:var(--color-gold); color:#0b0b0b; }
.btn-solid:hover{ background:var(--color-gold-light); color:#0b0b0b; }
.section{ padding:96px 0; }
.section-tight{ padding:56px 0; }
.section-title{ text-align:center; max-width:640px; margin:0 auto 56px; }
.section-title h2{ margin-bottom:12px; }
.section-title p{ color:var(--color-muted); }
.skip-link{ position:absolute; left:-9999px; }
.skip-link:focus{ left:16px; top:16px; z-index:9999; background:var(--color-gold); color:#0b0b0b; padding:10px 16px; }

/* =========================================================
   1. HEADER / NAV
========================================================= */
.site-header{
  position:sticky; top:0; z-index:500;
  background:rgba(11,11,11,.92); backdrop-filter:blur(6px);
  border-bottom:1px solid var(--color-border);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 0;
}
.site-branding a{ display:flex; align-items:center; gap:12px; }
.site-title{
  font-family:var(--font-serif); font-size:1.6rem; color:var(--color-cream);
  letter-spacing:.03em; margin:0;
}
.site-title span{ color:var(--color-gold); }
.site-logo img{ max-height:48px; width:auto; }

.primary-nav ul{ display:flex; gap:36px; align-items:center; }
.primary-nav a{
  font-size:.82rem; text-transform:uppercase; letter-spacing:.12em; color:var(--color-text);
}
.primary-nav a:hover{ color:var(--color-gold); }
.primary-nav .current-menu-item > a{ color:var(--color-gold); }

.header-actions{ display:flex; align-items:center; gap:22px; }
.header-icon{ position:relative; color:var(--color-cream); font-size:1.1rem; }
.cart-count{
  position:absolute; top:-8px; right:-10px; background:var(--color-gold);
  color:#0b0b0b; font-size:.65rem; font-weight:700; width:18px; height:18px;
  border-radius:50%; display:flex; align-items:center; justify-content:center;
}
.menu-toggle{
  display:none; background:none; border:1px solid var(--color-border); color:var(--color-cream);
  font-size:1.3rem; padding:6px 10px; cursor:pointer;
}

@media (max-width:900px){
  .primary-nav{
    position:fixed; inset:0 0 0 auto; width:78%; max-width:340px; height:100vh;
    background:var(--color-bg-alt); padding:100px 32px; transform:translateX(100%);
    transition:transform var(--transition); z-index:600; border-left:1px solid var(--color-border);
  }
  .primary-nav.is-open{ transform:translateX(0); }
  .primary-nav ul{ flex-direction:column; align-items:flex-start; gap:22px; }
  .menu-toggle{ display:inline-block; }
}

/* =========================================================
   2. HERO
========================================================= */
.hero{
  position:relative; min-height:82vh; display:flex; align-items:center;
  background:linear-gradient(180deg,rgba(11,11,11,.35),rgba(11,11,11,.85)),
    var(--color-bg-alt) center/cover no-repeat;
  border-bottom:1px solid var(--color-border);
  text-align:center;
}
.hero-inner{ max-width:720px; margin:0 auto; padding:0 24px; }
.hero h1{ margin-bottom:20px; }
.hero p{ color:var(--color-muted); font-size:1.05rem; max-width:520px; margin:0 auto 32px; }
.hero-actions{ display:flex; gap:18px; justify-content:center; flex-wrap:wrap; }

/* =========================================================
   3. FEATURED CATEGORIES / COLLECTIONS
========================================================= */
.collections-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:28px;
}
@media (max-width:900px){ .collections-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .collections-grid{ grid-template-columns:1fr; } }
.collection-card{
  position:relative; aspect-ratio:3/4; overflow:hidden; border:1px solid var(--color-border);
  background:var(--color-bg-card);
}
.collection-card img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.collection-card:hover img{ transform:scale(1.06); }
.collection-card .overlay{
  position:absolute; inset:0; display:flex; align-items:flex-end;
  background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.85));
  padding:24px;
}
.collection-card h3{ margin:0; color:var(--color-cream); }
.collection-card span{ color:var(--color-gold); font-size:.75rem; letter-spacing:.15em; text-transform:uppercase; }

/* =========================================================
   4. PRODUCT GRID / CARDS (WooCommerce loop overrides)
========================================================= */
ul.products{
  display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:32px !important;
  list-style:none !important; margin:0 !important; padding:0 !important;
}
@media (max-width:1100px){ ul.products{ grid-template-columns:repeat(3,1fr) !important; } }
@media (max-width:760px){ ul.products{ grid-template-columns:repeat(2,1fr) !important; } }
@media (max-width:480px){ ul.products{ grid-template-columns:1fr !important; } }

.product-card{
  background:var(--color-bg-card); border:1px solid var(--color-border);
  transition:border-color var(--transition), transform var(--transition);
  display:flex; flex-direction:column; height:100%;
}
.product-card:hover{ border-color:var(--color-gold-dim); transform:translateY(-4px); }
.product-card .thumb{ position:relative; overflow:hidden; aspect-ratio:1/1; background:#0f0e0c; }
.product-card .thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.product-card:hover .thumb img{ transform:scale(1.05); }
.product-card .badge{
  position:absolute; top:14px; left:14px; background:var(--color-gold); color:#0b0b0b;
  font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; padding:4px 10px; font-weight:600;
}
.product-card .info{ padding:20px; text-align:center; flex:1; display:flex; flex-direction:column; }
.product-card .cat{ font-size:.68rem; letter-spacing:.15em; text-transform:uppercase; color:var(--color-gold); margin-bottom:6px; }
.product-card h2, .product-card .woocommerce-loop-product__title{
  font-size:1.05rem; margin:0 0 8px; color:var(--color-cream); font-family:var(--font-serif);
}
.product-card .price{ color:var(--color-gold-light); font-family:var(--font-sans); margin-bottom:14px; }
.product-card .price del{ color:var(--color-muted); opacity:.7; margin-right:8px; }
.product-card .add_to_cart_button{
  margin-top:auto; display:inline-block; border:1px solid var(--color-gold); color:var(--color-gold-light);
  padding:10px 18px; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; transition:all var(--transition);
}
.product-card .add_to_cart_button:hover{ background:var(--color-gold); color:#0b0b0b; }
.star-rating{ color:var(--color-gold); font-size:.8rem; margin-bottom:6px; }

/* =========================================================
   5. SINGLE PRODUCT PAGE
========================================================= */
.single-product #primary{ padding:64px 0; }
.woocommerce div.product{ display:grid; grid-template-columns:1fr 1fr; gap:56px; }
@media (max-width:820px){ .woocommerce div.product{ grid-template-columns:1fr; } }
.woocommerce div.product .woocommerce-product-gallery{ background:var(--color-bg-card); border:1px solid var(--color-border); }
.woocommerce div.product .summary{ padding-top:8px; }
.woocommerce div.product .price{ font-family:var(--font-serif); font-size:1.6rem; color:var(--color-gold-light); margin:12px 0 24px; }
.woocommerce div.product .price del{ color:var(--color-muted); font-size:1.1rem; margin-right:12px; }
.woocommerce div.product form.cart{ display:flex; gap:16px; align-items:center; margin:28px 0; }
.woocommerce div.product .quantity input{
  width:64px; padding:12px; background:var(--color-bg-card); border:1px solid var(--color-border);
  color:var(--color-cream); text-align:center;
}
.woocommerce div.product .single_add_to_cart_button{
  background:var(--color-gold); color:#0b0b0b; border:none; padding:14px 34px;
  letter-spacing:.12em; text-transform:uppercase; font-size:.78rem; cursor:pointer; transition:all var(--transition);
}
.woocommerce div.product .single_add_to_cart_button:hover{ background:var(--color-gold-light); }
.woocommerce-tabs{ margin-top:48px; border-top:1px solid var(--color-border); padding-top:32px; }
.woocommerce-tabs ul.tabs{ display:flex; gap:28px; margin-bottom:24px; }
.woocommerce-tabs ul.tabs li a{ text-transform:uppercase; letter-spacing:.1em; font-size:.8rem; color:var(--color-muted); }
.woocommerce-tabs ul.tabs li.active a{ color:var(--color-gold); }
.related.products{ margin-top:80px; border-top:1px solid var(--color-border); padding-top:56px; }
.related.products > h2{ text-align:center; margin-bottom:40px; }

/* =========================================================
   6. CART / CHECKOUT
========================================================= */
.woocommerce table.shop_table{ border:1px solid var(--color-border); border-collapse:collapse; width:100%; }
.woocommerce table.shop_table th{ background:var(--color-bg-card); color:var(--color-gold); text-transform:uppercase; font-size:.75rem; letter-spacing:.1em; padding:16px; }
.woocommerce table.shop_table td{ padding:16px; border-top:1px solid var(--color-border); }
.woocommerce-cart .cart-collaterals{ background:var(--color-bg-card); border:1px solid var(--color-border); padding:28px; margin-top:32px; }
.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button{
  background:var(--color-gold); color:#0b0b0b; border:none; padding:14px 30px;
  letter-spacing:.1em; text-transform:uppercase; font-size:.76rem; border-radius:var(--radius);
}
.woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover{ background:var(--color-gold-light); }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row select, .woocommerce form .form-row textarea{
  background:var(--color-bg-card); border:1px solid var(--color-border); color:var(--color-cream); padding:12px;
}
.woocommerce-checkout #payment{ background:var(--color-bg-card); border:1px solid var(--color-border); padding:24px; }

/* =========================================================
   7. FOOTER
========================================================= */
.site-footer{ background:var(--color-bg-alt); border-top:1px solid var(--color-border); padding:80px 0 0; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px; padding-bottom:60px; }
@media (max-width:900px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .footer-grid{ grid-template-columns:1fr; } }
.footer-grid h4{ color:var(--color-gold); font-family:var(--font-sans); text-transform:uppercase; font-size:.8rem; letter-spacing:.15em; margin-bottom:20px; }
.footer-grid ul li{ margin-bottom:10px; }
.footer-grid ul li a{ color:var(--color-muted); font-size:.92rem; }
.footer-grid ul li a:hover{ color:var(--color-gold); }
.footer-newsletter form{ display:flex; margin-top:16px; border:1px solid var(--color-border); }
.footer-newsletter input[type=email]{
  flex:1; background:transparent; border:none; padding:14px; color:var(--color-cream); font-family:var(--font-sans);
}
.footer-newsletter button{
  background:var(--color-gold); border:none; color:#0b0b0b; padding:0 20px; text-transform:uppercase;
  font-size:.72rem; letter-spacing:.1em; cursor:pointer;
}
.social-icons{ display:flex; gap:16px; margin-top:20px; }
.social-icons a{
  width:36px; height:36px; border:1px solid var(--color-border); display:flex; align-items:center;
  justify-content:center; border-radius:50%; color:var(--color-cream);
}
.social-icons a:hover{ border-color:var(--color-gold); color:var(--color-gold); }
.footer-bottom{
  border-top:1px solid var(--color-border); padding:24px 0; text-align:center;
  font-size:.8rem; color:var(--color-muted);
}
.footer-bottom a{ color:var(--color-muted); }

/* =========================================================
   8. BLOG / PAGES
========================================================= */
.entry-content{ max-width:760px; margin:0 auto; padding:64px 24px; }
.entry-title{ text-align:center; }
.entry-meta{ text-align:center; color:var(--color-muted); font-size:.85rem; margin-bottom:32px; }
.posts-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
@media (max-width:900px){ .posts-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .posts-grid{ grid-template-columns:1fr; } }
.post-card{ background:var(--color-bg-card); border:1px solid var(--color-border); }
.post-card .thumb{ aspect-ratio:16/10; overflow:hidden; }
.post-card .thumb img{ width:100%; height:100%; object-fit:cover; }
.post-card .body{ padding:22px; }
.post-card time{ color:var(--color-gold); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; }

/* =========================================================
   9. UTILITIES
========================================================= */
.text-center{ text-align:center; }
.mt-0{ margin-top:0; } .mb-0{ margin-bottom:0; }
::selection{ background:var(--color-gold); color:#0b0b0b; }