/*
Theme Name: Idéal'aurore Child
Theme URI: https://idealaurore.com
Description: Thème enfant Storefront pour Idéal'aurore — boutique WooCommerce aux tons terracotta, beige et marron chaud.
Author: Aurore Kazadi
Author URI: https://idealaurore.com
Template: storefront
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: idealaurore-child
*/

/* ═══════════════════════════════════════════
   VARIABLES & BASE
═══════════════════════════════════════════ */
:root {
  --white:     #ffffff;
  --ivory:     #faf5ef;
  --cream:     #f2e8dc;
  --beige:     #e6d5c3;
  --beige-dk:  #d4bfa8;
  --terra:     #c0633a;
  --terra-lt:  #d4815e;
  --terra-dk:  #8b3e20;
  --brown:     #6b3a28;
  --text:      #2d1a0f;
  --muted:     #7a5c48;
  --warm-dark: #3d2213;
}

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,700;1,400&family=Raleway:wght@300;400;500;600&display=swap');

body {
  font-family: 'Raleway', sans-serif;
  font-weight: 300;
  color: var(--text);
  background: var(--ivory);
}

/* ═══════════════════════════════════════════
   HEADER
═══════════════════════════════════════════ */
.site-header {
  background: var(--warm-dark) !important;
  padding: 0 !important;
  border-bottom: 3px solid var(--terra) !important;
}

.site-header .col-full {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 40px;
  max-width: 1300px;
  margin: 0 auto;
}

/* Logo */
.site-branding .site-title a,
.site-branding .site-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 1.3rem !important;
  font-weight: 500 !important;
  color: #fff !important;
  text-decoration: none !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-style: italic;
}

.site-branding .site-description {
  font-size: 0.58rem !important;
  letter-spacing: 0.28em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.45) !important;
  margin: 0 !important;
}

/* Nav principale */
.main-navigation ul li a {
  font-family: 'Raleway', sans-serif !important;
  font-size: 0.74rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.85) !important;
  padding: 8px 14px !important;
  transition: color 0.3s !important;
}

.main-navigation ul li a:hover,
.main-navigation ul li.current-menu-item > a {
  color: var(--terra-lt) !important;
}

/* Panier header */
.site-header-cart .cart-contents {
  color: rgba(255,255,255,0.8) !important;
  font-size: 0.74rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
}

.site-header-cart .cart-contents:hover { color: var(--terra-lt) !important; }

.site-header-cart .count {
  background: var(--terra) !important;
  color: #fff !important;
  border-radius: 50% !important;
}

/* ═══════════════════════════════════════════
   BREADCRUMB & PAGE TITLE
═══════════════════════════════════════════ */
.woocommerce-breadcrumb {
  background: var(--cream) !important;
  padding: 14px 40px !important;
  font-size: 0.74rem !important;
  color: var(--muted) !important;
  margin: 0 !important;
  max-width: 100% !important;
}

.woocommerce-breadcrumb a {
  color: var(--muted) !important;
  text-decoration: none !important;
  transition: color 0.3s !important;
}

.woocommerce-breadcrumb a:hover { color: var(--terra) !important; }
.woocommerce-breadcrumb .breadcrumb-separator { color: var(--beige-dk) !important; }

/* Titre de page boutique */
.woocommerce-products-header__title,
.page-title,
h1.entry-title {
  font-family: 'Playfair Display', serif !important;
  font-weight: 400 !important;
  color: var(--text) !important;
  font-size: 2.4rem !important;
}

/* ═══════════════════════════════════════════
   BANNIÈRE BOUTIQUE
═══════════════════════════════════════════ */
.woocommerce-products-header {
  background: linear-gradient(rgba(45,26,15,0.65), rgba(45,26,15,0.65)),
              url('https://images.unsplash.com/photo-1586023492125-27b2c045efd7?w=1600&q=80')
              center/cover no-repeat;
  padding: 80px 40px !important;
  text-align: center !important;
  margin-bottom: 0 !important;
}

.woocommerce-products-header__title {
  color: #fff !important;
  font-size: clamp(2rem, 4vw, 3.5rem) !important;
  font-style: italic;
  margin-bottom: 12px !important;
}

.woocommerce-products-header p {
  color: rgba(255,255,255,0.7) !important;
  font-size: 0.9rem !important;
  max-width: 560px;
  margin: 0 auto !important;
}

/* ═══════════════════════════════════════════
   BARRE OUTILS (tri, résultats)
═══════════════════════════════════════════ */
.woocommerce-notices-wrapper { padding: 0 40px; }

.woocommerce-result-count {
  font-size: 0.78rem !important;
  color: var(--muted) !important;
  letter-spacing: 0.08em !important;
}

.woocommerce-ordering select {
  font-family: 'Raleway', sans-serif !important;
  font-size: 0.78rem !important;
  border: 1px solid var(--beige) !important;
  border-radius: 0 !important;
  padding: 10px 40px 10px 16px !important;
  color: var(--text) !important;
  background: var(--white) !important;
  cursor: pointer !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c0633a' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  transition: border-color 0.3s !important;
}

.woocommerce-ordering select:focus {
  border-color: var(--terra) !important;
  outline: none !important;
}

/* ═══════════════════════════════════════════
   FILTRES CATÉGORIES (widget)
═══════════════════════════════════════════ */
.widget_product_categories,
.widget_layered_nav {
  background: var(--white) !important;
  border: 1px solid var(--beige) !important;
  border-top: 3px solid var(--terra) !important;
  padding: 28px 24px !important;
  margin-bottom: 28px !important;
}

.widget_product_categories .widget-title,
.widget_layered_nav .widget-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 1.1rem !important;
  font-weight: 500 !important;
  color: var(--text) !important;
  margin-bottom: 18px !important;
  padding-bottom: 14px !important;
  border-bottom: 1px solid var(--beige) !important;
}

.widget_product_categories ul li a,
.widget_layered_nav ul li a {
  font-size: 0.84rem !important;
  color: var(--muted) !important;
  text-decoration: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px 0 !important;
  transition: color 0.3s !important;
  border-bottom: 1px solid rgba(230,213,195,0.4) !important;
}

.widget_product_categories ul li a:hover,
.widget_layered_nav ul li a:hover {
  color: var(--terra) !important;
}

.widget_product_categories ul li a::before {
  content: '—';
  color: var(--terra);
  font-size: 0.7rem;
}

.widget_product_categories ul li.current-cat > a {
  color: var(--terra) !important;
  font-weight: 500 !important;
}

/* ═══════════════════════════════════════════
   GRILLE PRODUITS
═══════════════════════════════════════════ */
.woocommerce .products,
.woocommerce-page .products {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 28px !important;
  margin: 0 !important;
  padding: 40px !important;
  list-style: none !important;
}

@media (max-width: 1024px) {
  .woocommerce .products,
  .woocommerce-page .products {
    grid-template-columns: repeat(2, 1fr) !important;
    padding: 20px !important;
    gap: 20px !important;
  }
}

@media (max-width: 600px) {
  .woocommerce .products,
  .woocommerce-page .products {
    grid-template-columns: 1fr !important;
  }
}

/* ═══════════════════════════════════════════
   CARTE PRODUIT
═══════════════════════════════════════════ */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  background: var(--white) !important;
  border: 1px solid var(--beige) !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  position: relative !important;
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s !important;
  display: flex !important;
  flex-direction: column !important;
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 18px 50px rgba(192,99,58,0.13) !important;
  border-color: var(--terra-lt) !important;
}

/* Barre couleur en haut au hover */
.woocommerce ul.products li.product::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--terra);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
  z-index: 2;
}

.woocommerce ul.products li.product:hover::before {
  transform: scaleX(1);
}

/* Image produit */
.woocommerce ul.products li.product a img {
  width: 100% !important;
  height: 260px !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.5s ease !important;
}

.woocommerce ul.products li.product:hover a img {
  transform: scale(1.04) !important;
}

/* Overflow image */
.woocommerce ul.products li.product .woocommerce-loop-product__link {
  overflow: hidden !important;
  display: block !important;
}

/* Contenu texte carte */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2 {
  font-family: 'Playfair Display', serif !important;
  font-size: 1.05rem !important;
  font-weight: 500 !important;
  color: var(--text) !important;
  padding: 20px 22px 6px !important;
  margin: 0 !important;
  line-height: 1.35 !important;
}

/* Prix */
.woocommerce ul.products li.product .price {
  font-family: 'Playfair Display', serif !important;
  font-size: 1rem !important;
  font-style: italic !important;
  color: var(--terra) !important;
  padding: 4px 22px 8px !important;
  display: block !important;
}

.woocommerce ul.products li.product .price del {
  color: var(--beige-dk) !important;
  font-size: 0.85rem !important;
}

.woocommerce ul.products li.product .price ins {
  text-decoration: none !important;
  color: var(--terra) !important;
  font-weight: 600 !important;
}

/* Description courte produit */
.woocommerce ul.products li.product .woocommerce-product-details__short-description,
.woocommerce ul.products li.product p:not(.price):not(.button) {
  font-size: 0.82rem !important;
  color: var(--muted) !important;
  padding: 0 22px 12px !important;
  line-height: 1.65 !important;
  margin: 0 !important;
  flex: 1 !important;
}

/* Badge promo */
.woocommerce span.onsale {
  background: var(--terra) !important;
  color: #fff !important;
  border-radius: 0 !important;
  font-family: 'Raleway', sans-serif !important;
  font-size: 0.65rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  padding: 6px 12px !important;
  top: 14px !important;
  left: 14px !important;
  min-height: auto !important;
  line-height: 1 !important;
}

/* ═══════════════════════════════════════════
   BOUTON AJOUTER AU PANIER
═══════════════════════════════════════════ */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button {
  display: block !important;
  width: calc(100% - 44px) !important;
  margin: 8px 22px 22px !important;
  background: var(--warm-dark) !important;
  color: var(--cream) !important;
  font-family: 'Raleway', sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  padding: 14px 20px !important;
  border: none !important;
  border-radius: 0 !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: background 0.3s, transform 0.2s !important;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product .add_to_cart_button:hover {
  background: var(--terra) !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
}

.woocommerce ul.products li.product .button.added {
  background: var(--terra-dk) !important;
}

/* ═══════════════════════════════════════════
   PAGINATION
═══════════════════════════════════════════ */
.woocommerce nav.woocommerce-pagination {
  text-align: center !important;
  padding: 20px 40px 60px !important;
}

.woocommerce nav.woocommerce-pagination ul {
  display: inline-flex !important;
  gap: 6px !important;
  list-style: none !important;
  border: none !important;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important; height: 40px !important;
  border: 1px solid var(--beige) !important;
  font-family: 'Raleway', sans-serif !important;
  font-size: 0.82rem !important;
  color: var(--muted) !important;
  text-decoration: none !important;
  transition: all 0.3s !important;
}

.woocommerce nav.woocommerce-pagination ul li a:hover {
  border-color: var(--terra) !important;
  color: var(--terra) !important;
  background: var(--cream) !important;
}

.woocommerce nav.woocommerce-pagination ul li span.current {
  background: var(--terra) !important;
  border-color: var(--terra) !important;
  color: #fff !important;
}

/* ═══════════════════════════════════════════
   MESSAGES & NOTIFICATIONS
═══════════════════════════════════════════ */
.woocommerce-message,
.woocommerce-info {
  background: var(--cream) !important;
  border-top: 3px solid var(--terra) !important;
  color: var(--text) !important;
  font-family: 'Raleway', sans-serif !important;
  font-size: 0.88rem !important;
  border-radius: 0 !important;
  padding: 16px 20px !important;
}

.woocommerce-error {
  background: #fdf0ed !important;
  border-top: 3px solid #c0392b !important;
  border-radius: 0 !important;
}

/* ═══════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════ */
.site-footer {
  background: var(--warm-dark) !important;
  color: rgba(255,255,255,0.4) !important;
  padding: 50px 40px 24px !important;
  border-top: 3px solid var(--terra) !important;
}

.site-footer a {
  color: rgba(255,255,255,0.4) !important;
  transition: color 0.3s !important;
}

.site-footer a:hover { color: var(--terra-lt) !important; }

.site-footer .widget-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 1rem !important;
  color: rgba(255,255,255,0.7) !important;
  margin-bottom: 16px !important;
}

.site-info {
  font-size: 0.72rem !important;
  letter-spacing: 0.08em !important;
  border-top: 1px solid rgba(255,255,255,0.07) !important;
  padding-top: 20px !important;
  margin-top: 30px !important;
}

/* ═══════════════════════════════════════════
   BOUTONS GLOBAUX
═══════════════════════════════════════════ */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  font-family: 'Raleway', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  background: var(--terra) !important;
  color: #fff !important;
  border: none !important;
  transition: background 0.3s !important;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
  background: var(--terra-dk) !important;
  color: #fff !important;
}

.woocommerce a.button.alt,
.woocommerce button.button.alt {
  background: var(--warm-dark) !important;
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background: var(--terra) !important;
}

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width: 768px) {
  .site-header .col-full { padding: 14px 20px; }
  .woocommerce .products,
  .woocommerce-page .products { padding: 16px !important; }
  .woocommerce nav.woocommerce-pagination { padding: 20px 16px 40px !important; }
  .woocommerce ul.products li.product a img { height: 200px !important; }
}