:root{--ccec-accent:#1e5bd6;--ccec-accent-dark:#164aad;--ccec-ink:#0f172a;--ccec-muted:#64748b;--ccec-line:#e2e8f0;--ccec-bg:#f8fafc;--ccec-radius:14px}

.ccec-checkout{max-width:760px;margin:0 auto;color:var(--ccec-ink);font-size:16px;line-height:1.5}
.ccec-checkout *{box-sizing:border-box}
.ccec-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}

/* Progress */
.ccec-progress ol{display:flex;gap:8px;list-style:none;margin:0 0 28px;padding:0;counter-reset:step}
.ccec-progress li{flex:1;position:relative;padding:10px 8px 0;font-size:13px;font-weight:600;color:var(--ccec-muted);text-align:center;border-top:3px solid var(--ccec-line)}
.ccec-progress li::before{counter-increment:step;content:counter(step);display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-right:6px;border-radius:50%;background:var(--ccec-line);color:#fff;font-size:12px;vertical-align:middle}
.ccec-progress li.is-active{color:var(--ccec-accent);border-top-color:var(--ccec-accent)}
.ccec-progress li.is-active::before{background:var(--ccec-accent)}
.ccec-progress li.is-done{color:var(--ccec-accent-dark);border-top-color:var(--ccec-accent-dark)}
.ccec-progress li.is-done::before{background:var(--ccec-accent-dark)}

.ccec-step__title{font-size:1.5rem;margin:0 0 4px}
.ccec-step__hint,.ccec-hint{color:var(--ccec-muted);font-size:14px;margin:0 0 18px}

/* Aree (tendine) */
.ccec-area{border:1px solid var(--ccec-line);border-radius:var(--ccec-radius);margin-bottom:12px;overflow:hidden;background:#fff}
.ccec-area__title{cursor:pointer;padding:16px 18px;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center}
.ccec-area__title::-webkit-details-marker{display:none}
.ccec-area__title::after{content:"+";font-size:20px;color:var(--ccec-accent);line-height:1}
.ccec-area[open] .ccec-area__title::after{content:"\2212"}
.ccec-area__grid{display:grid;grid-template-columns:1fr;gap:10px;padding:10px 18px 18px}

/* Card prodotto */
.ccec-product{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1.5px solid var(--ccec-line);border-radius:12px;cursor:pointer;transition:border-color .15s,background .15s}
.ccec-product:hover{border-color:#c7d2fe}
.ccec-product.is-selected{border-color:var(--ccec-accent);background:#eff4ff}
.ccec-product__check{width:20px;height:20px;accent-color:var(--ccec-accent);flex:0 0 auto}
.ccec-product__name{flex:1;font-weight:600}
.ccec-product__price{font-weight:700;color:var(--ccec-accent-dark);white-space:nowrap}
.ccec-product.is-onrequest .ccec-product__price{color:var(--ccec-muted);font-weight:600;font-style:italic}

/* Campi */
.ccec-grid2{display:flex;flex-wrap:wrap;gap:14px}
.ccec-field{display:flex;flex-direction:column;gap:6px;flex:1 1 calc(50% - 7px);min-width:220px}
.ccec-field--wide{flex:1 1 100%}
.ccec-field span{font-size:13px;font-weight:600;color:var(--ccec-muted)}
.ccec-field input{padding:11px 13px;border:1.5px solid var(--ccec-line);border-radius:10px;font-size:15px;width:100%}
.ccec-field input:focus{outline:none;border-color:var(--ccec-accent);box-shadow:0 0 0 3px rgba(30,91,214,.12)}
.ccec-subhead{margin:24px 0 12px;font-size:1.05rem}

.ccec-check{display:flex;gap:10px;align-items:flex-start;margin:18px 0;font-size:14px}
.ccec-check input{margin-top:3px;accent-color:var(--ccec-accent)}

.ccec-error{color:#dc2626;font-size:13px;font-style:normal;min-height:1em;display:block;margin-top:2px}

/* Nav / bottoni */
.ccec-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:24px}
.ccec-btn{appearance:none;border:1.5px solid var(--ccec-line);background:#fff;color:var(--ccec-ink);padding:12px 22px;border-radius:10px;font-size:15px;font-weight:600;cursor:pointer}
.ccec-btn:hover{border-color:var(--ccec-muted)}
.ccec-btn--primary{background:var(--ccec-accent);border-color:var(--ccec-accent);color:#fff;margin-left:auto}
.ccec-btn--primary:hover{background:var(--ccec-accent-dark);border-color:var(--ccec-accent-dark)}
.ccec-cart-total{font-size:14px;color:var(--ccec-muted)}
.ccec-cart-total strong{color:var(--ccec-ink);font-size:18px}

/* Riepilogo */
.ccec-summary{border:1px solid var(--ccec-line);border-radius:var(--ccec-radius);padding:18px;background:var(--ccec-bg)}
.ccec-summary__items{list-style:none;margin:0 0 12px;padding:0}
.ccec-summary__items li{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed var(--ccec-line)}
.ccec-summary__total{font-size:17px;margin:12px 0 0}
.ccec-summary__cust{color:var(--ccec-muted);font-size:14px;margin:6px 0 0}
.ccec-status{margin-top:12px;font-size:14px;color:var(--ccec-accent-dark)}
.ccec-status--error{color:#dc2626}

/* Conferma */
.ccec-done{max-width:640px;margin:0 auto;padding:28px;border:1px solid var(--ccec-line);border-radius:var(--ccec-radius);background:#fff}
.ccec-done h2{margin:0 0 8px}
.ccec-done__items{margin:12px 0;padding-left:18px}

/* --------------------------------------------------------------------- *
 * Integrazione col layout /inizia (tema: main.cc-signup-app__main).
 * Il contenitore del tema e' display:grid con place-items:center, che
 * (justify-items:center) impedisce al checkout di prendere la larghezza
 * piena e lo centra verticalmente: la griglia dei campi collassa e lo
 * stepper "balla" tra gli step. Riportiamo il blocco ad ancoraggio in alto
 * e larghezza piena, senza toccare il tema ne' il vecchio form .cc-form.
 * --------------------------------------------------------------------- */
.cc-signup-app__main > .ccec-checkout{justify-self:stretch;align-self:start;width:100%}
/* Hardening: layout dei campi a prova di conflitti col tema. Flex-wrap invece
   di grid: due campi per riga, i campi larghi su riga intera, nessuna cella vuota;
   min-width + wrap danno il collasso a una sola colonna sui viewport stretti. */
#ccec-checkout .ccec-grid2{display:flex;flex-wrap:wrap;gap:14px}
#ccec-checkout .ccec-grid2 > .ccec-field{flex:1 1 calc(50% - 7px);min-width:220px;grid-column:auto}
#ccec-checkout .ccec-grid2 > .ccec-field--wide{flex:1 1 100%}
#ccec-checkout .ccec-field input{width:100%;max-width:none}

@media (max-width:600px){#ccec-checkout .ccec-grid2 > .ccec-field,#ccec-checkout .ccec-grid2 > .ccec-field--wide{flex-basis:100%}.ccec-nav{flex-wrap:wrap}}