/*
Irozon shop styling — structural rebuild.
Scope: header/nav, footer, WooCommerce shop archive, WooCommerce single product.
*/

:root {
	--irozon-primary-gradient: linear-gradient(135deg, #35d063, #02c685);
	--irozon-green: #02c685;
	--irozon-dark: #1a1a1a;
	--irozon-ink: #2c3033;
	--irozon-muted: #6d7278;
	--irozon-border: #e6e6e6;
	--irozon-surface: #ffffff;
	--irozon-shop-bg: rgb(245, 245, 245);
}

body, .irozon-header, .irozon-footer, .irozon-shop-archive, .irozon-single-product {
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Shop-wide background, matching irozon.se's body tone */
body.woocommerce,
body.woocommerce-page,
body.single-product,
.irozon-shop-archive,
.irozon-single-product {
	background-color: var(--irozon-shop-bg);
}

.irozon-shop-archive .irozon-product-info,
.irozon-single-product .irozon-product-details table.woocommerce-product-attributes,
.irozon-single-product #review_form_wrapper,
.woocommerce-message,
.woocommerce-error,
.woocommerce-info,
.wc-block-components-notice-banner {
	background-color: var(--irozon-surface);
}

/* =========================================================
   HEADER / NAVBAR — matches D:\Code\irozon-website Navigation.tsx
   ========================================================= */

.irozon-header {
	background-color: rgba(255, 255, 255, 0.97) !important;
	box-shadow: 0 1px 0 var(--irozon-border);
	position: sticky;
	top: 0;
	z-index: 500;
}

.irozon-header-inner {
	min-height: 4rem;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.irozon-header-logo img {
	height: auto;
	max-height: 2.5rem;
	width: auto;
	object-fit: contain;
}

/* Theme's global ".hostinger-ai-site-navigation a:hover" rule (in style.min.css,
   part of the deactivated Hostinger AI plugin's base styling) adds a solid black
   border-bottom on hover/current-menu-item. Kill it in every state, on every
   selector shape the block can render (WP core Navigation block adds
   "current-menu-item"/"current-menu-ancestor" to the <li>, "aria-current" to the
   link itself, and nothing guarantees the link is a direct child), and on every
   property that could draw a line under the text. This must stay independent of
   the Hostinger plugin, which is why it lives here in irozon-shop.css. */
.hostinger-ai-site-navigation a,
.hostinger-ai-site-navigation a:hover,
.hostinger-ai-site-navigation a:focus,
.hostinger-ai-site-navigation a:focus-visible,
.hostinger-ai-site-navigation a:active,
.hostinger-ai-site-navigation .current-menu-item a,
.hostinger-ai-site-navigation .current-menu-item a:hover,
.hostinger-ai-site-navigation .current-menu-ancestor a,
.hostinger-ai-site-navigation .current-page-item a,
.hostinger-ai-site-navigation a[aria-current="page"],
.hostinger-ai-site-navigation a[aria-current="page"]:hover,
.hostinger-ai-site-title a,
.hostinger-ai-site-title a:hover,
.irozon-nav .wp-block-navigation-item,
.irozon-nav .wp-block-navigation-item > a,
.irozon-nav .wp-block-navigation-item__content,
.irozon-nav .wp-block-navigation-item__content:hover,
.irozon-nav .wp-block-navigation-item__content:focus,
.irozon-nav .wp-block-navigation-item__content:focus-visible,
.irozon-nav .wp-block-navigation-item__content:active,
.irozon-nav .current-menu-item .wp-block-navigation-item__content,
.irozon-nav .current-menu-ancestor .wp-block-navigation-item__content {
	border: 0 !important;
	border-bottom: 0 !important;
	text-decoration: none !important;
	box-shadow: none !important;
	background-image: none !important;
}

.hostinger-ai-site-navigation a::before,
.hostinger-ai-site-navigation a::after,
.irozon-nav .wp-block-navigation-item__content::before {
	content: none !important;
	border: 0 !important;
	background: none !important;
}

/* Accessible keyboard-focus indicator that isn't the black border-bottom */
.irozon-nav .wp-block-navigation-item__content:focus-visible {
	outline: 2px solid var(--irozon-green) !important;
	outline-offset: 2px;
	border-radius: 0.25rem;
}

.irozon-nav .wp-block-navigation-item > .wp-block-navigation-item__content {
	font-weight: 500;
	font-size: 0.9rem;
	color: var(--irozon-ink);
	padding: 0.5rem 0.75rem;
	border-bottom: none !important;
	transition: color 0.2s ease;
}

.irozon-nav .wp-block-navigation-item > .wp-block-navigation-item__content:hover {
	color: var(--irozon-green) !important;
	border-bottom: none !important;
}

.irozon-nav .wp-block-navigation-item.irozon-nav-active > .wp-block-navigation-item__content {
	color: var(--irozon-green) !important;
	position: relative;
	font-weight: 700;
}

.irozon-nav .wp-block-navigation-item.irozon-nav-active > .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0.75rem;
	right: 0.75rem;
	bottom: 0.15rem;
	height: 2px;
	border-radius: 2px;
	background: var(--irozon-primary-gradient);
}

.wc-block-customer-account__link,
.hostinger-ai-site-navigation-wrapper .wc-block-mini-cart__button {
	border-radius: 999px;
	transition: background-color 0.2s ease;
}

.hostinger-ai-site-navigation-wrapper .wc-block-mini-cart__button:hover,
.wc-block-customer-account__link:hover {
	background-color: rgba(0, 0, 0, 0.05);
}

.wc-block-mini-cart__badge {
	background: var(--irozon-primary-gradient) !important;
	border-color: transparent !important;
}

/* Mobile nav drawer — reproduces src/components/Navigation.tsx's shadcn <Sheet>:
   dim overlay behind a right-side panel, 300-360px wide, generous inset padding,
   open/close slide transition, reduced-motion respected (WP core's Interactivity
   API already wires up Escape-to-close, overlay-click-to-close, focus trap, and
   body-scroll locking for the Navigation block's modal — this only restyles it). */
.irozon-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: rgba(0, 0, 0, 0.5) !important;
}

.irozon-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	background: #fff;
	width: 85vw;
	max-width: 360px;
	min-width: 280px;
	margin-left: auto;
	height: 100dvh;
	padding: 5rem 1.75rem 2rem !important;
	box-shadow: -10px 0 30px rgba(0, 0, 0, 0.15);
	box-sizing: border-box;
}

.irozon-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	position: absolute;
	top: 1.25rem;
	right: 1.25rem;
}

.irozon-nav .wp-block-navigation__responsive-container.is-menu-open ul.wp-block-navigation__container {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.irozon-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	display: block;
	font-size: 1.05rem;
	font-weight: 500;
	color: var(--irozon-ink);
	padding: 0.85rem 0.5rem !important;
	border-radius: 0.5rem;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.irozon-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover,
.irozon-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:focus-visible {
	background-color: rgba(0, 0, 0, 0.05);
}

.irozon-nav .wp-block-navigation__responsive-container.is-menu-open .irozon-nav-active .wp-block-navigation-item__content {
	color: var(--irozon-green) !important;
	font-weight: 700;
}

.irozon-nav .wp-block-navigation__responsive-container.is-menu-open .irozon-nav-active .wp-block-navigation-item__content::after {
	content: none !important;
}

@media (prefers-reduced-motion: reduce) {
	.irozon-nav .wp-block-navigation__responsive-container,
	.irozon-nav .wp-block-navigation__responsive-container-content {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}

/* =========================================================
   FOOTER — rebuilt from D:\Code\irozon-website src/components/Footer.tsx
   ========================================================= */

.irozon-footer-v2 {
	background-color: #ebebeb;
	color: var(--irozon-ink);
	overflow: hidden;
}

.irozon-footer-top {
	max-width: 82.5rem;
	margin: 0 auto;
	padding: 5rem 1.5rem 2rem;
}

.irozon-footer-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 3rem;
	align-items: end;
}

.irozon-footer-heading h2 {
	font-size: clamp(2.5rem, 5vw, 3.75rem);
	font-weight: 700;
	line-height: 1.05;
	margin: 0;
	color: var(--irozon-ink);
}

.irozon-footer-social h3,
.irozon-footer-contact h3 {
	font-size: 0.85rem;
	font-weight: 600;
	margin: 0 0 1.5rem;
	color: var(--irozon-ink);
}

.irozon-footer-social-icons {
	display: flex;
	gap: 1rem;
}

.irozon-footer-social-icons a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.08);
	color: var(--irozon-ink);
	transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.irozon-footer-social-icons a:hover {
	background: #000;
	color: #fff;
	transform: scale(1.1);
}

.irozon-footer-contact a {
	font-size: 1.125rem;
	font-weight: 500;
	color: var(--irozon-ink);
	text-decoration: none;
	transition: color 0.2s ease;
}

.irozon-footer-contact a:hover {
	color: var(--irozon-green);
}

.irozon-footer-marquee {
	overflow: hidden;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	padding: 1.5rem 0;
}

.irozon-footer-marquee-track {
	display: flex;
	width: max-content;
	white-space: nowrap;
	animation: irozon-marquee 32s linear infinite;
}

.irozon-footer-marquee-track span {
	font-size: clamp(1.75rem, 5vw, 3.5rem);
	font-weight: 700;
	color: var(--irozon-ink);
}

@keyframes irozon-marquee {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

.irozon-footer-bottom {
	max-width: 82.5rem;
	margin: 0 auto;
	padding: 1.5rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 0.5rem;
	font-size: 0.85rem;
	color: var(--irozon-muted);
}

@media (max-width: 782px) {
	.irozon-footer-grid {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.irozon-footer-bottom {
		justify-content: center;
		text-align: center;
	}
}

/* =========================================================
   MOBILE GUTTER — consistent side padding everywhere on small screens.
   theme.json has no root-padding-aware alignment, so unaligned/wide blocks
   have zero side inset by default; pad the top-level wrappers once instead
   of every child (header heading, breadcrumbs, toolbar, grid, product
   details, additional info and reviews all live inside these wrappers).
   ========================================================= */

.irozon-shop-archive,
.irozon-single-product,
.hostinger-ai-menu-wrapper,
.irozon-footer-top,
.irozon-footer-bottom {
	padding-left: 2rem !important;
	padding-right: 2rem !important;
	box-sizing: border-box;
}

@media (max-width: 782px) {
	.irozon-shop-archive,
	.irozon-single-product,
	.hostinger-ai-menu-wrapper,
	.irozon-footer-top,
	.irozon-footer-bottom {
		padding-left: 1.5rem !important;
		padding-right: 1.5rem !important;
	}
}

@media (max-width: 480px) {
	.irozon-shop-archive,
	.irozon-single-product,
	.hostinger-ai-menu-wrapper,
	.irozon-footer-top,
	.irozon-footer-bottom {
		padding-left: 1.25rem !important;
		padding-right: 1.25rem !important;
	}
}

/* =========================================================
   SHOP ARCHIVE — modeled on theme.madsparrow.me/osty/shop
   ========================================================= */

.irozon-shop-title.wp-block-query-title {
	font-size: clamp(2.5rem, 7vw, 4.5rem);
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--irozon-ink);
	margin: 2.5rem 0 0.5rem;
	text-transform: uppercase;
}

.irozon-shop-description {
	color: var(--irozon-muted);
	font-size: 1rem;
	margin: 0 0 1.25rem;
	max-width: 40em;
}

.irozon-shop-description:empty {
	display: none;
}

.irozon-breadcrumbs {
	color: var(--irozon-ink);
	font-size: 0.8rem;
	margin: 0.75rem 0 1.5rem;
	line-height: 1.6;
	flex-wrap: wrap;
}

.irozon-breadcrumbs,
.irozon-breadcrumbs nav,
.irozon-breadcrumbs .woocommerce-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem;
}

.irozon-breadcrumbs a {
	color: var(--irozon-muted);
	text-decoration: none !important;
	border-bottom: 0 !important;
	transition: color 0.2s ease;
}

.irozon-breadcrumbs a:hover,
.irozon-breadcrumbs a:focus-visible {
	color: var(--irozon-green);
}

.irozon-breadcrumbs a:focus-visible {
	outline: 2px solid var(--irozon-green);
	outline-offset: 2px;
	border-radius: 0.2rem;
}

.irozon-shop-toolbar {
	margin: 0 0 2rem;
	font-size: 0.9rem;
	color: var(--irozon-muted);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
}

.irozon-shop-toolbar .wc-block-components-product-results-count {
	margin-bottom: 0;
}

/* Real native <select> — no fake dropdown, just a styled control with a
   custom chevron drawn via background-image so the native picker still opens */
.irozon-shop-toolbar select {
	appearance: none;
	-webkit-appearance: none;
	border: 1px solid var(--irozon-border);
	border-radius: 0.5rem;
	background-color: var(--irozon-surface);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%236d7278' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.9rem center;
	color: var(--irozon-ink);
	font-size: 0.85rem;
	font-family: inherit;
	padding: 0.6rem 2.25rem 0.6rem 1rem;
	min-width: 12rem;
	max-width: 100%;
	cursor: pointer;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.irozon-shop-toolbar select:hover {
	border-color: #cfcfcf;
}

.irozon-shop-toolbar select:focus-visible {
	outline: none;
	border-color: var(--irozon-green);
	box-shadow: 0 0 0 3px rgba(2, 198, 133, 0.2);
}

.irozon-shop-toolbar select:disabled {
	opacity: 0.5;
	cursor: not-allowed;
	background-color: #f5f5f5;
}

@media (max-width: 480px) {
	.irozon-shop-toolbar select {
		width: 100%;
	}
}

/* Category tiles row — output of the [product_categories] shortcode */
.irozon-shop-categories {
	margin-bottom: 2.5rem;
}

.irozon-shop-categories ul.products {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.irozon-shop-categories ul.products li.product-category {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	width: auto;
	margin: 0;
	padding: 0;
	text-align: left;
}

.irozon-shop-categories ul.products li.product-category a {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	color: var(--irozon-ink);
	font-size: 0.9rem;
	font-weight: 500;
	text-decoration: none;
}

.irozon-shop-categories ul.products li.product-category img {
	width: 44px !important;
	height: 44px !important;
	border-radius: 999px !important;
	object-fit: cover;
	margin: 0 !important;
}

.irozon-shop-categories ul.products li.product-category h2 {
	font-size: 0.9rem;
	font-weight: 500;
	margin: 0;
}

.irozon-shop-categories ul.products li.product-category mark {
	background: none;
	color: inherit;
	font-weight: inherit;
}

.irozon-shop-categories ul.products li.product-category .count {
	display: none;
}

/* Product grid — no cards, image-led composition */

.irozon-product-grid {
	row-gap: 1.5rem !important;
	column-gap: 1.5rem !important;
	align-items: stretch !important;
}

/* WooCommerce's own container-query responsive columns
   (.wc-block-product-template__responsive) don't reliably kick in on every
   engine, and the grid is otherwise pinned to a fixed column count — force
   the column count directly so cards never get squeezed. */
@media (max-width: 480px) {
	.irozon-product-grid .wc-block-product-template__responsive {
		grid-template-columns: 1fr !important;
	}
}

@media (min-width: 481px) and (max-width: 900px) {
	.irozon-product-grid .wc-block-product-template__responsive {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

.wp-block-woocommerce-product-template > * {
	background: none;
	border: none;
	border-radius: 0;
	padding: 0;
	box-shadow: none;
	transition: none;
	transform: none;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.wp-block-woocommerce-product-template .wc-block-components-product-image {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 0;
	background: #f2f2f2;
	aspect-ratio: 1 / 1.05;
}

.wp-block-woocommerce-product-template .wc-block-components-product-image img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
	transition: transform 0.5s ease;
}

.wp-block-woocommerce-product-template .wc-block-components-product-image:hover img {
	transform: scale(1.05);
}

.wp-block-woocommerce-product-template .wc-block-components-sale-badge {
	position: absolute;
	top: 0.75rem;
	left: 0.75rem;
	z-index: 2;
	background: var(--irozon-primary-gradient) !important;
	border-radius: 999px;
	border: none;
	color: #fff;
	font-size: 0.7rem;
	font-weight: 700;
	padding: 0.25rem 0.75rem;
}

.irozon-product-info {
	background: var(--irozon-surface);
	border-radius: 0 0 0.75rem 0.75rem;
	padding: 1.25rem 1.25rem 1.5rem;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.irozon-product-meta-row {
	margin-top: auto;
	padding-top: 0.9rem;
}

.irozon-product-title {
	font-size: 1.15rem;
	font-weight: 700;
	line-height: 1.25;
	text-align: left;
	margin: 0;
}

.irozon-product-title a {
	color: var(--irozon-ink);
}

.irozon-product-cat {
	display: block;
	margin-top: 0.25rem;
	font-size: 0.8rem;
	color: var(--irozon-muted);
}

.irozon-product-cat a {
	color: inherit;
	text-decoration: none;
}

.irozon-product-meta-row {
	align-items: center;
}

.irozon-product-price {
	color: var(--irozon-ink);
	font-weight: 700;
	font-size: 0.95rem;
}

.irozon-product-price del {
	color: var(--irozon-muted);
	opacity: 1;
	font-weight: 400;
	margin-right: 0.4rem;
}

.irozon-product-price ins {
	color: var(--irozon-green);
	text-decoration: none;
}

/* Archive card CTA sizing tweaks — the shared .irozon-cta-btn visual rules
   (amber/near-black, radius, focus state) are applied to this same selector
   below, next to the .irozon-cta-btn definitions, so both buttons share one
   source of truth. */
.irozon-select-btn .wp-block-button__link {
	width: 100%;
	font-size: 0.8rem;
	padding: 0.55rem 1rem !important;
	min-height: 2.5rem;
}

.wp-block-query-pagination .page-numbers {
	border-radius: 999px;
	min-width: 2.25rem;
	text-align: center;
	color: var(--irozon-ink);
}

.wp-block-query-pagination .page-numbers.current {
	background: var(--irozon-primary-gradient);
	color: #fff;
}

/* =========================================================
   SINGLE PRODUCT — modeled on theme.madsparrow.me/osty/product/bold-layer
   ========================================================= */

.irozon-product-columns {
	align-items: flex-start;
}

.wp-block-woocommerce-product-image-gallery,
.woocommerce div.product .woocommerce-product-gallery {
	border-radius: 0;
}

.wp-block-woocommerce-product-image-gallery img {
	border-radius: 0;
}

.irozon-product-title.wp-block-post-title {
	font-size: 1.5rem;
	font-weight: 800;
	color: var(--irozon-ink);
	margin: 0 0 0.5rem;
}

.wp-block-woocommerce-product-price.irozon-product-price {
	color: var(--irozon-ink);
	font-weight: 700;
	margin-bottom: 0.75rem;
}

.irozon-single-product p.stock {
	display: inline-block;
	font-size: 0.85rem;
	font-weight: 600;
	margin-bottom: 1.25rem;
}

.irozon-single-product p.stock.in-stock {
	color: var(--irozon-green);
}

.irozon-single-product p.stock.out-of-stock {
	color: #e0433f;
}

/* add-to-cart-form's classic template also prints its own stock line;
   we already show one via the explicit product-stock-indicator block above. */
.irozon-add-to-cart p.stock {
	display: none;
}

.irozon-product-excerpt {
	color: var(--irozon-ink);
	line-height: 1.7;
	max-width: 46em;
	margin-bottom: 1.5rem;
}

.irozon-product-meta-top {
	color: var(--irozon-muted);
	font-size: 0.85rem;
	border-top: 1px solid var(--irozon-border);
	border-bottom: 1px solid var(--irozon-border);
	margin: 1.5rem 0;
	padding: 0.9rem 0;
}

.irozon-product-meta-top strong {
	color: var(--irozon-ink);
}

.irozon-product-meta-top a {
	color: var(--irozon-muted);
	text-decoration: underline;
}

.irozon-product-meta-top a:hover {
	color: var(--irozon-green);
}

/* ---------- Irozon CTA button — translated from src/components/SlidingButton.tsx
   (amber base, near-black on hover) and src/components/ui/button.tsx (rounded-xl,
   ring-offset focus state, bouncy spring-like transition) ---------- */

/* .irozon-select-btn .wp-block-button__link is the real WooCommerce archive
   card button (Add to cart / Select options / Read more / View products) —
   sharing every selector below with .irozon-cta-btn means it's the exact same
   CTA, not a re-approximation, wired server-side via the block's className. */

.irozon-cta-btn,
.irozon-select-btn .wp-block-button__link {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	overflow: hidden;
	border: none !important;
	border-radius: 0.75rem !important;
	background: #fbbf24 !important;
	color: #171717 !important;
	font-weight: 500;
	font-size: 0.95rem;
	padding: 0.9rem 2rem !important;
	cursor: pointer;
	transition: background-color 0.35s cubic-bezier(0.34, 1.56, 0.64, 1),
		color 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), transform 0.15s ease;
}

.irozon-cta-btn::before,
.irozon-select-btn .wp-block-button__link::before {
	content: "";
	position: absolute;
	inset: 0;
	background: #262626;
	transform: translateX(-100%);
	transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
	z-index: 0;
}

.irozon-cta-btn > *,
.irozon-select-btn .wp-block-button__link > * {
	position: relative;
	z-index: 1;
}

.irozon-cta-btn:hover,
.irozon-cta-btn:focus-visible,
.irozon-select-btn .wp-block-button__link:hover,
.irozon-select-btn .wp-block-button__link:focus-visible {
	color: #fff !important;
}

.irozon-cta-btn:hover::before,
.irozon-cta-btn:focus-visible::before,
.irozon-select-btn .wp-block-button__link:hover::before,
.irozon-select-btn .wp-block-button__link:focus-visible::before {
	transform: translateX(0);
}

.irozon-cta-btn:active,
.irozon-select-btn .wp-block-button__link:active {
	transform: scale(0.97);
}

.irozon-cta-btn:focus-visible,
.irozon-select-btn .wp-block-button__link:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px #fff, 0 0 0 4px #262626;
}

.irozon-cta-btn:disabled,
.irozon-cta-btn.disabled,
.irozon-select-btn .wp-block-button__link:disabled,
.irozon-select-btn .wp-block-button__link.disabled {
	opacity: 0.5;
	cursor: not-allowed;
	pointer-events: none;
}

/* Loading skeleton placeholder (before hydration) shouldn't get the amber treatment */
.irozon-select-btn .wc-block-components-product-button__button--placeholder {
	background: currentColor !important;
}

/* <input type="submit"> is a replaced element — ::before doesn't render there,
   so give it a direct color transition instead of the sliding panel. */
input.irozon-cta-btn::before {
	display: none;
}

input.irozon-cta-btn:hover,
input.irozon-cta-btn:focus-visible {
	background: #262626 !important;
}

.irozon-add-to-cart form.cart {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 1rem;
}

.irozon-add-to-cart .quantity {
	display: flex;
	align-items: center;
	height: 3rem;
}

.irozon-add-to-cart .irozon-qty-label {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--irozon-muted);
	margin-right: 0.75rem;
}

.irozon-add-to-cart .quantity {
	border: 1px solid var(--irozon-border);
	border-radius: 0.75rem;
	overflow: hidden;
}

.irozon-add-to-cart .quantity .irozon-qty-btn {
	width: 2.75rem;
	height: 3rem;
	border: none;
	background: none;
	font-size: 1.1rem;
	cursor: pointer;
	color: var(--irozon-ink);
	transition: background-color 0.2s ease, color 0.2s ease;
}

.irozon-add-to-cart .quantity .irozon-qty-btn:hover {
	background: #f5f5f5;
	color: var(--irozon-green);
}

.irozon-add-to-cart .quantity .irozon-qty-btn:focus-visible {
	outline: 2px solid var(--irozon-green);
	outline-offset: -2px;
}

.irozon-add-to-cart .quantity input.qty {
	border: none;
	width: 3rem;
	height: 3rem;
	text-align: center;
	font-weight: 600;
	-moz-appearance: textfield;
}

.irozon-add-to-cart .quantity input.qty::-webkit-inner-spin-button,
.irozon-add-to-cart .quantity input.qty::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.irozon-add-to-cart .single_add_to_cart_button {
	height: 3rem;
	flex: 1 1 auto;
}

.irozon-add-to-cart .single_add_to_cart_button.disabled {
	opacity: 0.5;
	pointer-events: none;
}

@media (max-width: 480px) {
	.irozon-add-to-cart form.cart {
		flex-direction: column;
		align-items: stretch;
	}

	.irozon-add-to-cart .single_add_to_cart_button {
		width: 100%;
	}
}

/* ---------- Tabs (Additional information / Reviews) ---------- */

.irozon-product-details .woocommerce-tabs.wc-tabs-wrapper {
	margin-top: 4.5rem;
	margin-bottom: 3.5rem;
}

.irozon-product-details ul.tabs.wc-tabs {
	display: flex;
	gap: 2.5rem;
	border-bottom: 1px solid var(--irozon-border);
	padding: 0;
	margin: 0 0 2.5rem;
	list-style: none;
}

.irozon-product-details ul.tabs.wc-tabs li {
	margin: 0;
}

.irozon-product-details ul.tabs.wc-tabs li a {
	display: inline-block;
	font-weight: 600;
	font-size: 0.95rem;
	color: var(--irozon-muted);
	text-decoration: none;
	padding-bottom: 1rem;
	border-bottom: 2px solid transparent;
}

.irozon-product-details ul.tabs.wc-tabs li.active a {
	color: var(--irozon-ink);
	border-bottom-color: var(--irozon-green);
}

.irozon-product-details .woocommerce-Tabs-panel {
	max-width: 46em;
}

/* ---------- Additional information — clean spec table ---------- */

.irozon-product-details table.woocommerce-product-attributes {
	width: 100%;
	border-collapse: collapse;
	margin: 0;
}

.irozon-product-details table.woocommerce-product-attributes tr {
	border-top: 1px solid var(--irozon-border);
}

.irozon-product-details table.woocommerce-product-attributes tr:last-child {
	border-bottom: 1px solid var(--irozon-border);
}

.irozon-product-details .woocommerce-product-attributes-item__label {
	width: 35%;
	padding: 1.5rem 2rem 1.5rem 0;
	font-weight: 600;
	font-size: 0.9rem;
	line-height: 1.6;
	color: var(--irozon-ink);
	text-align: left;
	vertical-align: top;
}

.irozon-product-details .woocommerce-product-attributes-item__value {
	padding: 1.5rem 0;
	font-size: 0.9rem;
	line-height: 1.6;
	color: var(--irozon-muted);
}

.irozon-product-details .woocommerce-product-attributes-item__value p {
	margin: 0;
}

@media (max-width: 600px) {
	.irozon-product-details table.woocommerce-product-attributes,
	.irozon-product-details table.woocommerce-product-attributes tbody,
	.irozon-product-details table.woocommerce-product-attributes tr,
	.irozon-product-details .woocommerce-product-attributes-item__label,
	.irozon-product-details .woocommerce-product-attributes-item__value {
		display: block;
		width: 100%;
	}

	.irozon-product-details .woocommerce-product-attributes-item__label {
		padding: 1rem 0 0.35rem;
	}

	.irozon-product-details .woocommerce-product-attributes-item__value {
		padding: 0 0 1rem;
	}
}

/* ---------- Reviews ---------- */

.irozon-product-details #reviews {
	max-width: 46em;
}

.irozon-product-details #reviews h2 {
	font-weight: 800;
	font-size: 1.5rem;
	color: var(--irozon-ink);
	margin-bottom: 1rem;
}

.irozon-product-details .woocommerce-noreviews {
	color: var(--irozon-muted);
	margin-bottom: 2rem;
}

.irozon-product-details #review_form_wrapper {
	margin-top: 2rem;
}

.irozon-product-details .comment-reply-title {
	font-weight: 700;
	font-size: 1.15rem;
	color: var(--irozon-ink);
	display: block;
	margin-bottom: 1.5rem;
}

.irozon-product-details .comment-notes {
	color: var(--irozon-muted);
	font-size: 0.85rem;
	margin-bottom: 1.5rem;
}

.irozon-product-details .comment-form-rating {
	margin-bottom: 1.5rem;
}

.irozon-product-details .comment-form-rating label {
	display: block;
	font-weight: 600;
	font-size: 0.9rem;
	margin-bottom: 0.5rem;
	color: var(--irozon-ink);
}

.irozon-product-details p.comment-form-comment,
.irozon-product-details p.comment-form-author,
.irozon-product-details p.comment-form-email {
	margin-bottom: 1.5rem;
}

.irozon-product-details p.comment-form-comment label,
.irozon-product-details p.comment-form-author label,
.irozon-product-details p.comment-form-email label {
	display: block;
	font-weight: 600;
	font-size: 0.9rem;
	margin-bottom: 0.5rem;
	color: var(--irozon-ink);
}

.irozon-product-details #comment,
.irozon-product-details #author,
.irozon-product-details #email {
	width: 100%;
	border: 1px solid var(--irozon-border);
	border-radius: 0.5rem;
	padding: 0.75rem 1rem;
	font-family: inherit;
	font-size: 0.9rem;
	box-sizing: border-box;
	transition: border-color 0.2s ease;
}

.irozon-product-details #comment:focus,
.irozon-product-details #author:focus,
.irozon-product-details #email:focus {
	outline: none;
	border-color: var(--irozon-green);
}

.irozon-product-details #comment {
	resize: vertical;
	min-height: 8rem;
}

@media (min-width: 601px) {
	.irozon-product-details .comment-form-author,
	.irozon-product-details .comment-form-email {
		display: inline-block;
		width: calc(50% - 0.75rem);
		vertical-align: top;
	}

	.irozon-product-details .comment-form-author {
		margin-right: 1.5rem;
	}
}

.irozon-product-details p.form-submit {
	margin-top: 0.5rem;
}

.related.products > h2,
.wp-block-pattern .related h2 {
	font-weight: 800;
	font-size: 1.5rem;
	color: var(--irozon-ink);
	margin: 3rem 0 1.5rem;
}