/* ============================================================
   MY SXM — Reviews overrides (charte v2)
   Cible : plugin "Customer Reviews for WooCommerce" (CusRev)
   Spec : openspec/changes/product-reviews-cusrev/specs/.../spec.md
   Tokens : theme/mysxm-child/assets/css/tokens.css
   ============================================================ */

/* ---- 1. Étoiles : gold sur toutes les variantes plugin ---- */
.ivole-summary .ivole-star,
.ivole-rating .ivole-star,
.ivole-review .ivole-star,
.ivole-form .ivole-star,
.cr-qna-rating .cr-star,
.woocommerce-product-rating .star-rating,
.woocommerce .star-rating,
.woocommerce p.stars a,
.woocommerce-page .star-rating {
  color: var(--gold) !important;
}

/* WC star-rating utilise un pseudo-element : forcer la couleur du ::before */
.woocommerce .star-rating::before,
.woocommerce .star-rating span::before {
  color: var(--gold);
}

/* ---- 2. Cartes review : fond sandy + bordure or doux ---- */
.ivole-review,
.ivole-summary,
.cr-review,
.cr-qna-review {
  background-color: var(--bg);
  border: 1px solid var(--gold-soft);
  border-radius: 0;
  padding: 1rem 1.25rem;
}

/* ---- 3. Titres section reviews : Cormorant Garamond ---- */
.ivole-summary-title,
.ivole-form-title,
.cr-all-reviews-title,
.woocommerce #reviews #comments h2,
.woocommerce-Reviews-title {
  font-family: 'Cormorant Garamond', 'Fraunces', Georgia, serif !important;
  font-weight: 500;
  color: var(--ink);
  letter-spacing: 0.01em;
}

/* ---- 4. Boutons : sharp + navy + sandy (charte v2) ---- */
.ivole-form button[type="submit"],
.ivole-form .ivole-button,
.ivole-form input[type="submit"],
.ivole-write-review,
.cr-write-review-link,
.woocommerce #review_form #respond .form-submit input,
.woocommerce-Reviews .submit {
  background-color: var(--ink) !important;
  color: var(--bg) !important;
  border-radius: 0 !important;
  border: 1px solid var(--ink) !important;
  font-family: 'Inter Tight', 'Inter', system-ui, sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 13px;
  padding: 0.75rem 1.5rem;
  cursor: pointer;
  transition: background-color 0.18s ease, color 0.18s ease;
}

.ivole-form button[type="submit"]:hover,
.ivole-form .ivole-button:hover,
.ivole-write-review:hover,
.woocommerce #review_form #respond .form-submit input:hover {
  background-color: var(--gold) !important;
  border-color: var(--gold) !important;
}

/* ---- 5. Auteur + dates : sobriété éditoriale ---- */
.ivole-author,
.ivole-review-author,
.cr-review-author,
.woocommerce-review__author {
  font-weight: 600;
  color: var(--ink);
}

.ivole-date,
.ivole-review-date,
.cr-review-date,
.woocommerce-review__published-date {
  color: color-mix(in srgb, var(--ink) 60%, transparent);
  font-size: 0.85em;
  font-family: 'Inter Tight', 'Inter', system-ui, sans-serif;
}

/* ---- 6. Verified Owner badge : pastille discrète ---- */
.ivole-verified-buyer,
.cr-verified-purchase {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  background-color: var(--gold);
  color: var(--bg);
  font-size: 0.7em;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.15rem 0.5rem;
  border-radius: 0;
}

/* ---- 7. Galerie photos : grille sandy, hover gold ---- */
.ivole-review-photos img,
.cr-review-photos img {
  border: 1px solid var(--gold-soft);
  border-radius: 0;
  transition: border-color 0.18s ease;
}

.ivole-review-photos img:hover,
.cr-review-photos img:hover {
  border-color: var(--gold);
}

/* ---- 8. Formulaire submission : champs sobres ---- */
.ivole-form input[type="text"],
.ivole-form input[type="email"],
.ivole-form textarea,
.cr-form input,
.cr-form textarea,
.woocommerce #review_form #respond textarea,
.woocommerce #review_form #respond input[type="text"],
.woocommerce #review_form #respond input[type="email"] {
  background-color: var(--bg);
  border: 1px solid var(--gold-soft);
  border-radius: 0;
  padding: 0.6rem 0.8rem;
  font-family: 'Inter Tight', 'Inter', system-ui, sans-serif;
  color: var(--ink);
}

.ivole-form input:focus,
.ivole-form textarea:focus,
.cr-form input:focus,
.cr-form textarea:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--gold) 25%, transparent);
}

/* ---- 9. GDPR opt-in : label lisible ---- */
.ivole-gdpr-checkbox + label,
.cr-gdpr-label {
  font-size: 0.9em;
  color: var(--ink);
  font-family: 'Inter Tight', 'Inter', system-ui, sans-serif;
}

/* ---- 10. Loop card rating (shop grid) — réutilise .p-card-rating de theme.css ---- */
.p-card-rating .star-rating,
.p-card-rating .ivole-star {
  color: var(--gold);
}
