/*
Theme Name: The Rose Barn — Google Reviews
Theme URI: https://www.therosebarn.co.za/
Template: the-rose-barn
Author: The Color Blue
Author URI: https://thecolorblue.co.za
Description: Child theme of The Rose Barn. Puts the Google reviews from the Trustindex plugin into the Love Letters section on the home page, styled to match the approved design. Everything else is inherited from the parent theme unchanged.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: the-rose-barn-reviews
*/

/* The reviews styling lives in this file. Everything else comes from
   the parent's css/rosebarn.css and assets/wp.css, both untouched. */

/* ---------- Google reviews, via the Trustindex plugin ----------
   The plugin's own stylesheet loads after this one, so every rule
   here is prefixed with body and marked important to win. Class
   names verified against the live widget on 12 Oct 2026 (layout 4,
   "Slider I"): re-check them after a plugin update.

   Mirrors the approved design's .review rules in css/rosebarn.css,
   which stays untouched. */

body .reviews-ti .reviews-ti-widget{ margin-top: clamp(2rem, 4vw, 3rem); }

/* no white cards: the quotes sit on the dark ground, as designed */
body .reviews-ti .ti-widget .ti-review-item .ti-inner{
  background: transparent !important;
  border: 1px solid rgba(242, 236, 225, 0.16) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 2rem 1.8rem !important;
}

/* the design carries no avatars, platform badges or verified ticks */
body .reviews-ti .ti-widget .ti-platform-icon,
body .reviews-ti .ti-widget .ti-profile-img,
body .reviews-ti .ti-widget .ti-verified-review{ display: none !important; }

body .reviews-ti .ti-widget .ti-review-header{
  justify-content: center !important;
  text-align: center !important;
}

body .reviews-ti .ti-widget .ti-profile-details{
  width: 100% !important;
  text-align: center !important;
}

/* attribution: uppercase, letter-spaced, quiet */
body .reviews-ti .ti-widget .ti-name,
body .reviews-ti .ti-widget .ti-date{
  font-family: var(--ui) !important;
  font-size: var(--fs-label) !important;
  letter-spacing: var(--ls-label) !important;
  text-transform: uppercase !important;
  color: var(--on-dark-soft) !important;
}

/* The stars are images served from the plugin's CDN, so they cannot
   be refilled like the design's SVG stars. A filter pulls Google's
   gold back to the muted tone the dark sections use. */
body .reviews-ti .ti-widget .ti-stars{
  display: flex !important;
  justify-content: center !important;
  gap: 0.22em !important;
  margin: 0.7rem 0 1.2rem !important;
}

body .reviews-ti .ti-widget .ti-star{
  width: 0.95rem !important;
  height: auto !important;
  filter: grayscale(1) sepia(0.5) saturate(0.8) brightness(1.1) !important;
}

/* the quote itself. Three lines keeps every card the same height and
   stops the slider clipping a sentence part way through. */
body .reviews-ti .ti-widget .ti-review-text-container,
body .reviews-ti .ti-widget .ti-review-content{
  font-family: var(--display) !important;
  font-size: clamp(1rem, 1.25vw, 1.15rem) !important;
  line-height: 1.6 !important;
  font-style: italic !important;
  color: var(--on-dark) !important;
  text-align: center !important;
  -webkit-line-clamp: 3 !important;
}

body .reviews-ti .ti-widget .ti-read-more{
  display: block !important;
  margin-top: 1.2rem !important;
  font-family: var(--ui) !important;
  font-size: var(--fs-label) !important;
  letter-spacing: var(--ls-label) !important;
  text-transform: uppercase !important;
  color: var(--olive-pale) !important;
  text-align: center !important;
}

body .reviews-ti .ti-widget .ti-read-more:hover{ color: var(--on-dark) !important; }

/* slider arrows: accent only, no button chrome */
body .reviews-ti .ti-widget .ti-next,
body .reviews-ti .ti-widget .ti-prev{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--olive-pale) !important;
}
