/* [offerta_operazioni] — elenco radio dei tipi di attivazione disponibili */

.alp-op-block {
	margin: 2rem 0;
}

.alp-op-title {
	font-size: 1.5rem;
	font-weight: 700;
	color: #003057;
	margin: 0 0 1.25rem;
}

.alp-op-cards {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.alp-op-card {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 16px;
	padding: 20px 24px;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	cursor: pointer;
	transition: border-color .15s, background-color .15s;
}

.alp-op-card:hover {
	border-color: #1D7990;
}

/* Focus visibile sulla card: l'input radio nativo resta presente per lo
   screen reader e la tastiera, ma è visivamente sostituito dal pallino
   disegnato in .alp-op-card__radio-dot (stesso pattern già in uso nel
   configuratore, vedi assets/calcolatore/calcolatore.css .calc-card). */
.alp-op-card:focus-within {
	outline: 3px solid #1D7990;
	outline-offset: 2px;
}

.alp-op-card:has(.alp-op-card__radio:checked) {
	background: #f0f7f9;
	border-color: #1D7990;
}

.alp-op-card__radio {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.alp-op-card__radio-dot {
	flex-shrink: 0;
	margin-top: 2px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	border: 2px solid #94a3b8;
	background: #fff;
	position: relative;
}

.alp-op-card__radio-dot::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) scale(0);
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #1D7990;
	transition: transform .15s;
}

.alp-op-card__radio:checked ~ .alp-op-card__radio-dot {
	border-color: #1D7990;
}

.alp-op-card__radio:checked ~ .alp-op-card__radio-dot::after {
	transform: translate(-50%, -50%) scale(1);
}

.alp-op-card__text {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.alp-op-card__label {
	font-weight: 700;
	color: #003057;
}

.alp-op-card__sublabel {
	color: #55606c;
	font-size: .9375rem;
	line-height: 1.4;
}

.alp-op-actions {
	margin-top: 24px;
}

.alp-op-continue {
	background: #DB3700;
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: 14px 28px;
	font-size: 1rem;
	font-weight: 700;
	cursor: pointer;
	transition: background-color .15s;
}

.alp-op-continue:hover {
	background: #b82e00;
}

.alp-op-continue:focus-visible {
	outline: 3px solid #DB3700;
	outline-offset: 2px;
}

.alp-op-continue[aria-disabled="true"] {
	background: #cbd5e1;
	color: #64748b;
	cursor: not-allowed;
}

@media (prefers-reduced-motion: reduce) {
	.alp-op-card,
	.alp-op-card__radio-dot::after,
	.alp-op-continue {
		transition: none;
	}
}