.dms {
	width: 100%;
}

/* Controls layout */
.dms__controls {
	display: flex;
	gap: 14px;
	margin-bottom: 16px;
}

.dms--inline .dms__controls {
	flex-direction: row;
}

.dms--inline .dms__field {
	flex: 1;
}

.dms--stack .dms__controls {
	flex-direction: column;
}

/* Field wrapper */
.dms__field {
	position: relative;
	width: 100%;
}

/* Select styling baseline */
.dms__select {
	width: 100%;
	min-height: 42px;
	padding: 28px 44px 10px 12px; /* more top padding so text never overlaps the label */
	border: 1px solid rgba(0,0,0,.2);
	border-radius: 10px;
	background: #fff;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

/* Chevron */
.dms__chevron {
	position: absolute;
	right: 14px;
	top: 50%;
	width: 10px;
	height: 10px;
	pointer-events: none;
	transform: translateY(-50%) rotate(45deg);
	border-right: 2px solid rgba(0,0,0,.55);
	border-bottom: 2px solid rgba(0,0,0,.55);
}

/* Floating label (always top-aligned, Apple-like) */
.dms__floating_label {
	position: absolute;
	left: 12px;
	top: 10px;
	transform: none;
	font-size: 12px;
	color: rgba(0,0,0,.6);
	pointer-events: none;
	transition: opacity .15s ease;
	background: transparent;
}

/* Slight emphasis when user has selected a value or focused */
.dms__field--has-value .dms__floating_label,
.dms__select:focus + .dms__chevron + .dms__floating_label {
	opacity: .9;
}

/* Empty state */
.dms__empty {
	padding: 14px;
	border: 1px dashed rgba(0,0,0,.3);
	border-radius: 10px;
}

/* Prices table */
.dms_prices {
	width: 100%;
}

.dms_prices__row {
	display: grid;
	grid-template-columns: 1fr 140px 140px;
	gap: 10px;
	padding: 10px 0;
	border-bottom: 1px solid rgba(0,0,0,.08);
}

.dms_prices__row--head {
	font-weight: 600;
	border-bottom: 1px solid rgba(0,0,0,.14);
}

.dms_prices__col {
	line-height: 1.3;
}

.dms_prices__col--ac,
.dms_prices__col--price {
	text-align: right;
	white-space: nowrap;
}

.dms_prices__empty {
	padding: 10px 0;
	opacity: .75;
}


@media (max-width: 600px) {
	/* Stack pricing rows nicely on mobile */
	.dms_prices__row {
		grid-template-columns: 1fr 1fr;
		gap: 8px;
		padding: 12px 0;
	}

	/* Put service on its own line */
	.dms_prices__col--service {
		grid-column: 1 / -1;
		font-weight: 600;
	}

	/* Hide the header row and use data-labels instead */
	.dms_prices__row--head {
		display: none;
	}

	/* Show labels above values */
	.dms_prices__col--ac,
	.dms_prices__col--price {
		text-align: left;
		white-space: normal;
	}

	.dms_prices__col--ac::before,
	.dms_prices__col--price::before {
		content: attr(data-label);
		display: block;
		font-size: 12px;
		opacity: .7;
		margin-bottom: 2px;
	}
}


/* Terms & Conditions */
.dms_terms {
	margin-top: 12px;
	font-size: 13px;
	opacity: .85;
}

/* When AppleCare+ is disabled/hidden */
.dms--no-applecare .dms_prices__row {
	grid-template-columns: 1fr 140px;
}

.dms--no-applecare .dms_prices__col--price {
	text-align: right;
}
