/**
 * PDP Summary Section Styles
 * Right side hero section of Product Detail Page
 *
 * @package Onviqa
 * @since 1.0.0
 */

/* ==========================================================================
   Mobile Intro Section - Hidden on Desktop, Visible on Mobile only
   ========================================================================== */

.ksq-mobile-intro {
	display: none;
}

.ksq-mobile-trustpilot {
	display: none;
}

@media (max-width: 1024px) {
	.ksq-mobile-intro {
		display: block;
	}
	
	.ksq-mobile-trustpilot {
		display: block;
	}
}

/* ==========================================================================
   PDP Container - 1440px max-width for Desktop
   ========================================================================== */

/* Main product page container */
.single-product .woocommerce-container {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 24px;
	padding-right: 24px;
	box-sizing: border-box;
}

/* Ensure single product layout respects container */
.single-product .single-product-layout {
	max-width: 100%;
}

/* Full-width sections - break out of container but content stays 1440px */
.single-product .ksq-promise-section__container,
.single-product .ksq-diamond-tester-section__container,
.single-product .ksq-similar-products__container {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 24px;
	padding-right: 24px;
	box-sizing: border-box;
}

/* Responsive - keep 1440px on larger screens */
@media (min-width: 1488px) {
	.single-product .woocommerce-container {
		padding-left: 0;
		padding-right: 0;
	}
	
	.single-product .ksq-promise-section__container,
	.single-product .ksq-diamond-tester-section__container,
	.single-product .ksq-similar-products__container {
		padding-left: 0;
		padding-right: 0;
	}
}

/* ==========================================================================
   Star Rating - Clean Minimal Styling
   ========================================================================== */

.ksq-pdp-rating {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
}

.ksq-pdp-rating__stars {
	display: flex;
	gap: 0;
	align-items: center;
	width: auto;
	height: 20px;
}

.ksq-pdp-rating__star {
	width: 20px;
	height: 20px;
	color: #DCDCE6;
	display: block;
}

.ksq-pdp-rating__star svg {
	display: block;
	width: 100%;
	height: 100%;
}

.ksq-pdp-rating__star.filled {
	color: #FFA033;
}

/* Rating Text - Figma Typography */
.ksq-pdp-rating__text {
	color: #444;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

/* Parent anchor - Remove default hover underline */
a.ksq-pdp-rating {
	text-decoration: none !important;
}

a.ksq-pdp-rating:hover,
a.ksq-pdp-rating:focus {
	text-decoration: none !important;
}

/* Happy Customers Link - Figma Typography with dotted underline */
.ksq-pdp-rating__link {
	color: #444;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	text-decoration-line: underline;
	text-decoration-style: dotted;
	text-decoration-skip-ink: auto;
	text-decoration-thickness: 12%;
	text-underline-offset: 25%;
	text-underline-position: from-font;
	transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

/* On hover of parent anchor, change the span's color to orange */
a.ksq-pdp-rating:hover .ksq-pdp-rating__link {
	color: #FF5100;
	text-decoration-color: #FF5100;
}

/* ==========================================================================
   Product Title (from WooCommerce) - Figma Matched
   ========================================================================== */

.single-product-layout__summary .product_title {
	max-width: 598px;
	color: #111;
	font-family: "DM Serif Display", Georgia, "Times New Roman", serif;
	font-size: 32px;
	font-style: normal;
	font-weight: 400;
	line-height: 38px; /* 118.75% */
	margin-bottom: 12px; /* 12px between title and description */
}

/* ==========================================================================
   Short Description - Figma Matched
   ========================================================================== */

.ksq-pdp-description {
	margin-bottom: 32px; /* 32px between description and price */
	align-self: stretch;
}

.ksq-pdp-description__text {
	color: #666;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 22px; /* 137.5% */
	margin: 0;
}

.ksq-pdp-description__readmore {
	color: #FF5100;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 22px;
	text-decoration-line: underline;
	text-decoration-style: dotted;
	text-decoration-skip-ink: auto;
	text-decoration-color: #AAA;
	text-decoration-thickness: 12%;
	text-underline-offset: 25%;
	text-underline-position: from-font;
	cursor: pointer;
	transition: color 0.2s ease;
}

.ksq-pdp-description__readmore:hover {
	color: #E54900;
	text-decoration-color: #FF5100;
}

/* ==========================================================================
   Price Section - Figma Matched
   Frame 1437258676: gap: 20px between price amounts and badge
   ========================================================================== */

.ksq-pdp-price {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
	margin-bottom: 12px; /* 12px between price and installment bar */
}

/* Price row container */
.ksq-pdp-price__row {
	display: flex;
	align-items: center;
	gap: 16px; /* Figma: 16px gap between amounts and badge */
	flex-wrap: wrap;
}

/* Frame 1437258580: price amounts container */
.ksq-pdp-price__amounts {
	display: flex;
	align-items: center;
	gap: 8px; /* Figma: 8px between current and regular price */
}

/* Sale Price (Current Price) */
.ksq-pdp-price__current {
	color: #FF5100;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 28px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
}

/* Compare Price (Regular/Strikethrough) */
.ksq-pdp-price__regular {
	color: #888;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 28px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	text-decoration-line: line-through;
}

/* % Off Badge */
.ksq-pdp-price__badge {
	display: flex;
	padding: 4px 12px;
	justify-content: center;
	align-items: center;
	gap: 8px;
	border-radius: 60px;
	background: #FFA033;
	border: none;
	
	/* Badge Text */
	color: #4E2104;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

/* ==========================================================================
   BNPL Banner (Buy Now Pay Later) - Figma Matched
   Group 1437258854: width: 454px, height: 32px
   ========================================================================== */

.ksq-pdp-bnpl {
	display: flex;
	align-items: center;
	gap: 8px; /* Figma: 8px gap */
	width: 454px;
	max-width: 100%;
	height: 32px;
	border-radius: 4px;
	background: #F0F4F8;
	margin-bottom: 36px; /* 36px between installment pay and 3 features */
	padding: 0 12px;
	box-sizing: border-box;
}

.ksq-pdp-bnpl__logo-wrapper {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}

.ksq-pdp-bnpl__logos {
	position: relative;
	display: flex;
	align-items: center;
	width: 44px;
	height: 18px;
}

.ksq-pdp-bnpl__logo {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	transition: opacity 0.3s ease;
	display: flex;
	align-items: center;
}

.ksq-pdp-bnpl__logo.active {
	opacity: 1;
}

.ksq-pdp-bnpl__logo img {
	width: 44px;
	height: 18px;
	aspect-ratio: 22/9;
	object-fit: contain;
}

.ksq-pdp-bnpl__logo svg {
	width: 44px;
	height: 18px;
	aspect-ratio: 22/9;
}

.ksq-pdp-bnpl__logo-text {
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: #444;
}

/* Text inside box - single line */
.ksq-pdp-bnpl__text {
	color: #444;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	white-space: nowrap;
}

/* Learn More link */
.ksq-pdp-bnpl__link {
	color: #111;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	text-decoration-line: underline;
	text-decoration-style: solid;
	text-decoration-skip-ink: auto;
	text-decoration-thickness: auto;
	text-underline-offset: auto;
	text-underline-position: from-font;
	margin-left: 4px;
	transition: color 0.2s ease;
}

.ksq-pdp-bnpl__link:hover {
	color: #FF5100;
}

/* ==========================================================================
   Value Propositions (3 Features) - Figma Matched
   ========================================================================== */

.ksq-pdp-value-props {
	display: flex;
	flex-direction: column;
	gap: 16px; /* 16px gap between all 3 features */
	margin-bottom: 36px; /* 36px between 3 features and video slider */
}

.ksq-pdp-value-prop {
	display: flex;
	align-items: center;
	gap: 14px;
}

/* Feature Icon */
.ksq-pdp-value-prop__icon {
	display: flex;
	width: 28px;
	height: 28px;
	padding: 2.333px 5.833px;
	justify-content: center;
	align-items: center;
	aspect-ratio: 1/1;
	color: #222;
	flex-shrink: 0;
}

.ksq-pdp-value-prop__icon svg {
	width: 28px !important;
	height: 28px !important;
	min-width: 28px !important;
	min-height: 28px !important;
	max-width: 28px !important;
	max-height: 28px !important;
}

/* Feature Text */
.ksq-pdp-value-prop__text {
	color: #222;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}

/* ==========================================================================
   Testimonial Video Blocks - Figma Matched
   ========================================================================== */

.ksq-pdp-testimonials {
	margin-bottom: 36px;
	max-width: 100%;
}

.ksq-pdp-testimonials__grid {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	overflow-x: auto;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding: 6px 0;
	margin: -6px 0;
}

.ksq-pdp-testimonials__grid::-webkit-scrollbar {
	display: none;
}

/* Individual Video Thumbnail - Round Circle */
.ksq-pdp-testimonial-thumb {
	position: relative;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	border: none;
	overflow: hidden;
	cursor: pointer;
	background: linear-gradient(135deg, #f0f0f0 0%, #e0e0e0 100%);
	padding: 0;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	flex-shrink: 0;
}

.ksq-pdp-testimonial-thumb:hover {
	transform: scale(1.05);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Thumbnail Image */
.ksq-pdp-testimonial-thumb__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Video as Thumbnail (for MP4) */
.ksq-pdp-testimonial-thumb__video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	pointer-events: none;
}

/* Placeholder (when no thumbnail) - Varied colors for visual interest */
.ksq-pdp-testimonial-thumb__placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-size: 32px;
	font-weight: 700;
	color: #fff;
	background: linear-gradient(135deg, #FF6B35 0%, #F7931A 100%);
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

/* Alternate colors for variety */
.ksq-pdp-testimonial-thumb:nth-child(2) .ksq-pdp-testimonial-thumb__placeholder {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.ksq-pdp-testimonial-thumb:nth-child(3) .ksq-pdp-testimonial-thumb__placeholder {
	background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
}

.ksq-pdp-testimonial-thumb:nth-child(4) .ksq-pdp-testimonial-thumb__placeholder {
	background: linear-gradient(135deg, #ee0979 0%, #ff6a00 100%);
}

.ksq-pdp-testimonial-thumb:nth-child(5) .ksq-pdp-testimonial-thumb__placeholder {
	background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
}

/* Play Button - Centered */
.ksq-pdp-testimonial-thumb__play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
	pointer-events: none;
}

.ksq-pdp-testimonial-thumb__play svg {
	width: 24px;
	height: 24px;
	aspect-ratio: 1/1;
	fill: #FF5100;
}

.ksq-pdp-testimonial-thumb:hover .ksq-pdp-testimonial-thumb__play svg {
	filter: drop-shadow(0 0 6px rgba(255, 81, 0, 0.8));
}

/* ==========================================================================
   Testimonial Modal - Enhanced Carousel Design
   ========================================================================== */

.ksq-testimonial-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10001;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.ksq-testimonial-modal[aria-hidden="false"] {
	display: flex;
}

.ksq-testimonial-modal__overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.92);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

/* Close Button - Fixed Position */
.ksq-testimonial-modal__close {
	position: fixed;
	top: 20px;
	right: 20px;
	width: 44px;
	height: 44px;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 50%;
	color: #fff;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 100;
	transition: all 0.2s ease;
}

.ksq-testimonial-modal__close:hover {
	background: rgba(255, 255, 255, 0.2);
	transform: scale(1.05);
}

/* Carousel Container */
.ksq-testimonial-modal__carousel {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 24px;
	z-index: 1;
	max-width: 100%;
	padding: 0 80px;
}

/* Main Content Card */
.ksq-testimonial-modal__content {
	position: relative;
	width: 380px;
	max-width: 90vw;
	background: #fff;
	border-radius: 20px;
	overflow: hidden;
	box-shadow: 0 25px 80px rgba(0, 0, 0, 0.5);
	flex-shrink: 0;
	transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease;
}

/* Slide Animations */
.ksq-testimonial-modal__content.slide-out-left {
	transform: translateX(-120%) scale(0.85);
	opacity: 0;
}

.ksq-testimonial-modal__content.slide-out-right {
	transform: translateX(120%) scale(0.85);
	opacity: 0;
}

.ksq-testimonial-modal__content.slide-in-from-right {
	animation: slideInFromRight 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.ksq-testimonial-modal__content.slide-in-from-left {
	animation: slideInFromLeft 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes slideInFromRight {
	0% {
		transform: translateX(80%) scale(0.8);
		opacity: 0;
	}
	100% {
		transform: translateX(0) scale(1);
		opacity: 1;
	}
}

@keyframes slideInFromLeft {
	0% {
		transform: translateX(-80%) scale(0.8);
		opacity: 0;
	}
	100% {
		transform: translateX(0) scale(1);
		opacity: 1;
	}
}

/* Video Container */
.ksq-testimonial-modal__video {
	position: relative;
	width: 100%;
	aspect-ratio: 9/16;
	max-height: 55vh;
	background: #000;
	overflow: hidden;
}

.ksq-testimonial-modal__video-player {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Hide default video controls initially, show on hover/playing */
.ksq-testimonial-modal__video-player::-webkit-media-controls {
	opacity: 0;
	transition: opacity 0.3s ease;
}

.ksq-testimonial-modal__video:hover .ksq-testimonial-modal__video-player::-webkit-media-controls {
	opacity: 1;
}

/* Play Button Overlay - Hides when video is playing */
.ksq-testimonial-modal__play-btn {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 72px;
	height: 72px;
	background: rgba(0, 0, 0, 0.4);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s ease;
	z-index: 5;
}

.ksq-testimonial-modal__play-btn:hover {
	background: rgba(0, 0, 0, 0.6);
	transform: translate(-50%, -50%) scale(1.1);
}

.ksq-testimonial-modal__play-btn svg {
	margin-left: 4px;
}

/* Hide play button when video is playing */
.ksq-testimonial-modal__video.is-playing .ksq-testimonial-modal__play-btn {
	opacity: 0;
	pointer-events: none;
}

/* Info Section with Quote Styling */
.ksq-testimonial-modal__info {
	padding: 24px;
	background: #fff;
}

/* Star Rating */
.ksq-testimonial-modal__stars {
	display: flex;
	gap: 2px;
	margin-bottom: 16px;
}

.ksq-testimonial-modal__stars svg {
	width: 18px;
	height: 18px;
}

.ksq-testimonial-modal__stars svg.empty {
	fill: #DCDCE6;
}

/* Quote Block */
.ksq-testimonial-modal__quote {
	position: relative;
	margin: 0 0 20px;
	padding: 0;
	border: none;
}

.ksq-testimonial-modal__quote-icon {
	position: absolute;
	top: -8px;
	left: -4px;
	width: 32px;
	height: 32px;
	opacity: 0.15;
}

.ksq-testimonial-modal__text {
	font-family: "Playfair Display", "DM Serif Display", Georgia, serif;
	font-size: 18px;
	font-style: italic;
	font-weight: 400;
	line-height: 1.6;
	color: #333;
	margin: 0;
	padding-left: 8px;
	position: relative;
}

.ksq-testimonial-modal__text::before {
	content: '"';
	font-size: 24px;
	color: #FF5100;
	font-weight: 600;
}

.ksq-testimonial-modal__text::after {
	content: '"';
	font-size: 24px;
	color: #FF5100;
	font-weight: 600;
}

/* Author Info with Flag */
.ksq-testimonial-modal__author {
	display: flex;
	align-items: center;
	gap: 12px;
	padding-top: 16px;
	border-top: 1px solid #F0F0F0;
}

.ksq-testimonial-modal__flag {
	width: 32px;
	height: 24px;
	border-radius: 4px;
	background-size: cover;
	background-position: center;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
	flex-shrink: 0;
}

.ksq-testimonial-modal__author-details {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.ksq-testimonial-modal__name {
	font-family: "Roboto Flex", sans-serif;
	font-weight: 600;
	font-size: 16px;
	color: #111;
}

.ksq-testimonial-modal__location {
	font-family: "Roboto Flex", sans-serif;
	font-size: 13px;
	color: #666;
}

/* Linked Product Block */
.ksq-testimonial-modal__product {
	display: block;
	margin-top: 16px;
	padding: 12px;
	background: linear-gradient(135deg, #f8f8f8 0%, #f0f0f0 100%);
	border-radius: 12px;
	text-decoration: none;
	transition: all 0.2s ease;
	border: 1px solid rgba(0, 0, 0, 0.06);
}

.ksq-testimonial-modal__product:hover {
	background: linear-gradient(135deg, #f0f0f0 0%, #e8e8e8 100%);
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.ksq-testimonial-modal__product-label {
	display: block;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.8px;
	color: #999;
	margin-bottom: 8px;
}

.ksq-testimonial-modal__product-inner {
	display: flex;
	align-items: center;
	gap: 10px;
}

.ksq-testimonial-modal__product-img {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: 8px;
	flex-shrink: 0;
	border: 1px solid rgba(0, 0, 0, 0.08);
	background: #fff;
}

.ksq-testimonial-modal__product-info {
	flex: 1;
	min-width: 0;
}

.ksq-testimonial-modal__product-name {
	display: block;
	font-family: "Roboto Flex", sans-serif;
	font-size: 13px;
	font-weight: 600;
	color: #222;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 1.3;
}

.ksq-testimonial-modal__product-price {
	display: block;
	font-size: 12px;
	font-weight: 500;
	color: #FF5100;
	margin-top: 2px;
}

.ksq-testimonial-modal__product-price del {
	color: #999;
	font-weight: 400;
	margin-right: 4px;
}

.ksq-testimonial-modal__product-price ins {
	text-decoration: none;
	color: #FF5100;
}

.ksq-testimonial-modal__product-arrow {
	flex-shrink: 0;
	color: #999;
	transition: transform 0.2s ease;
}

.ksq-testimonial-modal__product:hover .ksq-testimonial-modal__product-arrow {
	transform: translateX(2px);
	color: #FF5100;
}

/* Preview Cards (Prev/Next) - 2 on each side with size progression */
.ksq-testimonial-modal__preview {
	position: relative;
	border-radius: 16px;
	overflow: hidden;
	cursor: pointer;
	flex-shrink: 0;
	transition: all 0.3s ease;
}

/* Inner previews (prev-1 and next-1) - medium size (1.5x of outer) */
.ksq-testimonial-modal__preview--prev-1,
.ksq-testimonial-modal__preview--next-1 {
	width: 150px;
	height: 300px;
	opacity: 0.6;
	filter: blur(2px);
}

/* Outer previews (prev-2 and next-2) - smallest size */
.ksq-testimonial-modal__preview--prev-2,
.ksq-testimonial-modal__preview--next-2 {
	width: 100px;
	height: 200px;
	opacity: 0.35;
	filter: blur(4px);
}

.ksq-testimonial-modal__preview--prev-1:hover,
.ksq-testimonial-modal__preview--next-1:hover {
	opacity: 0.9;
	filter: blur(0);
	transform: scale(1.02);
}

.ksq-testimonial-modal__preview--prev-2:hover,
.ksq-testimonial-modal__preview--next-2:hover {
	opacity: 0.7;
	filter: blur(1px);
	transform: scale(1.05);
}

.ksq-testimonial-modal__preview-inner {
	width: 100%;
	height: 100%;
	background: #1a1a1a;
	border-radius: 16px;
	overflow: hidden;
}

.ksq-testimonial-modal__preview-video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Navigation Buttons */
.ksq-testimonial-modal__nav-btn {
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	width: 52px;
	height: 52px;
	background: rgba(255, 255, 255, 0.95);
	border: none;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #1A1A1A;
	transition: all 0.2s ease;
	z-index: 10;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.ksq-testimonial-modal__nav-btn:hover {
	background: #fff;
	transform: translateY(-50%) scale(1.1);
	box-shadow: 0 6px 25px rgba(0, 0, 0, 0.4);
}

.ksq-testimonial-modal__prev {
	left: 24px;
}

.ksq-testimonial-modal__next {
	right: 24px;
}

/* Responsive - Hide outer previews on medium screens */
@media (max-width: 1200px) {
	.ksq-testimonial-modal__preview--prev-2,
	.ksq-testimonial-modal__preview--next-2 {
		display: none;
	}
}

/* Responsive - Hide all previews on mobile */
@media (max-width: 900px) {
	.ksq-testimonial-modal__preview {
		display: none;
	}
	
	.ksq-testimonial-modal__carousel {
		padding: 0 60px;
	}
	
	.ksq-testimonial-modal__content {
		width: 340px;
	}
}

@media (max-width: 600px) {
	.ksq-testimonial-modal__carousel {
		padding: 0 16px;
	}
	
	.ksq-testimonial-modal__content {
		width: 100%;
		max-width: 100%;
		border-radius: 16px;
	}
	
	.ksq-testimonial-modal__video {
		max-height: 50vh;
	}
	
	.ksq-testimonial-modal__nav-btn {
		width: 44px;
		height: 44px;
	}
	
	.ksq-testimonial-modal__prev {
		left: 12px;
	}
	
	.ksq-testimonial-modal__next {
		right: 12px;
	}
	
	.ksq-testimonial-modal__close {
		top: 12px;
		right: 12px;
		width: 40px;
		height: 40px;
	}
	
	.ksq-testimonial-modal__info {
		padding: 20px;
	}
	
	.ksq-testimonial-modal__text {
		font-size: 16px;
	}
}

/* ==========================================================================
   Variant Selection Cards - Figma Matched
   Component 2: width: 452px, gap: 16px label-to-options
   ========================================================================== */

.ksq-pdp-variants {
	display: flex;
	width: 452px;
	max-width: 100%;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	margin-top: -10px; /* Move variant selector up */
	margin-bottom: 32px; /* Figma: 32px gap before next section */
}

/* Shown by pdp-summary.js when the selected options have no matching variation */
.ksq-pdp-variants__notice {
	margin: 4px 0 0;
	color: #D92D20;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 14px;
	line-height: 1.4;
}

/* "Name on pendant" field above Add to Bag (inc/pendant-name-field.php) */
.ksq-pendant-name {
	width: 598px;
	max-width: 100%;
	margin: 0 0 20px;
}

.ksq-pendant-name__label {
	display: block;
	margin: 0 0 12px;
	color: #111;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	font-weight: 500;
	line-height: normal;
}

.ksq-pendant-name__required {
	color: #D92D20;
}

/* .ksq-pendant-name prefix: beats the site-wide input[type="text"] / :focus rules (black focus border) */
.ksq-pendant-name .ksq-pendant-name__input {
	display: block;
	width: 100%;
	height: 52px;
	padding: 0 16px;
	border: 1px solid #DDDDDD;
	border-radius: 8px;
	background: #FFFFFF;
	color: #111;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px; /* 16px: iOS zooms into smaller fields */
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
}

.ksq-pendant-name .ksq-pendant-name__input:focus {
	outline: none;
	border-color: #FF5100;
	box-shadow: 0 0 0 3px rgba(255, 81, 0, 0.12);
}

.ksq-pendant-name__help {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	margin-top: 6px;
	color: #777;
	font-size: 13px;
	line-height: 1.4;
}

.ksq-pendant-name__error {
	margin: 6px 0 0;
	color: #D92D20;
	font-size: 14px;
	line-height: 1.4;
}

.ksq-pendant-name.has-error .ksq-pendant-name__input,
.ksq-pendant-name.has-error .ksq-pendant-name__input:focus {
	border-color: #D92D20;
	box-shadow: 0 0 0 3px rgba(217, 45, 32, 0.12);
}

@media (max-width: 1024px) {
	.ksq-pendant-name {
		width: 100%;
		margin-bottom: 16px;
	}

	.ksq-pendant-name__label {
		font-size: 14px;
	}
}

/* Chain length guide (inc/length-guide.php): ruler icon + "Size Guide" right after "Choose Length:" */
.ksq-pdp-variants__label:has(.ksq-length-guide-link__btn) {
	display: flex;
	align-items: center;
	gap: 12px;
}

.ksq-length-guide-link__btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 10px 0; /* bigger tap area without moving the text */
	margin: -10px 0;
	color: #FF5100;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	white-space: nowrap;
}

/* stay orange on hover / tap (a global a:hover rule turns links black, and stays on touch screens) */
.ksq-length-guide-link__btn:hover,
.ksq-length-guide-link__btn:focus,
.ksq-length-guide-link__btn:active {
	color: #FF5100;
}

.ksq-length-guide-link__icon {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
}

.ksq-length-guide-link__text {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Tablet + phone: smaller link and icon */
@media (max-width: 1024px) {
	.ksq-length-guide-link__btn {
		gap: 4px;
		font-size: 12px;
	}

	.ksq-length-guide-link__icon {
		width: 15px;
		height: 15px;
	}
}

/* Popup: shown with :target (no JS needed), closed by links to #_ */
.ksq-length-guide {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 100002; /* above the side cart (99999) and confetti (100001) */
	align-items: center;
	justify-content: center;
	padding: 16px;
}

.ksq-length-guide:target {
	display: flex;
}

.ksq-length-guide__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
}

.ksq-length-guide__inner {
	position: relative;
	width: min(560px, 100%);
	max-height: calc(100dvh - 32px);
	padding: 16px 20px 20px;
	border-radius: 16px;
	background: #FFFFFF;
	color: #111;
	overflow: auto;
	overscroll-behavior: contain;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.ksq-length-guide__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 8px;
}

.ksq-length-guide__title {
	margin: 0;
	font-size: 22px;
	font-weight: 600;
	line-height: 1.2;
}

.ksq-length-guide__close {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #F2F2F2;
	color: #111;
	font-size: 26px;
	line-height: 1;
	text-decoration: none;
}

.ksq-length-guide__diagram {
	display: block;
	width: 100%;
	max-width: 340px;
	border-radius: 14px;
	height: auto;
	margin: 0 auto 12px;
}

.ksq-length-guide__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}

.ksq-length-guide__table th,
.ksq-length-guide__table td {
	padding: 8px 6px;
	border-bottom: 1px solid #EEEEEE;
	text-align: left;
	vertical-align: top;
}

.ksq-length-guide__table th {
	color: #777;
	font-weight: 500;
}

.ksq-length-guide__table td:first-child {
	font-weight: 600;
	white-space: nowrap;
}

.ksq-length-guide__table tr.is-popular td {
	color: #FF5100;
}

.ksq-length-guide__cm {
	color: #888;
	font-size: 12px;
	font-weight: 400;
}

.ksq-length-guide__tip {
	margin: 14px 0 0;
	padding: 12px 14px;
	border-radius: 8px;
	background: #FAFAFA;
	color: #555;
	font-size: 13px;
	line-height: 1.5;
}

/* Overrides the orange :disabled "adding" look in pdp-mobile.css (loaded later, so needs higher specificity) */
.ksq-pdp-add-btn.is-unavailable:disabled,
.ksq-sticky-bar__btn.is-unavailable:disabled,
.ksq-diamond-tester-section__btn.is-unavailable:disabled {
	background: #BDBDBD !important;
	border-color: #BDBDBD !important;
	opacity: 1 !important;
	cursor: not-allowed;
}

.ksq-pdp-variants__label {
	align-self: stretch;
	color: #111;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	margin: 0;
}

.ksq-pdp-variants__options {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	width: 100%;
}

.ksq-pdp-variant {
	cursor: pointer;
}

.ksq-pdp-variant input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

/* Variation Card - Figma: Rectangle 3465802 */
.ksq-pdp-variant__card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	width: 220px;
	height: 67px;
	padding: 12px 12px 12px 60px; /* top: 12, right: 12, bottom: 12, left: 60 (20 + 24 icon + 16 gap) */
	border-radius: 8px;
	border: 1px solid #DDDDDD; /* Figma: inactive state 1px #DDDDDD */
	background: #FFF;
	transition: all 0.2s ease;
	position: relative;
	box-sizing: border-box;
}

/* Active/Selected State */
.ksq-pdp-variant input:checked + .ksq-pdp-variant__card {
	border-radius: 8px !important;
	border: 2px solid #FF5100 !important;
	background: linear-gradient(0deg, rgba(255, 81, 0, 0.04) 0%, rgba(255, 81, 0, 0.04) 100%), #FFF !important;
}

.ksq-pdp-variant:hover .ksq-pdp-variant__card {
	border-color: #FF5100;
}

/* Checkbox Circle - Left side - Figma: Ellipse 3494 */
.ksq-pdp-variant__check {
	position: absolute;
	top: 50%;
	left: 20px;
	transform: translateY(-50%);
	width: 24px;
	height: 24px;
	border: 1px solid #CCCCCC; /* Figma: inactive 1px #CCCCCC */
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	transition: all 0.2s ease;
}

/* Hide checkmark SVG for unselected state */
.ksq-pdp-variant__check svg {
	display: none;
}

/* Selected state - remove CSS border, SVG has its own circle */
.ksq-pdp-variant input:checked + .ksq-pdp-variant__card .ksq-pdp-variant__check {
	border: none;
}

/* Show checkmark SVG only for selected state */
.ksq-pdp-variant input:checked + .ksq-pdp-variant__card .ksq-pdp-variant__check svg {
	display: block;
}

/* Variation Name - Main Title */
/* Selected: #FF5100, Unselected: #111111 */
.ksq-pdp-variant__name {
	color: #111111; /* Figma: unselected state */
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 600;
	line-height: 21px; /* Figma: 21px */
	margin: 0;
}

/* Selected state name color */
.ksq-pdp-variant input:checked + .ksq-pdp-variant__card .ksq-pdp-variant__name {
	color: #FF5100;
}

/* Variation Subtitle - Figma: Frame 1437258713 */
.ksq-pdp-variant__sub {
	display: flex;
	align-items: center;
	gap: 6px;
	color: #666666;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px; /* Figma: 16px */
	margin-top: 6px; /* Figma: 6px gap in Frame 1437258714 */
	mix-blend-mode: multiply; /* Figma spec */
}

.ksq-pdp-variant__sub svg {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
	color: #666666;
}

/* Variation Price (if shown separately) */
.ksq-pdp-variant__price {
	display: block;
	font-size: 15px;
	font-weight: 600;
	color: #FF5100;
	margin-top: 4px;
}

/* ==========================================================================
   Add to Bag Button - Figma Matched
   Group 1437258705: width: 598px, height: 60px
   ========================================================================== */

.ksq-pdp-add-to-cart {
	margin-bottom: 0;
}

.ksq-pdp-add-to-cart .cart {
	margin: 0;
}

.ksq-pdp-add-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px; /* Figma: 12px gap */
	width: 598px;
	max-width: 100%;
	height: 60px; /* Figma: 60px */
	padding: 0 24px;
	background: #FF5100; /* Figma: #FF5100 */
	color: #fff;
	border: none;
	border-radius: 12px; /* Figma: 12px */
	cursor: pointer;
	transition: background 0.2s ease;
}

.ksq-pdp-add-btn:hover {
	background: #E54900;
}

.ksq-pdp-add-btn.loading {
	pointer-events: none;
	cursor: not-allowed;
}

.ksq-pdp-add-btn.loading .ksq-pdp-add-btn__icon svg {
	animation: ksq-pdp-icon-pulse 1.2s ease-in-out infinite;
}

@keyframes ksq-pdp-icon-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50% { opacity: 0.5; transform: scale(1.15); }
}

/* "Add to Bag" Text - Figma: Frame 1437258718 */
.ksq-pdp-add-btn__text {
	color: #FFFFFF;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 600;
	line-height: 21px; /* Figma: 21px */
}

/* Separator */
.ksq-pdp-add-btn__sep {
	color: rgba(255, 255, 255, 0.60);
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	font-weight: 400;
}

/* Sale Price (current price on button) */
.ksq-pdp-add-btn__price,
.ksq-pdp-add-btn__price .woocommerce-Price-amount,
.ksq-pdp-add-btn__price .woocommerce-Price-currencySymbol,
.ksq-pdp-add-btn__price bdi {
	color: #FFF;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	text-decoration: none;
}

/* Strikeout Price (compare/original price on button) */
.ksq-pdp-add-btn__strike {
	color: rgba(255, 255, 255, 0.60);
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	text-decoration-line: line-through;
}

.ksq-pdp-add-btn__strike .woocommerce-Price-amount,
.ksq-pdp-add-btn__strike .woocommerce-Price-currencySymbol,
.ksq-pdp-add-btn__strike bdi {
	color: rgba(255, 255, 255, 0.60);
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.ksq-pdp-add-btn--disabled {
	background: #ccc;
	cursor: not-allowed;
}

/* ==========================================================================
   PayPal Smart Buttons (PPCP) - Below Add to Bag
   ========================================================================== */

.ksq-pdp-paypal-buttons {
	width: 598px;
	max-width: 100%;
	margin-top: 12px;
}

.ksq-pdp-paypal-buttons .ppc-button-wrapper {
	width: 100%;
}

.ksq-pdp-paypal-buttons #ppc-button-ppcp-gateway {
	width: 100%;
}

.ksq-pdp-paypal-buttons .ppcp-messages {
	margin-top: 8px;
	text-align: center;
}

/* ==========================================================================
   Shipping Label - Figma Matched
   Frame 1437258683: single row with icon + text + separator + link
   ========================================================================== */

.ksq-pdp-shipping {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	max-width: 598px;
	padding: 0;
	margin-top: 20px;
	color: #444444;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 19px;
	white-space: nowrap;
}

.ksq-pdp-shipping svg {
	width: 24px;
	height: 24px;
	color: #444444;
	flex-shrink: 0;
}

.ksq-pdp-shipping__text {
	color: #444444;
	white-space: nowrap;
}

.ksq-pdp-shipping__sep {
	color: #CCCCCC;
	margin: 0 4px;
}

.ksq-pdp-shipping__link {
	/* Reset button styles */
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	cursor: pointer;
	/* Link styles */
	color: #444444;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 19px;
	text-decoration-line: underline;
	text-decoration-style: dotted;
	text-decoration-skip-ink: auto;
	text-decoration-color: #AAA;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	white-space: nowrap;
	transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

.ksq-pdp-shipping__link:hover {
	color: #FF5100;
	text-decoration-color: #FF5100;
}

.ksq-pdp-shipping__link:focus {
	outline: none;
}

.ksq-pdp-shipping__link:focus-visible {
	outline: 2px solid #FF5100;
	outline-offset: 2px;
	border-radius: 2px;
}

/* ==========================================================================
   Payment Icons - Figma Matched
   Frame 1437258729: width: 292px, height: 56px, gap: 12px
   ========================================================================== */

.ksq-pdp-payments {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 0;
	gap: 12px; /* Figma: 12px */
	width: 100%;
	margin-top: 24px;
}

/* Label: "Buy With Confidence:" - Figma: 292x16 */
.ksq-pdp-payments__label {
	color: #444444;
	text-align: center;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px; /* Figma: 16px */
}

/* Icons Row - Frame 1437258728: 292x28, gap: 8px */
.ksq-pdp-payments__icons {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	padding: 0;
	gap: 8px; /* Figma: 8px */
	width: 100%;
	height: 28px;
}

/* Each payment icon: 42x28 */
.ksq-pdp-payments__icon {
	width: 42px;
	height: 28px;
	flex: none;
	flex-grow: 0;
}

/* Payment icons image: 292px fill × 28px height (combined image with all icons) */
.ksq-pdp-payments__image {
	width: auto;
	max-width: 292px;
	height: 28px;
	object-fit: contain;
	border-radius: 2px;
}

/* Wrapper for centering payment section within summary */
.ksq-pdp-payments-wrapper {
	display: flex;
	justify-content: center;
	width: 100%;
}

.ksq-pdp-payments__placeholder {
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 14px;
	color: #666;
}

/* ==========================================================================
   Review Slider - Figma Matched
   Group 3474074: width: 598px, height: 128px
   Rectangle 1046: background: #F0F4F8, border-radius: 8px
   ========================================================================== */

.ksq-pdp-reviews-slider {
	position: relative;
	margin-top: 24px;
	margin-bottom: 24px;
	width: 598px;
	max-width: 100%;
	height: 132px; /* Figma: 132px */
	background: #F0F4F8; /* Figma: solid #F0F4F8 */
	border: none;
	border-radius: 8px; /* Figma: 8px */
	display: flex;
	align-items: center;
	box-sizing: border-box;
	padding: 20px 38px; /* Figma: 20px top/bottom, 38px left/right */
}

.ksq-pdp-reviews-slider__track {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	box-sizing: border-box;
	cursor: pointer;
	transition: opacity 0.2s ease;
}

.ksq-pdp-reviews-slider__track:hover {
	opacity: 0.9;
}

.ksq-pdp-reviews-slider__track:active {
	opacity: 0.8;
}

.ksq-pdp-review-slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.4s ease-in-out, visibility 0.4s ease-in-out;
	display: flex;
	align-items: center;
	gap: 24px; /* Figma: 24px gap */
	box-sizing: border-box;
	pointer-events: none;
}

.ksq-pdp-review-slide.active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

/* Author Column: Avatar + Name below */
.ksq-pdp-review-slide__author-col {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
}

.ksq-pdp-review-slide__content {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 12px;
	min-width: 0;
	width: 428px;
	max-width: 428px;
}

/* Review Header with Stars, Name and Location - Figma: Group 1437259092 */
.ksq-pdp-review-slide__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: nowrap;
	width: 100%;
	height: 20px;
	margin: 0;
	padding: 0;
}

.ksq-pdp-review-slide__header .ksq-pdp-rating__stars {
	margin: 0;
	padding: 0;
	height: 20px;
	width: auto;
}

/* Stars + Name wrapper - Figma: Frame 1437256375, gap: 8px */
.ksq-pdp-review-slide__stars-name {
	display: flex;
	align-items: center;
	gap: 8px;
	height: 20px;
	margin: 0;
	padding: 0;
}

/* Reviewer name beside stars - Figma: 14px, #666666 */
.ksq-pdp-review-slide__reviewer-name {
	color: #666666;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px;
	white-space: nowrap;
	margin: 0;
	padding: 0;
}

/* Name below avatar - hidden when using new layout with name beside stars */
.ksq-pdp-review-slide__name {
	display: none;
}

/* Review Text - Figma: 428x60, font-weight: 500, line-height: 20px */
.ksq-pdp-review-slide__text {
	display: -webkit-box;
	width: 428px;
	max-width: 100%;
	height: 60px;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	color: #222222;
	text-overflow: ellipsis;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: 20px; /* Figma: 20px or 143% */
	margin: 0;
}

/* Meta Row: Verified Badge */
.ksq-pdp-review-slide__meta {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-top: 2px;
}

.ksq-pdp-review-slide__verified {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: #00B67A;
	font-weight: 500;
	white-space: nowrap;
}

.ksq-pdp-review-slide__verified svg {
	color: #00B67A;
	flex-shrink: 0;
	width: 12px;
	height: 12px;
}

/* Location - on desktop: positioned at right of header */
.ksq-pdp-review-slide__location {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #444444;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px;
	height: 20px;
	flex-shrink: 0;
	margin: 0;
	padding: 0;
}

/* Flag - Figma: 24x14, border-radius: 2px */
.ksq-pdp-review-slide__location .ksq-country-flag {
	width: 24px;
	height: 14px;
	object-fit: cover;
	border-radius: 2px;
	flex-shrink: 0;
}

/* Avatar - Figma: 70x70 Ellipse 17 */
.ksq-pdp-review-slide__avatar {
	width: 70px;
	height: 70px;
	aspect-ratio: 1/1;
	border-radius: 50%;
	object-fit: cover;
	flex-shrink: 0;
	background: #D9D9D9; /* Figma: #D9D9D9 */
}

.ksq-pdp-review-slide__avatar.ksq-avatar-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #D9D9D9; /* Figma: solid placeholder */
	color: #666;
	font-weight: 600;
	font-size: 24px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

/* Navigation Buttons - simple arrows without circles */
.ksq-pdp-reviews-slider__prev,
.ksq-pdp-reviews-slider__next {
	position: absolute !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	width: 24px !important;
	height: 24px !important;
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	cursor: pointer;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	color: #94A3B8 !important;
	transition: color 0.2s ease, transform 0.2s ease !important;
	z-index: 2;
	padding: 0 !important;
}

.ksq-pdp-reviews-slider__prev {
	left: 10px !important;
}

.ksq-pdp-reviews-slider__next {
	right: 10px !important;
}

.ksq-pdp-reviews-slider__prev svg,
.ksq-pdp-reviews-slider__next svg {
	width: 16px !important;
	height: 16px !important;
	stroke-width: 2.5 !important;
}

.ksq-pdp-reviews-slider__prev:hover,
.ksq-pdp-reviews-slider__next:hover {
	background: transparent !important;
	border: none !important;
	color: var(--color-primary) !important;
	transform: translateY(-50%) scale(1.15) !important;
}

/* ==========================================================================
   Accordion Section - Figma Matched
   Frame 1437258733: gap: 24px between items
   Separators: border: 1px solid #DDDDDD (mix-blend-mode: multiply)
   ========================================================================== */

.ksq-pdp-accordion {
	display: flex;
	flex-direction: column;
	gap: 24px; /* Figma: 24px gap */
	width: 598px;
	max-width: 100%;
	margin-top: 36px; /* 36px gap from reviews slider */
	border-top: 1px solid #DDD;
	padding-top: 24px;
}

.ksq-pdp-accordion__item {
	border-bottom: 1px solid #DDD;
	padding-bottom: 24px;
}

.ksq-pdp-accordion__item:last-child {
	border-bottom: 1px solid #DDD;
	padding-bottom: 24px;
}

.ksq-pdp-accordion__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 0;
	background: none;
	border: none;
	cursor: pointer;
	text-align: left;
}

/* Main Accordion Title - Figma Matched */
.ksq-pdp-accordion__title {
	color: #111111;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 20px;
	font-style: normal;
	font-weight: 600;
	line-height: 23px; /* Figma: 23px */
}

.ksq-pdp-accordion__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	aspect-ratio: 1/1;
	flex-shrink: 0;
}

.ksq-pdp-accordion__icon svg {
	width: 16px;
	height: 16px;
	stroke-width: 2px;
	stroke: #111111;
	transition: transform 0.2s ease;
}

.ksq-accordion-vertical {
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.ksq-pdp-accordion__item.active .ksq-accordion-vertical {
	opacity: 0;
	transform: scaleY(0);
}

.ksq-pdp-accordion__content {
	overflow: hidden;
	max-height: 0;
	transition: max-height 0.35s ease-out, opacity 0.25s ease-out;
	opacity: 0;
}

.ksq-pdp-accordion__item.active .ksq-pdp-accordion__content {
	max-height: 5000px; /* CSS fallback; JS sets exact scrollHeight */
	opacity: 1;
	transition: max-height 0.4s ease-in, opacity 0.3s ease-in;
}

/* Remove hidden attribute styling - we use max-height instead */
.ksq-pdp-accordion__content[hidden] {
	display: block !important; /* Override hidden attribute */
}

.ksq-pdp-accordion__body {
	padding-top: 16px;
	padding-bottom: 0;
}

/* Description content wrapper - limit to 5 lines total */
.ksq-pdp-accordion__body-content {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 5;
	overflow: hidden;
}

.ksq-pdp-accordion__body.expanded .ksq-pdp-accordion__body-content {
	display: block;
	-webkit-line-clamp: unset;
	overflow: visible;
}

/* Accordion Text Content - Figma: 558x199 */
.ksq-pdp-accordion__text {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 7; /* ~168px / 24px line-height */
	overflow: hidden;
	width: 558px;
	max-width: 100%;
	color: #666666;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px; /* Figma: 24px or 150% */
}

.ksq-pdp-accordion__text.expanded {
	display: block;
	-webkit-line-clamp: unset;
}

.ksq-pdp-accordion__body p {
	margin: 0 0 12px;
	align-self: stretch;
	color: #666;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 22px;
}

.ksq-pdp-accordion__body p:last-child {
	margin-bottom: 0;
}


.ksq-pdp-accordion__body ul,
.ksq-pdp-accordion__body ol {
	margin: 0 0 12px;
	padding-left: 20px;
	color: #666;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 22px;
}

.ksq-pdp-accordion__body li {
	margin-bottom: 6px;
}

.ksq-pdp-accordion__body strong {
	color: #111;
}

/* AI-optimized description headings */
.ksq-pdp-accordion__body h2 {
	font-size: 18px;
	font-weight: 700;
	color: #111;
	margin: 24px 0 10px;
	padding-bottom: 6px;
	border-bottom: 1px solid #e5e5e5;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	line-height: 1.3;
}

.ksq-pdp-accordion__body h2:first-child {
	margin-top: 0;
}

/* AI-optimized description tables (Specifications) */
.ksq-pdp-accordion__body table {
	width: 100%;
	border-collapse: collapse;
	margin: 8px 0 16px;
}

.ksq-pdp-accordion__body table th,
.ksq-pdp-accordion__body table td {
	text-align: left;
	padding: 6px 10px;
	border-bottom: 1px solid #eee;
	font-size: 14px;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	color: #666;
	line-height: 1.5;
}

.ksq-pdp-accordion__body table th {
	font-weight: 600;
	color: #333;
	white-space: nowrap;
	width: 35%;
}

.ksq-pdp-accordion__body table tr:last-child th,
.ksq-pdp-accordion__body table tr:last-child td {
	border-bottom: none;
}

/* Read More link - Figma: font-weight: 500, text-decoration: underline */
.ksq-pdp-accordion__readmore {
	display: inline-block;
	color: #FF5100;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-weight: 500; /* Figma: 500 */
	line-height: 19px; /* Figma: 19px */
	text-decoration-line: underline;
	text-decoration-style: solid;
	margin-top: 12px;
	padding: 0;
	background: none;
	border: 0;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	transition: color 0.2s ease;
}

/* Hidden by JS when the description already fits within the clamp */
.ksq-pdp-accordion__readmore[hidden] {
	display: none;
}

.ksq-pdp-accordion__readmore:hover {
	color: #E54900;
	text-decoration-color: #FF5100;
}

/* ==========================================================================
   Gem & Case Setting Grid (inside accordion)
   Figma: 3-column grid, 598px wide, cells ~199px each with 1px border
   ========================================================================== */

.ksq-gem-case-grid {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	border-top: 1px solid #E6E9F0;
	border-left: 1px solid #E6E9F0;
	margin-bottom: 2px;
}

.ksq-gem-case-grid__cell {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	width: calc(100% / 3);
	min-height: 93px;
	padding: 24px;
	background: #FFFFFF;
	border-right: 1px solid #E6E9F0;
	border-bottom: 1px solid #E6E9F0;
	box-sizing: border-box;
}

.ksq-gem-case-grid__label {
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 16px;
	color: #666666;
}

.ksq-gem-case-grid__value {
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 600;
	font-size: 17px;
	line-height: 20px;
	color: #111111;
}

/* ==========================================================================
   Brand Products Slider - "You may also like..."
   Frame 2085665135: width: 598px, height: 154px
   ========================================================================== */

.ksq-brand-products {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 0;
	gap: 12px;
	width: 598px;
	max-width: 100%;
	margin-top: 36px; /* 36px gap from accordion */
	overflow: visible;
	position: relative;
}

/* Header with title and dots */
.ksq-brand-products__header {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	padding: 0;
	width: 100%;
	height: 30px;
}

/* Title: DM Serif Display, italic, 22px/30px */
.ksq-brand-products__title {
	font-family: 'DM Serif Display', Georgia, serif;
	font-style: italic;
	font-weight: 400;
	font-size: 22px;
	line-height: 30px;
	color: #111111;
	margin: 0;
}

/* Pagination dots */
.ksq-brand-products__dots {
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 0;
	gap: 4px;
}

.ksq-brand-products__dot {
	width: 6px;
	height: 6px;
	background: #D9D9D9;
	border-radius: 50%;
	transition: background-color 0.3s ease;
	cursor: pointer;
}

.ksq-brand-products__dot.active {
	background: #FF5100;
}

/* Slider container */
.ksq-brand-products__slider {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 0;
	width: 100%;
	overflow: visible;
}

/* Track with horizontal scroll */
.ksq-brand-products__track {
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 0 2px; /* Small padding to prevent cut-off */
	gap: 16px;
	width: 100%;
	overflow-x: auto;
	overflow-y: visible;
	scrollbar-width: none; /* Firefox */
	-ms-overflow-style: none; /* IE/Edge */
	-webkit-overflow-scrolling: touch;
	/* Ensure touch scrolling works */
	touch-action: pan-x;
	scroll-behavior: smooth;
}

.ksq-brand-products__track::-webkit-scrollbar {
	display: none;
}

/* Product card */
.ksq-brand-products__card {
	position: relative;
	width: 408px;
	min-width: 408px;
	height: 112px;
	background: #FFFFFF;
	border: 1px solid #DDDDDD;
	border-radius: 12px;
	flex-shrink: 0;
}

.ksq-brand-products__card-inner {
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 16px;
	gap: 16px;
	height: 100%;
}

/* Product image: 80x80, border-radius 8px */
.ksq-brand-products__image {
	width: 80px;
	height: 80px;
	flex-shrink: 0;
	border-radius: 8px;
	overflow: hidden;
	background: #D9D9D9;
}

.ksq-brand-products__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Product info */
.ksq-brand-products__info {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 0;
	gap: 12px;
	flex: 1;
	min-width: 0;
}

/* Product name: Roboto Flex, 500, 16px/20px */
.ksq-brand-products__name {
	font-family: 'Roboto Flex', sans-serif;
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 20px;
	text-transform: capitalize;
	color: #000000;
	text-decoration: none;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-height: 40px;
	transition: text-decoration 0.2s ease;
}

.ksq-brand-products__name:hover {
	color: #000000;
	text-decoration: underline;
	text-decoration-style: dotted;
	text-decoration-color: #000000;
	text-underline-offset: 3px;
}

/* Price row */
.ksq-brand-products__prices {
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 0;
	gap: 8px;
}

/* Sale price: Roboto Flex, 600, 18px/21px, orange */
.ksq-brand-products__price {
	font-family: 'Roboto Flex', sans-serif;
	font-style: normal;
	font-weight: 600;
	font-size: 18px;
	line-height: 21px;
	text-transform: capitalize;
	color: #FF5100;
}

/* Regular price: Roboto Flex, 400, 18px/21px, gray, strikethrough */
.ksq-brand-products__price-regular {
	font-family: 'Roboto Flex', sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	line-height: 21px;
	text-transform: capitalize;
	color: #888888;
	text-decoration: line-through;
}

/* Add to cart button: 87x35, orange, border-radius 32px */
.ksq-brand-products__add-btn {
	position: absolute;
	right: 16px;
	bottom: 16px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	padding: 8px 20px;
	gap: 8px;
	background: #FF5100;
	border-radius: 32px;
	border: none;
	cursor: pointer;
	transition: background-color 0.2s ease, transform 0.2s ease;
}

.ksq-brand-products__add-btn:hover {
	background: #E54900;
	transform: scale(1.02);
}

.ksq-brand-products__add-btn svg {
	width: 10px;
	height: 10px;
	color: #FFFFFF;
}

.ksq-brand-products__add-btn span {
	font-family: 'Roboto Flex', sans-serif;
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 19px;
	text-transform: capitalize;
	color: #FFFFFF;
}

/* Loading state */
.ksq-brand-products__add-btn.loading {
	pointer-events: none;
	opacity: 0.7;
}

.ksq-brand-products__add-btn.loading span {
	visibility: hidden;
}

.ksq-brand-products__add-btn.loading::after {
	content: '';
	position: absolute;
	width: 16px;
	height: 16px;
	border: 2px solid #fff;
	border-top-color: transparent;
	border-radius: 50%;
	animation: ksq-spin 0.8s linear infinite;
}

@keyframes ksq-spin {
	to { transform: rotate(360deg); }
}

/* ==========================================================================
   Why Choose Kloira - Trust Logos Section
   Frame 2085665136: width: 598px, height: 160px
   ========================================================================== */

.ksq-trust-logos {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 0;
	gap: 12px;
	width: 598px;
	max-width: 100%;
	margin-top: 36px; /* 36px gap from Hip Hop upsell */
}

/* Header with title and dots */
.ksq-trust-logos__header {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	padding: 0;
	width: 100%;
	height: 30px;
}

/* Title: DM Serif Display, italic, 22px/30px */
.ksq-trust-logos__title {
	font-family: 'DM Serif Display', Georgia, serif;
	font-style: italic;
	font-weight: 400;
	font-size: 22px;
	line-height: 30px;
	color: #111111;
	margin: 0;
}

/* Pagination dots */
.ksq-trust-logos__dots {
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 0;
	gap: 4px;
}

.ksq-trust-logos__dot {
	width: 6px;
	height: 6px;
	background: #D9D9D9;
	border-radius: 50%;
	transition: background-color 0.3s ease;
	cursor: pointer;
}

.ksq-trust-logos__dot.active {
	background: #FF5100;
}

/* Container with background */
.ksq-trust-logos__container {
	width: 100%;
	height: 118px;
	background: #F5F6FA;
	border: 1px solid #E6E9F0;
	border-radius: 12px;
	overflow: hidden;
	display: flex;
	align-items: center;
	padding: 0 20px;
}

/* Track for marquee scrolling */
.ksq-trust-logos__track {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 50px;
	width: max-content;
	min-width: 100%;
	overflow-x: scroll;
	scrollbar-width: none;
	-ms-overflow-style: none;
	-webkit-overflow-scrolling: touch;
	touch-action: pan-x;
}

.ksq-trust-logos__track::-webkit-scrollbar {
	display: none;
}

/* Logo item */
.ksq-trust-logos__item {
	flex-shrink: 0;
	width: 166px;
	height: 54px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.ksq-trust-logos__item img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	mix-blend-mode: multiply;
}

.ksq-trust-logos__item a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.ksq-trust-logos__item a:hover img {
	opacity: 0.8;
	transition: opacity 0.2s ease;
}

/* ==========================================================================
   Hip Hop Upsell Box - Figma Matched
   Group 1437257119: width: 598px, height: 160px
   Rectangle 3464982: border-radius: 12px
   Background: radial-gradient(59.28% 221.56% at 21.82% 50%, #0051A3 0%, #003870 100%)
   ========================================================================== */

a.ksq-pdp-upsell,
.ksq-pdp-upsell {
	display: flex;
	align-items: stretch;
	width: 598px;
	max-width: 100%;
	height: 160px;
	/* Figma exact gradient */
	background: radial-gradient(59.28% 221.56% at 21.82% 50%, #0051A3 0%, #003870 100%);
	border-radius: 12px; /* Figma: 12px */
	overflow: hidden;
	margin-top: 36px; /* 36px gap after Return Policy */
	position: relative;
	text-decoration: none;
	color: inherit;
}

a.ksq-pdp-upsell:hover,
a.ksq-pdp-upsell:focus {
	text-decoration: none;
	color: inherit;
}

.ksq-pdp-upsell__bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}

.ksq-pdp-upsell__bg svg {
	width: 100%;
	height: 100%;
	display: block;
}

/* Figma: Frame 1437256903 at left: 50px, top: centered */
.ksq-pdp-upsell__content {
	position: relative;
	z-index: 1;
	flex: 1;
	padding: 33px 24px 34px 50px; /* Figma: left 50px, vertically centered */
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 24px; /* Figma: 24px gap */
}

/* Figma: 274x50, DM Serif Display, 20px/25px */
.ksq-pdp-upsell__title {
	width: 274px;
	max-width: 100%;
	height: 50px;
	color: #FFFFFF;
	font-family: "DM Serif Display", Georgia, "Times New Roman", serif;
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 25px; /* Figma: 25px or 125% */
	margin: 0;
}

/* Figma: Frame 1437256902, gap: 12px, text: 138x19 */
.ksq-pdp-upsell__link {
	display: inline-flex;
	align-items: center;
	gap: 12px; /* Figma: 12px gap */
	color: #FFFFFF;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	text-decoration-line: underline;
	text-decoration-style: dotted;
	text-decoration-skip-ink: auto;
	text-decoration-color: rgba(255, 255, 255, 0.24);
	text-decoration-thickness: 10%; /* 1.6px */
	text-underline-offset: 31%; /* 4.96px */
	text-underline-position: from-font;
	transition: gap 0.2s ease, opacity 0.2s ease;
}

.ksq-pdp-upsell__link:hover {
	color: #FFFFFF;
	opacity: 0.85;
	gap: 12px;
	text-decoration-color: rgba(255, 255, 255, 0.5);
}

/* Arrow icon: 10x8, border: 1.5px solid #FFFFFF */
.ksq-pdp-upsell__link svg {
	width: 10px;
	height: 8px;
	flex-shrink: 0;
	transition: transform 0.2s ease;
}

.ksq-pdp-upsell__link:hover svg {
	transform: translateX(4px);
}

/* Figma: image 797, 200x160, right-aligned with border-radius: 0px 12px 12px 0px */
.ksq-pdp-upsell__image {
	position: relative;
	z-index: 1;
	width: 200px; /* Figma: 200px */
	height: 160px;
	flex-shrink: 0;
}

.ksq-pdp-upsell__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	border-radius: 0px 12px 12px 0px; /* Figma: right corners rounded */
}

.ksq-pdp-upsell__placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255,255,255,0.1);
	color: rgba(255,255,255,0.4);
}

/* ==========================================================================
   Sticky Gallery Layout
   ========================================================================== */

.single-product-layout {
	position: relative;
	align-items: flex-start;
}

/* Sticky gallery - works when summary is taller than gallery */
.single-product-layout__gallery {
	position: sticky !important;
	top: 150px !important; /* 120px (header+trustbar) + 30px gap */
	height: fit-content !important;
	align-self: flex-start !important;
	overflow: visible;
	z-index: 1;
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1024px) {
	/* Rating responsive */
	.ksq-pdp-rating {
		flex-wrap: wrap;
	}
	
	.ksq-pdp-rating__text,
	.ksq-pdp-rating__link {
		font-size: 14px;
	}
	
	.ksq-pdp-variants__options {
		grid-template-columns: 1fr;
	}
	
	.ksq-pdp-testimonials__grid {
		flex-wrap: nowrap;
		justify-content: flex-start;
	}
	
	.ksq-pdp-bnpl {
		max-width: 100%;
		height: auto;
		padding: 8px 12px;
		flex-wrap: wrap;
	}
	
	.ksq-pdp-reviews-slider {
		width: 100%;
		height: 120px;
		padding: 12px 36px;
	}
	
	.ksq-pdp-reviews-slider__prev,
	.ksq-pdp-reviews-slider__next {
		width: 20px !important;
		height: 20px !important;
	}
	
	.ksq-pdp-reviews-slider__prev {
		left: 8px !important;
	}
	
	.ksq-pdp-reviews-slider__next {
		right: 8px !important;
	}
	
	.ksq-pdp-reviews-slider__prev svg,
	.ksq-pdp-reviews-slider__next svg {
		width: 14px !important;
		height: 14px !important;
	}
	
	.ksq-pdp-review-slide {
		gap: 12px;
	}
	
	.ksq-pdp-review-slide__author-col {
		gap: 4px;
	}
	
	.ksq-pdp-review-slide__avatar {
		width: 48px;
		height: 48px;
	}
	
	.ksq-pdp-review-slide__avatar.ksq-avatar-placeholder {
		font-size: 18px;
	}
	
	.ksq-pdp-review-slide__name {
		font-size: 13px;
		max-width: 70px;
	}
	
	.ksq-pdp-review-slide__header {
		gap: 6px;
		flex-wrap: wrap;
	}
	
	
	.ksq-pdp-review-slide__location {
		font-size: 12px;
	}
	
	.ksq-pdp-review-slide__text {
		font-size: 13px;
		-webkit-line-clamp: 2;
	}
	
	.ksq-pdp-review-slide__name {
		font-size: 11px;
	}
	
	.ksq-pdp-review-slide__text {
		font-size: 12px;
		-webkit-line-clamp: 2;
	}
	
	.ksq-pdp-review-slide__location {
		font-size: 10px;
	}
	
	.ksq-pdp-review-slide__location .ksq-country-flag {
		width: 14px;
		height: 10px;
	}
	
	.ksq-pdp-review-slide__verified {
		font-size: 10px;
	}
	
	.ksq-testimonial-modal__content {
		max-width: 100%;
		max-height: 90vh;
		overflow-y: auto;
	}
	
	.ksq-testimonial-modal__video {
		max-height: 50vh;
	}
	
	/* Accordion responsive */
	.ksq-pdp-accordion {
		gap: 20px;
	}
	
	.ksq-pdp-accordion__title {
		font-size: 18px;
	}
	
	.ksq-pdp-accordion__body p,
	.ksq-pdp-accordion__text {
		font-size: 15px;
		line-height: 21px;
	}
	
	/* Brand products slider responsive */
	.ksq-brand-products {
		width: 100%;
		margin-top: 20px;
		overflow: visible;
	}
	
	.ksq-brand-products__header {
		height: auto;
		gap: 12px;
	}
	
	.ksq-brand-products__title {
		font-size: 18px;
		line-height: 24px;
	}
	
	.ksq-brand-products__slider {
		overflow: visible;
	}
	
	.ksq-brand-products__track {
		overflow-x: scroll;
		-webkit-overflow-scrolling: touch;
		touch-action: pan-x;
	}
	
	.ksq-brand-products__card {
		width: 320px;
		min-width: 320px;
		height: 100px;
	}
	
	.ksq-brand-products__card-inner {
		padding: 12px;
		gap: 12px;
	}
	
	.ksq-brand-products__image {
		width: 70px;
		height: 70px;
	}
	
	.ksq-brand-products__info {
		gap: 8px;
	}
	
	.ksq-brand-products__name {
		font-size: 14px;
		line-height: 18px;
		max-height: 36px;
	}
	
	.ksq-brand-products__price {
		font-size: 16px;
		line-height: 19px;
	}
	
	.ksq-brand-products__price-regular {
		font-size: 14px;
		line-height: 17px;
	}
	
	.ksq-brand-products__add-btn {
		padding: 6px 14px;
		right: 12px;
		bottom: 12px;
	}
	
	.ksq-brand-products__add-btn span {
		font-size: 14px;
		line-height: 17px;
	}
	
	/* Trust logos responsive */
	.ksq-trust-logos {
		width: 100%;
		margin-top: 20px;
	}
	
	.ksq-trust-logos__header {
		height: auto;
		gap: 12px;
	}
	
	.ksq-trust-logos__title {
		font-size: 18px;
		line-height: 24px;
	}
	
	.ksq-trust-logos__container {
		height: 100px;
		padding: 0 16px;
	}
	
	.ksq-trust-logos__track {
		gap: 30px;
	}
	
	.ksq-trust-logos__item {
		width: 130px;
		height: 44px;
	}
	
	/* Upsell box responsive - Figma Mobile Specs */
	.ksq-pdp-upsell {
		width: 100% !important;
		height: 110px !important;
		min-height: 110px !important;
		max-height: 110px !important;
		background: radial-gradient(59.28% 221.56% at 21.82% 50%, #0051A3 0%, #003870 100%) !important;
		border-radius: 8px !important;
		margin-top: 24px;
		position: relative;
		overflow: hidden;
	}
	
	/* Hide the SVG background on mobile - use CSS gradient instead */
	.ksq-pdp-upsell__bg {
		display: none !important;
	}
	
	.ksq-pdp-upsell__content {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		padding: 20px 115px 20px 24px;
		gap: 20px;
		width: 181px;
		height: 70px;
		box-sizing: content-box;
	}
	
	.ksq-pdp-upsell__title {
		width: 181px;
		font-family: 'DM Serif Display', serif;
		font-style: normal;
		font-weight: 400;
		font-size: 14px;
		line-height: 18px;
		color: #FFFFFF;
		margin: 0;
	}
	
	.ksq-pdp-upsell__link {
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 0;
		gap: 10px;
		font-family: 'Roboto Flex', sans-serif;
		font-style: normal;
		font-weight: 600;
		font-size: 12px;
		line-height: 14px;
		text-decoration-line: underline;
		color: #FFFFFF;
	}
	
	.ksq-pdp-upsell__link svg {
		width: 8px;
		height: 6px;
	}
	
	.ksq-pdp-upsell__image {
		position: absolute;
		width: 131px;
		height: 110px;
		right: 0;
		top: 0;
		border-radius: 0px 8px 8px 0px;
		overflow: hidden;
	}
	
	.ksq-pdp-upsell__image img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	
	/* Disable sticky on mobile */
	.single-product-layout__gallery {
		position: relative;
		top: auto;
	}
}

/* ==========================================================================
   FLOATING STICKY ADD TO CART BAR
   Appears on scroll for easy cart access
   ========================================================================== */

.ksq-sticky-bar {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 9999;
	padding: 16px 0 16px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(100%);
	transition: opacity 0.4s ease, visibility 0.4s ease, transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	pointer-events: none;
}

.ksq-sticky-bar[aria-hidden="false"] {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	pointer-events: auto;
}

/* Background gradient overlay - matches Figma */
.ksq-sticky-bar__bg {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 172px;
	background: linear-gradient(360deg, rgba(0, 0, 0, 0.28) 0%, rgba(0, 0, 0, 0) 100%);
	pointer-events: none;
	z-index: -1;
}

/* Main container - centered white card */
.ksq-sticky-bar__container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 40px;
	max-width: 1440px;
	height: 140px;
	margin: 0 auto;
	padding: 20px 40px;
	background: #FFFFFF;
	border: 1px solid #DDDDDD;
	border-radius: 16px;
	box-shadow: 0 -4px 40px rgba(0, 0, 0, 0.12);
	box-sizing: border-box;
}

/* Product Info Section */
.ksq-sticky-bar__product {
	display: flex;
	align-items: center;
	gap: 24px;
	flex: 1;
	min-width: 0;
	max-width: 564px;
}

/* Product Thumbnail */
.ksq-sticky-bar__image {
	display: block;
	width: 100px;
	height: 100px;
	border-radius: 12px;
	overflow: hidden;
	flex-shrink: 0;
	background: #D9D9D9;
	cursor: pointer;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	text-decoration: none;
}

.ksq-sticky-bar__image:hover {
	transform: scale(1.02);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.ksq-sticky-bar__image:focus {
	outline: 2px solid #FF5100;
	outline-offset: 2px;
}

.ksq-sticky-bar__image img,
.ksq-sticky-bar__image video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Product Info */
.ksq-sticky-bar__info {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-width: 0;
	max-width: 440px;
}

/* Product Title */
.ksq-sticky-bar__title {
	margin: 0;
	max-width: 440px;
	color: #111111;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 500;
	line-height: 26px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Price Row */
.ksq-sticky-bar__price {
	display: flex;
	align-items: center;
	gap: 12px;
}

.ksq-sticky-bar__price-current,
.ksq-sticky-bar__price-current .woocommerce-Price-amount,
.ksq-sticky-bar__price-current bdi {
	color: #FF5100;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 20px;
	font-style: normal;
	font-weight: 600;
	line-height: 23px;
}

.ksq-sticky-bar__price-regular,
.ksq-sticky-bar__price-regular .woocommerce-Price-amount,
.ksq-sticky-bar__price-regular bdi {
	color: #888888;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 23px;
	text-decoration: line-through;
}

/* ==========================================================================
   Variant Dropdown Selector
   ========================================================================== */

.ksq-sticky-bar__variant {
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 320px;
	flex-shrink: 0;
}

.ksq-sticky-bar__variant-group {
	display: flex;
	flex-direction: column;
	gap: 0;
}

/* Multi-attribute: mirror main PDP selection as static text (no sticky dropdowns).
   Max two attributes — always one row, side by side. */
.ksq-sticky-bar__variant--static {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: flex-end;
	justify-content: flex-start;
	gap: 12px 32px;
	width: auto;
	min-width: 0;
	flex: 0 0 auto;
	max-width: min(480px, 46vw);
	/* Pull variant summary toward Add to Bag; free space stays left of this block */
	margin-left: auto;
}

.ksq-sticky-bar__variant-group--static {
	flex: 1 1 0;
	min-width: 0;
	max-width: none;
	gap: 4px;
}

.ksq-sticky-bar__variant-group--static .ksq-sticky-bar__variant-label {
	display: block;
	margin-bottom: 2px;
}

.ksq-sticky-bar__variant-value {
	display: block;
	color: #FF5100;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 600;
	line-height: 21px;
}

.ksq-sticky-bar__variant-label {
	color: #666666;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: 16px;
}

.ksq-sticky-bar__variant-dropdown {
	position: relative;
}

/* Dropdown Trigger Button */
.ksq-sticky-bar__variant-trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 60px;
	padding: 0 20px;
	background: linear-gradient(0deg, rgba(255, 81, 0, 0.04), rgba(255, 81, 0, 0.04)), #FFFFFF;
	border: 1px solid #FF5100;
	border-radius: 8px;
	cursor: pointer;
	transition: all 0.2s ease;
}

.ksq-sticky-bar__variant-trigger:hover {
	background: linear-gradient(0deg, rgba(255, 81, 0, 0.08), rgba(255, 81, 0, 0.08)), #FFFFFF;
}

/* Opens upward - border radius on bottom, top border transparent */
.ksq-sticky-bar__variant-trigger[aria-expanded="true"] {
	border-radius: 0 0 8px 8px;
	border-top-color: transparent;
}

.ksq-sticky-bar__variant-selected {
	display: flex;
	align-items: center;
	gap: 12px;
}

.ksq-sticky-bar__variant-name {
	color: #FF5100;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 600;
	line-height: 21px;
}

.ksq-sticky-bar__variant-sub {
	display: flex;
	align-items: center;
	gap: 6px;
	color: #666666;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 14px;
	mix-blend-mode: multiply;
}

.ksq-sticky-bar__variant-sub svg {
	width: 16px;
	height: 16px;
	color: #666666;
}

.ksq-sticky-bar__variant-arrow {
	color: #111111;
	transition: transform 0.2s ease;
	flex-shrink: 0;
	transform: rotate(180deg); /* Points up by default since dropdown opens upward */
}

.ksq-sticky-bar__variant-trigger[aria-expanded="true"] .ksq-sticky-bar__variant-arrow {
	transform: rotate(0deg); /* Points down when open */
}

/* Dropdown Options Panel - Opens UPWARD */
.ksq-sticky-bar__variant-options {
	position: absolute;
	bottom: 100%;
	left: 0;
	right: 0;
	background: #FFFFFF;
	border: 1px solid #FF5100;
	border-bottom: none;
	border-radius: 8px 8px 0 0;
	z-index: 100;
	max-height: 240px;
	overflow-y: auto;
	box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.12);
}

.ksq-sticky-bar__variant-options[hidden] {
	display: none;
}

.ksq-sticky-bar__variant-option {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 16px 20px;
	background: transparent;
	border: none;
	border-bottom: 1px solid #F0F0F0;
	cursor: pointer;
	text-align: left;
	transition: background 0.15s ease;
}

.ksq-sticky-bar__variant-option:last-child {
	border-bottom: none;
}

.ksq-sticky-bar__variant-option:hover {
	background: rgba(255, 81, 0, 0.04);
}

.ksq-sticky-bar__variant-option.active {
	background: rgba(255, 81, 0, 0.08);
}

.ksq-sticky-bar__option-name {
	color: #111111;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 19px;
}

.ksq-sticky-bar__variant-option.active .ksq-sticky-bar__option-name {
	color: #FF5100;
	font-weight: 600;
}

.ksq-sticky-bar__option-sub {
	display: flex;
	align-items: center;
	gap: 6px;
	color: #666666;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 12px;
	font-weight: 400;
	line-height: 14px;
}

.ksq-sticky-bar__option-sub svg {
	flex-shrink: 0;
}

/* ==========================================================================
   Add to Bag Button
   ========================================================================== */

.ksq-sticky-bar__action {
	flex-shrink: 0;
	margin-left: 80px; /* Total gap with variant: 40px (container gap) + 80px = 120px */
}

/* Static variant row sits next to CTA — drop extra action inset (container gap is enough) */
.ksq-sticky-bar__container:has(.ksq-sticky-bar__variant--static) .ksq-sticky-bar__action {
	margin-left: 0;
}

.ksq-sticky-bar__form {
	margin: 0;
}

.ksq-sticky-bar__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	width: 300px;
	height: 76px;
	padding: 0 32px;
	background: #FF5100;
	border: none;
	border-radius: 12px;
	cursor: pointer;
	transition: background 0.2s ease, transform 0.15s ease;
}

.ksq-sticky-bar__btn:hover {
	background: #E54900;
	transform: translateY(-2px);
}

.ksq-sticky-bar__btn:active {
	transform: translateY(0);
}

.ksq-sticky-bar__btn-icon {
	width: 28px;
	height: 28px;
	color: #FFFFFF;
	flex-shrink: 0;
}

.ksq-sticky-bar__btn-text {
	color: #FFFFFF;
	font-family: "Roboto Flex", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 20px;
	font-style: normal;
	font-weight: 600;
	line-height: 23px;
}

/* Hide price elements on desktop - only show on mobile */
.ksq-sticky-bar__btn-sep,
.ksq-sticky-bar__btn-price,
.ksq-sticky-bar__btn-strike {
	display: none;
}

.ksq-sticky-bar__btn--disabled {
	background: #CCCCCC;
	cursor: not-allowed;
}

.ksq-sticky-bar__btn--disabled:hover {
	background: #CCCCCC;
	transform: none;
}

/* Loading/Adding state - keep white text */
.ksq-sticky-bar__btn.loading,
.ksq-sticky-bar__btn:disabled,
.ksq-sticky-bar__btn[disabled] {
	background: #FF5100 !important;
	color: #FFFFFF !important;
	opacity: 0.85;
	pointer-events: none;
}

.ksq-sticky-bar__btn.loading *,
.ksq-sticky-bar__btn:disabled *,
.ksq-sticky-bar__btn[disabled] * {
	color: #FFFFFF !important;
}

/* ==========================================================================
   Sticky Bar Responsive
   ========================================================================== */

@media (max-width: 1480px) {
	.ksq-sticky-bar__container {
		margin: 0 20px;
		max-width: calc(100% - 40px);
	}
}

@media (max-width: 1200px) {
	.ksq-sticky-bar__container {
		gap: 24px;
		padding: 16px 24px;
	}
	
	.ksq-sticky-bar__product {
		max-width: 400px;
	}
	
	.ksq-sticky-bar__variant {
		width: 280px;
	}
	
	/* Static variant: need horizontal room for two columns (overrides width: 280px above) */
	.ksq-sticky-bar__variant--static {
		width: auto;
		min-width: 260px;
		max-width: min(440px, 40vw);
		flex-wrap: nowrap;
	}
	
	.ksq-sticky-bar__btn {
		width: 240px;
	}
}

@media (max-width: 1024px) {
	.ksq-sticky-bar__container {
		height: auto;
		flex-wrap: wrap;
		gap: 16px;
		padding: 16px 20px;
	}
	
	.ksq-sticky-bar__product {
		flex: 1 1 100%;
		max-width: none;
	}
	
	.ksq-sticky-bar__variant {
		flex: 1;
		width: auto;
		min-width: 200px;
	}
	
	.ksq-sticky-bar__variant--static {
		max-width: none;
		width: 100%;
		flex-wrap: nowrap;
		gap: 16px 24px;
		margin-left: 0;
		justify-content: flex-end;
	}
	
	.ksq-sticky-bar__btn {
		width: 200px;
		height: 60px;
	}
	
	.ksq-sticky-bar__image {
		width: 70px;
		height: 70px;
	}
}

/* ==========================================================================
   Mobile Sticky Bar - Figma Specs (MOBILE ONLY)
   100px height, gradient bg, 20px L/R margin, 16px bottom margin
   Button shows: icon + "Add to Bag — $2,786 $3,756" on ONE line
   ========================================================================== */
@media (max-width: 1024px) {
	.ksq-sticky-bar {
		position: fixed !important;
		bottom: 0 !important;
		left: 0 !important;
		right: 0 !important;
		width: 100% !important;
		height: 100px !important;
		padding: 0 !important;
		background: transparent !important;
	}
	
	.ksq-sticky-bar__bg {
		position: absolute !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		width: 100% !important;
		height: 100px !important;
		background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%) !important;
	}
	
	/* Container: 20px from left/right, 16px from bottom */
	.ksq-sticky-bar__container {
		position: absolute !important;
		bottom: 16px !important;
		left: 20px !important;
		right: 20px !important;
		width: calc(100% - 40px) !important;
		max-width: calc(100% - 40px) !important;
		height: 50px !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		border: none !important;
		box-shadow: none !important;
	}
	
	/* Hide product info on mobile */
	.ksq-sticky-bar__product {
		display: none !important;
	}
	
	/* Hide variant selector on mobile - uses selection from main PDP */
	.ksq-sticky-bar__variant {
		display: none !important;
	}
	
	/* Remove margin-left on mobile */
	.ksq-sticky-bar__action {
		width: 100% !important;
		height: 100% !important;
		margin-left: 0 !important;
	}
	
	.ksq-sticky-bar__form {
		width: 100% !important;
		height: 100% !important;
	}
	
	/* Button: full width, 50px height, #FF5100 bg, 12px radius */
	.ksq-sticky-bar__btn {
		width: 100% !important;
		height: 50px !important;
		background: #FF5100 !important;
		border-radius: 12px !important;
		border: none !important;
		display: flex !important;
		flex-direction: row !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 8px !important;
		padding: 0 !important;
	}
	
	.ksq-sticky-bar__btn-icon {
		width: 24px !important;
		height: 24px !important;
		flex-shrink: 0 !important;
	}
	
	.ksq-sticky-bar__btn-icon svg {
		width: 24px !important;
		height: 24px !important;
		color: #FFFFFF !important;
	}
	
	/* All text: Roboto Flex, 600, 14px, white, on ONE line */
	.ksq-sticky-bar__btn-text,
	.ksq-sticky-bar__btn-sep,
	.ksq-sticky-bar__btn-price,
	.ksq-sticky-bar__btn-price .woocommerce-Price-amount,
	.ksq-sticky-bar__btn-price bdi {
		font-family: 'Roboto Flex', sans-serif !important;
		font-style: normal !important;
		font-weight: 600 !important;
		font-size: 14px !important;
		line-height: 16px !important;
		color: #FFFFFF !important;
		white-space: nowrap !important;
		display: inline !important;
	}
	
	/* Strike price: line-through, lighter opacity */
	.ksq-sticky-bar__btn-strike,
	.ksq-sticky-bar__btn-strike .woocommerce-Price-amount,
	.ksq-sticky-bar__btn-strike bdi {
		font-family: 'Roboto Flex', sans-serif !important;
		font-style: normal !important;
		font-weight: 600 !important;
		font-size: 14px !important;
		line-height: 16px !important;
		color: #FFFFFF !important;
		white-space: nowrap !important;
		display: inline !important;
		text-decoration: line-through !important;
		opacity: 0.7 !important;
	}
}

/* ==========================================================================
   KLOIRA'S PROMISE SECTION
   Full-width trust badges section below product
   ========================================================================== */

.ksq-promise-section {
	position: relative;
	width: 100vw;
	margin-left: calc(-50vw + 50%);
	margin-top: 100px;
	padding: 100px 0;
	overflow: hidden;
}

.ksq-promise-section__bg {
	position: absolute;
	inset: 0;
	background: radial-gradient(40.39% 154.48% at 50% 0%, #333333 0%, #111111 100%);
	z-index: -1;
}

.ksq-promise-section__container {
	max-width: 1440px;
	margin: 0 auto;
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 50px;
}

.ksq-promise-section__title {
	font-family: 'DM Serif Display', Georgia, serif;
	font-style: normal;
	font-weight: 400;
	font-size: 44px;
	line-height: 60px;
	text-align: center;
	color: #FFFFFF;
	margin: 0;
}

.ksq-promise-section__grid {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: center;
	gap: 24px;
	width: 100%;
	max-width: 1440px;
	flex-wrap: nowrap;
}

.ksq-promise-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	width: 220px;
	flex-shrink: 0;
}

.ksq-promise-item__icon {
	width: 120px;
	height: 120px;
	aspect-ratio: 1/1;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.16);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.ksq-promise-item__icon svg {
	display: flex;
	width: 60px;
	height: 60px;
	padding: 5px;
	justify-content: center;
	align-items: center;
	aspect-ratio: 1/1;
}

.ksq-promise-item__title {
	color: #FFF;
	text-align: center;
	font-family: "Roboto Flex", sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
}

/* Large Tablet Responsive - Keep 6 in a row but smaller */
@media (max-width: 1500px) {
	.ksq-promise-section__container {
		padding: 0 20px;
	}
	
	.ksq-promise-section__grid {
		gap: 16px;
	}
	
	.ksq-promise-item {
		width: 180px;
	}
	
	.ksq-promise-item__icon {
		width: 100px;
		height: 100px;
	}
	
	.ksq-promise-item__icon svg {
		width: 50px;
		height: 50px;
	}
	
	.ksq-promise-item__title {
		font-size: 16px;
		line-height: 19px;
	}
}

/* Tablet Responsive - 3 columns */
@media (max-width: 1200px) {
	.ksq-promise-section {
		padding: 80px 0;
	}
	
	.ksq-promise-section__container {
		gap: 40px;
		padding: 0 24px;
	}
	
	.ksq-promise-section__title {
		font-size: 36px;
		line-height: 48px;
	}
	
	.ksq-promise-section__grid {
		flex-wrap: wrap;
		gap: 32px 24px;
		max-width: 800px;
	}
	
	.ksq-promise-item {
		width: calc(33.333% - 16px);
		min-width: 150px;
		gap: 16px;
	}
	
	.ksq-promise-item__icon {
		width: 100px;
		height: 100px;
	}
	
	.ksq-promise-item__icon svg {
		width: 50px;
		height: 50px;
	}
	
	.ksq-promise-item__title {
		font-size: 16px;
		line-height: 19px;
	}
}

/* Mobile Responsive - 3 columns grid */
@media (max-width: 1024px) {
	.ksq-promise-section {
		padding: 60px 0;
	}
	
	.ksq-promise-section__container {
		gap: 32px;
		padding: 0 16px;
	}
	
	.ksq-promise-section__title {
		font-size: 28px;
		line-height: 38px;
	}
	
	.ksq-promise-section__grid {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 24px 16px;
		justify-items: center;
		max-width: 100%;
	}
	
	.ksq-promise-item {
		width: 100%;
		min-width: unset;
		max-width: 120px;
		gap: 12px;
	}
	
	.ksq-promise-item__icon {
		width: 80px;
		height: 80px;
	}
	
	.ksq-promise-item__icon svg {
		width: 40px;
		height: 40px;
	}
	
	.ksq-promise-item__title {
		font-size: 13px;
		line-height: 16px;
	}
}

/* Small Mobile */
@media (max-width: 480px) {
	.ksq-promise-section {
		padding: 48px 0;
	}
	
	.ksq-promise-section__title {
		font-size: 24px;
		line-height: 32px;
	}
	
	.ksq-promise-section__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px 12px;
	}
	
	.ksq-promise-item {
		max-width: 140px;
	}
	
	.ksq-promise-item__icon {
		width: 70px;
		height: 70px;
	}
	
	.ksq-promise-item__icon svg {
		width: 35px;
		height: 35px;
	}
	
	.ksq-promise-item__title {
		font-size: 12px;
		line-height: 15px;
	}
}

/* ==========================================================================
   DIAMOND TESTER VIDEO SECTION
   Full-width section with video and authenticity features
   ========================================================================== */

.ksq-diamond-tester-section {
	position: relative;
	width: 100vw;
	margin-left: calc(-50vw + 50%);
	padding: 80px 0;
	background: #FFFFFF;
	overflow: hidden;
}

.ksq-diamond-tester-section__container {
	width: 1440px;
	height: 560px;
	max-width: 100%;
	margin: 0 auto;
	padding: 0 80px;
	display: flex;
	align-items: center;
	gap: 60px;
	box-sizing: border-box;
}

/* ==========================================================================
   Video Side (Left)
   ========================================================================== */

.ksq-diamond-tester-section__video-wrapper {
	flex-shrink: 0;
	width: 700px;
	height: 560px;
}

.ksq-diamond-tester-section__video-container {
	position: relative;
	width: 700px;
	height: 560px;
	border-radius: 20px;
	overflow: hidden;
	background: #D9D9D9;
}

.ksq-diamond-tester-section__video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* Safari does not always apply object-fit to the poster frame the way it
	   does to video frames, which left the still letterboxed inside the
	   rounded container on iOS. Sizing the poster explicitly keeps the
	   placeholder and the playing video framed identically. */
	object-position: center;
	background-color: #D9D9D9;
}

/* Play Button with Blinking Animation */
.ksq-diamond-tester-section__play-btn {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 80px;
	height: 80px;
	background: rgba(255, 81, 0, 0.95);
	border: none;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 10;
	transition: transform 0.3s ease, background 0.3s ease;
	animation: playButtonPulse 2s ease-in-out infinite;
}

.ksq-diamond-tester-section__play-btn:hover {
	transform: translate(-50%, -50%) scale(1.1);
	background: rgba(255, 81, 0, 1);
	animation: none;
}

.ksq-diamond-tester-section__play-btn.is-playing {
	animation: none;
	background: rgba(0, 0, 0, 0.6);
}

.ksq-diamond-tester-section__play-btn.is-playing .ksq-diamond-tester-section__play-icon svg {
	display: none;
}

.ksq-diamond-tester-section__play-btn.is-playing::before {
	content: '';
	display: block;
	width: 24px;
	height: 24px;
	border-left: 4px solid #fff;
	border-right: 4px solid #fff;
}

@keyframes playButtonPulse {
	0%, 100% {
		box-shadow: 0 0 0 0 rgba(255, 81, 0, 0.6);
		opacity: 1;
	}
	50% {
		box-shadow: 0 0 0 20px rgba(255, 81, 0, 0);
		opacity: 0.85;
	}
}

.ksq-diamond-tester-section__play-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #FFFFFF;
	margin-left: 4px;
}

.ksq-diamond-tester-section__play-icon svg {
	width: 32px;
	height: 32px;
}

/* ==========================================================================
   Content Side (Right)
   ========================================================================== */

.ksq-diamond-tester-section__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	padding: 0;
	gap: 40px;
	width: 660px;
	max-width: 660px;
	flex-shrink: 0;
}

.ksq-diamond-tester-section__header {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
}

/* Proven Authenticity Badge */
.ksq-diamond-tester-section__badge {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	padding: 12px 20px;
	background: #EAF9EA;
	border-radius: 40px;
	
	color: #008000;
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 19px;
}

/* Section Title */
.ksq-diamond-tester-section__title {
	margin: 0;
	max-width: 660px;
	
	color: #111111;
	font-family: 'DM Serif Display', Georgia, serif;
	font-style: normal;
	font-weight: 400;
	font-size: 44px;
	line-height: 50px;
}

/* ==========================================================================
   Features List
   ========================================================================== */

.ksq-diamond-tester-section__features {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 28px;
	width: 100%;
}

.ksq-diamond-tester-section__feature {
	display: flex;
	align-items: flex-start;
	gap: 24px;
	width: 100%;
}

.ksq-diamond-tester-section__feature-icon {
	flex-shrink: 0;
	width: 40px;
	height: 43px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.ksq-diamond-tester-section__feature-icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.ksq-diamond-tester-section__feature-content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	flex: 1;
	max-width: 596px;
}

.ksq-diamond-tester-section__feature-title {
	margin: 0;
	
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 600;
	font-size: 20px;
	line-height: 23px;
	color: #444444;
}

.ksq-diamond-tester-section__feature-desc {
	margin: 0;
	
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;
	color: #666666;
}

/* ==========================================================================
   Add to Bag Button
   ========================================================================== */

.ksq-diamond-tester-section__cart {
	margin: 0;
}

.ksq-diamond-tester-section__btn {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 12px;
	width: 431px;
	height: 60px;
	padding: 0 32px;
	
	background: #FF5100;
	border: none;
	border-radius: 12px;
	cursor: pointer;
	transition: background 0.2s ease, transform 0.15s ease;
}

.ksq-diamond-tester-section__btn:hover {
	background: #E54900;
	transform: translateY(-2px);
}

.ksq-diamond-tester-section__btn:active {
	transform: translateY(0);
}

.ksq-diamond-tester-section__btn-icon {
	display: flex;
	width: 28px;
	height: 28px;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
	color: #FFFFFF;
}

.ksq-diamond-tester-section__btn-icon svg {
	width: 100%;
	height: 100%;
}

.ksq-diamond-tester-section__btn-text,
.ksq-diamond-tester-section__btn-price,
.ksq-diamond-tester-section__btn-price .woocommerce-Price-amount,
.ksq-diamond-tester-section__btn-price bdi {
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 600;
	font-size: 18px;
	line-height: 21px;
	color: #FFFFFF;
}

.ksq-diamond-tester-section__btn-sep {
	color: rgba(255, 255, 255, 0.6);
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 18px;
	font-weight: 400;
}

.ksq-diamond-tester-section__btn-strike,
.ksq-diamond-tester-section__btn-strike .woocommerce-Price-amount,
.ksq-diamond-tester-section__btn-strike bdi {
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	line-height: 21px;
	color: rgba(255, 255, 255, 0.6);
	text-decoration: line-through;
}

/* ==========================================================================
   Diamond Tester Section Responsive
   ========================================================================== */

@media (max-width: 1500px) {
	.ksq-diamond-tester-section__container {
		width: 100%;
		padding: 0 40px;
		gap: 40px;
	}
	
	.ksq-diamond-tester-section__video-wrapper {
		width: 550px;
		height: auto;
	}
	
	.ksq-diamond-tester-section__video-container {
		width: 100%;
		height: 440px;
	}
	
	.ksq-diamond-tester-section__content {
		width: auto;
		flex: 1;
	}
	
	.ksq-diamond-tester-section__title {
		font-size: 36px;
		line-height: 44px;
	}
}

@media (max-width: 1200px) {
	.ksq-diamond-tester-section {
		padding: 60px 0;
	}
	
	.ksq-diamond-tester-section__container {
		width: 100%;
		height: auto;
		flex-direction: column;
		align-items: center;
		gap: 48px;
		padding: 0 24px;
	}
	
	.ksq-diamond-tester-section__video-wrapper {
		width: 100%;
		max-width: 700px;
		height: auto;
	}
	
	.ksq-diamond-tester-section__video-container {
		width: 100%;
		height: 400px;
	}
	
	.ksq-diamond-tester-section__content {
		width: 100%;
		max-width: 700px;
		gap: 40px;
		align-items: center;
		text-align: center;
	}
	
	.ksq-diamond-tester-section__header {
		align-items: center;
	}
	
	.ksq-diamond-tester-section__features {
		align-items: center;
	}
	
	.ksq-diamond-tester-section__feature {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
	
	.ksq-diamond-tester-section__feature-content {
		align-items: center;
	}
	
	.ksq-diamond-tester-section__btn {
		width: 100%;
		max-width: 431px;
	}
}

@media (max-width: 1024px) {
	.ksq-diamond-tester-section {
		padding: 48px 0;
	}
	
	.ksq-diamond-tester-section__container {
		padding: 0 16px;
		gap: 36px;
	}
	
	.ksq-diamond-tester-section__video-container {
		height: 320px;
		border-radius: 16px;
	}
	
	.ksq-diamond-tester-section__play-btn {
		width: 64px;
		height: 64px;
	}
	
	.ksq-diamond-tester-section__play-icon svg {
		width: 24px;
		height: 24px;
	}
	
	.ksq-diamond-tester-section__content {
		gap: 32px;
	}
	
	.ksq-diamond-tester-section__header {
		gap: 16px;
	}
	
	.ksq-diamond-tester-section__badge {
		padding: 10px 16px;
		font-size: 14px;
	}
	
	.ksq-diamond-tester-section__title {
		font-size: 28px;
		line-height: 36px;
	}
	
	.ksq-diamond-tester-section__features {
		gap: 24px;
	}
	
	.ksq-diamond-tester-section__feature-icon {
		width: 36px;
		height: 38px;
	}
	
	.ksq-diamond-tester-section__feature-title {
		font-size: 18px;
		line-height: 21px;
	}
	
	.ksq-diamond-tester-section__feature-desc {
		font-size: 14px;
		line-height: 22px;
	}
	
	.ksq-diamond-tester-section__btn {
		height: 56px;
		border-radius: 10px;
		gap: 10px;
	}
	
	.ksq-diamond-tester-section__btn-text,
	.ksq-diamond-tester-section__btn-price,
	.ksq-diamond-tester-section__btn-price .woocommerce-Price-amount,
	.ksq-diamond-tester-section__btn-price bdi {
		font-size: 16px;
	}
	
	.ksq-diamond-tester-section__btn-icon {
		width: 24px;
		height: 24px;
	}
}

@media (max-width: 480px) {
	.ksq-diamond-tester-section {
		padding: 40px 0;
	}
	
	.ksq-diamond-tester-section__video-container {
		height: 280px;
		border-radius: 12px;
	}
	
	.ksq-diamond-tester-section__play-btn {
		width: 56px;
		height: 56px;
	}
	
	.ksq-diamond-tester-section__play-icon svg {
		width: 20px;
		height: 20px;
	}
	
	.ksq-diamond-tester-section__title {
		font-size: 24px;
		line-height: 32px;
	}
	
	.ksq-diamond-tester-section__btn {
		height: 52px;
		padding: 0 20px;
		flex-wrap: wrap;
		gap: 8px;
	}
	
	.ksq-diamond-tester-section__btn-sep {
		display: none;
	}
	
	.ksq-diamond-tester-section__btn-strike {
		font-size: 14px;
	}
}

/* ==========================================================================
   SIMILAR PRODUCTS SECTION
   Product carousel showing items from the same brand/category
   Positioned below Diamond Tester with 100px gap
   ========================================================================== */

.ksq-similar-products {
	position: relative;
	width: 100vw;
	margin-left: calc(-50vw + 50%);
	/* Diamond Tester has 80px bottom padding, so 20px margin = 100px total gap */
	margin-top: 20px;
	padding: 0;
	background: #FFFFFF;
	/* Allow arrows to extend outside container */
	overflow: visible;
}

.ksq-similar-products__container {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 50px;
	max-width: 1440px;
	width: 100%;
	margin: 0 auto;
	/* Override any container padding - we need full 1440px for 4 cards */
	padding: 0 !important;
	box-sizing: border-box;
}

/* Section Title */
.ksq-similar-products__title {
	margin: 0;
	align-self: stretch;
	font-family: 'DM Serif Display', Georgia, serif;
	font-style: normal;
	font-weight: 400;
	font-size: 44px;
	line-height: normal;
	text-align: center;
	color: #111111;
}

/* ==========================================================================
   Slider Wrapper with Navigation
   ========================================================================== */

.ksq-similar-products__slider-wrapper {
	position: relative;
	width: 100%;
	display: flex;
	align-items: center;
}

.ksq-similar-products__track-container {
	width: 100%;
	max-width: 1440px;
	margin: 0 auto;
	overflow: hidden;
}

.ksq-similar-products__track {
	display: flex;
	gap: 24px;
	transition: transform 0.4s ease;
}

/* Center products when fewer than visible count */
.ksq-similar-products__track.ksq-similar-products__track--centered {
	justify-content: center;
}

/* Navigation Arrows - 50% inside container, 50% outside */
.ksq-similar-products__nav {
	position: absolute;
	top: 146px; /* Center button on image: (342px - 50px) / 2 = 146px */
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border: 1.5px solid #888888;
	border-radius: 50%;
	cursor: pointer;
	transition: all 0.2s ease;
	z-index: 10;
	color: #888888;
}

.ksq-similar-products__nav:hover {
	border-color: #111111;
	color: #111111;
}

.ksq-similar-products__nav:disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

/* Arrow positions: 50% inside 1440px container, 50% outside */
.ksq-similar-products__nav--prev {
	left: -25px;
}

.ksq-similar-products__nav--next {
	right: -25px;
}

/* ==========================================================================
   Product Card
   ========================================================================== */

.ksq-similar-products__card {
	flex-shrink: 0;
	width: 342px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.ksq-similar-products__card-link {
	display: flex;
	flex-direction: column;
	gap: 20px;
	text-decoration: none;
	color: inherit;
}

.ksq-similar-products__card-link:hover,
.ksq-similar-products__card-link:focus,
.ksq-similar-products__card-link:active {
	text-decoration: none;
}

.ksq-similar-products__card-link:hover *,
.ksq-similar-products__card-link * {
	text-decoration: none;
}

/* Card Image Container */
.ksq-similar-products__card-image {
	position: relative;
	width: 342px;
	height: 342px;
	background: #000000;
	border-radius: 16px;
	overflow: hidden;
}

/* Bottom gradient overlay */
.ksq-similar-products__card-image::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 105px;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 1.26%, #000000 57.14%);
	pointer-events: none;
	opacity: 0;
	transition: opacity 100ms ease-out;
	z-index: 2;
}

/* Blinking/Shimmer light sweep effect */
.ksq-similar-products__card-image::before {
	content: '';
	position: absolute;
	top: -20px;
	left: -250px;
	width: 210px;
	height: 382px;
	background: rgba(255, 255, 255, 0.2);
	filter: blur(40px);
	pointer-events: none;
	z-index: 3;
	opacity: 0;
	transition: opacity 100ms ease-out;
}

.ksq-similar-products__card:hover .ksq-similar-products__card-image::before {
	opacity: 1;
	animation: shimmerSweep 1.5s ease-in-out infinite;
}

@keyframes shimmerSweep {
	0% {
		left: -250px;
		opacity: 0;
	}
	20% {
		opacity: 1;
	}
	80% {
		opacity: 1;
	}
	100% {
		left: calc(100% + 50px);
		opacity: 0;
	}
}

.ksq-similar-products__card:hover .ksq-similar-products__card-image::after {
	opacity: 1;
}

.ksq-similar-products__card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 100ms ease-out;
}

.ksq-similar-products__card:hover .ksq-similar-products__card-image img {
	transform: scale(1.05);
}

/* Bestseller Badge */
.ksq-similar-products__badge-bestseller {
	position: absolute;
	top: 16px;
	left: 16px;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	padding: 8px 16px;
	gap: 8px;
	height: 32px;
	background: #444444;
	border-radius: 100px;
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 16px;
	color: #FFFFFF;
	z-index: 5;
	box-sizing: border-box;
}

.ksq-similar-products__badge-bestseller svg {
	flex-shrink: 0;
}

/* Wishlist Button */
.ksq-similar-products__wishlist {
	position: absolute;
	top: 16px;
	right: 16px;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #FFFFFF;
	border: none;
	border-radius: 50%;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.12);
	cursor: pointer;
	transition: all 100ms ease-out;
	z-index: 5;
	color: #111111;
}

.ksq-similar-products__wishlist:hover {
	transform: scale(1.1);
	box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.16);
}

.ksq-similar-products__wishlist svg {
	width: 24px;
	height: 24px;
	transition: all 100ms ease-out;
}

/* Active wishlist state - filled heart */
.ksq-similar-products__wishlist.is-active {
	background: #FF5100;
	color: #FFFFFF;
}

.ksq-similar-products__wishlist.is-active svg {
	fill: #FFFFFF;
}

.ksq-similar-products__wishlist.is-active svg path {
	stroke: #FFFFFF;
	fill: #FFFFFF;
}

.ksq-similar-products__wishlist.is-active:hover {
	background: #E54900;
}

/* Buy Now Button (appears on hover) */
.ksq-similar-products__buy-now {
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%) translateY(80px);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	/* 20px gap each side on any card width; Figma 302px on 342px cards */
	width: calc(100% - 40px);
	max-width: 302px;
	height: 48px;
	background: #FF5100;
	border-radius: 12px;
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 600;
	font-size: 18px;
	line-height: 21px;
	color: #FFFFFF;
	z-index: 10;
	opacity: 0;
	pointer-events: none;
	border: none;
	cursor: pointer;
	transition: transform 100ms ease-out, opacity 100ms ease-out;
}

.ksq-similar-products__card:hover .ksq-similar-products__buy-now {
	transform: translateX(-50%) translateY(0);
	opacity: 1;
	pointer-events: auto;
}

.ksq-similar-products__buy-now:hover {
	background: #E54900;
}

.ksq-similar-products__buy-now svg {
	width: 24px;
	height: 24px;
	flex-shrink: 0;
}

/* ==========================================================================
   Card Content (Below Image) - Matches Figma Frame 1437258767
   Height: 110px, gap: 16px between info block and prices
   ========================================================================== */

.ksq-similar-products__card-content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 0;
	gap: 16px;
	width: 100%;
}

/* Brand + Title wrapper - Matches Figma Frame 1437258764 */
/* Height: 71px, gap: 8px between brand row and title */
.ksq-similar-products__card-info {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 0;
	gap: 8px;
	width: 100%;
}

/* Brand Meta Row - Matches Figma Frame 1437258763 */
.ksq-similar-products__card-meta {
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 0;
	gap: 4px;
}

.ksq-similar-products__card-brand-label {
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 19px;
	color: #666666;
}

.ksq-similar-products__card-brand-name {
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 19px;
	color: #444444;
}

/* Product Title - 2 lines max, 44px height */
.ksq-similar-products__card-title {
	margin: 0;
	width: 100%;
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 500;
	font-size: 18px;
	line-height: 22px;
	color: #222222;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Prices Row - Matches Figma Frame 1437258766 */
.ksq-similar-products__card-prices {
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 0;
	gap: 16px;
}

/* Price amounts container - Matches Figma Frame 1437258580 */
.ksq-similar-products__card-price-row {
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 0;
	gap: 8px;
}

/* Current price - $2,550.00 */
.ksq-similar-products__card-price-current,
.ksq-similar-products__card-price-current .woocommerce-Price-amount,
.ksq-similar-products__card-price-current bdi {
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 600;
	font-size: 20px;
	line-height: 23px;
	color: #FF5100;
}

/* Regular/strikethrough price - $3,650.00 */
.ksq-similar-products__card-price-regular,
.ksq-similar-products__card-price-regular .woocommerce-Price-amount,
.ksq-similar-products__card-price-regular bdi {
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 20px;
	line-height: 23px;
	color: #888888;
	text-decoration: line-through;
}

/* Discount Badge - Matches Figma Frame 1437258676 */
.ksq-similar-products__card-discount {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	padding: 4px 12px;
	gap: 8px;
	background: rgba(255, 160, 51, 0.12);
	border: 1px solid rgba(255, 160, 51, 0.8);
	border-radius: 60px;
	font-family: 'Roboto Flex', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 12px;
	line-height: 14px;
	color: #4E2104;
}

/* ==========================================================================
   Similar Products Responsive
   ========================================================================== */

/* Below 1540px - add padding and resize cards to fit */
@media (max-width: 1540px) {
	.ksq-similar-products__container {
		padding: 0 50px !important;
	}
	
	/* Arrows stay at container edge */
	.ksq-similar-products__nav--prev {
		left: 0;
	}
	
	.ksq-similar-products__nav--next {
		right: 0;
	}
	
	.ksq-similar-products__nav {
		top: 50%;
		transform: translateY(-50%);
	}
	
	/* Reduce card width to fit 4 cards in smaller container */
	.ksq-similar-products__card {
		width: calc((100% - 72px) / 4);
		min-width: 280px;
	}
	
	.ksq-similar-products__card-image {
		width: 100%;
		height: auto;
		aspect-ratio: 1 / 1;
	}
}

@media (max-width: 1200px) {
	.ksq-similar-products {
		/* Diamond Tester has 60px bottom padding at this breakpoint, so 40px = 100px total */
		margin-top: 40px;
	}
	
	.ksq-similar-products__container {
		gap: 40px;
		padding: 0 50px !important;
	}
	
	.ksq-similar-products__title {
		font-size: 36px;
	}
	
	/* Fixed card size for horizontal scroll */
	.ksq-similar-products__card {
		width: 280px;
		min-width: 280px;
	}
	
	.ksq-similar-products__card-image {
		width: 280px;
		height: 280px;
	}
	
	.ksq-similar-products__track {
		gap: 20px;
	}
	
	.ksq-similar-products__nav {
		width: 44px;
		height: 44px;
		top: 50%;
		transform: translateY(-50%);
	}
	
	.ksq-similar-products__nav--prev {
		left: 3px;
	}
	
	.ksq-similar-products__nav--next {
		right: 3px;
	}
}

@media (max-width: 992px) {
	.ksq-similar-products__nav {
		display: none;
	}
	
	.ksq-similar-products__track-container {
		max-width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		-ms-overflow-style: none;
		padding-bottom: 16px;
	}
	
	.ksq-similar-products__track-container::-webkit-scrollbar {
		display: none;
	}
	
	/* Track handles left/right margin - 20px on mobile */
	.ksq-similar-products__track {
		padding-left: 20px;
		padding-right: 20px;
	}
}

@media (max-width: 1024px) {
	.ksq-similar-products {
		/* Diamond Tester has 48px bottom padding at this breakpoint, so 52px = 100px total */
		margin-top: 52px;
	}
	
	/* Remove ALL container padding - track handles the 20px margin */
	.ksq-similar-products__container,
	.single-product .ksq-similar-products__container {
		gap: 32px;
		padding: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	
	.ksq-similar-products__title {
		font-size: 28px;
		padding: 0 20px; /* Title needs padding since container has none */
	}
	
	.ksq-similar-products__card {
		width: 260px;
		gap: 16px;
	}
	
	.ksq-similar-products__card-image {
		width: 260px;
		height: 260px;
		border-radius: 12px;
	}
	
	.ksq-similar-products__badge-bestseller {
		padding: 6px 12px;
		font-size: 12px;
	}
	
	.ksq-similar-products__wishlist {
		width: 36px;
		height: 36px;
	}
	
	.ksq-similar-products__wishlist svg {
		width: 20px;
		height: 20px;
	}
	
	.ksq-similar-products__card-content {
		gap: 12px;
	}
	
	.ksq-similar-products__card-info {
		gap: 6px;
	}
	
	.ksq-similar-products__card-brand-label,
	.ksq-similar-products__card-brand-name {
		font-size: 14px;
		line-height: 17px;
	}
	
	.ksq-similar-products__card-title {
		font-size: 16px;
		line-height: 20px;
	}
	
	.ksq-similar-products__card-prices {
		gap: 12px;
	}
	
	.ksq-similar-products__card-price-current,
	.ksq-similar-products__card-price-current .woocommerce-Price-amount,
	.ksq-similar-products__card-price-current bdi,
	.ksq-similar-products__card-price-regular,
	.ksq-similar-products__card-price-regular .woocommerce-Price-amount,
	.ksq-similar-products__card-price-regular bdi {
		font-size: 18px;
		line-height: 21px;
	}
	
	.ksq-similar-products__buy-now {
		width: 140px;
		height: 42px;
		font-size: 16px;
	}
	
	/* Track handles the 20px left/right margin */
	.ksq-similar-products__track {
		padding-left: 20px;
		padding-right: 20px;
		gap: 16px;
	}
}

@media (max-width: 480px) {
	.ksq-similar-products,
	.ksq-cross-category-slider {
		/* Diamond Tester has 40px bottom padding at this breakpoint, so 60px = 100px total */
		margin-top: 60px;
	}
	
	.ksq-similar-products__title,
	.ksq-cross-category-slider .ksq-similar-products__title {
		font-size: 22px;
		line-height: 26px;
	}
	
	/* Figma specs: Card 200px width */
	.ksq-similar-products__card,
	.ksq-cross-category-slider .ksq-similar-products__card,
	.ksq-similar-products .ksq-product-card,
	.ksq-cross-category-slider .ksq-product-card {
		width: 200px !important;
		min-width: 200px !important;
		gap: 12px !important;
	}
	
	.ksq-similar-products__card-image,
	.ksq-cross-category-slider .ksq-similar-products__card-image,
	.ksq-similar-products .ksq-product-card__image,
	.ksq-cross-category-slider .ksq-product-card__image {
		width: 200px !important;
		height: 200px !important;
	}
	
	.ksq-similar-products__card-prices,
	.ksq-cross-category-slider .ksq-similar-products__card-prices,
	.ksq-similar-products .ksq-product-card__prices,
	.ksq-cross-category-slider .ksq-product-card__prices {
		flex-wrap: nowrap;
		gap: 12px !important;
	}
}

/* ==========================================================================
   Cross-Category Slider Section
   Shows complementary products from different category
   100px gap from Similar Products above, 100px gap to Brand Collection below
   ========================================================================== */

section.ksq-cross-category-slider.ksq-similar-products {
	/* 100px gap from Similar Products section above */
	margin-top: 100px !important;
	/* 100px white space gap to Brand Collection below */
	padding-bottom: 100px !important;
	margin-bottom: 0 !important;
}

/* Also target via ID for maximum specificity */
#cross-category-products.ksq-cross-category-slider {
	margin-top: 100px !important;
	padding-bottom: 100px !important;
	margin-bottom: 0 !important;
}

@media (max-width: 1200px) {
	section.ksq-cross-category-slider.ksq-similar-products,
	#cross-category-products.ksq-cross-category-slider {
		margin-top: 80px !important;
		padding-bottom: 80px !important;
	}
}

@media (max-width: 1024px) {
	section.ksq-cross-category-slider.ksq-similar-products,
	#cross-category-products.ksq-cross-category-slider {
		margin-top: 60px !important;
		padding-bottom: 60px !important;
	}
}

@media (max-width: 480px) {
	section.ksq-cross-category-slider.ksq-similar-products,
	#cross-category-products.ksq-cross-category-slider {
		margin-top: 40px !important;
		padding-bottom: 40px !important;
	}
}

/* ==========================================================================
   Customer Reviews Section - Full (with reviews)
   ========================================================================== */

.ksq-pdp-reviews-full {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	background: #FFFFFF;
	padding: 60px 0 0 0;
}

.ksq-pdp-reviews-full__container {
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 20px;
}

/* ==========================================================================
   Customer Reviews Section - Empty State
   ========================================================================== */

.ksq-reviews-empty {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	background: linear-gradient(180deg, #FAFAFA 0%, #FFFFFF 100%);
	padding: 80px 0;
	overflow: hidden;
}

.ksq-reviews-empty__container {
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 20px;
	text-align: center;
}

/* Header */
.ksq-reviews-empty__header {
	margin-bottom: 50px;
}

.ksq-reviews-empty__title {
	font-family: 'DM Serif Display', Georgia, 'Times New Roman', serif;
	font-style: normal;
	font-weight: 400;
	font-size: 44px;
	line-height: 60px;
	text-align: center;
	color: #000000;
	margin: 0 0 16px;
}

.ksq-reviews-empty__subtitle {
	font-family: "Roboto Flex", sans-serif;
	font-weight: 400;
	font-size: 18px;
	line-height: 26px;
	color: #666666;
	margin: 0;
}

/* Decorative Quote Cards */
.ksq-reviews-empty__cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	margin-bottom: 50px;
}

.ksq-reviews-empty__card {
	background: #FFFFFF;
	border: 1px solid #E5E5E5;
	border-radius: 16px;
	padding: 32px 24px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	animation: ksqFadeInUp 0.6s ease forwards;
	opacity: 0;
}

.ksq-reviews-empty__card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
}

@keyframes ksqFadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.ksq-reviews-empty__card-icon {
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #FF5100;
}

.ksq-reviews-empty__card-icon svg {
	width: 32px;
	height: 32px;
}

.ksq-reviews-empty__card-stars {
	display: flex;
	gap: 4px;
}

.ksq-reviews-empty__card-stars .ksq-star-box {
	width: 20px;
	height: 20px;
	background: #219653;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #FFFFFF;
}

.ksq-reviews-empty__card-stars .ksq-star-box svg {
	width: 14px;
	height: 14px;
}

.ksq-reviews-empty__card-quote {
	font-family: "Roboto Flex", sans-serif;
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
	color: #222222;
	font-style: italic;
	margin: 0;
	text-align: center;
}

.ksq-reviews-empty__card-author {
	font-family: "Roboto Flex", sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #888888;
}

/* Call to Action */
.ksq-reviews-empty__cta {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 30px;
	margin-bottom: 50px;
}

.ksq-reviews-empty__message {
	display: flex;
	align-items: center;
	gap: 20px;
	background: linear-gradient(135deg, #FFF8F5 0%, #FFF5F0 100%);
	border: 1px solid #FFE5D9;
	border-radius: 16px;
	padding: 24px 40px;
	max-width: 600px;
}

.ksq-reviews-empty__message-icon {
	width: 48px;
	height: 48px;
	flex-shrink: 0;
	color: #FF5100;
}

.ksq-reviews-empty__message-content {
	text-align: left;
}

.ksq-reviews-empty__message-content h3 {
	color: #1A1A1A;
	margin: 0 0 6px;
}

.ksq-reviews-empty__message-content p {
	font-family: "Roboto Flex", sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 20px;
	color: #666666;
	margin: 0;
}

/* Button styles (reuse from plugin) */
.ksq-reviews-empty .ksq-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 15px 50px;
	font-family: "Roboto Flex", sans-serif;
	font-weight: 600;
	font-size: 18px;
	line-height: 21px;
	border-radius: 12px;
	text-decoration: none;
	transition: all 0.2s ease;
	cursor: pointer;
	border: none;
}

.ksq-reviews-empty .ksq-btn--primary {
	background: #FF5100;
	color: #FFFFFF;
	min-width: 220px;
	height: 51px;
}

.ksq-reviews-empty .ksq-btn--primary:hover {
	background: #E04800;
	color: #FFFFFF;
}

/* Trust Indicators */
.ksq-reviews-empty__trust {
	display: flex;
	justify-content: center;
	gap: 40px;
	padding-top: 40px;
	border-top: 1px solid #EEEEEE;
}

.ksq-reviews-empty__trust-item {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: "Roboto Flex", sans-serif;
	font-weight: 500;
	font-size: 14px;
	color: #444444;
}

.ksq-reviews-empty__trust-item svg {
	width: 20px;
	height: 20px;
	color: #219653;
}

/* Responsive */
@media (max-width: 1024px) {
	.ksq-reviews-empty {
		padding: 50px 0;
	}
	
	.ksq-reviews-empty__title {
		font-size: 32px;
		line-height: 44px;
	}
	
	.ksq-reviews-empty__cards {
		grid-template-columns: 1fr;
		gap: 16px;
	}
	
	.ksq-reviews-empty__card {
		padding: 24px 20px;
	}
	
	.ksq-reviews-empty__message {
		flex-direction: column;
		text-align: center;
		padding: 24px 20px;
	}
	
	.ksq-reviews-empty__message-content {
		text-align: center;
	}
	
	.ksq-reviews-empty__trust {
		flex-direction: column;
		gap: 16px;
		align-items: center;
	}
	
	.ksq-reviews-empty .ksq-btn--primary {
		width: 100%;
	}
}



/* Space between Similar Products and the next section (Luxury Timepieces is dark, so the gap must be white space) */
.single-product .ksq-similar-products {
	padding-bottom: 80px;
}

@media (max-width: 1024px) {
	.single-product .ksq-similar-products {
		padding-bottom: 56px;
	}
}

@media (max-width: 480px) {
	.single-product .ksq-similar-products {
		padding-bottom: 40px;
	}
}