/* ============================================================
   WOOCOMMERCE.CSS — AutoPerf Store
   Overrides complets pour WooCommerce dark mode automotive
   ============================================================ */

/* ============================================================
   RESET WOOCOMMERCE — FOND / COULEURS
   ============================================================ */
.woocommerce,
.woocommerce-page,
.woocommerce-shop {
  background-color: var(--ap-bg-deep) !important;
  color: var(--ap-text) !important;
}
.woocommerce a:not(.button):not(.ap-btn) { color: var(--ap-text-2); }
.woocommerce a:not(.button):not(.ap-btn):hover { color: var(--ap-red); }

/* ============================================================
   ARCHIVE BOUTIQUE — LAYOUT
   ============================================================ */
.woocommerce-products-header { margin-bottom: 24px; }
.woocommerce-products-header__title.page-title {
  font-family: var(--ap-f-heading);
  font-size: clamp(22px, 4vw, 36px);
  font-weight: 700;
  color: var(--ap-text);
}

/* Toolbar (résultats + tri) */
.woocommerce-result-count {
  font-size: 14px;
  color: var(--ap-text-3);
  margin-bottom: 0;
  max-width: none;
}
.woocommerce-ordering select {
  background: var(--ap-bg-input);
  border: 1px solid var(--ap-border);
  color: var(--ap-text);
  padding: 10px 14px;
  border-radius: var(--ap-r-md);
  font-family: var(--ap-f-body);
  font-size: 14px;
  outline: none;
  cursor: pointer;
  min-height: 44px;
}
.woocommerce-ordering select:focus { border-color: var(--ap-red); }

/* Grille produits */
ul.products,
.products.columns-3 {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
  gap: 20px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
  width: 100% !important;
}

/* ============================================================
   CARD PRODUIT
   ============================================================ */
ul.products li.product {
  background: var(--ap-bg-card) !important;
  border: 1px solid var(--ap-border) !important;
  border-radius: var(--ap-r-lg) !important;
  overflow: hidden !important;
  transition: var(--ap-t2) !important;
  position: relative !important;
  width: auto !important;
  margin: 0 !important;
  float: none !important;
}
ul.products li.product:hover {
  border-color: var(--ap-border-red) !important;
  transform: translateY(-4px) !important;
  box-shadow: var(--ap-shadow-red) !important;
}

/* Image produit */
ul.products li.product .woocommerce-loop-product__link img,
ul.products li.product a img {
  width: 100% !important;
  height: 240px !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.4s ease !important;
}
ul.products li.product:hover a img { transform: scale(1.04) !important; }

/* Corps de la card */
ul.products li.product .ap-product-card-body,
ul.products li.product > a + * {
  padding: 16px !important;
}

/* Marque */
ul.products li.product .ap-product-brand {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ap-red);
  margin-bottom: 4px;
}

/* Titre */
ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--ap-f-heading) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--ap-text) !important;
  padding: 0 16px 4px !important;
  line-height: 1.3 !important;
}

/* Note */
ul.products li.product .star-rating {
  padding: 0 16px 8px !important;
}
.star-rating span::before,
.star-rating::before {
  color: var(--ap-amber) !important;
}

/* Prix */
ul.products li.product .price {
  font-family: var(--ap-f-mono) !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  color: var(--ap-text) !important;
  padding: 0 16px 12px !important;
  display: block !important;
}
ul.products li.product .price del {
  font-size: 13px !important;
  color: var(--ap-text-3) !important;
  margin-right: 6px !important;
}
ul.products li.product .price ins {
  color: var(--ap-red) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

/* Bouton Add to Cart */
ul.products li.product .button,
ul.products li.product .add_to_cart_button {
  display: block !important;
  width: calc(100% - 32px) !important;
  margin: 0 16px 16px !important;
  padding: 12px !important;
  background: var(--ap-red) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--ap-r-md) !important;
  font-family: var(--ap-f-heading) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: var(--ap-t2) !important;
  min-height: 44px !important;
}
ul.products li.product .button:hover,
ul.products li.product .add_to_cart_button:hover {
  background: var(--ap-red-dark) !important;
  transform: none !important;
  box-shadow: var(--ap-shadow-red) !important;
}
ul.products li.product .added_to_cart {
  display: block !important;
  text-align: center !important;
  font-size: 13px !important;
  color: var(--ap-green) !important;
  font-weight: 600 !important;
  padding: 4px 16px 16px !important;
}

/* Badge promo */
ul.products li.product .onsale {
  top: 12px !important;
  right: 12px !important;
  left: auto !important;
  background: var(--ap-red) !important;
  color: #fff !important;
  font-family: var(--ap-f-heading) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  border-radius: var(--ap-r-sm) !important;
  padding: 4px 10px !important;
  min-height: auto !important;
  line-height: 1 !important;
}

/* Wishlist bouton (YITH) */
.yith-wcwl-add-to-wishlist {
  position: absolute !important;
  top: 52px !important;
  right: 12px !important;
  z-index: 2 !important;
}
.yith-wcwl-add-button a,
.yith-wcwl-wishlistexistsbrowse a,
.yith-wcwl-wishlistaddedbrowse a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  background: rgba(7,11,18,0.80) !important;
  border: 1px solid var(--ap-border) !important;
  border-radius: 50% !important;
  color: var(--ap-text-2) !important;
  transition: var(--ap-t) !important;
  font-size: 0 !important;
}
.yith-wcwl-add-button a:hover { border-color: var(--ap-red) !important; color: var(--ap-red) !important; }

/* ============================================================
   PAGE PRODUIT UNIQUE
   ============================================================ */
.single-product div.product {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
}
@media (max-width: 768px) {
  .single-product div.product { grid-template-columns: 1fr; gap: 32px; }
}

/* Galerie */
.woocommerce-product-gallery {
  position: sticky !important;
  top: calc(var(--ap-header-h) + 24px) !important;
}
.woocommerce-product-gallery__image img {
  border-radius: var(--ap-r-lg);
  border: 1px solid var(--ap-border);
}
.flex-control-thumbs { display: flex !important; gap: 8px !important; margin-top: 12px !important; }
.flex-control-thumbs li { margin: 0 !important; }
.flex-control-thumbs li img {
  border-radius: var(--ap-r-md) !important;
  border: 2px solid transparent !important;
  cursor: pointer !important;
  transition: var(--ap-t) !important;
  opacity: 0.6 !important;
}
.flex-control-thumbs li img.flex-active,
.flex-control-thumbs li img:hover { border-color: var(--ap-red) !important; opacity: 1 !important; }

/* Infos produit */
.single-product .summary { }
.single-product .product_title {
  font-family: var(--ap-f-heading) !important;
  font-size: clamp(22px, 3vw, 32px) !important;
  font-weight: 700 !important;
  color: var(--ap-text) !important;
  margin-bottom: 8px !important;
}
.single-product .woocommerce-product-rating { margin-bottom: 16px !important; }
.single-product .price {
  font-family: var(--ap-f-mono) !important;
  font-size: 28px !important;
  font-weight: 500 !important;
  color: var(--ap-text) !important;
  margin-bottom: 16px !important;
  display: block !important;
}
.single-product .price del { color: var(--ap-text-3) !important; font-size: 18px !important; margin-right: 8px !important; }
.single-product .price ins { color: var(--ap-red) !important; text-decoration: none !important; }

/* Disponibilité stock */
.single-product .in-stock {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--ap-green) !important;
  background: var(--ap-green-glow) !important;
  border: 1px solid var(--ap-border-green) !important;
  padding: 4px 12px !important;
  border-radius: var(--ap-r-sm) !important;
  margin-bottom: 16px !important;
}
.single-product .out-of-stock {
  display: inline-block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--ap-amber) !important;
  margin-bottom: 16px !important;
}

/* Description courte */
.woocommerce-product-details__short-description {
  font-size: 15px !important;
  color: var(--ap-text-2) !important;
  line-height: 1.7 !important;
  margin-bottom: 24px !important;
}
.woocommerce-product-details__short-description p { max-width: none !important; margin-bottom: 0 !important; }

/* Quantité + Add to cart */
form.cart {
  display: flex !important;
  gap: 12px !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  margin-bottom: 20px !important;
}
.quantity .qty {
  width: 80px !important;
  background: var(--ap-bg-input) !important;
  border: 1px solid var(--ap-border) !important;
  color: var(--ap-text) !important;
  padding: 12px !important;
  border-radius: var(--ap-r-md) !important;
  font-family: var(--ap-f-mono) !important;
  font-size: 16px !important;
  text-align: center !important;
  min-height: 52px !important;
  outline: none !important;
}
.quantity .qty:focus { border-color: var(--ap-red) !important; }

.single_add_to_cart_button,
.single_add_to_cart_button.button {
  flex: 1 !important;
  min-width: 200px !important;
  padding: 16px 28px !important;
  background: var(--ap-red) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--ap-r-md) !important;
  font-family: var(--ap-f-heading) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: var(--ap-t2) !important;
  min-height: 52px !important;
}
.single_add_to_cart_button:hover {
  background: var(--ap-red-dark) !important;
  box-shadow: var(--ap-shadow-red) !important;
}
.single_add_to_cart_button.loading::after { border-top-color: #fff !important; }

/* Méta produit */
.product_meta {
  padding-top: 16px !important;
  border-top: 1px solid var(--ap-border) !important;
  font-size: 13px !important;
  color: var(--ap-text-3) !important;
}
.product_meta .sku_wrapper,
.product_meta .posted_in,
.product_meta .tagged_as { display: block !important; margin-bottom: 4px !important; }
.product_meta a { color: var(--ap-text-2) !important; }
.product_meta a:hover { color: var(--ap-red) !important; }

/* Réassurance produit */
.ap-product-reassurance {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px;
  background: var(--ap-bg-elevated);
  border: 1px solid var(--ap-border);
  border-radius: var(--ap-r-lg);
  margin-top: 20px;
}
.ap-product-reassurance__item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: var(--ap-text-2);
}
.ap-product-reassurance__item svg { color: var(--ap-green); flex-shrink: 0; }

/* ============================================================
   ONGLETS PRODUIT
   ============================================================ */
.woocommerce-tabs {
  margin-top: 60px !important;
  grid-column: span 2 !important;
}
@media (max-width: 768px) { .woocommerce-tabs { grid-column: span 1 !important; } }

.woocommerce-tabs ul.tabs {
  display: flex !important;
  gap: 4px !important;
  border-bottom: 1px solid var(--ap-border) !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
  list-style: none !important;
  background: none !important;
}
.woocommerce-tabs ul.tabs::before { display: none !important; }
.woocommerce-tabs ul.tabs li {
  border: none !important;
  border-radius: 0 !important;
  background: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.woocommerce-tabs ul.tabs li a {
  display: block !important;
  padding: 12px 20px !important;
  font-family: var(--ap-f-heading) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--ap-text-3) !important;
  border-bottom: 2px solid transparent !important;
  transition: var(--ap-t) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
}
.woocommerce-tabs ul.tabs li.active a,
.woocommerce-tabs ul.tabs li a:hover {
  color: var(--ap-text) !important;
  border-bottom-color: var(--ap-red) !important;
  background: none !important;
}
.woocommerce-tabs .panel {
  padding: 32px 0 !important;
  background: none !important;
}
.woocommerce-tabs .panel h2 { display: none !important; }
.woocommerce-tabs .panel p,
.woocommerce-tabs .panel li { color: var(--ap-text-2) !important; }
.woocommerce-tabs .panel table { width: 100% !important; border-collapse: collapse !important; }
.woocommerce-tabs .panel table th,
.woocommerce-tabs .panel table td {
  padding: 12px 16px !important;
  border: 1px solid var(--ap-border) !important;
  text-align: left !important;
  font-size: 14px !important;
}
.woocommerce-tabs .panel table th {
  background: var(--ap-bg-elevated) !important;
  color: var(--ap-text) !important;
  font-weight: 600 !important;
}
.woocommerce-tabs .panel table td { color: var(--ap-text-2) !important; }

/* ============================================================
   AVIS / REVIEWS
   ============================================================ */
#reviews { }
.woocommerce-Reviews-title { display: none !important; }
.comment-respond .comment-reply-title {
  font-family: var(--ap-f-heading) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--ap-text) !important;
}
.comment-respond label { color: var(--ap-text-2) !important; font-size: 14px !important; }
.comment-respond .comment-form-rating { margin-bottom: 16px !important; }
.stars a { color: var(--ap-amber) !important; }
.comment-list li.comment { list-style: none; }
.woocommerce-review__author { color: var(--ap-text) !important; font-weight: 600 !important; }
.woocommerce-review__dash,
.woocommerce-review__published-date { color: var(--ap-text-3) !important; }
.description p { color: var(--ap-text-2) !important; }

/* ============================================================
   PRODUITS ASSOCIÉS / UPSELLS
   ============================================================ */
.related, .up-sells {
  grid-column: span 2 !important;
  margin-top: 60px !important;
}
@media (max-width: 768px) { .related, .up-sells { grid-column: span 1 !important; } }
.related h2, .up-sells h2 {
  font-family: var(--ap-f-heading) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--ap-text) !important;
  margin-bottom: 24px !important;
}

/* ============================================================
   PANIER
   ============================================================ */
.woocommerce-cart-form__cart-item td,
.woocommerce-cart table.cart td,
.woocommerce-cart table.cart th {
  background: transparent !important;
  color: var(--ap-text) !important;
  border-color: var(--ap-border) !important;
  padding: 16px !important;
}
.woocommerce-cart table.cart th {
  font-family: var(--ap-f-heading) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--ap-text-3) !important;
}
.woocommerce-cart table.cart img { border-radius: var(--ap-r-md) !important; }
.woocommerce-cart table.cart .product-name a { color: var(--ap-text) !important; font-weight: 600 !important; }
.woocommerce-cart table.cart .product-price,
.woocommerce-cart table.cart .product-subtotal {
  font-family: var(--ap-f-mono) !important;
  font-weight: 500 !important;
}
.woocommerce-cart-form__contents .product-remove a {
  color: var(--ap-text-3) !important;
  font-size: 20px !important;
  transition: var(--ap-t) !important;
}
.woocommerce-cart-form__contents .product-remove a:hover { color: var(--ap-red) !important; }

/* Résumé commande panier */
.cart_totals {
  background: var(--ap-bg-card) !important;
  border: 1px solid var(--ap-border) !important;
  border-radius: var(--ap-r-xl) !important;
  padding: 28px !important;
}
.cart_totals h2 {
  font-family: var(--ap-f-heading) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--ap-text) !important;
  margin-bottom: 20px !important;
}
.cart_totals .shop_table th,
.cart_totals .shop_table td {
  background: transparent !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text-2) !important;
  padding: 12px 0 !important;
}
.cart_totals .shop_table .order-total td { color: var(--ap-text) !important; font-weight: 700 !important; font-family: var(--ap-f-mono) !important; font-size: 22px !important; }
.wc-proceed-to-checkout .checkout-button {
  display: block !important;
  width: 100% !important;
  padding: 16px !important;
  background: var(--ap-red) !important;
  color: #fff !important;
  border-radius: var(--ap-r-md) !important;
  font-family: var(--ap-f-heading) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  border: none !important;
  cursor: pointer !important;
  transition: var(--ap-t2) !important;
  margin-top: 16px !important;
}
.wc-proceed-to-checkout .checkout-button:hover { background: var(--ap-red-dark) !important; box-shadow: var(--ap-shadow-red) !important; }

/* ============================================================
   CHECKOUT
   ============================================================ */
.woocommerce-checkout #payment {
  background: var(--ap-bg-card) !important;
  border-radius: var(--ap-r-xl) !important;
  border: 1px solid var(--ap-border) !important;
}
.woocommerce-checkout #payment ul.payment_methods {
  border-bottom: 1px solid var(--ap-border) !important;
  padding: 16px !important;
}
.woocommerce-checkout #payment ul.payment_methods li label {
  color: var(--ap-text) !important;
}
.woocommerce-checkout #payment div.payment_box {
  background: var(--ap-bg-elevated) !important;
  color: var(--ap-text-2) !important;
}
.woocommerce-checkout #payment div.payment_box::before {
  border-bottom-color: var(--ap-bg-elevated) !important;
}
.woocommerce .woocommerce-checkout-review-order-table th,
.woocommerce .woocommerce-checkout-review-order-table td {
  background: transparent !important;
  border-color: var(--ap-border) !important;
  color: var(--ap-text-2) !important;
}
#place_order {
  width: 100% !important;
  padding: 18px !important;
  background: var(--ap-red) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--ap-r-md) !important;
  font-family: var(--ap-f-heading) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: var(--ap-t2) !important;
  min-height: 56px !important;
}
#place_order:hover { background: var(--ap-red-dark) !important; box-shadow: var(--ap-shadow-red) !important; }

/* Labels checkout */
.woocommerce-billing-fields label,
.woocommerce-shipping-fields label,
.woocommerce-account-fields label {
  color: var(--ap-text-2) !important;
  font-size: 14px !important;
}
.woocommerce-input-wrapper input,
.woocommerce-input-wrapper select,
.woocommerce-input-wrapper textarea {
  background: var(--ap-bg-input) !important;
  border: 1px solid var(--ap-border) !important;
  color: var(--ap-text) !important;
  border-radius: var(--ap-r-md) !important;
}
.woocommerce-input-wrapper input:focus,
.woocommerce-input-wrapper select:focus { border-color: var(--ap-red) !important; }

/* ============================================================
   MON COMPTE
   ============================================================ */
.woocommerce-account .woocommerce-MyAccount-navigation {
  background: var(--ap-bg-card) !important;
  border: 1px solid var(--ap-border) !important;
  border-radius: var(--ap-r-xl) !important;
  padding: 12px !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none !important; }
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
  display: block !important;
  padding: 10px 16px !important;
  border-radius: var(--ap-r-md) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--ap-text-2) !important;
  transition: var(--ap-t) !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
  background: var(--ap-red-glow) !important;
  color: var(--ap-red) !important;
}

/* Messages WooCommerce */
.woocommerce-message,
.woocommerce-info {
  background: var(--ap-bg-elevated) !important;
  border-top-color: var(--ap-green) !important;
  color: var(--ap-text-2) !important;
  border-radius: 0 var(--ap-r-md) var(--ap-r-md) 0 !important;
}
.woocommerce-error {
  background: rgba(239,68,68,0.1) !important;
  border-top-color: var(--ap-red) !important;
  color: var(--ap-text-2) !important;
  border-radius: 0 var(--ap-r-md) var(--ap-r-md) 0 !important;
}
.woocommerce-message a.button,
.woocommerce-info a.button {
  background: var(--ap-red) !important;
  color: #fff !important;
  border-radius: var(--ap-r-md) !important;
  padding: 8px 20px !important;
  font-weight: 700 !important;
  font-family: var(--ap-f-heading) !important;
  font-size: 13px !important;
}

/* ============================================================
   WOOF FILTERS (Plugin gratuit)
   ============================================================ */
.woocommerce-widget-layered-nav,
.woof,
.woof_container {
  background: var(--ap-bg-card) !important;
  border: 1px solid var(--ap-border) !important;
  border-radius: var(--ap-r-lg) !important;
  padding: 20px !important;
  margin-bottom: 16px !important;
}
.woof_container_inner h4,
.woocommerce-widget-layered-nav h2 {
  font-family: var(--ap-f-heading) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--ap-text) !important;
  margin-bottom: 12px !important;
}
.woof_list li,
.woocommerce-widget-layered-nav-list__item {
  list-style: none !important;
  margin: 0 !important;
}
.woof_list li label,
.woocommerce-widget-layered-nav-list__item a {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 6px 0 !important;
  font-size: 14px !important;
  color: var(--ap-text-2) !important;
  cursor: pointer !important;
  transition: var(--ap-t) !important;
}
.woof_list li label:hover,
.woocommerce-widget-layered-nav-list__item a:hover { color: var(--ap-text) !important; }
.woof_list input[type="checkbox"] { accent-color: var(--ap-red) !important; }

/* Filtre prix */
.price_slider_wrapper .price_slider { background: var(--ap-border) !important; border-radius: 2px !important; }
.price_slider_wrapper .ui-slider-range { background: var(--ap-red) !important; }
.price_slider_wrapper .ui-slider-handle { background: var(--ap-red) !important; border: 2px solid var(--ap-red) !important; border-radius: 50% !important; }

/* ============================================================
   YITH COMPARE
   ============================================================ */
.yith-woocompare-widget ul.products-list li {
  background: var(--ap-bg-card) !important;
  border: 1px solid var(--ap-border) !important;
}