/*
 * WrapStoria responsive hardening
 * Final cascade layer for commerce, editorial and responsive components.
 */

/* Product media: never leave the gallery invisible when WooCommerce's slider
   initialisation is delayed or unavailable. */
.single-product .woocommerce-product-gallery {
	opacity: 1 !important;
	visibility: visible !important;
	max-width: 100%;
}
.single-product .woocommerce-product-gallery__wrapper,
.single-product .woocommerce-product-gallery__image,
.single-product .woocommerce-product-gallery__image a,
.single-product .woocommerce-product-gallery__image img {
	max-width: 100%;
}
.single-product .woocommerce-product-gallery__image img {
	display: block;
	height: auto;
	object-fit: contain;
}
.single-product .flex-control-thumbs {
	display: grid !important;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 10px;
	margin-top: 12px !important;
}
.single-product .flex-control-thumbs li {
	width: auto !important;
	float: none !important;
	margin: 0 !important;
}
.single-product .flex-control-thumbs img {
	aspect-ratio: 1;
	width: 100%;
	height: auto;
	object-fit: cover;
	border: 1px solid rgba(20, 55, 44, .16);
	border-radius: 10px;
}

/* Specifications: stable two-column presentation on larger screens. */
.wrapstoria-specifications {
	width: 100% !important;
	table-layout: auto !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	overflow: hidden;
	border: 1px solid rgba(20, 55, 44, .16);
	border-radius: 12px;
	background: #fffdfa;
}
.wrapstoria-specifications tbody tr:not(:last-child) > * {
	border-bottom: 1px solid rgba(20, 55, 44, .12);
}
.wrapstoria-specifications th,
.wrapstoria-specifications td {
	padding: 14px 18px !important;
	vertical-align: middle !important;
	line-height: 1.55 !important;
	overflow-wrap: normal !important;
	word-break: normal !important;
}
.wrapstoria-specifications tbody th {
	width: 34% !important;
	min-width: 150px;
	background: #eef2ec;
	color: #14372c;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: .08em;
	text-transform: uppercase;
	white-space: normal;
}
.wrapstoria-specifications tbody td {
	color: #46534e;
	background: #fffdfa;
}

/* Product FAQ: clearly pair each question with its answer. */
.wrapstoria-faq {
	width: 100%;
	margin: 0;
	text-align: left !important;
}
.wrapstoria-faq dt,
.wrapstoria-faq dd {
	box-sizing: border-box;
	width: 100%;
}
.wrapstoria-faq dt {
	position: relative;
	margin: 12px 0 0;
	padding: 16px 18px 12px 54px;
	border: 1px solid rgba(20, 55, 44, .16);
	border-bottom: 0;
	border-radius: 12px 12px 0 0;
	background: #eef2ec;
	color: #14372c;
	font-family: inherit;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.45;
}
.wrapstoria-faq dt::before {
	content: "Q";
	position: absolute;
	top: 13px;
	left: 16px;
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #14372c;
	color: #fff;
	font-size: 12px;
	font-weight: 800;
}
.wrapstoria-faq dd {
	margin: 0 0 12px !important;
	padding: 0 18px 17px 54px !important;
	border: 1px solid rgba(20, 55, 44, .16);
	border-top: 0;
	border-radius: 0 0 12px 12px;
	background: #fffdfa;
	color: #46534e;
	font-size: 15px;
	line-height: 1.7;
}

/* Volume pricing and CTA consistency. */
.ws-volume-pricing,
.wrapstoria-volume-pricing,
.ws-vp {
	max-width: 100%;
	overflow: hidden;
}
.ws-volume-pricing table,
.wrapstoria-volume-pricing table,
.ws-vp-table {
	width: 100%;
	table-layout: fixed;
}
.ws-volume-pricing th,
.ws-volume-pricing td,
.wrapstoria-volume-pricing th,
.wrapstoria-volume-pricing td,
.ws-vp-table th,
.ws-vp-table td {
	text-align: center !important;
	vertical-align: middle !important;
}
.ws-volume-pricing a,
.wrapstoria-volume-pricing a,
.ws-moq-note a,
[class*="moq"] a[href^="mailto:"] {
	display: inline-block !important;
	white-space: nowrap !important;
}
.single-product .summary form.cart,
.single-product .summary .variations_button,
.single-product .summary .woocommerce-variation-add-to-cart {
	width: 100% !important;
	max-width: 100% !important;
	align-items: center !important;
	gap: 10px !important;
}
.single-product .summary .single_add_to_cart_button,
.single-product .summary button.single_add_to_cart_button,
.single-product .summary .button.single_add_to_cart_button {
	box-sizing: border-box !important;
	flex: 0 0 auto !important;
	width: 100% !important;
	min-width: 0 !important;
	max-width: none !important;
	min-height: 52px !important;
	height: 52px !important;
	max-height: 52px !important;
	margin: 0 !important;
	padding: 0 22px !important;
	border-radius: 10px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	letter-spacing: .09em !important;
	text-align: center !important;
}
.single-product .summary .quantity,
.single-product .summary .quantity input.qty {
	min-height: 52px !important;
	height: 52px !important;
}

/* Product option cards remain readable and evenly sized. */
.single-product .ws-size-options,
.single-product .wst-size-options,
.single-product [class*="variation-cards"] {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px !important;
	width: 100%;
}
.single-product .ws-size-option,
.single-product .wst-size-option,
.single-product [class*="variation-card"] {
	box-sizing: border-box;
	min-width: 0;
	height: 100%;
}

/* Editorial tables: JS adds the wrapper; the fallback keeps content contained. */
.single-post .entry-content {
	min-width: 0;
	max-width: 100%;
}
.single-post .entry-content > table {
	display: block;
	width: 100%;
	max-width: 100%;
	margin: 24px 0;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	border: 1px solid rgba(20, 55, 44, .16);
	border-radius: 12px;
	background: #fffdfa;
	scrollbar-width: thin;
}
.ws-table-scroll {
	width: 100%;
	max-width: 100%;
	margin: 24px 0;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	border: 1px solid rgba(20, 55, 44, .16);
	border-radius: 12px;
	background: #fffdfa;
	scrollbar-width: thin;
}
.ws-table-scroll table {
	width: 100%;
	margin: 0 !important;
	border: 0 !important;
	border-collapse: collapse;
}
.ws-table-scroll caption {
	padding: 14px 18px;
	background: #fffdfa;
	color: #14372c;
	font-weight: 700;
	text-align: left;
}
.ws-table-scroll th,
.ws-table-scroll td {
	padding: 14px 16px !important;
	border: 1px solid rgba(20, 55, 44, .13) !important;
	vertical-align: top;
	line-height: 1.5;
}
.ws-table-scroll th {
	background: #dfe8df;
	color: #14372c;
}

/* Shop pagination: remove legacy padding from every list item. */
.woocommerce nav.woocommerce-pagination {
	width: 100% !important;
	margin: 30px auto 10px !important;
	padding: 0 !important;
	text-align: center;
}
.woocommerce nav.woocommerce-pagination ul.page-numbers {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	width: auto !important;
	margin: 0 auto !important;
	padding: 0 !important;
	border: 0 !important;
}
.woocommerce nav.woocommerce-pagination ul.page-numbers li {
	display: block !important;
	float: none !important;
	flex: 0 0 auto !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}
.woocommerce nav.woocommerce-pagination .page-numbers li a,
.woocommerce nav.woocommerce-pagination .page-numbers li span {
	box-sizing: border-box;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 44px !important;
	min-width: 44px !important;
	height: 44px !important;
	margin: 0 !important;
	padding: 0 8px !important;
	border: 1px solid rgba(20, 55, 44, .18) !important;
	border-radius: 10px !important;
	background: #fff !important;
	color: #14372c !important;
	line-height: 1 !important;
}
.woocommerce nav.woocommerce-pagination .page-numbers li span.current {
	background: #14372c !important;
	color: #fff !important;
}

/* Cart foundation. */
.wc-block-components-sidebar-layout.wc-block-cart,
.wc-block-cart,
.wc-block-cart__main,
.wc-block-cart__sidebar {
	box-sizing: border-box;
	max-width: 100%;
	min-width: 0;
}
.wc-block-cart-items .wc-block-cart-item__product {
	min-width: 0;
}
.wc-block-cart-items .wc-block-components-product-name {
	overflow-wrap: anywhere;
	word-break: normal;
}
.wc-block-cart__submit-container--sticky {
	z-index: 2;
}

@media (max-width: 1024px) {
	.single-product .product,
	.single-product div.product {
		min-width: 0;
	}
	.single-product .flex-control-thumbs {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
	.wc-block-components-sidebar-layout.wc-block-cart {
		gap: 24px !important;
	}
}

@media (max-width: 782px) {
	html,
	body {
		max-width: 100%;
		overflow-x: hidden;
	}
	/* Specifications become readable key/value cards instead of squeezed columns. */
	.wrapstoria-specifications,
	.wrapstoria-specifications tbody,
	.wrapstoria-specifications tr,
	.wrapstoria-specifications th,
	.wrapstoria-specifications td {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box;
	}
	.wrapstoria-specifications {
		border: 0;
		background: transparent;
		overflow: visible;
	}
	.wrapstoria-specifications tbody tr {
		margin: 0 0 10px;
		overflow: hidden;
		border: 1px solid rgba(20, 55, 44, .16);
		border-radius: 10px;
		background: #fffdfa;
	}
	.wrapstoria-specifications tbody tr:not(:last-child) > * {
		border-bottom: 0;
	}
	.wrapstoria-specifications tbody th {
		min-width: 0;
		padding: 11px 14px !important;
		border: 0 !important;
		background: #eef2ec;
		text-align: center !important;
		white-space: normal !important;
		overflow-wrap: normal !important;
		word-break: keep-all !important;
	}
	.wrapstoria-specifications tbody td {
		padding: 13px 14px !important;
		border: 0 !important;
		text-align: center !important;
		overflow-wrap: anywhere !important;
	}
	.wrapstoria-faq dt {
		padding: 14px 14px 10px 48px;
		font-size: 15px;
	}
	.wrapstoria-faq dt::before {
		left: 13px;
		top: 12px;
	}
	.wrapstoria-faq dd {
		padding: 0 14px 15px 48px !important;
		font-size: 14px;
	}
	.ws-table-scroll,
	.single-post .entry-content > table {
		margin: 20px 0;
		border-radius: 10px;
	}
	.ws-table-scroll table,
	.single-post .entry-content > table {
		width: max-content !important;
		min-width: 640px !important;
	}
	.ws-table-scroll caption,
	.single-post .entry-content > table caption {
		position: sticky;
		left: 0;
		max-width: calc(100vw - 40px);
		font-size: 14px;
	}
	.ws-table-scroll th,
	.ws-table-scroll td,
	.single-post .entry-content > table th,
	.single-post .entry-content > table td {
		min-width: 150px;
		padding: 12px 14px !important;
		font-size: 14px;
	}
	.woocommerce nav.woocommerce-pagination {
		margin-top: 22px !important;
		padding: 0 12px !important;
	}
	.woocommerce nav.woocommerce-pagination ul.page-numbers {
		gap: 6px !important;
	}
	.woocommerce nav.woocommerce-pagination .page-numbers li a,
	.woocommerce nav.woocommerce-pagination .page-numbers li span {
		width: 42px !important;
		min-width: 42px !important;
		height: 42px !important;
		border-radius: 9px !important;
	}
	.single-product .flex-control-thumbs {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 8px;
	}
	.single-product .summary .single_add_to_cart_button,
	.single-product .summary button.single_add_to_cart_button,
	.single-product .summary .button.single_add_to_cart_button {
		height: 50px !important;
		min-height: 50px !important;
		max-height: 50px !important;
		border-radius: 9px !important;
	}
	/* Mobile cart: compact two-column item card, then totals below it. */
	.wc-block-components-sidebar-layout.wc-block-cart {
		display: block !important;
		width: 100% !important;
		padding: 0 !important;
	}
	.wc-block-cart__main,
	.wc-block-cart__sidebar {
		width: 100% !important;
		flex: none !important;
		margin: 0 0 18px !important;
		padding: 0 !important;
	}
	.wc-block-cart-items thead {
		display: none !important;
	}
	.wc-block-cart-items,
	.wc-block-cart-items tbody {
		display: block !important;
		width: 100% !important;
	}
	.wc-block-cart-items .wc-block-cart-items__row {
		display: grid !important;
		grid-template-columns: 82px minmax(0, 1fr) !important;
		grid-template-areas:
			"image product"
			"image total";
		gap: 6px 14px !important;
		width: 100% !important;
		margin: 0 0 14px !important;
		padding: 16px !important;
		overflow: hidden;
		border: 1px solid rgba(20, 55, 44, .16) !important;
		border-radius: 14px;
		background: #fffdfa;
	}
	.wc-block-cart-items .wc-block-cart-item__image {
		grid-area: image;
		width: 82px !important;
		padding: 0 !important;
		align-self: start;
	}
	.wc-block-cart-items .wc-block-cart-item__image img {
		width: 82px !important;
		height: 82px !important;
		object-fit: cover;
		border-radius: 8px;
	}
	.wc-block-cart-items .wc-block-cart-item__product {
		grid-area: product;
		width: auto !important;
		padding: 0 !important;
	}
	.wc-block-cart-items .wc-block-cart-item__total {
		grid-area: total;
		width: auto !important;
		padding: 0 !important;
		text-align: left !important;
	}
	.wc-block-cart-items .wc-block-cart-item__total-price-and-sale-badge-wrapper {
		align-items: flex-start !important;
	}
	.wc-block-cart-item__quantity {
		display: flex !important;
		align-items: center;
		flex-wrap: wrap;
		gap: 8px;
	}
	.wc-block-components-quantity-selector {
		max-width: 128px;
	}
	.wc-block-cart__sidebar {
		padding: 16px !important;
		border: 1px solid rgba(20, 55, 44, .16);
		border-radius: 14px;
		background: #fffdfa;
	}
	.wc-block-cart__submit-container,
	.wc-block-cart__submit-container--sticky {
		position: static !important;
		inset: auto !important;
		width: 100% !important;
		margin: 16px 0 0 !important;
		padding: 0 !important;
		transform: none !important;
		box-shadow: none !important;
		background: transparent !important;
	}
	.wc-block-cart__submit-button {
		width: 100% !important;
		min-height: 52px;
	}
}

@media (max-width: 480px) {
	.single-product .ws-size-options,
	.single-product .wst-size-options,
	.single-product [class*="variation-cards"] {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px !important;
	}
	.single-product .flex-control-thumbs {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
	.wrapstoria-specifications tbody th {
		font-size: 11px !important;
	}
	.wrapstoria-specifications tbody td {
		font-size: 14px !important;
	}
	.wc-block-cart-items .wc-block-cart-items__row {
		grid-template-columns: 72px minmax(0, 1fr) !important;
		gap: 6px 12px !important;
		padding: 13px !important;
	}
	.wc-block-cart-items .wc-block-cart-item__image,
	.wc-block-cart-items .wc-block-cart-item__image img {
		width: 72px !important;
		height: 72px !important;
	}
	.wc-block-cart-items .wc-block-components-product-name {
		font-size: 15px !important;
		line-height: 1.35 !important;
	}
}
