/**
 * Nisargo Natural Care - Customer Reviews Dedicated Stylesheet
 *
 * Scoped styles for the dedicated Customer Reviews page (/customer-reviews/).
 * Matches the unified botanical design system of Cart (/cart/) and Shop (/shop/).
 * Completely eliminates parent theme (Hello Elementor) #c36 pink on hover/focus.
 * Includes self-hosted Hind Siliguri fonts, viewport-aware popup, and price formatting.
 *
 * @package NisargoChild
 */

/* ==========================================================================
   Hind Siliguri Self-Hosted WOFF2 Fonts (Bengali & Latin Subsets)
   ========================================================================== */
@font-face {
	font-family: 'Hind Siliguri';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/hind-siliguri-v14-bengali-400.woff2') format('woff2');
	unicode-range: U+0951-0952, U+0964-0965, U+0980-09FE, U+1CD0, U+1CD2, U+1CD5-1CD6, U+1CD8, U+1CE1, U+1CEA, U+1CED, U+1CF2, U+1CF5-1CF7, U+200C-200D, U+20B9, U+25CC, U+A8F1, U+11DF0-11DF1;
}

@font-face {
	font-family: 'Hind Siliguri';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/hind-siliguri-v14-latin-400.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Hind Siliguri';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/hind-siliguri-v14-bengali-600.woff2') format('woff2');
	unicode-range: U+0951-0952, U+0964-0965, U+0980-09FE, U+1CD0, U+1CD2, U+1CD5-1CD6, U+1CD8, U+1CE1, U+1CEA, U+1CED, U+1CF2, U+1CF5-1CF7, U+200C-200D, U+20B9, U+25CC, U+A8F1, U+11DF0-11DF1;
}

@font-face {
	font-family: 'Hind Siliguri';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/hind-siliguri-v14-latin-600.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Hind Siliguri';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/hind-siliguri-v14-bengali-700.woff2') format('woff2');
	unicode-range: U+0951-0952, U+0964-0965, U+0980-09FE, U+1CD0, U+1CD2, U+1CD5-1CD6, U+1CD8, U+1CE1, U+1CEA, U+1CED, U+1CF2, U+1CF5-1CF7, U+200C-200D, U+20B9, U+25CC, U+A8F1, U+11DF0-11DF1;
}

@font-face {
	font-family: 'Hind Siliguri';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/hind-siliguri-v14-latin-700.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ==========================================================================
   1. Customer Reviews Page Hero Banner
   Matches Cart (/cart/) and Shop (/shop/) Page Hero
   ========================================================================== */

.nisargo-reviews-hero,
.ncr-page-hero {
	background: radial-gradient(circle at 50% 0%, rgba(35, 139, 91, 0.28) 0%, transparent 70%),
	            linear-gradient(135deg, #093320 0%, #0b3d26 50%, #176b45 100%) !important;
	padding: 44px 20px 40px !important;
	text-align: center !important;
	color: #ffffff !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 4px 16px rgba(11, 61, 38, 0.08) !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	box-sizing: border-box !important;
}

.nisargo-reviews-hero-inner,
.ncr-page-hero-inner {
	max-width: 720px !important;
	margin: 0 auto !important;
	padding: 0 !important;
	box-sizing: border-box !important;
}

/* Badge: NISARGO COMMUNITY */
.nisargo-reviews-hero .nisargo-hero-kicker,
.ncr-page-hero .ncr-eyebrow,
.ncr-page-hero .nisargo-hero-kicker {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	font-size: 0.75rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.12em !important;
	color: #8be6be !important;
	background: rgba(255, 255, 255, 0.08) !important;
	border: 1px solid rgba(139, 230, 190, 0.3) !important;
	padding: 4px 14px !important;
	border-radius: 20px !important;
	margin: 0 auto 12px !important;
	line-height: 1.4 !important;
}

/* Heading: Hear From Our Customers */
.nisargo-reviews-hero-title,
.ncr-page-hero h1,
.ncr-page-hero .ncr-page-hero-title {
	font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 2.125rem !important;
	font-weight: 700 !important;
	color: #ffffff !important;
	margin: 0 0 10px 0 !important;
	letter-spacing: -0.025em !important;
	line-height: 1.25 !important;
	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) !important;
}

/* Description: Discover why thousands trust us... */
.nisargo-reviews-hero-subtitle,
.ncr-page-hero p:last-child,
.ncr-page-hero .ncr-page-hero-subtitle {
	font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 1rem !important;
	font-weight: 400 !important;
	color: rgba(255, 255, 255, 0.92) !important;
	margin: 0 auto !important;
	line-height: 1.5 !important;
	max-width: 580px !important;
}

/* ==========================================================================
   2. Review Tabs (Video Reviews & Social Proof)
   Completely overrides & eliminates Hello Elementor #c36 pink
   ========================================================================== */

.ncr-root.ncr-reviews-page {
	margin-top: 32px !important;
	margin-bottom: 60px !important;
}

.ncr-page-toolbar {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	margin: 0 0 28px !important;
	padding: 0 !important;
	gap: 16px !important;
}

/* Completely remove Sort By UI */
.ncr-sort,
label.ncr-sort {
	display: none !important;
	visibility: hidden !important;
	margin: 0 !important;
	padding: 0 !important;
	height: 0 !important;
	width: 0 !important;
	overflow: hidden !important;
	pointer-events: none !important;
}

/* Tab Container Pill */
.ncr-tabs {
	background: #EAF3EC !important;
	background-color: #EAF3EC !important;
	border: 1px solid rgba(23, 107, 69, 0.15) !important;
	border-radius: 999px !important;
	display: inline-flex !important;
	align-items: center !important;
	padding: 5px !important;
	gap: 6px !important;
	box-shadow: inset 0 1px 3px rgba(11, 61, 38, 0.05) !important;
	margin: 0 auto !important;
}

/* Both Tabs (Video Reviews & Social Proof) Base State */
.ncr-tabs button,
.ncr-tabs [type="button"],
.ncr-tabs button[role="tab"] {
	background: transparent !important;
	background-color: transparent !important;
	border: 1px solid transparent !important;
	border-color: transparent !important;
	border-radius: 999px !important;
	color: #0B3D26 !important;
	-webkit-text-fill-color: #0B3D26 !important;
	cursor: pointer !important;
	font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 14.5px !important;
	font-weight: 600 !important;
	min-height: 42px !important;
	padding: 8px 22px !important;
	line-height: 1.4 !important;
	text-decoration: none !important;
	outline: none !important;
	box-shadow: none !important;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
}

/* Inactive Tab Hover & Focus State (Overrides parent theme #c36 pink) */
.ncr-tabs button:hover,
.ncr-tabs [type="button"]:hover,
.ncr-tabs button:focus,
.ncr-tabs [type="button"]:focus {
	background: rgba(23, 107, 69, 0.08) !important;
	background-color: rgba(23, 107, 69, 0.08) !important;
	border-color: rgba(23, 107, 69, 0.12) !important;
	color: #176B45 !important;
	-webkit-text-fill-color: #176B45 !important;
	transform: translateY(-1px) !important;
	box-shadow: none !important;
}

/* Active Tab (Applied to either Video Reviews or Social Proof when selected) */
.ncr-tabs button[aria-selected="true"],
.ncr-tabs [type="button"][aria-selected="true"],
.ncr-tabs button[role="tab"][aria-selected="true"],
.ncr-tabs button[aria-selected="true"]:focus,
.ncr-tabs [type="button"][aria-selected="true"]:focus {
	background: #176B45 !important;
	background-color: #176B45 !important;
	border: 1px solid #176B45 !important;
	border-color: #176B45 !important;
	color: #FFFFFF !important;
	-webkit-text-fill-color: #FFFFFF !important;
	font-weight: 700 !important;
	box-shadow: 0 4px 14px rgba(23, 107, 69, 0.28) !important;
	cursor: default !important;
	transform: none !important;
}

/* Active Tab Hover State */
.ncr-tabs button[aria-selected="true"]:hover,
.ncr-tabs [type="button"][aria-selected="true"]:hover {
	background: #0B3D26 !important;
	background-color: #0B3D26 !important;
	border-color: #0B3D26 !important;
	color: #FFFFFF !important;
	-webkit-text-fill-color: #FFFFFF !important;
	box-shadow: 0 4px 14px rgba(11, 61, 38, 0.35) !important;
	transform: none !important;
}

/* Accessible Keyboard Focus Ring */
.ncr-tabs button:focus-visible,
.ncr-tabs [type="button"]:focus-visible {
	outline: 2px solid #176B45 !important;
	outline-offset: 2px !important;
}

/* ==========================================================================
   3. Responsive Breakpoints
   ========================================================================== */

@media (max-width: 768px) {
	.nisargo-reviews-hero,
	.ncr-page-hero {
		padding: 32px 16px 28px !important;
	}

	.nisargo-reviews-hero-title,
	.ncr-page-hero h1,
	.ncr-page-hero .ncr-page-hero-title {
		font-size: 1.625rem !important;
		margin-bottom: 8px !important;
	}

	.nisargo-reviews-hero-subtitle,
	.ncr-page-hero p:last-child,
	.ncr-page-hero .ncr-page-hero-subtitle {
		font-size: 0.875rem !important;
		line-height: 1.45 !important;
	}

	.ncr-page-toolbar {
		margin-bottom: 20px !important;
	}
}

@media (max-width: 600px) {
	.ncr-page-toolbar {
		align-items: center !important;
		justify-content: center !important;
		width: 100% !important;
	}

	.ncr-tabs {
		display: flex !important;
		width: 100% !important;
		max-width: 360px !important;
		box-sizing: border-box !important;
	}

	.ncr-tabs button,
	.ncr-tabs [type="button"] {
		flex: 1 1 50% !important;
		padding: 8px 12px !important;
		font-size: 13.5px !important;
		text-align: center !important;
		justify-content: center !important;
	}
}

@media (max-width: 360px) {
	.ncr-tabs button,
	.ncr-tabs [type="button"] {
		font-size: 12.5px !important;
		padding: 7px 8px !important;
	}
}

/* ==========================================================================
   4. Review Detail Modal (Popup) Refinements
   - Zero unnecessary padding/empty space around video and images
   - Object-fit contain and natural aspect-ratio preservation
   - Hind Siliguri typography for Bengali reviews
   - Unbreakable price formatting with inline currency symbol
   ========================================================================== */

.ncr-modal-dialog {
	position: relative !important;
	z-index: 2 !important;
	width: min(94vw, 860px) !important;
	max-width: 860px !important;
	max-height: min(90vh, 90dvh, 680px) !important;
	height: auto !important;
	min-height: 0 !important;
	background: #ffffff !important;
	border-radius: 18px !important;
	box-shadow: 0 24px 80px rgba(0, 0, 0, 0.45) !important;
	outline: none !important;
	display: flex !important;
	flex-direction: column !important;
	overflow: hidden !important;
	margin: auto !important;
	font-family: 'Poppins', 'Hind Siliguri', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

.ncr-modal-close {
	position: absolute !important;
	top: 14px !important;
	right: 14px !important;
	z-index: 35 !important;
	width: 40px !important;
	height: 40px !important;
	border-radius: 50% !important;
	background: #176b45 !important;
	color: #ffffff !important;
	border: 2px solid #ffffff !important;
	box-shadow: 0 3px 14px rgba(16, 61, 42, 0.32) !important;
	cursor: pointer !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-size: 26px !important;
	line-height: 1 !important;
	padding: 0 !important;
	flex-shrink: 0 !important;
	transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
}

.ncr-modal-close:hover,
.ncr-modal-close:focus-visible {
	background: #103d2a !important;
	transform: scale(1.08) !important;
	box-shadow: 0 0 0 3px rgba(23, 107, 69, 0.28) !important;
	outline: none !important;
}

.ncr-modal-content {
	min-height: 0 !important;
	height: 100% !important;
	width: 100% !important;
	flex: 1 1 auto !important;
	display: flex !important;
	flex-direction: column !important;
	overflow: hidden !important;
}

/* Two-Panel Layout */
.ncr-detail {
	display: grid !important;
	grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr) !important;
	min-height: 0 !important;
	height: 100% !important;
	width: 100% !important;
	align-items: stretch !important;
}

.ncr-detail.is-text-only {
	display: block !important;
	overflow-y: auto !important;
}

.ncr-detail.is-text-only .ncr-detail-copy {
	max-width: 680px !important;
	margin: 0 auto !important;
	padding: 36px 36px 36px !important;
}

/* Media Panel (Left Side) - Deep Botanical Green, Zero Unnecessary Padding */
.ncr-detail-media {
	background: #091f14 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: relative !important;
	overflow: hidden !important;
	min-height: 380px !important;
	height: 100% !important;
	width: 100% !important;
	align-self: stretch !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Portrait Videos (YouTube Shorts, 9:16) - Preserves Aspect Ratio, Expands Naturally */
.ncr-embed.ncr-embed-portrait {
	aspect-ratio: 9 / 16 !important;
	height: 100% !important;
	max-height: 100% !important;
	width: auto !important;
	max-width: 100% !important;
	margin: auto !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: relative !important;
}

.ncr-embed.ncr-embed-portrait iframe {
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;
	border: none !important;
	display: block !important;
}

/* Landscape Videos (16:9) */
.ncr-embed.ncr-embed-landscape {
	aspect-ratio: 16 / 9 !important;
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	max-height: 100% !important;
	margin: auto !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: relative !important;
}

.ncr-embed.ncr-embed-landscape iframe {
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;
	border: none !important;
	display: block !important;
}

/* HTML5 & WordPress Embedded Videos */
.ncr-detail-media .wp-video,
.ncr-detail-media video,
.ncr-detail-media .wp-video-shortcode {
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain !important;
	margin: auto !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.ncr-detail-media .wp-video video {
	width: 100% !important;
	height: 100% !important;
	max-height: 100% !important;
	object-fit: contain !important;
}

/* Review Images - Preserves Complete Image with Object-Fit Contain */
.ncr-detail-image {
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain !important;
	display: block !important;
	margin: auto !important;
	padding: 0 !important;
}

/* Review Copy Panel (Right Side) - Scrollable when needed, Balanced Spacing */
.ncr-detail-copy {
	padding: 28px 46px 24px 24px !important;
	display: flex !important;
	flex-direction: column !important;
	justify-content: flex-start !important;
	overflow-y: auto !important;
	overflow-x: hidden !important;
	-webkit-overflow-scrolling: touch;
	min-width: 0 !important;
	height: 100% !important;
	max-height: 100% !important;
	min-height: 0 !important;
}

/* Hide reviewer profile/avatar icon in review detail modal */
.ncr-detail .ncr-reviewer .ncr-avatar,
.ncr-detail .ncr-reviewer .ncr-avatar-fallback {
	display: none !important;
}

.ncr-reviewer h3,
.ncr-reviewer strong {
	font-family: 'Hind Siliguri', 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	color: #173824 !important;
	margin: 0 !important;
}

/* Review Title (Bengali Typography with Hind Siliguri) */
.ncr-detail-copy h2 {
	font-family: 'Hind Siliguri', 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: clamp(18px, 2.2vw, 22px) !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
	margin: 8px 0 6px !important;
	color: #173824 !important;
	word-break: break-word !important;
}

/* Review Description & Customer Text (Bengali Typography with Hind Siliguri) */
.ncr-full-review,
.ncr-full-review p {
	font-family: 'Hind Siliguri', 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 14.5px !important;
	font-weight: 400 !important;
	line-height: 1.65 !important;
	color: #3b4e41 !important;
	margin: 8px 0 12px !important;
	word-break: break-word !important;
}

.ncr-full-review strong,
.ncr-full-review b {
	font-weight: 700 !important;
}

.ncr-detail-copy time,
.ncr-source {
	color: #78857d !important;
	font-size: 12.5px !important;
	font-family: 'Hind Siliguri', 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

/* Product Card Inside Modal */
.ncr-product-card {
	align-items: center !important;
	background: #f4f8f5 !important;
	border: 1px solid #d3e2d7 !important;
	border-radius: 14px !important;
	display: grid !important;
	gap: 14px !important;
	grid-template-columns: 80px minmax(0, 1fr) !important;
	margin-top: auto !important;
	margin-top: 16px !important;
	padding: 12px 14px !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

.ncr-product-card img {
	border-radius: 10px !important;
	height: 80px !important;
	width: 80px !important;
	object-fit: cover !important;
	flex-shrink: 0 !important;
	display: block !important;
}

.ncr-product-card > div {
	min-width: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	justify-content: center !important;
	gap: 2px !important;
	width: 100% !important;
}

.ncr-product-card span,
.ncr-product-card small {
	color: #5d6f63 !important;
	display: block !important;
	font-size: 11px !important;
	font-weight: 500 !important;
	letter-spacing: 0.02em !important;
	text-transform: uppercase !important;
	line-height: 1.3 !important;
}

.ncr-product-card strong {
	color: #173824 !important;
	display: block !important;
	font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	margin: 2px 0 3px !important;
	word-break: break-word !important;
}

/* Product Price Section - Unbreakable Currency Symbol & Clean Alignment */
.ncr-price {
	color: #176b45 !important;
	font-weight: 700 !important;
	font-size: 14.5px !important;
	margin: 3px 0 8px !important;
	display: flex !important;
	align-items: baseline !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	line-height: 1.35 !important;
	white-space: normal !important;
	width: 100% !important;
}

/* Prevent currency symbol from breaking onto a separate line */
.ncr-price del,
.ncr-price ins,
.ncr-price .woocommerce-Price-amount,
.ncr-price .amount,
.ncr-price bdi {
	white-space: nowrap !important;
	display: inline-flex !important;
	align-items: baseline !important;
}

.ncr-price del {
	color: #7b8d80 !important;
	font-size: 12.5px !important;
	font-weight: 500 !important;
	text-decoration: line-through !important;
	opacity: 0.8 !important;
	order: 1 !important;
}

.ncr-price ins {
	color: #176b45 !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	background: transparent !important;
	order: 2 !important;
}

/* Regular price without sale */
.ncr-price > .woocommerce-Price-amount,
.ncr-price > .amount,
.ncr-price > bdi {
	color: #176b45 !important;
	font-size: 15px !important;
	font-weight: 700 !important;
}

.ncr-price .woocommerce-Price-currencySymbol {
	white-space: nowrap !important;
	display: inline !important;
	margin-left: 1px !important;
	color: inherit !important;
	font-weight: inherit !important;
}

/* View Product Details Button */
.ncr-modal .ncr-product-card a,
.ncr-modal .ncr-product-card .ncr-button,
.ncr-modal .ncr-product-card a.ncr-button,
.ncr-modal .ncr-product-button,
.ncr-detail .ncr-product-card a,
.ncr-product-card a.ncr-product-button,
.ncr-product-card .ncr-button,
.ncr-product-card a.ncr-button,
.ncr-product-button {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: #176b45 !important;
	background-color: #176b45 !important;
	color: #ffffff !important;
	-webkit-text-fill-color: #ffffff !important;
	border: 1px solid #176b45 !important;
	border-radius: 999px !important;
	font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	font-size: 12.5px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	min-height: 36px !important;
	padding: 7px 18px !important;
	margin-top: 2px !important;
	text-decoration: none !important;
	box-shadow: 0 3px 10px rgba(23, 107, 69, 0.22) !important;
	cursor: pointer !important;
	opacity: 1 !important;
	visibility: visible !important;
	white-space: nowrap !important;
	max-width: 100% !important;
	width: auto !important;
	transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
}

.ncr-modal .ncr-product-card a:hover,
.ncr-modal .ncr-product-card a:focus,
.ncr-modal .ncr-product-card a:focus-visible,
.ncr-modal .ncr-product-card .ncr-button:hover,
.ncr-modal .ncr-product-card .ncr-button:focus,
.ncr-modal .ncr-product-card .ncr-button:focus-visible,
.ncr-product-card .ncr-button:hover,
.ncr-product-card a.ncr-button:hover,
.ncr-product-button:hover,
.ncr-product-card .ncr-button:focus-visible,
.ncr-product-card a.ncr-button:focus-visible,
.ncr-product-button:focus-visible {
	background: #103d2a !important;
	background-color: #103d2a !important;
	border-color: #103d2a !important;
	color: #ffffff !important;
	-webkit-text-fill-color: #ffffff !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 5px 14px rgba(16, 61, 42, 0.32) !important;
	outline: none !important;
}

.ncr-product-card .ncr-product-button::before,
.ncr-product-card .ncr-product-button::after {
	display: none !important;
	content: none !important;
}

/* ==========================================================================
   5. Responsive Modal Breakpoints (320px - 900px)
   ========================================================================== */

@media (max-width: 900px) {
	.ncr-modal-prev {
		left: 8px !important;
	}
	.ncr-modal-next {
		right: 8px !important;
	}
}

@media (max-width: 768px) {
	.ncr-modal {
		padding: 10px !important;
	}
	.ncr-modal-dialog {
		width: 100% !important;
		max-width: 500px !important;
		max-height: calc(100vh - 20px) !important;
		max-height: calc(100dvh - 20px) !important;
		border-radius: 16px !important;
		overflow-y: auto !important;
		overflow-x: hidden !important;
		-webkit-overflow-scrolling: touch;
	}
	.ncr-modal-content {
		overflow: visible !important;
		height: auto !important;
	}
	.ncr-detail {
		grid-template-columns: 1fr !important;
		display: flex !important;
		flex-direction: column !important;
		height: auto !important;
		max-height: none !important;
	}
	.ncr-detail-media {
		width: 100% !important;
		min-height: 240px !important;
		height: auto !important;
		max-height: min(48vh, 48dvh, 360px) !important;
		flex-shrink: 0 !important;
	}
	.ncr-embed.ncr-embed-portrait {
		height: min(48vh, 48dvh, 360px) !important;
		max-height: min(48vh, 48dvh, 360px) !important;
		width: auto !important;
		max-width: 100% !important;
	}
	.ncr-embed.ncr-embed-landscape {
		max-height: min(48vh, 48dvh, 360px) !important;
	}
	.ncr-detail-image {
		height: min(48vh, 48dvh, 360px) !important;
		max-height: min(48vh, 48dvh, 360px) !important;
	}
	.ncr-detail-copy {
		overflow-y: visible !important;
		height: auto !important;
		max-height: none !important;
		padding: 20px 16px 24px !important;
	}
	.ncr-modal-close {
		top: 10px !important;
		right: 10px !important;
		width: 36px !important;
		height: 36px !important;
		font-size: 22px !important;
	}
	.ncr-modal-nav {
		width: 38px !important;
		height: 38px !important;
		font-size: 24px !important;
		top: auto !important;
		bottom: 12px !important;
		transform: none !important;
	}
	.ncr-modal-nav:hover,
	.ncr-modal-nav:focus-visible {
		transform: scale(1.08) !important;
	}
	.ncr-modal-prev {
		left: 12px !important;
	}
	.ncr-modal-next {
		right: 12px !important;
	}
	.ncr-modal-count {
		bottom: 18px !important;
	}
	.ncr-product-card {
		grid-template-columns: 72px minmax(0, 1fr) !important;
		gap: 12px !important;
		padding: 10px 12px !important;
	}
	.ncr-product-card img {
		height: 72px !important;
		width: 72px !important;
	}
}

/* Extra small devices (320px - 380px) */
@media (max-width: 380px) {
	.ncr-modal {
		padding: 6px !important;
	}
	.ncr-modal-dialog {
		width: 100% !important;
		max-height: calc(100vh - 12px) !important;
		max-height: calc(100dvh - 12px) !important;
		border-radius: 12px !important;
	}
	.ncr-detail-media {
		min-height: 200px !important;
		max-height: min(44vh, 44dvh, 300px) !important;
	}
	.ncr-embed.ncr-embed-portrait {
		height: min(44vh, 44dvh, 300px) !important;
		max-height: min(44vh, 44dvh, 300px) !important;
	}
	.ncr-detail-image {
		height: min(44vh, 44dvh, 300px) !important;
		max-height: min(44vh, 44dvh, 300px) !important;
	}
	.ncr-detail-copy {
		padding: 16px 12px 20px !important;
	}
	.ncr-product-card {
		grid-template-columns: 60px minmax(0, 1fr) !important;
		gap: 10px !important;
		padding: 8px 10px !important;
	}
	.ncr-product-card img {
		height: 60px !important;
		width: 60px !important;
	}
	.ncr-product-button {
		font-size: 12px !important;
		padding: 6px 14px !important;
		min-height: 34px !important;
	}
}

