/**
 * PSTV brand lock.
 *
 * Loads last. Everything WordPress, WooCommerce or the browser would otherwise
 * style on its own — buttons, fields, radios, selects, prices, ratings, stock
 * labels, notices, hover and focus states — is pinned to the tokens here, so
 * nothing arrives in a default blue, a default grey, or a default underline.
 *
 * !important is used only where WooCommerce ships a competing rule of equal or
 * higher specificity. Everywhere else ordinary specificity does the work.
 */

/* ==== Browser defaults ==================================================== */

::selection {
	background: var(--pstv-navy);
	color: #fff;
}

:root {
	/* Checkboxes, radios and progress bars would otherwise render in the OS
	   accent — usually system blue. */
	accent-color: var(--pstv-blue);
	color-scheme: light;
	scrollbar-color: var(--pstv-border) transparent;
}

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
	background: var(--pstv-border);
	border-radius: var(--pstv-radius);
}
::-webkit-scrollbar-thumb:hover { background: var(--pstv-grey-muted); }

hr {
	height: 0;
	margin: var(--pstv-space-md) 0;
	border: 0;
	border-top: 1px solid var(--pstv-hairline);
}

mark {
	background: var(--pstv-ice);
	color: var(--pstv-navy);
}

abbr[title] {
	text-decoration-color: var(--pstv-border);
}

:focus-visible {
	outline: 2px solid var(--pstv-blue);
	outline-offset: 3px;
}

/* Browsers paint an inner focus ring on some controls in the system colour. */
input:focus,
select:focus,
textarea:focus {
	border-color: var(--pstv-navy);
	outline-color: var(--pstv-blue);
}

/* ==== Links =============================================================== */

a {
	color: var(--pstv-blue);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

a:hover,
a:focus-visible {
	color: var(--pstv-navy);
}

/* Links inside running copy stay underlined — that is the accessible default
   and the brand does not override it. */
.pstv-prose a:not([class*="pstv-btn"]):not(.button):not(.pstv-pill):not(.pstv-logo),
.pstv-accordion__body a,
.woocommerce-privacy-policy-text a {
	text-decoration: underline;
}

.pstv-prose a:hover,
.pstv-accordion__body a:hover {
	color: var(--pstv-navy);
	text-decoration-color: var(--pstv-navy);
}

/* Anything acting as UI must not inherit the running-copy underline. */
.pstv-nav a,
.pstv-header__utility a,
.pstv-footer a,
.pstv-drawer a,
.pstv-mega a,
.pstv-btn,
.pstv-pill,
.woocommerce a.button {
	text-decoration: none;
}

.pstv-footer a:hover,
.pstv-drawer a:hover {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* ==== Every button, whoever printed it ==================================== */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit,
.woocommerce .woocommerce-message a.button,
.wp-element-button,
.wp-block-button__link,
button[type="submit"]:not(.pstv-btn):not(.pstv-icon-btn):not(.pstv-qty__btn),
input[type="submit"]:not(.pstv-btn) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--pstv-btn-md);
	padding: 0 34px;
	border: 1px solid var(--pstv-navy);
	border-radius: var(--pstv-radius);
	background: var(--pstv-navy);
	color: #fff;
	font-family: var(--pstv-font);
	font-size: var(--pstv-btn-size-sm);
	font-weight: 500;
	letter-spacing: var(--pstv-btn-ls);
	line-height: 1;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background var(--pstv-dur) var(--pstv-ease),
		border-color var(--pstv-dur) var(--pstv-ease),
		color var(--pstv-dur) var(--pstv-ease);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit:hover,
.wp-element-button:hover,
.wp-block-button__link:hover,
button[type="submit"]:not(.pstv-btn):not(.pstv-icon-btn):not(.pstv-qty__btn):hover,
input[type="submit"]:not(.pstv-btn):hover {
	background: var(--pstv-blue);
	border-color: var(--pstv-blue);
	color: #fff;
}

.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce input.button:focus-visible {
	outline: 2px solid var(--pstv-blue);
	outline-offset: 3px;
}

.woocommerce button.button:disabled,
.woocommerce button.button[disabled],
.woocommerce button.button:disabled[disabled],
.woocommerce a.button.disabled,
.woocommerce a.button.wc-variation-selection-needed {
	background: var(--pstv-disabled-bg) !important;
	border-color: transparent !important;
	color: var(--pstv-grey-muted) !important;
	opacity: 1;
	cursor: not-allowed;
}

/* Woo's "View cart" link that appears after an AJAX add. */
.added_to_cart {
	display: inline-flex;
	align-items: center;
	min-height: var(--pstv-tap);
	margin-inline-start: 10px;
	color: var(--pstv-navy);
	font-size: var(--pstv-meta-size);
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: underline;
	text-underline-offset: 4px;
}

.added_to_cart:hover {
	color: var(--pstv-blue);
}

/* The spinner Woo drops on a button mid-request. */
.woocommerce button.button.loading::after,
.woocommerce a.button.loading::after {
	border-color: currentColor;
}

/* ==== Fields ============================================================== */

.input-text,
.woocommerce-Input,
.woocommerce-form__input,
input.qty,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
	font-family: var(--pstv-font);
	color: var(--pstv-navy);
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-Input--text,
.woocommerce-Input--email,
.woocommerce-Input--password {
	width: 100%;
	min-height: var(--pstv-tap);
	padding: 12px 18px;
	border: 1px solid var(--pstv-border);
	border-radius: var(--pstv-radius);
	background: #fff;
	font-size: 0.9375rem;
	transition: border-color var(--pstv-dur) var(--pstv-ease);
}

.woocommerce form .form-row input.input-text:hover,
.woocommerce form .form-row select:hover {
	border-color: var(--pstv-grey-muted);
}

.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select {
	border-color: var(--pstv-cherry);
}

.woocommerce form .form-row.woocommerce-validated input.input-text {
	border-color: var(--pstv-blue);
}

.woocommerce form .form-row label,
.woocommerce-form__label,
.comment-form label {
	color: var(--pstv-navy);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.06em;
}

.required,
.required_field,
.woocommerce form .form-row .required {
	color: var(--pstv-cherry);
	text-decoration: none;
	border: 0;
}

.woocommerce form .form-row-first,
.woocommerce form .form-row-last {
	width: 100%;
	float: none;
	margin: 0;
}

.woocommerce-input-wrapper {
	display: block;
	width: 100%;
}

/* Checkboxes and radios: square, brand-coloured, with a real hit area. */
input[type="checkbox"],
input[type="radio"],
.woocommerce-form__input-checkbox,
.input-radio {
	width: 18px;
	height: 18px;
	margin: 0 8px 0 0;
	accent-color: var(--pstv-blue);
	cursor: pointer;
	vertical-align: middle;
}

.woocommerce-form__label-for-checkbox,
.woocommerce-form-login__rememberme,
.woocommerce-terms-and-conditions-wrapper label,
.comment-form-cookies-consent label {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	min-height: var(--pstv-tap);
	font-weight: 400;
	font-size: 0.84375rem;
	letter-spacing: 0;
	text-transform: none;
	cursor: pointer;
}

/* Woo's country/state enhanced select. */
.select2-container--default .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple {
	min-height: var(--pstv-tap);
	border: 1px solid var(--pstv-border) !important;
	border-radius: var(--pstv-radius) !important;
	background: #fff;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	display: flex;
	align-items: center;
	min-height: calc(var(--pstv-tap) - 2px);
	padding-inline: 18px 34px;
	color: var(--pstv-navy);
	font-family: var(--pstv-font);
	line-height: 1.4;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	top: 50%;
	transform: translateY(-50%);
	inset-inline-end: 12px;
}

.select2-dropdown {
	border-color: var(--pstv-border);
	border-radius: 14px;
	overflow: hidden;
	font-family: var(--pstv-font);
}

.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option[data-selected="true"] {
	background: var(--pstv-navy) !important;
	color: #fff !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
	border: 1px solid var(--pstv-border);
	border-radius: var(--pstv-radius);
	padding: 8px 14px;
}

/* ==== Prices, stock, ratings ============================================== */

.woocommerce-Price-amount {
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.woocommerce-Price-currencySymbol {
	font-weight: 500;
	opacity: 0.75;
}

.price del,
.woocommerce-Price-amount del {
	color: var(--pstv-grey-muted);
	font-weight: 400;
}

.price ins,
.woocommerce-Price-amount ins {
	text-decoration: none;
}

.stock.in-stock,
p.stock.in-stock {
	color: var(--pstv-blue);
	font-size: 0.84375rem;
	font-weight: 600;
	letter-spacing: 0.04em;
}

.stock.out-of-stock,
p.stock.out-of-stock {
	color: var(--pstv-cherry);
	font-size: 0.84375rem;
	font-weight: 600;
	letter-spacing: 0.04em;
}

/* Woo's font-based star rating — gold by default. */
.woocommerce .star-rating,
.woocommerce .star-rating::before,
.woocommerce p.stars a,
.comment-form-rating .stars a {
	color: var(--pstv-blue);
}

.woocommerce .star-rating::before {
	color: var(--pstv-border);
}

.comment-form-rating .stars a:hover,
.comment-form-rating .stars a.active {
	color: var(--pstv-navy);
}

.woocommerce-review__verified {
	color: var(--pstv-blue);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.woocommerce-review__dash {
	color: var(--pstv-border);
}

/* ==== Reviews and comments ================================================ */

.woocommerce-Reviews-title,
.comment-reply-title,
#reply-title {
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--pstv-navy);
}

.comment-notes,
.required-field-message,
.woocommerce-privacy-policy-text {
	font-size: 0.8125rem;
	color: var(--pstv-grey);
}

.comment-form-comment textarea,
.comment-form-author input,
.comment-form-email input {
	width: 100%;
	border: 1px solid var(--pstv-border);
	border-radius: var(--pstv-radius);
	padding: 12px 18px;
	font-family: var(--pstv-font);
}

.comment-form-comment textarea {
	border-radius: 14px;
}

/* ==== Coupon, notices, pagination ========================================= */

.showcoupon,
.woocommerce-form-coupon-toggle a,
.woocommerce-form-login-toggle a {
	color: var(--pstv-blue);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.showcoupon:hover {
	color: var(--pstv-navy);
}

.woocommerce-form-coupon,
.woocommerce-form-login {
	padding: 24px 26px;
	border: 1px solid var(--pstv-hairline);
	border-radius: 0;
	background: #fff;
}

.woocommerce-pagination ul.page-numbers {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
}

.woocommerce-pagination ul.page-numbers li {
	border: 0;
}

.woocommerce-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--pstv-tap);
	min-height: var(--pstv-tap);
	padding-inline: 14px;
	border: 1px solid var(--pstv-border);
	border-radius: var(--pstv-radius);
	background: transparent;
	color: var(--pstv-navy);
	font-size: 0.8125rem;
	letter-spacing: 0.06em;
}

.woocommerce-pagination .page-numbers:hover {
	border-color: var(--pstv-navy);
	background: transparent;
	color: var(--pstv-navy);
}

.woocommerce-pagination .page-numbers.current {
	background: var(--pstv-navy);
	border-color: var(--pstv-navy);
	color: #fff;
}

/* ==== Tables Woo prints on its own ======================================== */

.shop_table,
table.shop_table {
	width: 100%;
	border-collapse: collapse;
	border: 0;
	border-radius: 0;
}

.shop_table th,
.shop_table td {
	border: 0;
	border-bottom: 1px solid var(--pstv-hairline);
	text-align: start;
}

.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td {
	border-bottom-color: rgba(23, 38, 81, 0.12);
}

/* ==== Blocked overlay ===================================================== */

.blockUI.blockOverlay {
	background: rgba(255, 255, 255, 0.7) !important;
}

/* ==== Hover on every interactive surface the theme owns =================== */

.pstv-tile__title a:hover,
.pstv-post-card__title a:hover {
	color: var(--pstv-flavour-text, var(--pstv-blue));
}

.pstv-pill:hover {
	border-color: var(--pstv-navy);
	color: var(--pstv-navy);
}

.pstv-pill[aria-current="true"]:hover,
.pstv-pill--active:hover {
	background: var(--pstv-blue);
	border-color: var(--pstv-blue);
	color: #fff;
}

.pstv-icon-btn:hover {
	color: var(--pstv-blue);
}

.pstv-accordion__head:hover {
	color: var(--pstv-blue);
}

.pstv-accordion__head:hover .pstv-accordion__sign::before,
.pstv-accordion__head:hover .pstv-accordion__sign::after {
	background: var(--pstv-blue);
}

.pstv-gallery__thumb:hover img {
	opacity: 0.85;
}

.pstv-mini__remove:hover,
.woocommerce-cart-form__contents .product-remove a.remove:hover {
	background: transparent;
	color: var(--pstv-cherry);
}

.pstv-crumbs a:hover {
	color: var(--pstv-blue);
}

/* Woo prints a red circular remove control by default. */
a.remove {
	color: var(--pstv-grey) !important;
	background: transparent !important;
	border-radius: var(--pstv-radius);
	font-weight: 400;
}

a.remove:hover {
	color: var(--pstv-cherry) !important;
	background: transparent !important;
}


/* ==== Browser form chrome ==================================================
 * Chrome and Safari paint their own controls inside text fields — the autofill
 * background, the password-manager pill, the caps-lock indicator, the search
 * clear button, the number spinners. Left alone they arrive in system yellow,
 * system blue or a stray pink, which is exactly the kind of default the brand
 * is meant to exclude.
 */

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
	-webkit-text-fill-color: var(--pstv-navy);
	-webkit-box-shadow: 0 0 0 100px #fff inset;
	box-shadow: 0 0 0 100px #fff inset;
	caret-color: var(--pstv-navy);
}

input::-webkit-credentials-auto-fill-button,
input::-webkit-strong-password-auto-fill-button,
input::-webkit-caps-lock-indicator,
input::-webkit-textfield-decoration-container {
	display: none !important;
	visibility: hidden;
	pointer-events: none;
	margin: 0;
	width: 0;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	appearance: none;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
	appearance: none;
	margin: 0;
}

input[type="number"] {
	appearance: textfield;
}

/* Date and colour pickers pick up the OS palette otherwise. */
input[type="date"]::-webkit-calendar-picker-indicator {
	filter: grayscale(1);
	opacity: 0.6;
	cursor: pointer;
}

input::placeholder,
textarea::placeholder {
	color: var(--pstv-grey-muted);
	opacity: 1;
}

/* ==== Account screens ====================================================== */

.woocommerce-account .u-column1 h2,
.woocommerce-account .u-column2 h2,
.woocommerce-account .woocommerce > h2 {
	margin: 0 0 18px;
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--pstv-navy);
	text-align: start;
}

/* Woo emits the notices wrapper, the heading and the form as siblings. A grid
   here pushed the heading into the second track; a plain block keeps the
   heading with its form whether one column renders or two. */
.woocommerce-account:not(.logged-in) .woocommerce {
	display: block;
	max-width: 900px;
}

.woocommerce-account:not(.logged-in) .col2-set,
.woocommerce-account:not(.logged-in) .u-columns {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 40px;
	align-items: start;
}

.woocommerce-account:not(.logged-in) .woocommerce > h2 {
	max-width: 480px;
}

.woocommerce-LostPassword a {
	color: var(--pstv-blue);
	font-size: 0.8125rem;
}

.woocommerce-LostPassword a:hover {
	color: var(--pstv-navy);
}

/* ==== The Dirham mark ======================================================
 * Drawn, not typed — see inc/woocommerce.php. Sized and coloured like a
 * character so it sits correctly in any price, at any size.
 */

.pstv-aed {
	display: inline-block;
	/* Manrope's digits are tall, so the mark sits a little under the 1.15em the
	   app uses with Poppins — matched by eye against the numerals. */
	width: 1.02em;
	height: 1.02em;
	vertical-align: -0.13em;
	margin-inline-end: 0.14em;
	color: inherit;
	flex-shrink: 0;
}

/* The mark reads as part of the number, so it keeps the number's weight. */
.woocommerce-Price-currencySymbol {
	font-weight: inherit;
	opacity: 1;
}

.woocommerce-Price-amount {
	display: inline-flex;
	align-items: baseline;
	white-space: nowrap;
}

/* A struck-through old price should strike the mark too. */
del .woocommerce-Price-amount { text-decoration: inherit; }