/* =========================================================
   Raccord entre le design (Claude Design) et WordPress / WooCommerce
   ========================================================= */

/* lien d'évitement clavier */
.skip-link:focus { position: fixed; left: 12px; top: 12px; width: auto; height: auto; clip: auto; z-index: 200; background: #fff; color: var(--concord); padding: 10px 16px; border-radius: 12px; font-weight: 700; }

/* barre d'admin WordPress : l'en-tête collant passe dessous */
body.admin-bar .header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .header { top: 46px; } }

/* -------- cartes produit -------- */
.card__media { position: relative; }
.card__hit { position: absolute; inset: 0; z-index: 1; }
.card__media .badge { z-index: 2; }
.card .btn.add { text-decoration: none; text-align: center; }
.card .btn.add.loading { opacity: .7; pointer-events: none; }
.card .btn.add.added::after { content: " ✓"; }
/* WooCommerce ajoute un lien « Voir le panier » après l'ajout : le compteur suffit */
.card .added_to_cart { display: none !important; }

/* filtres sous forme de liens (pages de catégorie) */
a.pill { text-decoration: none; display: inline-flex; align-items: center; }
a.pill[aria-pressed="true"] { background: var(--concord); color: var(--white); }

/* -------- messages WooCommerce sur les pages du design -------- */
.mse-main > .woocommerce-notices-wrapper:not(:empty),
.woocommerce-notices-wrapper:not(:empty) { width: min(1180px, 100% - 40px); margin: 18px auto 0; }
.woocommerce-message, .woocommerce-info, .woocommerce-error {
  list-style: none; margin: 0 0 12px; padding: 14px 20px;
  background: var(--white); color: var(--concord); font-weight: 600;
  border-radius: var(--cut); box-shadow: var(--shadow);
  border-left: 6px solid var(--grape);
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
}
.woocommerce-message { border-left-color: #16a34a; }
.woocommerce-error { border-left-color: #c8202a; }
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { content: none !important; }
.woocommerce-message .button, .woocommerce-info .button {
  margin-left: auto; order: 2; background: var(--concord); color: var(--white);
  padding: 10px 18px; border-radius: 52px; font-weight: 700; text-decoration: none;
}

/* -------- fiche produit -------- */
.buy__note, .buy__out {
  margin-top: 14px; padding: 12px 16px; border-radius: 16px;
  background: color-mix(in srgb, var(--lilac) 70%, var(--white));
  font-size: .86rem; line-height: 1.5; color: var(--ink-soft);
}
.buy__out a { font-weight: 700; }

/* produits à variantes : formulaire WooCommerce habillé par pdp.js */
.cartline--wc { display: block; }
.cartline--wc form.cart { display: flex; flex-wrap: wrap; gap: 12px; align-items: stretch; }
.cartline--wc .mse-hidden-select { position: absolute !important; left: -9999px !important; }
.cartline--wc .opt { flex: 0 0 100%; }
.cartline--wc .opt-h { font-weight: 700; font-size: .82rem; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 10px; }
.cartline--wc .opt-h span { text-transform: none; letter-spacing: 0; color: var(--ink-soft); }
.cartline--wc .pills { display: flex; flex-wrap: wrap; gap: 8px; }
.cartline--wc .pill[aria-disabled="true"] { opacity: .4; }
.cartline--wc .woocommerce-variation-add-to-cart { display: flex; flex-wrap: wrap; gap: 12px; width: 100%; }
.cartline--wc .woocommerce-variation-price { flex: 0 0 100%; font-weight: 800; font-size: 1.25rem; }
.cartline--wc .reset_variations { flex: 0 0 100%; font-size: .85rem; }
.cartline--wc .quantity { display: flex; align-items: center; border: 2px solid var(--concord); border-radius: 18px; overflow: hidden; background: var(--white); }
.cartline--wc .quantity .qty-btn { width: 44px; min-height: 52px; border: 0; background: none; font-size: 1.3rem; font-weight: 700; color: var(--concord); cursor: pointer; }
.cartline--wc .quantity input.qty { width: 44px; border: 0; text-align: center; font-weight: 800; background: none; -moz-appearance: textfield; appearance: textfield; }
.cartline--wc .single_add_to_cart_button {
  flex: 1 1 200px; min-height: 56px; border: 0; border-radius: 20px; cursor: pointer;
  background: var(--grape-grad); color: var(--white); font: inherit; font-weight: 800;
}
.cartline--wc .single_add_to_cart_button.disabled { opacity: .45; cursor: not-allowed; }
.cartline--wc .stock.in-stock { display: none; }

/* boutons de paiement express (Apple Pay, Google Pay, PayPal) injectés par Stripe / PayPal */
.buy #wc-stripe-express-checkout-element,
.buy .ppc-button-wrapper,
.buy .wc-stripe-payment-request-wrapper { margin-top: 12px; }
.buy .ppcp-messages { margin-top: 8px; font-size: .78rem; }

/* -------- avis clients (formulaire WooCommerce) -------- */
.reviews__wc { margin-top: 26px; }
.reviews__wc #reviews > h2,
.reviews__wc .woocommerce-Reviews-title,
.reviews__wc .woocommerce-noreviews { display: none; }
.reviews__wc ol.commentlist { list-style: none; padding: 0; margin: 0 auto 28px; max-width: 760px; display: grid; gap: 14px; }
.reviews__wc ol.commentlist li .comment_container {
  background: var(--white); border-radius: var(--cut); padding: 18px 22px; box-shadow: var(--shadow);
}
.reviews__wc ol.commentlist img.avatar { display: none; }
.reviews__wc .meta { font-size: .84rem; color: var(--ink-soft); margin: 4px 0 8px; }
.reviews__wc .meta strong { color: var(--concord); }
.reviews__wc .star-rating { color: var(--gold); font-size: .95rem; }
.reviews__wc #review_form_wrapper {
  max-width: 760px; margin: 0 auto; background: var(--white);
  border-radius: 25px; padding: 24px 26px; box-shadow: var(--shadow);
}
.reviews__wc .comment-reply-title { display: block; font-weight: 800; font-size: 1.2rem; margin-bottom: 12px; }
.reviews__wc .comment-form p { margin: 0 0 14px; }
.reviews__wc .comment-form label { display: block; font-weight: 700; font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 6px; }
.reviews__wc .comment-form input[type=text],
.reviews__wc .comment-form input[type=email],
.reviews__wc .comment-form textarea,
.reviews__wc .comment-form select {
  width: 100%; border: 2px solid var(--soft); border-radius: 16px; padding: 12px 16px;
  font: inherit; background: var(--white); color: var(--concord);
}
.reviews__wc .comment-form textarea { min-height: 120px; }
.reviews__wc .comment-form-cookies-consent label { display: inline; text-transform: none; letter-spacing: 0; font-weight: 500; }
.reviews__wc .stars a { color: var(--gold); text-decoration: none; }
.reviews__wc .form-submit input[type=submit] {
  background: var(--grape-grad); color: var(--white); border: 0; border-radius: 20px;
  padding: 14px 28px; font: inherit; font-weight: 800; cursor: pointer;
}

/* -------- sol « arcade » du héros : grille fine en perspective, comme sur l'ancien site --------
   La grille reste fixe ; seules les lignes glissent doucement (fond animé), sans à-coups. */
.floor { perspective: none; height: 38%; min-height: 150px; }
.floor::after { display: none; }
.floor__grid {
  left: -30%; right: -30%; top: auto; bottom: 0; height: 100%;
  transform-origin: 50% 100%;
  transform: perspective(500px) rotateX(62deg);
  background-image:
    repeating-linear-gradient(90deg, rgba(255,255,255,.16) 0 2px, transparent 2px 90px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.16) 0 2px, transparent 2px 90px),
    linear-gradient(180deg, rgba(40,0,140,0), rgba(30,0,110,.75));
  background-size: auto, auto, 100% 100%;
}
.motion .floor__grid { animation: mse-floor 9s linear infinite; }
@keyframes mse-floor {
  from { background-position: 0 0, 0 0, 0 0; }
  to   { background-position: 0 0, 0 90px, 0 0; }
}
@media (prefers-reduced-motion: reduce) { .floor__grid { animation: none; } }
