/* Perfume Product Details – front-end styles. Colours follow the Astra global palette when available. */

.ppd-profile {
	--ppd-accent: var(--ast-global-color-0, #8c6a35);
	--ppd-gold: #b08d57;
	--ppd-tint: var(--ast-global-color-4, #f7f1ea);
	--ppd-border: var(--ast-global-color-6, #e3d9cc);
	--ppd-text: var(--ast-global-color-3, #454c49);
	margin: 1.5em 0;
	padding: 1.25em 1.5em;
	background: var(--ppd-tint);
	border: 1px solid var(--ppd-border);
	border-radius: 10px;
}

.ppd-profile__title {
	margin: 0 0 .9em;
	font-size: 1.15em;
	letter-spacing: .02em;
}

.ppd-notes {
	margin: 0 0 1em;
}

.ppd-notes__row {
	display: grid;
	grid-template-columns: 6.5em 1fr;
	gap: .5em;
	align-items: baseline;
	padding: .45em 0;
	border-bottom: 1px dashed var(--ppd-border);
}

.ppd-notes__row:last-child {
	border-bottom: 0;
}

.ppd-notes dt {
	margin: 0;
	font-size: .78em;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ppd-gold);
}

.ppd-notes dd {
	display: flex;
	flex-wrap: wrap;
	gap: .35em;
	margin: 0;
}

.ppd-chip {
	padding: .15em .7em;
	font-size: .88em;
	line-height: 1.6;
	color: var(--ppd-text);
	background: #fff;
	border: 1px solid var(--ppd-border);
	border-radius: 999px;
}

.ppd-meters {
	display: grid;
	gap: .55em;
	margin-bottom: .8em;
}

.ppd-meter {
	display: grid;
	grid-template-columns: 6.5em auto 1fr;
	gap: .75em;
	align-items: center;
	font-size: .92em;
}

.ppd-meter__label {
	font-size: .85em;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ppd-gold);
}

.ppd-meter__bar {
	display: inline-flex;
	gap: 4px;
}

.ppd-meter__bar i {
	width: 26px;
	height: 6px;
	background: var(--ppd-border);
	border-radius: 3px;
}

.ppd-meter__bar i.is-on {
	background: var(--ppd-accent);
}

.ppd-best-for {
	margin: 0;
	font-size: .92em;
}

.ppd-loop-notes {
	margin: .1em 0 .4em;
	font-size: .85em;
	color: var(--ast-global-color-3, #454c49);
	opacity: .8;
}

/* Shop filter bar */

.ppd-shop-filters {
	display: flex;
	flex-wrap: wrap;
	gap: .75em 2.5em;
	margin: 0 0 1.75em;
	padding: 1em 1.25em;
	background: var(--ast-global-color-4, #f7f1ea);
	border: 1px solid var(--ast-global-color-6, #e3d9cc);
	border-radius: 10px;
}

.ppd-shop-filters__group {
	display: flex;
	align-items: center;
	gap: .75em;
	min-width: 0;
}

.ppd-shop-filters__label {
	font-size: .78em;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #9a7440;
}

.ppd-shop-filters__list {
	display: flex;
	flex-wrap: wrap;
	gap: .4em;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ppd-shop-filters__list li {
	margin: 0;
}

.ppd-pill {
	display: inline-block;
	padding: .35em 1em;
	font-size: .9em;
	line-height: 1.4;
	color: var(--ast-global-color-2, #17201d);
	background: #fff;
	border: 1px solid var(--ast-global-color-6, #e3d9cc);
	border-radius: 999px;
	text-decoration: none;
	white-space: nowrap;
	transition: border-color .15s, background-color .15s, color .15s;
}

.ppd-pill:hover,
.ppd-pill:focus-visible {
	color: var(--ast-global-color-0, #8c6a35);
	border-color: var(--ast-global-color-0, #8c6a35);
}

.ppd-pill.is-active {
	color: #fff;
	background: var(--ast-global-color-0, #8c6a35);
	border-color: var(--ast-global-color-0, #8c6a35);
}

.ppd-pill__badge {
	margin-left: .2em;
	padding: .1em .5em;
	font-size: .72em;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	vertical-align: .1em;
	color: var(--ast-global-color-0, #8c6a35);
	background: var(--ast-global-color-4, #f7f1ea);
	border-radius: 999px;
}

.ppd-pill.is-active .ppd-pill__badge {
	color: var(--ast-global-color-0, #8c6a35);
	background: #fff;
}

/* Coming soon category */

.ppd-coming-soon {
	max-width: 36em;
	margin: 1em auto 3em;
	padding: 2.5em 2em;
	text-align: center;
	background: var(--ast-global-color-4, #f7f1ea);
	border: 1px solid var(--ast-global-color-6, #e3d9cc);
	border-radius: 10px;
}

.ppd-coming-soon__eyebrow {
	margin: 0 0 .5em;
	font-size: .78em;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #9a7440;
}

.ppd-coming-soon__title {
	margin: 0 0 .5em;
}

.ppd-coming-soon__text {
	margin: 0 0 1.5em;
}

/* Orders paused */

.ppd-orders-paused {
	margin: 1.25em 0;
	padding: 1.1em 1.25em;
	background: var(--ast-global-color-4, #f7f1ea);
	border: 1px solid var(--ast-global-color-6, #e3d9cc);
	border-radius: 10px;
}

.ppd-orders-paused--bar {
	margin: 0 0 1.75em;
	padding: .75em 1.25em;
	text-align: center;
}

.ppd-orders-paused__eyebrow {
	margin: 0 0 .35em;
	font-size: .78em;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #9a7440;
}

.ppd-orders-paused__text {
	margin: 0;
}

.ppd-orders-paused__sizes {
	margin: .9em 0 0;
	padding: 0;
	list-style: none;
}

.ppd-orders-paused__sizes li {
	display: flex;
	justify-content: space-between;
	gap: 1em;
	padding: .45em 0;
	border-top: 1px dashed var(--ast-global-color-6, #e3d9cc);
}

@media (max-width: 480px) {
	.ppd-shop-filters {
		padding: .85em 1em;
	}

	.ppd-shop-filters__group {
		flex-direction: column;
		align-items: flex-start;
		gap: .4em;
		width: 100%;
	}

	.ppd-shop-filters__list {
		flex-wrap: nowrap;
		width: 100%;
		overflow-x: auto;
		padding-bottom: 2px;
	}

	.ppd-profile {
		padding: 1em;
	}

	.ppd-notes__row {
		grid-template-columns: 1fr;
		gap: .35em;
	}

	.ppd-meter {
		grid-template-columns: 7.2em auto 1fr;
		gap: .6em;
	}

	.ppd-meter__label {
		font-size: .78em;
	}

	.ppd-meter__bar i {
		width: 16px;
	}
}