/*
 * Paramount Improvements – UI fixes (October 2026 UX/UI audit).
 * Loaded after the theme so these rules win without !important where possible.
 */

/* ------------------------------------------------------------------
 * Long words never push content off the screen (UI 7).
 * Amino-acid sequences and strings like "5mg/5mg/500mcg/2.5mg" have no
 * spaces, so they used to stretch the spec table to 1,100px+ on phones.
 * ------------------------------------------------------------------ */
.pp-product-specs {
	table-layout: fixed;
	max-width: 100%;
}
.pp-product-specs th,
.pp-product-specs td,
.single-product .product_title,
.single-product h1,
.woocommerce-loop-product__title,
.t-entry-title,
.ucpls-product-title {
	overflow-wrap: anywhere;
	word-break: normal;
}
@media (max-width: 600px) {
	.pp-product-specs,
	.pp-product-specs thead,
	.pp-product-specs tbody {
		display: block;
		width: 100%;
	}
	.pp-product-specs thead th {
		display: block;
		font-size: 20px;
	}
	/* Labels were 40% wide when stacked, so their border looked broken (UI 20). */
	.pp-product-specs td:first-child {
		width: 100%;
		border-bottom: 0;
		padding-bottom: 2px;
	}
	.pp-product-specs td + td {
		border-left: 0;
		padding-top: 2px;
	}
}

/* ------------------------------------------------------------------
 * Mobile announcement bar: no clipped edges, readable size (UI 23).
 * ------------------------------------------------------------------ */
@media (max-width: 959px) {
	.top-menu.top-menu-enhanced .row-menu-inner,
	.top-menu .row-menu-inner {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		padding-left: 16px;
		padding-right: 16px;
	}
	.top-menu .row-menu-inner a {
		font-size: 12px;
		line-height: 1.4;
	}
}

/* Cart and checkout rules moved to Paramount Checkout UI 1.2.0
 * (assets/css/cart.css and checkout.css). */

/* ------------------------------------------------------------------
 * Floating buttons (loyalty, chat) no longer cover the last lines of the
 * footer: leave room at the bottom of the page (UI 6 · UX M01).
 * ------------------------------------------------------------------ */
.pp-disclaimer {
	padding-bottom: 72px;
}
@media (max-width: 959px) {
	.pp-disclaimer {
		padding-bottom: 96px;
	}
}

/* ------------------------------------------------------------------
 * Homepage Featured Products on phones/tablets: a normal swipe row that
 * shows part of the next card, instead of locked scrolling (UX H07 · UI 19).
 * ------------------------------------------------------------------ */
@media (max-width: 959px) {
	.ucpls.ppi-swipe .ucpls-scroll {
		display: block;
		width: 100%;
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		padding-bottom: 8px;
	}
	.ucpls.ppi-swipe .index-wrapper,
	.ucpls.ppi-swipe .ucpls-track {
		display: flex;
		width: max-content;
		min-width: 0;
	}
	.ucpls.ppi-swipe .ucpls-product-card {
		flex: 0 0 auto;
		width: 46vw;
		scroll-snap-align: start;
	}
}
@media (max-width: 569px) {
	.ucpls.ppi-swipe .ucpls-product-card {
		width: 70vw;
	}
}

/* ------------------------------------------------------------------
 * Contact page intro (UX C03).
 * ------------------------------------------------------------------ */
.pp-contact-intro {
	max-width: 760px;
	margin: 0 auto 24px;
	padding: 0;
}
.pp-contact-intro h1 {
	margin: 0 0 12px;
}
.pp-contact-intro ul.pp-contact-details,
.pp-contact-intro ul.pp-contact-details li {
	list-style: none;
	padding-left: 0;
}
.pp-contact-intro ul.pp-contact-details {
	margin: 16px 0 0;
}
.pp-contact-intro ul.pp-contact-details li {
	margin: 0 0 6px;
}
.pp-contact-intro a {
	color: #3d63ae;
}

/* ------------------------------------------------------------------
 * 404 quick links (UX M12).
 * ------------------------------------------------------------------ */
.ppi-404-links {
	margin-top: 24px;
}
.ppi-404-links .btn {
	margin: 4px;
}
