/* -------------------------------------------------------
   Blocksy Product Reviews Slider
   Mirrors Blocksy / WooCommerce review visual conventions
------------------------------------------------------- */

.bpr-slider-wrapper {
	--bpr-star-color:   var( --theme-palette-color-1, #f5a623 );
	--bpr-text:         var( --theme-text-color, #333 );
	--bpr-meta:         var( --theme-text-color, #777 );
	--bpr-border:       var( --theme-border-color, #e8e8e8 );
	--bpr-radius:       var( --theme-border-radius, 12px );
	--bpr-btn-size:     40px;
	--bpr-btn-color:    var( --theme-palette-color-1, #1e73be );
	--bpr-bg:           var( --theme-palette-color-8, #fff );

	/* Override Swiper's own navigation color variable so its ::after icons match */
	--swiper-navigation-color: var( --bpr-text );
	--swiper-navigation-size:  13px;

	position: relative;
	width: 100%;
	margin-block: 2rem;
}

/* ---- Link wrapper around each card ---- */
.bpr-review-link {
	display:         block;
	height:          100%;
	text-decoration: none;
	color:           inherit;
	outline-offset:  3px;
}

/* ---- Individual review card ---- */
.bpr-review {
	background:     var( --bpr-bg );
	border:         1px solid var( --bpr-border );
	border-radius:  var( --bpr-radius );
	padding:        2rem;
	display:        flex;
	flex-direction: column;
	gap:            1.25rem;
	height:         100%;
	box-sizing:     border-box;
	position:       relative;
	overflow:       hidden;
	box-shadow:     0 2px 12px rgba( 0, 0, 0, 0.06 );
	transition:     transform 0.3s cubic-bezier( 0.4, 0, 0.2, 1 ), box-shadow 0.3s ease, border-color 0.3s ease;
}

.bpr-review-link:hover .bpr-review,
.bpr-review-link:focus-visible .bpr-review {
	transform:    translateY( -4px );
	box-shadow:   0 12px 30px rgba( 0, 0, 0, 0.1 );
	border-color: transparent;
}

/* Decorative opening quote — top-right corner */
.bpr-review::before {
	content:           "";
	position:          absolute;
	top:               1.25rem;
	right:             1.25rem;
	width:             48px;
	height:            38px;
	background-image:  url("data:image/svg+xml,%3Csvg width='48' height='38' viewBox='0 0 40 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 18.6667H8.88889L4.44444 32H13.3333L17.7778 18.6667V0H0V18.6667ZM22.2222 0V18.6667H31.1111L26.6667 32H35.5556L40 18.6667V0H22.2222Z' fill='%23000' fill-opacity='0.08'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size:   contain;
	pointer-events:    none;
}

/* ---- Star rating — reuses WooCommerce .star-rating styles ---- */
.bpr-stars.star-rating {
	font-size:    1em;
	margin-block: 0 0.25rem;
}

/* Fallback if WooCommerce star CSS is not present */
.bpr-stars.star-rating::before,
.bpr-stars.star-rating span::before {
	color: var( --bpr-star-color );
}

/* ---- Review text ---- */
.bpr-content {
	color:       var( --bpr-text );
	font-size:   1rem;
	line-height: 1.65;
	flex:        1;
}

.bpr-content p:last-child {
	margin-bottom: 0;
}

/* ---- Footer: avatar + author + date ---- */
.bpr-footer {
	border-top:  1px solid var( --bpr-border );
	padding-top: 1rem;
}

.bpr-author-wrap {
	display:     flex;
	align-items: center;
	gap:         0.75rem;
}

.bpr-avatar {
	border-radius: 50%;
	flex-shrink:   0;
}

.bpr-author-meta {
	display:        flex;
	flex-direction: column;
	gap:            0.1rem;
}

.bpr-author-name {
	font-weight: 600;
	color:       var( --bpr-text );
	font-size:   0.9rem;
}

.bpr-date {
	color:     var( --bpr-meta );
	font-size: 0.8rem;
}

/* ---- Navigation buttons — base (Swiper absolute positioning overridden) ---- */
.swiper-button-prev.bpr-btn-prev,
.swiper-button-next.bpr-btn-next {
	position:      static;
	width:         var( --bpr-btn-size );
	height:        var( --bpr-btn-size );
	margin-top:    0;
	border-radius: 50%;
	background:    var( --bpr-bg );
	border:        1px solid var( --bpr-border );
	box-shadow:    0 2px 8px rgba( 0, 0, 0, 0.1 );
	color:         var( --bpr-text );
	flex-shrink:   0;
	transition:    background 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s;
}

.swiper-button-prev.bpr-btn-prev::after,
.swiper-button-next.bpr-btn-next::after {
	font-size:   13px;
	font-weight: 700;
	color:       var( --bpr-text );
}

.swiper-button-prev.bpr-btn-prev:hover,
.swiper-button-next.bpr-btn-next:hover {
	background:   var( --bpr-bg );
	border-color: var( --bpr-border );
	box-shadow:   0 4px 14px rgba( 0, 0, 0, 0.15 );
	color:        var( --bpr-text );
}

/* ---- Controls wrapper (arrows + dots) ---- */
.bpr-controls {
	margin-top: 1rem;
}

.bpr-nav {
	display: flex;
	gap:     8px;
}

/* ---- Pagination dots ---- */
.bpr-pagination {
	position:   relative;
	bottom:     auto;
	text-align: center;
}

.bpr-pagination .swiper-pagination-bullet {
	background:  var( --bpr-border );
	opacity:     1;
	width:       8px;
	height:      8px;
	transition:  background 0.3s, transform 0.3s;
}

.bpr-pagination .swiper-pagination-bullet:hover {
	transform: scale( 1.25 );
}

.bpr-pagination .swiper-pagination-bullet-active {
	background: var( --bpr-btn-color );
	transform:  scale( 1.25 );
}

/* ======================================================
   Arrow style variants
   ====================================================== */

/* ---- A: inline-dots  ← • • • → ---- */
.bpr-slider-wrapper[data-nav-style="inline-dots"]:has( .bpr-nav ) .bpr-controls {
	display:         flex;
	align-items:     center;
	justify-content: center;
	gap:             12px;
}

.bpr-slider-wrapper[data-nav-style="inline-dots"] .bpr-nav {
	display: contents;
}

.bpr-slider-wrapper[data-nav-style="inline-dots"] .bpr-btn-prev { order: 1; }
.bpr-slider-wrapper[data-nav-style="inline-dots"] .bpr-pagination { order: 2; }
.bpr-slider-wrapper[data-nav-style="inline-dots"] .bpr-btn-next  { order: 3; }

/* ---- B: top-right — arrows pinned above slider ---- */
.bpr-slider-wrapper[data-nav-style="top-right"]:has( .bpr-nav ) {
	padding-top: calc( var( --bpr-btn-size ) + 12px );
}

.bpr-slider-wrapper[data-nav-style="top-right"] .bpr-controls {
	text-align: center;
}

.bpr-slider-wrapper[data-nav-style="top-right"] .bpr-nav {
	position: absolute;
	top:      0;
	right:    0;
}

.bpr-slider-wrapper[data-nav-style="top-right"] .bpr-btn-prev,
.bpr-slider-wrapper[data-nav-style="top-right"] .bpr-btn-next {
	background: transparent;
	border:     none;
	box-shadow: none;
	color:      var( --bpr-btn-color );
}

.bpr-slider-wrapper[data-nav-style="top-right"] .bpr-btn-prev:hover,
.bpr-slider-wrapper[data-nav-style="top-right"] .bpr-btn-next:hover {
	background: transparent;
	box-shadow: none;
	color:      var( --bpr-text );
}

/* ---- B2: top-left — arrows pinned above slider, left side ---- */
.bpr-slider-wrapper[data-nav-style="top-left"]:has( .bpr-nav ) {
	padding-top: calc( var( --bpr-btn-size ) + 12px );
}

.bpr-slider-wrapper[data-nav-style="top-left"] .bpr-controls {
	text-align: center;
}

.bpr-slider-wrapper[data-nav-style="top-left"] .bpr-nav {
	position: absolute;
	top:      0;
	left:     0;
}

.bpr-slider-wrapper[data-nav-style="top-left"] .bpr-btn-prev,
.bpr-slider-wrapper[data-nav-style="top-left"] .bpr-btn-next {
	background: transparent;
	border:     none;
	box-shadow: none;
	color:      var( --bpr-btn-color );
}

.bpr-slider-wrapper[data-nav-style="top-left"] .bpr-btn-prev:hover,
.bpr-slider-wrapper[data-nav-style="top-left"] .bpr-btn-next:hover {
	background: transparent;
	box-shadow: none;
	color:      var( --bpr-text );
}

/* ---- B3: top-center — arrows centered above slider ---- */
.bpr-slider-wrapper[data-nav-style="top-center"]:has( .bpr-nav ) {
	padding-top: calc( var( --bpr-btn-size ) + 12px );
}

.bpr-slider-wrapper[data-nav-style="top-center"] .bpr-controls {
	text-align: center;
}

.bpr-slider-wrapper[data-nav-style="top-center"] .bpr-nav {
	position:        absolute;
	top:             0;
	left:            50%;
	transform:       translateX( -50% );
}

.bpr-slider-wrapper[data-nav-style="top-center"] .bpr-btn-prev,
.bpr-slider-wrapper[data-nav-style="top-center"] .bpr-btn-next {
	background: transparent;
	border:     none;
	box-shadow: none;
	color:      var( --bpr-btn-color );
}

.bpr-slider-wrapper[data-nav-style="top-center"] .bpr-btn-prev:hover,
.bpr-slider-wrapper[data-nav-style="top-center"] .bpr-btn-next:hover {
	background: transparent;
	box-shadow: none;
	color:      var( --bpr-text );
}

/* ---- B4: top-split — prev top-left, next top-right ---- */
.bpr-slider-wrapper[data-nav-style="top-split"]:has( .bpr-nav ) {
	padding-top: calc( var( --bpr-btn-size ) + 12px );
}

.bpr-slider-wrapper[data-nav-style="top-split"] .bpr-controls {
	text-align: center;
}

.bpr-slider-wrapper[data-nav-style="top-split"] .bpr-nav {
	display: contents;
}

.bpr-slider-wrapper[data-nav-style="top-split"] .bpr-btn-prev,
.bpr-slider-wrapper[data-nav-style="top-split"] .bpr-btn-next {
	position:   absolute;
	top:        0;
	background: transparent;
	border:     none;
	box-shadow: none;
	color:      var( --bpr-btn-color );
}

.bpr-slider-wrapper[data-nav-style="top-split"] .bpr-btn-prev { left:  0; }
.bpr-slider-wrapper[data-nav-style="top-split"] .bpr-btn-next { right: 0; }

.bpr-slider-wrapper[data-nav-style="top-split"] .bpr-btn-prev:hover,
.bpr-slider-wrapper[data-nav-style="top-split"] .bpr-btn-next:hover {
	background: transparent;
	box-shadow: none;
	color:      var( --bpr-text );
}

/* ---- C: pill — joined [ ← | → ] ---- */
.bpr-slider-wrapper[data-nav-style="pill"]:has( .bpr-nav ) .bpr-controls {
	display:         flex;
	flex-direction:  column;
	align-items:     center;
	gap:             12px;
}

.bpr-slider-wrapper[data-nav-style="pill"] .bpr-nav {
	gap:           0;
	border:        1px solid var( --bpr-border );
	border-radius: 999px;
	overflow:      hidden;
	box-shadow:    0 2px 8px rgba( 0, 0, 0, 0.1 );
}

.bpr-slider-wrapper[data-nav-style="pill"] .bpr-btn-prev,
.bpr-slider-wrapper[data-nav-style="pill"] .bpr-btn-next {
	border:        none;
	border-radius: 0;
	box-shadow:    none;
}

.bpr-slider-wrapper[data-nav-style="pill"] .bpr-btn-prev {
	border-right: 1px solid var( --bpr-border );
}

/* ---- D: minimal — icon only, no chrome ---- */
.bpr-slider-wrapper[data-nav-style="minimal"]:has( .bpr-nav ) .bpr-controls {
	display:         flex;
	align-items:     center;
	justify-content: center;
	gap:             12px;
}

.bpr-slider-wrapper[data-nav-style="minimal"] .bpr-nav {
	display: contents;
}

.bpr-slider-wrapper[data-nav-style="minimal"] .bpr-btn-prev { order: 1; }
.bpr-slider-wrapper[data-nav-style="minimal"] .bpr-pagination { order: 2; }
.bpr-slider-wrapper[data-nav-style="minimal"] .bpr-btn-next  { order: 3; }

.bpr-slider-wrapper[data-nav-style="minimal"] .bpr-btn-prev,
.bpr-slider-wrapper[data-nav-style="minimal"] .bpr-btn-next {
	background: transparent;
	border:     none;
	box-shadow: none;
	color:      var( --bpr-btn-color );
}

.bpr-slider-wrapper[data-nav-style="minimal"] .bpr-btn-prev:hover,
.bpr-slider-wrapper[data-nav-style="minimal"] .bpr-btn-next:hover {
	background: transparent;
	box-shadow: none;
	color:      var( --bpr-text );
}

/* ---- Verified Client badge ---- */
.bpr-verified {
	display:        flex;
	align-items:    center;
	gap:            0.35rem;
	margin-bottom:  0.25rem;
}

.bpr-verified__icon {
	width:      14px;
	height:     14px;
	flex-shrink: 0;
	color:      #22a06b;
}

.bpr-verified__text {
	font-size:   0.75rem;
	font-weight: 500;
	color:       #22a06b;
	line-height: 1;
}

/* ---- Responsive ---- */
@media ( max-width: 767px ) {
	.bpr-review {
		padding: 1.25rem;
	}

	.bpr-swiper {
		padding-inline: 2px;
	}
}