/* ==========================================================================
   Richiesta D-Card: pulsante fisso + popup a passi
   ========================================================================== */

/* ---------- Pulsante fisso ---------- */
.dl-fab {
	position: fixed; z-index: 90;
	right: clamp(1rem, 2.5vw, 2rem);
	bottom: calc(clamp(1rem, 2.5vw, 2rem) + env(safe-area-inset-bottom, 0px));
	display: inline-flex; align-items: center; gap: .8rem;
	padding: 1.05rem 1.7rem 1.05rem 1.3rem;
	border: 0; border-radius: 999px;
	background: var(--dl-yellow); color: var(--dl-navy-dark);
	font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: 1.05rem; letter-spacing: -.01em;
	cursor: pointer;
	box-shadow: 0 16px 36px rgba(17, 26, 69, .45), 0 0 0 4px rgba(255, 255, 255, .92);
	animation: dc-fab-in .9s var(--dl-ease) .8s both;
	transition: transform .35s var(--dl-ease), opacity .3s;
}
.dl-fab:hover { transform: translateY(-4px) rotate(-1.2deg); }
.dl-fab:focus-visible { outline: 3px solid var(--dl-navy-dark); outline-offset: 4px; }
.dl-fab::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 0 0 rgba(251, 201, 77, .75); animation: dl-pulse 2.4s infinite; pointer-events: none; }
.dl-fab__icon { width: 1.6rem; height: 1.6rem; background: currentColor; flex: none; animation: dc-wiggle 5s ease-in-out 2s infinite;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2zm2 3v2h14V9zm0 5v4h6v-4z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2zm2 3v2h14V9zm0 5v4h6v-4z'/%3E%3C/svg%3E") center / contain no-repeat; }
html.dc-open .dl-fab { opacity: 0; pointer-events: none; }
@keyframes dc-fab-in { from { opacity: 0; transform: translateY(40px) scale(.9); } }
@keyframes dc-wiggle { 0%, 88%, 100% { rotate: 0deg; } 92% { rotate: -14deg; } 96% { rotate: 10deg; } }
@media (max-width: 600px) {
	.dl-fab { left: 1rem; right: 1rem; justify-content: center; bottom: calc(.9rem + env(safe-area-inset-bottom, 0px)); }
}

/* ---------- Finestra ---------- */
html.dc-open { overflow: hidden; }
.dl-modal { border: 0; padding: 0; background: transparent; max-width: none; max-height: none; width: 100vw; height: 100vh; height: 100dvh; color: #111a45; overflow: hidden; }
.dl-modal::backdrop { background: rgba(9, 14, 44, .84); animation: dc-fade .4s ease; }
.dl-modal[open] { display: grid; place-items: center; }
@keyframes dc-fade { from { opacity: 0; } }

.dl-modal__panel { position: relative; width: min(980px, calc(100vw - 2rem)); height: min(760px, 92vh); height: min(760px, 92dvh); display: grid; grid-template-columns: 320px minmax(0, 1fr); border-radius: 34px; overflow: hidden; background: #fff; box-shadow: 0 40px 110px rgba(0, 0, 0, .55); animation: dc-pop .6s var(--dl-ease); }
@keyframes dc-pop { from { opacity: 0; transform: translateY(36px) scale(.96); } }

/* Colonna a sinistra */
.dl-modal__aside { position: relative; overflow: hidden; display: flex; flex-direction: column; padding: 2.2rem 2rem; background: #111a45; color: #fff; }
.dl-modal__drop { position: absolute; right: -80px; bottom: -80px; width: 260px; height: 260px; background: #fbc94d; border-radius: 50% 50% 50% 0; rotate: -12deg; animation: dc-float 9s ease-in-out infinite; }
@keyframes dc-float { 50% { translate: -10px -14px; rotate: -6deg; } }
.dl-modal__eyebrow { margin: 0; font-family: var(--wp--preset--font-family--display); text-transform: uppercase; letter-spacing: .2em; font-size: .78rem; font-weight: 800; color: #fbc94d; }
.dl-modal__aside h2 { margin: .5rem 0 .8rem; font-size: clamp(1.9rem, 3vw, 2.5rem); line-height: 1; letter-spacing: -.025em; color: #fff; }
.dl-modal__lead { margin: 0; opacity: .85; font-size: .98rem; line-height: 1.5; }
.dl-modal__steps { list-style: none; margin: auto 0 0 !important; padding: 0 !important; display: grid; gap: .65rem; position: relative; z-index: 1; }
.dl-modal__steps li { display: flex; align-items: center; gap: .85rem; font-weight: 600; opacity: .5; transition: opacity .4s; cursor: default; }
.dl-modal__num { display: grid; place-items: center; flex: none; width: 2.1rem; height: 2.1rem; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .4); font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: .9rem; transition: background .4s, color .4s, border-color .4s, transform .4s var(--dl-ease); }
.dl-modal__steps li.is-active { opacity: 1; }
.dl-modal__steps li.is-active .dl-modal__num { background: #fbc94d; border-color: #fbc94d; color: #111a45; transform: scale(1.12); }
.dl-modal__steps li.is-done { opacity: .85; cursor: pointer; }
.dl-modal__steps li.is-done .dl-modal__num { background: rgba(251, 201, 77, .2); border-color: #fbc94d; color: #fbc94d; }
.dl-modal__steps li.is-done .dl-modal__num { font-size: 0; }
.dl-modal__steps li.is-done .dl-modal__num::after { content: ""; width: 1rem; height: 1rem; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }

/* Colonna principale */
.dl-modal__main { position: relative; display: flex; flex-direction: column; min-height: 0; padding: 2.4rem 2.4rem 1.5rem; background: #fff; }
.dl-modal__close { position: absolute; top: 1.1rem; right: 1.1rem; z-index: 3; display: grid; place-items: center; width: 2.7rem; height: 2.7rem; border: 0; border-radius: 50%; background: #f2f4fa; color: #111a45; cursor: pointer; transition: transform .35s var(--dl-ease), background .3s; }
.dl-modal__close:hover { transform: rotate(90deg); background: #fbc94d; }

/* Barra di avanzamento con la goccia */
.dl-modal__bar { position: absolute; left: 0; right: 0; top: 0; height: 6px; background: rgba(17, 26, 69, .08); }
.dl-modal__bar i { display: block; height: 100%; width: var(--p, 0%); background: linear-gradient(90deg, #fbc94d, #ff9d3d); border-radius: 0 6px 6px 0; transition: width .7s var(--dl-ease); }
.dl-modal__bar b { position: absolute; top: -3px; left: var(--p, 0%); width: 15px; height: 15px; margin-left: -8px; background: #ff9d3d; border-radius: 50% 50% 50% 0; rotate: -45deg; transition: left .7s var(--dl-ease); box-shadow: 0 3px 8px rgba(17, 26, 69, .25); }

.dl-dc { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.dc-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Passi */
.dc-step { display: none; flex: 1; min-height: 0; overflow-y: auto; padding: .2rem .4rem 1rem 0; scrollbar-width: thin; }
.dc-step.is-active { display: block; animation: dc-in .55s var(--dl-ease) both; }
.dl-dc.is-back .dc-step.is-active { animation-name: dc-in-back; }
@keyframes dc-in { from { opacity: 0; transform: translateX(34px); } }
@keyframes dc-in-back { from { opacity: 0; transform: translateX(-34px); } }
.dc-kicker { margin: 0 0 .4rem; font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .16em; color: #2a3a7c; }
.dc-step h3 { margin: 0; font-size: clamp(1.7rem, 3vw, 2.4rem); line-height: 1.05; letter-spacing: -.025em; color: #111a45; }
.dc-intro { margin: .5rem 0 1.4rem; color: rgba(17, 26, 69, .72); }

.dc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem 1.2rem; }
.dc-field { min-width: 0; }
.dc-field--textarea, .dc-field--consent, .dc-field--radio, .dc-field--checkbox, .dc-field--file, .dc-field--wide { grid-column: 1 / -1; }
.dc-field[hidden] { display: none; }
.dc-label { display: block; margin-bottom: .4rem; font-weight: 700; font-size: .9rem; padding: 0; }
.dc-label em { color: #d64545; font-style: normal; }
.dc-help { display: block; margin-top: .3rem; opacity: .65; font-size: .82rem; }

.dl-dc input[type="text"], .dl-dc input[type="email"], .dl-dc input[type="tel"], .dl-dc input[type="date"], .dl-dc input[type="number"], .dl-dc select, .dl-dc textarea, .dl-dc input[type="file"] {
	width: 100%; box-sizing: border-box; min-height: 3.3rem; padding: .75rem 1rem;
	border: 2px solid rgba(17, 26, 69, .18); border-radius: 16px; background: #fff;
	font: inherit; font-size: 1rem; color: #111a45; outline: none;
	transition: border-color .25s, box-shadow .25s, background .25s;
}
.dl-dc textarea { min-height: 7rem; resize: vertical; }
.dl-dc input:focus, .dl-dc select:focus, .dl-dc textarea:focus { border-color: #2a3a7c; box-shadow: 0 0 0 4px rgba(251, 201, 77, .6); }
.dc-field.has-error input, .dc-field.has-error select, .dc-field.has-error textarea { border-color: #d64545; background: #fff7f7; }
.dc-field.has-error { animation: dc-shake .4s; }
@keyframes dc-shake { 25% { translate: -6px 0; } 75% { translate: 6px 0; } }
.dc-err { display: block; min-height: 1.15em; margin-top: .25rem; color: #d64545; font-size: .82rem; font-weight: 600; }

/* Scelte a pillola */
.dc-field fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.dc-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.dc-chip { position: relative; }
.dc-chip input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.dc-chip span { display: inline-block; padding: .65rem 1.2rem; border: 2px solid rgba(17, 26, 69, .22); border-radius: 999px; font-weight: 600; transition: background .25s, color .25s, border-color .25s, transform .25s var(--dl-ease); }
.dc-chip:hover span { transform: translateY(-2px); }
.dc-chip input:checked + span { background: #111a45; border-color: #111a45; color: #fff; }
.dc-chip input:focus-visible + span { box-shadow: 0 0 0 4px rgba(251, 201, 77, .7); }

/* Consensi */
.dc-check { display: flex; align-items: flex-start; gap: .8rem; cursor: pointer; line-height: 1.45; position: relative; padding: .8rem 1rem; border: 2px solid rgba(17, 26, 69, .12); border-radius: 18px; transition: border-color .25s, background .25s; }
.dc-check:hover { border-color: rgba(17, 26, 69, .3); }
.dc-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.dc-box { display: grid; place-items: center; flex: none; width: 1.6rem; height: 1.6rem; margin-top: .05rem; border: 2px solid #111a45; border-radius: 9px; background: #fff; transition: background .25s, transform .25s var(--dl-ease); }
.dc-box::after { content: ""; width: .9rem; height: .9rem; background: #111a45; scale: 0; transition: scale .25s var(--dl-ease);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='black' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='black' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.dc-check input:checked + .dc-box { background: #fbc94d; transform: scale(1.08); }
.dc-check input:checked + .dc-box::after { scale: 1; }
.dc-check input:checked ~ .dc-ctext { color: #111a45; }
.dc-check input:focus-visible + .dc-box { box-shadow: 0 0 0 4px rgba(251, 201, 77, .7); }
.dc-ctext a { color: #2a3a7c; font-weight: 700; }
.dc-ctext em { color: #d64545; font-style: normal; }
.dc-field--consent.has-error .dc-check { border-color: #d64545; background: #fff7f7; }

/* Riepilogo */
.dc-sum { margin: 0; display: grid; gap: .3rem; }
.dc-sum__head { display: flex; justify-content: space-between; align-items: center; margin-top: 1rem; padding-bottom: .4rem; border-bottom: 2px solid #fbc94d; font-family: var(--wp--preset--font-family--display); font-weight: 800; }
.dc-sum__edit { border: 0; background: none; color: #2a3a7c; font: inherit; font-size: .85rem; font-weight: 700; text-decoration: underline; cursor: pointer; }
.dc-sum__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: .8rem; padding: .35rem 0; border-bottom: 1px dashed rgba(17, 26, 69, .14); }
.dc-sum__row dt { font-size: .88rem; opacity: .65; }
.dc-sum__row dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }

/* Navigazione */
.dc-msg { min-height: 1.3em; margin: .3rem 0; color: #d64545; font-weight: 700; font-size: .92rem; }
.dc-nav { display: flex; justify-content: space-between; gap: .8rem; padding-top: 1rem; border-top: 1px solid rgba(17, 26, 69, .1); }
.dc-btn { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 3.2rem; padding: 0 1.9rem; border: 2px solid transparent; border-radius: 999px; font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: 1rem; cursor: pointer; transition: transform .3s var(--dl-ease), box-shadow .3s, background .25s, opacity .25s; }
.dc-btn:hover { transform: translateY(-2px); }
.dc-btn--main { background: #fbc94d; color: #111a45; box-shadow: 0 10px 24px rgba(251, 201, 77, .5); margin-left: auto; }
.dc-btn--main:disabled { opacity: .6; cursor: progress; transform: none; }
.dc-btn--ghost { background: transparent; border-color: rgba(17, 26, 69, .25); color: #111a45; }
.dc-btn--ghost:hover { border-color: #111a45; }
.dc-next::after { content: ""; width: 1.1em; height: 1.1em; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h14M12 5l7 7-7 7' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h14M12 5l7 7-7 7' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; transition: transform .3s var(--dl-ease); }
.dc-next:hover::after { transform: translateX(4px); }
.dc-back { visibility: hidden; }
.dl-dc[data-step="0"] .dc-back { visibility: hidden; }
.dl-dc:not([data-step="0"]) .dc-back { visibility: visible; }
.dc-send { display: none; }
.dl-dc.is-last .dc-next { display: none; }
.dl-dc.is-last .dc-send { display: inline-flex; }
.dl-dc.is-done .dc-nav, .dl-dc.is-done .dc-msg { display: none; }

/* Conferma */
.dc-done { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 1rem; }
.dc-done[hidden] { display: none; }
.dc-done h3 { margin: 1.4rem 0 .5rem; font-size: clamp(1.9rem, 3.4vw, 2.8rem); letter-spacing: -.03em; }
.dc-done p { max-width: 26rem; margin: 0 0 1.6rem; color: rgba(17, 26, 69, .75); }
.dc-done__drop { display: grid; place-items: center; width: 5.6rem; height: 5.6rem; border-radius: 50% 50% 50% 0; rotate: -45deg; background: #fbc94d; color: #111a45; animation: dc-bounce .9s var(--dl-ease) both; }
.dc-done__drop svg { rotate: 45deg; }
@keyframes dc-bounce { 0% { scale: 0; } 60% { scale: 1.18; } 100% { scale: 1; } }

/* ---------- Telefono ---------- */
@media (max-width: 760px) {
	.dl-modal__panel { width: 100vw; height: 100vh; height: 100dvh; max-height: none; border-radius: 0; grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); }
	.dl-modal__aside { padding: 1.1rem 4.2rem 1.1rem 1.3rem; }
	.dl-modal__aside h2 { font-size: 1.35rem; margin: .2rem 0 0; }
	.dl-modal__lead, .dl-modal__steps { display: none; }
	.dl-modal__drop { width: 120px; height: 120px; right: -40px; bottom: -50px; }
	.dl-modal__main { position: static; padding: 1.2rem 1.2rem calc(1rem + env(safe-area-inset-bottom, 0px)); }
	/* il pulsante sta nella fascia blu in alto (il pannello è il riferimento), ben visibile e facile da toccare */
	.dl-modal__close { top: max(.7rem, env(safe-area-inset-top, 0px)); right: .8rem; width: 3rem; height: 3rem; background: #fbc94d; color: #111a45; box-shadow: 0 4px 14px rgba(0, 0, 0, .35); }
	.dl-modal__close:hover { transform: none; }
	.dc-grid { grid-template-columns: 1fr; }
	.dc-sum__row { grid-template-columns: 1fr; gap: 0; }
	.dc-step h3 { font-size: 1.6rem; }
	.dc-btn { padding: 0 1.4rem; }
}

@media (prefers-reduced-motion: reduce) {
	.dl-fab, .dl-fab__icon, .dl-modal__drop, .dl-modal__panel, .dc-step.is-active, .dc-done__drop { animation: none !important; }
	.dl-modal__bar i, .dl-modal__bar b { transition: none; }
}

/* Ritocchi: la goccia non copre i nomi dei passi; "Chiudi" centrato nella conferma */
.dl-modal__drop { bottom: auto; top: clamp(250px, 36%, 330px); right: -95px; width: 230px; height: 230px; }
.dc-done .dc-btn--main { margin-left: 0; }
@media (max-height: 700px) { .dl-modal__drop { top: 30%; width: 180px; height: 180px; } }

/* ==========================================================================
   Modulo D-Card: riquadri di scelta, veicoli, testi informativi, allegati
   ========================================================================== */
.dl-dc [hidden] { display: none !important; }
.dc-block { grid-column: 1 / -1; min-width: 0; }

/* Scelta a riquadri (tipo richiedente, tipo carta) */
.dc-cards { display: grid; gap: .8rem; }
.dc-optcard { position: relative; display: block; cursor: pointer; }
.dc-optcard input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.dc-optcard__in { display: grid; gap: .25rem; padding: 1.1rem 1.3rem 1.1rem 3.4rem; border: 2px solid rgba(17, 26, 69, .16); border-radius: 22px; position: relative; transition: border-color .25s, background .25s, transform .3s var(--dl-ease), box-shadow .3s; }
.dc-optcard__in::before { content: ""; position: absolute; left: 1.2rem; top: 1.25rem; width: 1.4rem; height: 1.4rem; border: 2px solid #111a45; border-radius: 50%; background: #fff; transition: background .25s, box-shadow .25s; }
.dc-optcard__in strong { font-family: var(--wp--preset--font-family--display); font-size: 1.12rem; letter-spacing: -.01em; }
.dc-optcard__in small { opacity: .7; font-size: .9rem; line-height: 1.4; }
.dc-optcard:hover .dc-optcard__in { transform: translateY(-2px); border-color: rgba(17, 26, 69, .4); }
.dc-optcard input:checked + .dc-optcard__in { border-color: #111a45; background: #f6f8ff; box-shadow: 0 10px 26px rgba(17, 26, 69, .12); }
.dc-optcard input:checked + .dc-optcard__in::before { background: #fbc94d; box-shadow: inset 0 0 0 4px #fff, 0 0 0 2px #111a45; border-color: #111a45; }
.dc-optcard input:focus-visible + .dc-optcard__in { box-shadow: 0 0 0 4px rgba(251, 201, 77, .7); }
.dc-field.has-error .dc-optcard__in { border-color: #d64545; }

/* Veicoli */
.dc-vehicles { display: grid; gap: 1rem; }
.dc-vehnote { margin: 0; padding: .8rem 1rem; border-radius: 14px; background: #fff7dc; font-weight: 600; font-size: .92rem; }
.dc-veh { margin: 0; padding: 1rem 1.2rem 1.1rem; border: 2px solid rgba(17, 26, 69, .12); border-radius: 22px; min-width: 0; background: #fbfcff; animation: dc-in .45s var(--dl-ease) both; }
.dc-veh legend { padding: 0 .6rem; font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: 1rem; color: #2a3a7c; }
.dc-veh__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem 1rem; }
.dc-veh__grid .dc-field:last-child:nth-child(odd) { grid-column: 1 / -1; }

/* Testi informativi */
.dc-html { font-size: .95rem; line-height: 1.55; color: rgba(17, 26, 69, .85); }
.dc-html p { margin: 0 0 .6rem; }
.dc-html ol { margin: 0; padding-left: 1.3rem; display: grid; gap: .45rem; }
.dc-html--box { max-height: 9.5rem; overflow-y: auto; padding: 1rem 1.2rem; border-radius: 18px; background: #f2f4fa; font-size: .88rem; scrollbar-width: thin; }

/* Allegati */
.dl-dc input[type="file"] { padding: .8rem 1rem; min-height: 0; border-style: dashed; cursor: pointer; background: #fbfcff; }
.dl-dc input[type="file"]::file-selector-button { margin-right: 1rem; padding: .55rem 1.1rem; border: 0; border-radius: 999px; background: #111a45; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.dc-files { display: block; margin-top: .4rem; font-size: .85rem; font-weight: 600; color: #2a3a7c; overflow-wrap: anywhere; }

.dc-done__num { margin: 0 0 .6rem; padding: .35rem 1rem; border-radius: 999px; background: #f2f4fa; font-weight: 600; }
.dc-done__num strong { font-family: var(--wp--preset--font-family--display); letter-spacing: .02em; }

/* Elenco passi più compatto (sono 8) */
.dl-modal__steps { gap: .45rem; }
.dl-modal__num { width: 1.9rem; height: 1.9rem; }
@media (max-height: 760px) { .dl-modal__lead { display: none; } .dl-modal__drop { top: 22%; } }

@media (max-width: 760px) {
	.dc-veh__grid { grid-template-columns: 1fr; }
	.dc-optcard__in { padding: 1rem 1rem 1rem 3.2rem; }
}

/* Con otto passi la goccia si sposta sul bordo: non deve passare dietro i nomi dei passi */
.dl-modal__drop { top: clamp(200px, 30%, 300px); right: -125px; width: 200px; height: 200px; }
@media (max-height: 760px) { .dl-modal__drop { top: 14%; width: 170px; height: 170px; right: -105px; } }
@media (max-height: 760px) { .dl-modal__drop { top: 150px; width: 130px; height: 130px; right: -70px; } }

/* Lettura del documento dal telefono */
.dc-scan { margin: 0 0 1.25rem; padding: 1rem 1.1rem; border: 1px dashed rgba(42, 58, 124, .35); border-radius: 14px; background: rgba(42, 58, 124, .04); }
.dc-scan__head strong { display: block; font-family: var(--dl-font-display, inherit); font-size: 1.05rem; margin-bottom: .2rem; }
.dc-scan__head p, .dc-scan__tip { margin: 0; font-size: .86rem; line-height: 1.45; opacity: .85; }
.dc-scan__tip { margin-top: .6rem; font-size: .8rem; opacity: .7; }
.dc-scan__btns { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: .8rem; }
.dc-scan__btn { flex: 1 1 11rem; }
.dc-scan__btn:disabled { opacity: .5; cursor: progress; }
.dc-scan__status { margin: .7rem 0 0; font-size: .86rem; line-height: 1.45; }
.dc-scan__status:empty { display: none; }
.dc-scan__status.is-ok { color: #1c7a5a; }
.dc-scan__status.is-err { color: #b3261e; }
.dc-scan.is-busy .dc-scan__status { color: var(--dl-navy, #2a3a7c); }
.dc-scan.is-busy .dc-scan__status::before { content: ""; display: inline-block; width: .8em; height: .8em; margin-right: .5em; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; vertical-align: -.1em; animation: dc-spin .8s linear infinite; }
@keyframes dc-spin { to { rotate: 360deg; } }
.dc-read { margin-left: .5rem; padding: .1rem .45rem; border-radius: 999px; background: rgba(47, 191, 143, .16); color: #1c7a5a; font-size: .68rem; font-weight: 600; letter-spacing: .02em; text-transform: none; white-space: nowrap; }
.dc-field.is-read input { border-color: rgba(47, 191, 143, .7); }
@media (prefers-reduced-motion: reduce) { .dc-scan.is-busy .dc-scan__status::before { animation: none; } }
