/**
 * Modern skin — Uniformstore (CollabX 446).
 *
 * Additive polish only: typography, rhythm, product cards, controls. No layout
 * restructuring and no palette change, so it stays recognisably the same site
 * and can be switched off in one click (Appearance -> Modern Skin).
 *
 * Everything is scoped under body.dws-modern so disabling the option removes
 * every rule at once.
 */

body.dws-modern {
	--dws-radius: 12px;
	--dws-radius-sm: 8px;
	--dws-border: rgba(17, 24, 39, 0.10);
	--dws-shadow: 0 1px 2px rgba(17, 24, 39, .04), 0 8px 24px rgba(17, 24, 39, .06);
	--dws-shadow-hover: 0 2px 6px rgba(17, 24, 39, .06), 0 18px 40px rgba(17, 24, 39, .12);
	--dws-ease: 220ms cubic-bezier(.4, 0, .2, 1);
	--dws-ink: #111827;
	--dws-muted: #6b7280;
}

/* ---------------------------------------------------------------- type ---- */

body.dws-modern {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	letter-spacing: -0.005em;
}

body.dws-modern h1,
body.dws-modern h2,
body.dws-modern h3,
body.dws-modern h4 {
	letter-spacing: -0.021em;
	line-height: 1.2;
}

body.dws-modern p,
body.dws-modern li {
	line-height: 1.65;
}

/* -------------------------------------------------------- product cards --- */

/*
 * Betheme's loop is `ul.products > li.product` with .mfn-li-product-row children
 * — there is no inner wrapper to style, so the li itself becomes the card.
 * Isotope owns `transform` on each li for masonry positioning, so the hover
 * effect uses shadow/border only; lifting it with translateY would override
 * Isotope's translate3d and collapse the grid.
 */
body.dws-modern ul.products li.product {
	background: #fff;
	border: 1px solid var(--dws-border);
	border-radius: var(--dws-radius);
	padding: 14px 14px 16px;
	transition: box-shadow var(--dws-ease), border-color var(--dws-ease);
	box-sizing: border-box;
}

body.dws-modern ul.products li.product:hover {
	box-shadow: var(--dws-shadow-hover);
	border-color: rgba(17, 24, 39, 0.18);
}

body.dws-modern ul.products li.product .image_frame {
	border: 0;
	border-radius: var(--dws-radius-sm);
	overflow: hidden;
	margin-bottom: 12px;
	background: #fff;
}

/* Kills the inline-image descender gap that showed as a grey band. */
body.dws-modern ul.products li.product .image_frame img {
	display: block;
	width: 100%;
	height: auto;
	transition: transform 420ms cubic-bezier(.4, 0, .2, 1);
}

body.dws-modern ul.products li.product:hover .image_frame img {
	transform: scale(1.04);
}

body.dws-modern ul.products li.product .image_frame .image_wrapper {
	border: 0;
}

body.dws-modern ul.products li.product h2,
body.dws-modern ul.products li.product h3,
body.dws-modern ul.products li.product h4,
body.dws-modern ul.products li.product .product-title,
body.dws-modern ul.products li.product .woocommerce-loop-product__title {
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.35;
	margin: 0 0 6px;
	color: var(--dws-ink);
	text-align: left;
}

body.dws-modern ul.products li.product .price {
	font-weight: 700;
	font-size: 1.02rem;
	color: var(--dws-ink);
	text-align: left;
	display: block;
}

body.dws-modern ul.products li.product .price del {
	font-weight: 500;
	opacity: .5;
	margin-right: 6px;
}

body.dws-modern ul.products li.product .price ins {
	text-decoration: none;
}

body.dws-modern ul.products li.product .price .woocommerce-Price-amount {
	white-space: nowrap;
}

/* The theme hides the loop add-to-cart (.hide-button); don't reserve space. */
body.dws-modern ul.products li.product .mfn-li-product-row-button.hide-button {
	display: none;
}

/* --------------------------------------------------------------- buttons -- */

body.dws-modern .button,
body.dws-modern button,
body.dws-modern input[type="submit"],
body.dws-modern .woocommerce a.button,
body.dws-modern .woocommerce button.button,
body.dws-modern .woocommerce input.button {
	border-radius: var(--dws-radius-sm);
	font-weight: 600;
	letter-spacing: 0;
	transition: transform var(--dws-ease), box-shadow var(--dws-ease), filter var(--dws-ease);
	box-shadow: none;
}

body.dws-modern .button:hover,
body.dws-modern button:hover,
body.dws-modern input[type="submit"]:hover,
body.dws-modern .woocommerce a.button:hover,
body.dws-modern .woocommerce button.button:hover {
	transform: translateY(-1px);
	filter: brightness(1.04);
	box-shadow: 0 6px 18px rgba(17, 24, 39, .14);
}

body.dws-modern .button:active,
body.dws-modern button:active {
	transform: translateY(0);
}

/* ---------------------------------------------------------------- forms --- */

body.dws-modern input[type="text"],
body.dws-modern input[type="email"],
body.dws-modern input[type="tel"],
body.dws-modern input[type="number"],
body.dws-modern input[type="search"],
body.dws-modern input[type="password"],
body.dws-modern select,
body.dws-modern textarea,
body.dws-modern .select2-container .select2-selection {
	border-radius: var(--dws-radius-sm);
	border: 1px solid var(--dws-border);
	transition: border-color var(--dws-ease), box-shadow var(--dws-ease);
}

body.dws-modern input[type="text"]:focus,
body.dws-modern input[type="email"]:focus,
body.dws-modern input[type="tel"]:focus,
body.dws-modern input[type="number"]:focus,
body.dws-modern input[type="search"]:focus,
body.dws-modern select:focus,
body.dws-modern textarea:focus {
	outline: none;
	border-color: rgba(17, 24, 39, .38);
	box-shadow: 0 0 0 3px rgba(17, 24, 39, .08);
}

/* ------------------------------------------------------- single product --- */

body.dws-modern .single-product .product .image_frame,
body.dws-modern .woo-variation-gallery-wrapper {
	border-radius: var(--dws-radius);
	overflow: hidden;
}

body.dws-modern .single-product .product_meta {
	font-size: .88rem;
	color: var(--dws-muted);
	border-top: 1px solid var(--dws-border);
	padding-top: 14px;
	margin-top: 18px;
}

/* :not() excludes Barn2's option surcharges, which reuse the generic `price`
   class — without it every "+$9.90" option row was bolded too. The real product
   price and the variation price both keep the weight. */
body.dws-modern .single-product .summary .price:not( .wpo-price-container ) {
	font-weight: 700;
}

body.dws-modern .woocommerce-tabs .wc-tabs li a {
	font-weight: 600;
}

/* Bulk pricing table from the discounts plugin. */
body.dws-modern .dws-bd-tiers {
	border-radius: var(--dws-radius-sm);
	overflow: hidden;
	border: 1px solid var(--dws-border);
}

body.dws-modern .dws-bd-tiers th,
body.dws-modern .dws-bd-tiers td {
	border-color: var(--dws-border);
}

/* --------------------------------------------------- cart / checkout ------ */

body.dws-modern .woocommerce table.shop_table {
	border-radius: var(--dws-radius);
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
}

body.dws-modern .woocommerce table.shop_table th,
body.dws-modern .woocommerce table.shop_table td {
	padding: 14px 12px;
}

body.dws-modern .woocommerce-info,
body.dws-modern .woocommerce-message,
body.dws-modern .woocommerce-error {
	border-radius: var(--dws-radius-sm);
}

/* -------------------------------------------------------------- rhythm --- */

body.dws-modern .section_wrapper,
body.dws-modern .container {
	--mfn-gutter: 24px;
}

body.dws-modern ul.products {
	row-gap: 26px;
}

body.dws-modern #Content {
	padding-top: 8px;
}

/* --------------------------------------------------------------- mobile -- */

@media (max-width: 767px) {
	body.dws-modern ul.products li.product .product_wrapper {
		padding: 10px 10px 12px;
	}

	body.dws-modern ul.products li.product h2,
	body.dws-modern ul.products li.product .woocommerce-loop-product__title {
		font-size: .88rem;
	}

	body.dws-modern .button,
	body.dws-modern .woocommerce a.button,
	body.dws-modern .woocommerce button.button {
		width: 100%;
		text-align: center;
	}
}

/* Respect a user's reduced-motion preference. */
@media (prefers-reduced-motion: reduce) {
	body.dws-modern *,
	body.dws-modern *::before,
	body.dws-modern *::after {
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
	}
}