/**
 * Override style Trustindex Reviews Widget — v6
 *
 * Corrections v6 :
 *  1. Sélecteurs ULTRA spécifiques (.testimonials-feed .ti-widget.ti-goog .ti-review-item)
 *     pour battre les règles natives Trustindex qui résistent
 *  2. Flèches inversées (flex-direction: row-reverse sur .ti-controls)
 *  3. Conservation de tout le reste qui marche
 */

/* ============================================================================
   1. RESET TOTAL — Sélecteurs ULTRA spécifiques pour battre Trustindex
   ============================================================================
   On chaîne .testimonials-feed .ti-widget.ti-goog pour augmenter la spécificité
   et battre les règles internes du plugin qui ont .ti-widget.ti-goog comme préfixe. */

.testimonials-feed,
.testimonials-feed .ti-widget,
.testimonials-feed .ti-widget.ti-goog,
.testimonials-feed .ti-widget-container,
.testimonials-feed .ti-widget.ti-goog .ti-widget-container,
.testimonials-feed .ti-widget-container.ti-col-1,
.testimonials-feed .ti-widget.ti-goog .ti-widget-container.ti-col-1,
.testimonials-feed .ti-reviews-container,
.testimonials-feed .ti-widget.ti-goog .ti-reviews-container,
.testimonials-feed .ti-reviews-container-wrapper,
.testimonials-feed .ti-widget.ti-goog .ti-reviews-container-wrapper {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  border-width: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 0 !important;
  font-family: 'Inter', sans-serif !important;
}

/* ============================================================================
   2. CARTES D'AVIS — Sélecteurs ULTRA spécifiques pour casser la border ambre
   ============================================================================
   On cible .ti-widget.ti-goog .ti-review-item ET .testimonials-feed le préfixe.
   On override aussi border-top, border-right, etc. individuellement. */

.testimonials-feed .ti-widget.ti-goog .ti-review-item,
.testimonials-feed .ti-widget .ti-review-item,
.testimonials-feed div.ti-review-item,
.testimonials-feed .ti-review-item {
  background: #0f0f0f !important;
  background-color: #0f0f0f !important;
  background-image: none !important;

  /* On force tous les côtés de la border individuellement */
  border: 1px solid #1c1c1c !important;
  border-top: 1px solid #1c1c1c !important;
  border-right: 1px solid #1c1c1c !important;
  border-bottom: 1px solid #1c1c1c !important;
  border-left: 1px solid #1c1c1c !important;
  border-color: #1c1c1c !important;
  border-style: solid !important;
  border-width: 1px !important;

  border-radius: 4px !important;
  padding: 36px 32px !important;
  margin: 8px !important;
  box-shadow: none !important;
  outline: none !important;
  transition: border-color .35s ease !important;
}

.testimonials-feed .ti-widget.ti-goog .ti-review-item:hover,
.testimonials-feed .ti-review-item:hover {
  border-color: #2a2a2a !important;
}

.testimonials-feed .ti-review-item::before,
.testimonials-feed .ti-review-item::after {
  display: none !important;
  content: none !important;
}

.testimonials-feed .ti-widget.ti-goog .ti-inner,
.testimonials-feed .ti-inner {
  background: transparent !important;
  border: none !important;
}

/* ============================================================================
   3. MASQUER les éléments parasites
   ============================================================================ */

.testimonials-feed .ti-controls-line,
.testimonials-feed .ti-widget.ti-goog .ti-controls-line {
  display: none !important;
}

.testimonials-feed .ti-footer,
.testimonials-feed .ti-widget.ti-goog .ti-footer {
  display: none !important;
}

.testimonials-feed .ti-write-review,
.testimonials-feed [class*="write-review"] {
  display: none !important;
}

/* ============================================================================
   4. CONTAINER DES FLÈCHES — INVERSÉ
   ============================================================================ */

.testimonials-feed .ti-reviews-container,
.testimonials-feed .ti-reviews-container-wrapper {
  position: relative !important;
}

.testimonials-feed .ti-controls,
.testimonials-feed .ti-widget.ti-goog .ti-controls {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 0 8px !important;
  background: transparent !important;
  border: none !important;
  z-index: 5 !important;

  /* ✨ INVERSION : la flèche "next" était à gauche, on remet l'ordre logique */
  flex-direction: row-reverse !important;
}

.testimonials-feed .ti-controls > * {
  pointer-events: auto !important;
}

/* ============================================================================
   5. FLÈCHES DU CARROUSEL
   ============================================================================ */

.testimonials-feed .ti-controls button,
.testimonials-feed .ti-controls .ti-control,
.testimonials-feed .ti-controls .ti-prev,
.testimonials-feed .ti-controls .ti-next,
.testimonials-feed .ti-controls [class*="prev"],
.testimonials-feed .ti-controls [class*="next"],
.testimonials-feed .ti-controls [class*="arrow"],
.testimonials-feed .slick-prev,
.testimonials-feed .slick-next,
.testimonials-feed [class*="slick-prev"],
.testimonials-feed [class*="slick-next"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  background: rgba(15, 15, 15, .9) !important;
  border: 1px solid #2a2a2a !important;
  color: #d4a574 !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  border-radius: 50% !important;
  transition: all .25s ease !important;
  cursor: pointer !important;
  font-size: 14px !important;
  z-index: 10 !important;
  pointer-events: auto !important;
}

.testimonials-feed .ti-controls button:hover,
.testimonials-feed .ti-controls .ti-control:hover,
.testimonials-feed .ti-controls [class*="prev"]:hover,
.testimonials-feed .ti-controls [class*="next"]:hover,
.testimonials-feed .slick-prev:hover,
.testimonials-feed .slick-next:hover {
  background: #d4a574 !important;
  border-color: #d4a574 !important;
  color: #0a0a0a !important;
  transform: scale(1.05) !important;
}

.testimonials-feed .ti-controls svg,
.testimonials-feed .ti-controls i,
.testimonials-feed .slick-prev::before,
.testimonials-feed .slick-next::before {
  color: inherit !important;
  fill: currentColor !important;
  font-size: 14px !important;
  opacity: 1 !important;
  width: 14px !important;
  height: 14px !important;
}

/* ============================================================================
   6. HEADER DE CARTE — AVATAR 72px
   ============================================================================ */

.testimonials-feed .ti-review-header {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin-bottom: 14px !important;
}

.testimonials-feed .ti-profile-img {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 72px !important;
  height: 72px !important;
  min-width: 72px !important;
  max-width: 72px !important;
  border-radius: 50% !important;
  background: #1c1c1c !important;
  color: #d4a574 !important;
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 28px !important;
  letter-spacing: 1px !important;
  border: 2px solid #2a2a2a !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
  position: relative !important;
}

.testimonials-feed .ti-profile-img img {
  border-radius: 50% !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.testimonials-feed .ti-profile-details {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  text-align: left !important;
}

.testimonials-feed .ti-name {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 20px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: #fafafa !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}

.testimonials-feed .ti-name a {
  color: #fafafa !important;
  text-decoration: none !important;
}

.testimonials-feed .ti-date {
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  color: #666666 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* ============================================================================
   7. ÉTOILES — Ambre
   ============================================================================ */

.testimonials-feed .ti-stars {
  color: #d4a574 !important;
  margin: 10px 0 !important;
}

.testimonials-feed .ti-stars svg,
.testimonials-feed .ti-stars i {
  color: #d4a574 !important;
  fill: #d4a574 !important;
}

.testimonials-feed .ti-stars svg path {
  fill: #d4a574 !important;
}

.testimonials-feed .ti-stars .ti-star-empty,
.testimonials-feed .ti-stars [class*="star-empty"] {
  color: #2a2a2a !important;
  fill: #2a2a2a !important;
  opacity: .5 !important;
}

/* ============================================================================
   8. TEXTE DE L'AVIS
   ============================================================================ */

.testimonials-feed .ti-review-text-container,
.testimonials-feed .ti-review-content {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-style: italic !important;
  line-height: 1.7 !important;
  color: #a8a8a8 !important;
  margin-top: 12px !important;
}

.testimonials-feed .ti-review-text {
  color: #a8a8a8 !important;
  font-style: italic !important;
}

.testimonials-feed .ti-show-more,
.testimonials-feed [class*="read-more"] {
  color: #d4a574 !important;
  text-decoration: none !important;
  font-style: normal !important;
  font-size: 11px !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}

/* ============================================================================
   9. BADGE GOOGLE
   ============================================================================ */

.testimonials-feed .ti-google-icon,
.testimonials-feed [class*="ti-source"] img,
.testimonials-feed .ti-verified-icon {
  opacity: .85 !important;
  transition: opacity .25s ease !important;
}

/* ============================================================================
   10. PAGINATION
   ============================================================================ */

.testimonials-feed .ti-slick-dots li button,
.testimonials-feed .slick-dots li button,
.testimonials-feed [class*="slick-dots"] li button {
  background: #2a2a2a !important;
  border: none !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  padding: 0 !important;
}

.testimonials-feed .ti-slick-dots li.slick-active button,
.testimonials-feed .slick-dots li.slick-active button,
.testimonials-feed [class*="slick-dots"] li.slick-active button {
  background: #d4a574 !important;
  width: 24px !important;
  border-radius: 4px !important;
}

.testimonials-feed .ti-slick-dots li button::before,
.testimonials-feed .slick-dots li button::before {
  display: none !important;
}

/* ============================================================================
   11. MODE CLAIR
   ============================================================================ */

body.theme-light .testimonials-feed .ti-review-item,
body.theme-light .testimonials-feed .ti-widget.ti-goog .ti-review-item,
html[data-theme="light"] .testimonials-feed .ti-review-item {
  background: #e9e1cf !important;
  background-color: #e9e1cf !important;
  border-color: #d3c6a8 !important;
}

body.theme-light .testimonials-feed .ti-name {
  color: #181206 !important;
}

body.theme-light .testimonials-feed .ti-date {
  color: #908067 !important;
}

body.theme-light .testimonials-feed .ti-stars,
body.theme-light .testimonials-feed .ti-stars svg {
  color: #a8702f !important;
  fill: #a8702f !important;
}

body.theme-light .testimonials-feed .ti-review-text,
body.theme-light .testimonials-feed .ti-review-text-container {
  color: #5a4c38 !important;
}

body.theme-light .testimonials-feed .ti-profile-img {
  background: #d3c6a8 !important;
  color: #a8702f !important;
  border-color: #bdae8a !important;
}

body.theme-light .testimonials-feed .ti-controls button {
  background: rgba(242, 235, 222, .95) !important;
  border-color: #bdae8a !important;
  color: #a8702f !important;
}

body.theme-light .testimonials-feed .ti-controls button:hover {
  background: #a8702f !important;
  border-color: #a8702f !important;
  color: #ffffff !important;
}

/* ============================================================================
   12. RESPONSIVE MOBILE
   ============================================================================ */

@media (max-width: 640px) {
  .testimonials-feed .ti-review-item,
  .testimonials-feed .ti-widget.ti-goog .ti-review-item {
    padding: 24px 20px !important;
    margin: 4px !important;
  }

  .testimonials-feed .ti-name {
    font-size: 16px !important;
  }

  .testimonials-feed .ti-review-text-container,
  .testimonials-feed .ti-review-content,
  .testimonials-feed .ti-review-text {
    font-size: 13px !important;
  }

  .testimonials-feed .ti-profile-img {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    font-size: 22px !important;
  }

  .testimonials-feed .ti-controls button,
  .testimonials-feed .ti-controls [class*="prev"],
  .testimonials-feed .ti-controls [class*="next"] {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
  }
}