/* Curvita Tiered Pricing — Frontend Styles
 * Renders the "buy more, save more" tier ladder on single product pages.
 *
 * Uses Curvita theme CSS variables (--c-coral, --c-navy, --c-red-sale,
 * --c-surface, --c-text, --c-text-muted) with hardcoded fallbacks so
 * the panel also looks correct if used under a different theme.
 *
 * Design constraints from theme spec: flat (no rounded corners,
 * no box-shadows), Lato body / Montserrat headings.
 */

.ctp-tier-ladder {
	margin: 1.5em 0;
	padding: 1.25em;
	background: var(--c-surface, #F9F9F9);
	border-left: 4px solid var(--c-coral, #E27C7C);
	font-family: 'Lato', sans-serif;
	color: var(--c-text, #000);
}

.ctp-tier-ladder__header {
	display: flex;
	align-items: center;
	gap: 0.5em;
	margin-bottom: 1em;
}

.ctp-tier-ladder__icon {
	font-size: 1.4em;
	line-height: 1;
}

.ctp-tier-ladder__title {
	font-family: 'Montserrat', sans-serif;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--c-text, #000);
}

.ctp-tier-ladder__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 0.75em;
}

.ctp-tier-card {
	background: var(--c-white, #FFF);
	border: 1px solid #E5E5E5;
	padding: 0.9em 0.75em;
	text-align: center;
	transition: border-color 0.15s ease;
}

.ctp-tier-card:hover {
	border-color: var(--c-coral, #E27C7C);
}

.ctp-tier-card--featured {
	border: 2px solid var(--c-coral, #E27C7C);
	padding: calc(0.9em - 1px) calc(0.75em - 1px);
}

.ctp-tier-card__qty {
	margin-bottom: 0.5em;
	line-height: 1.1;
}

.ctp-tier-card__qty-num {
	font-family: 'Montserrat', sans-serif;
	font-size: 1.9em;
	font-weight: 700;
	color: var(--c-navy, #0E243F);
	display: block;
	line-height: 1;
}

.ctp-tier-card__qty-label {
	display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--c-text-muted, #686868);
	margin-top: 4px;
}

.ctp-tier-card__price {
	font-family: 'Lato', sans-serif;
	font-size: 1.25em;
	font-weight: 700;
	color: var(--c-text, #000);
	margin: 0.3em 0 0.1em;
	line-height: 1.2;
}

.ctp-tier-card__price .woocommerce-Price-amount {
	color: inherit;
}

.ctp-tier-card__per-unit {
	font-size: 11px;
	color: var(--c-text-muted, #686868);
	margin-bottom: 0.5em;
}

.ctp-tier-card__savings {
	display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-size: 10px;
	font-weight: 700;
	color: var(--c-white, #FFF);
	background: var(--c-red-sale, #D63637);
	padding: 4px 7px;
	text-transform: uppercase;
	letter-spacing: 0.3px;
	line-height: 1;
}

.ctp-tier-card__savings .woocommerce-Price-amount {
	color: inherit;
	font-weight: 700;
}

.ctp-tier-ladder__note {
	margin: 1em 0 0;
	font-size: 11px;
	color: var(--c-text-muted, #686868);
	font-style: italic;
	line-height: 1.4;
}

@media (max-width: 600px) {
	.ctp-tier-ladder__grid {
		grid-template-columns: 1fr 1fr;
	}
	.ctp-tier-card__qty-num {
		font-size: 1.7em;
	}
}

@media (max-width: 400px) {
	.ctp-tier-ladder {
		padding: 1em;
	}
	.ctp-tier-ladder__grid {
		grid-template-columns: 1fr;
		gap: 0.5em;
	}
}

/* --- Cart / Checkout savings indicator --- */
.ctp-cart-savings,
.ctp-cart-savings .woocommerce-Price-amount {
	color: var(--c-red-sale, #D63637);
	font-weight: 700;
}