/* ==========================================================================
   CLICK RENTAL CAR — CHECKOUT STYLES
   
   Indice:
   01. Layout Principale
   02. Step Headers (01, 02, 03)
   03. Dashboard Sections (Box Scuri)
   04. Form: Griglia Campi & Colonne
   05. Form: Input, Select, Textarea, Label
   06. Order Review Ticket (Sticky)
   07. Ticket: Nome Auto & Meta Breakdown
   08. Promo Code
   09. Payment Terminal
   10. Order Notes
   11. Docs Upload Section
   12. Progress Bar
   13. Messaggi WooCommerce
   14. Responsive
   ========================================================================== */


/* ==========================================================================
   01. LAYOUT PRINCIPALE
   ========================================================================== */

.woocommerce-checkout {
    padding-top: 40px;
    padding-bottom: 100px;
}

.crc-ultimate-checkout {
    max-width: var(--container-max);
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
}

.crc-checkout-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 550px; 
    overflow: visible;
    gap: 60px;
    align-items: start;
    width: 100%;
}

.wcr-extra-driver-details .select2-container {
    width: 100% !important;
    max-width: 100% !important;
}

.crc-checkout-column-left {
    min-width: 0;
    width: 100%;
}

.crc-checkout-column-left > div {
    margin: 0 0 60px 0;
}

/* Fix specifico: wcr-extra-driver-details non deve rompere il flow */
.wcr-extra-driver-details {
    overflow: visible !important;
    width: 100%;
    box-sizing: border-box;
}

/* ==========================================================================
   02. STEP HEADERS (01, 02, 03)
   ========================================================================== */

.crc-checkout-step-header {
    display: flex;
    align-items: center;
    gap: 20px;
}

.crc-checkout-step-header .step-num {
    background: var(--primary);
    color: var(--white);
    font-size: 20px;
    font-weight: 900;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 8px 15px rgba(0, 50, 113, 0.2);
}

.crc-checkout-step-header h2 {
    font-size: 28px;
    font-weight: 900;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: -1px;
    color: var(--dark);
}

.crc-checkout-step-header p {
    margin: 3px 0 0;
    font-size: 14px;
    color: var(--gray);
}

/* Variante per sfondo scuro */
.crc-checkout-step-header.alt .step-num {
    background: var(--yellow);
    color: var(--dark);
}

.crc-checkout-step-header.alt h2 {
    color: var(--white);
}

#payment {
    margin: 25px 0 0 0;
}

/* ==========================================================================
   03. DASHBOARD SECTIONS (Box Scuri)
   ========================================================================== */

.woocommerce-billing-fields > div,
.custom-box-checkout,
.wcr-checkout-docs-section,
.crc-payment-terminal-wrapper {
    background: #121212 !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-left: 4px solid var(--yellow) !important;
    padding: 40px !important;
    border-radius: 0 30px 30px 0 !important;
    position: relative;
    overflow: hidden;
    box-shadow:
        20px 20px 60px rgba(0, 0, 0, 0.3),
        inset 0 0 20px rgba(0, 50, 113, 0.1) !important;
}

/* Texture di sfondo a punti nell'angolo */
.woocommerce-billing-fields > div::before,
.custom-box-checkout::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 150px;
    height: 150px;
    background-image: radial-gradient(var(--primary) 1px, transparent 1px);
    background-size: 15px 15px;
    opacity: 0.1;
    pointer-events: none;
}

/* Etichetta tecnica nell'angolo superiore destro */
.woocommerce-billing-fields > div::after,
.custom-box-checkout::after {
    content: 'CRC_TASK_0' + attr(data-step);
    position: absolute;
    top: 15px;
    right: 25px;
    font-family: monospace;
    font-size: 9px;
    color: var(--primary);
    letter-spacing: 2px;
    opacity: 0.5;
}

/* Titoli h3 interni ai box */
.crc-checkout-section h3,
.custom-box-checkout h3 {
    font-size: 14px !important;
    font-weight: 900 !important;
    letter-spacing: 2px !important;
    color: var(--white) !important;
    text-transform: uppercase;
    margin-bottom: 25px !important;
    display: flex;
    align-items: center;
    gap: 10px;
}

.crc-checkout-section h3::before {
    content: '';
    width: 8px;
    height: 8px;
    background: var(--yellow);
    border-radius: 50%;
    box-shadow: 0 0 10px var(--yellow);
    flex-shrink: 0;
}

/* Fix per il terminale di pagamento nella colonna sinistra */
.crc-checkout-column-left .crc-payment-terminal-wrapper {
    background: var(--dark);
    padding: 40px !important;
    border-radius: 40px;
    margin-bottom: 50px;
}

/* Separatore luminoso tra sezioni */
.crc-separator-glow {
    height: 1px;
    width: 100%;
    background: linear-gradient(to right, transparent, rgba(255, 215, 0, 0.2), transparent);
    margin: 40px 0;
}


/* ==========================================================================
   04. FORM: GRIGLIA CAMPI & COLONNE
   ========================================================================== */

/* Griglia a 12 colonne per i campi billing */
.woocommerce-billing-fields__field-wrapper {
    display: grid !important;
    grid-template-columns: repeat(12, 1fr) !important;
    gap: 15px !important;
}

/* Reset float WooCommerce */
.woocommerce-checkout .form-row,
.woocommerce-checkout .form-row.crc-col-half {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    margin-right: 0 !important;
}

/* Wrapper campi billing */
.woocommerce-billing-fields > div {
    padding: 20px;
    background: #fff;
    border-radius: var(--wcr-radius-lg);
    border: 1px solid var(--wcr-border);
}

/* Step header dentro la griglia: occupa tutte le 12 colonne */
.woocommerce-billing-fields__field-wrapper .crc-checkout-step-header.crc-col-full {
    grid-column: span 12 !important;
    display: flex !important;
    align-items: center;
    gap: 20px;
}


/* Classi larghezza colonne */
.crc-col-full    { grid-column: span 12 !important; }
.crc-col-70      { grid-column: span 8  !important; }
.crc-col-half    { grid-column: span 6  !important; }
.crc-col-third   { grid-column: span 4  !important; }
.crc-col-30      { grid-column: span 4  !important; }

/* Forza Email e Telefono a stare affiancati senza clear */
#billing_email_field, 
#billing_phone_field {
    clear: none !important;
}

/* Rimuove lo spazio per la scritta opzionale se presente */
.wcr-field-azienda .optional {
    display: none !important;
}


/* ==========================================================================
   05. FORM: INPUT, SELECT, TEXTAREA, LABEL
   ========================================================================== */

/* Input base */
.crc-ultimate-checkout input.input-text,
.crc-ultimate-checkout select,
.crc-ultimate-checkout textarea,
.select2-container--default .select2-selection--single {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: rgba(255, 255, 255, 0.6) !important;
    border-radius: 12px !important;
    padding: 15px 20px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    width: 100% !important;
    height: 50px !important;
    transition: all 0.2s ease !important;
    box-shadow: none !important;
    outline: none !important;
}

.crc-ultimate-checkout textarea {
    height: 120px !important;
}

/* Focus */
.crc-ultimate-checkout input.input-text:focus,
.crc-ultimate-checkout select:focus,
.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--yellow) !important;
    background: rgba(255, 215, 0, 0.05) !important;
    box-shadow: 0 0 20px rgba(255, 215, 0, 0.1) !important;
}

/* Label */
.woocommerce-checkout label {
    color: var(--gray) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px;
    gap: 5px;
}

/* Label no wrap dentro la griglia */
.woocommerce-billing-fields__field-wrapper label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 5px 0;
}

/* Label principale (doc upload) */
.wcr-main-label {
    color: #fff;
}

.cockpit-card.accent-card .label {
    color: var(--dark) !important;
}

/* Box Spiegazione Carta di Credito */
.wcr-cc-explanation {
    background: rgba(255, 215, 0, 0.05); /* Sfondo leggermente giallo */
    border: 1px dashed rgba(255, 215, 0, 0.3);
    padding: 20px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
}

.wcr-cc-explanation i {
    font-size: 30px;
    color: var(--yellow);
    width: 30px;
    height: 30px;
}

.wcr-cc-explanation strong {
    display: block;
    color: #fff;
    text-transform: uppercase;
    font-size: 13px;
    margin-bottom: 4px;
    letter-spacing: 1px;
}

.wcr-cc-explanation p {
    margin: 0;
    color: rgba(255, 255, 255, 0.6);
    font-size: 12px;
    line-height: 1.4;
}

/* Evidenziazione campi carta quando errati */
.woocommerce-invalid #wcr_cc_number,
.woocommerce-invalid #wcr_cc_expiry,
.woocommerce-invalid #wcr_cc_cvv {
    border-color: var(--red) !important;
}

/* Box Spiegazione Garanzia */
.wcr-cc-explanation {
    background: rgba(255, 215, 0, 0.08) !important;
    border: 1px dashed var(--yellow) !important;
    padding: 25px !important;
    border-radius: 15px !important;
    display: flex !important;
    align-items: center;
    gap: 15px;
    margin-bottom: 25px;
    border-left: 4px solid var(--yellow) !important;
}

.wcr-cc-explanation .dashicons {
    color: var(--yellow);
    font-size: 30px;
    width: 30px;
    height: 30px;
}

.wcr-cc-explanation strong { color: #fff; text-transform: uppercase; font-size: 13px; display: block; margin-bottom: 5px; }
.wcr-cc-explanation p { margin: 0; color: rgba(255,255,255,0.7); font-size: 12px; line-height: 1.4; }

/* Errore label */
.crc-error-label {
    color: #ff4d4d;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    margin-top: 8px;
    display: block;
    letter-spacing: 1px;
}

/* Icona rotante per il pulsante */
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
.spin { animation: spin 1s linear infinite; display: inline-block; }

/* ==========================================================================
   06. ORDER REVIEW TICKET (STICKY)
   ========================================================================== */


/* Riga Coupon */
table.crc-checkout-ticket tfoot tr.cart-discount {
    background: rgba(16, 185, 129, 0.05); /* Leggero tocco verde */
    border-radius: 10px;
}

table.crc-checkout-ticket tfoot tr.cart-discount th {
    color: rgba(255, 255, 255, 0.7);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding-left: 15px !important;
}

table.crc-checkout-ticket tfoot tr.cart-discount td {
    text-align: right !important;
    padding-right: 15px !important;
    color: #10b981 !important; /* Verde per lo sconto */
    font-weight: 800;
    font-size: 15px;
}

/* Tasto Rimuovi Coupon [Elimina] */
.woocommerce-remove-coupon {
    display: inline-block;
    margin-left: 10px;
    color: #ff4d4d !important; /* Rosso */
    text-transform: uppercase;
    font-size: 9px;
    font-weight: 900;
    text-decoration: none !important;
    background: rgba(255, 77, 77, 0.1);
    padding: 2px 6px;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.woocommerce-remove-coupon:hover {
    background: #ff4d4d;
    color: #fff !important;
}


.crc-sticky-order-review {
    position: sticky;
    top: 130px;
    background: var(--dark) !important;
    padding: 40px !important;
    border-radius: 40px !important;
    box-shadow: var(--shadow-premium) !important;
    color: var(--white) !important;
}

/* Tabella riepilogo */
table.crc-checkout-ticket {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
    border: none !important;
    margin: 0 !important;
}

table.crc-checkout-ticket thead {
    display: none;
}

/* Righe prodotto */
table.crc-checkout-ticket tbody tr.cart_item {
    background: rgba(255, 255, 255, 0.03) !important;
    transition: all 0.3s ease;
}

table.crc-checkout-ticket tbody tr.cart_item:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}

table.crc-checkout-ticket tr td {
    padding: 20px 15px !important;
    background: #003271 36 !important;
    border: none !important;
    text-align: left !important;
    color: var(--white) !important;
    vertical-align: top;
}

/* Accent line a sinistra del prodotto */
table.crc-checkout-ticket .product-name {
    border-left: 3px solid var(--yellow) !important;
}

/* Prezzo */
table.crc-checkout-ticket td.product-total {
    text-align: right !important;
    font-weight: 900;
    color: var(--yellow);
    font-size: 18px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

/* Footer totali */
table.crc-checkout-ticket tfoot tr.order-total th,
table.crc-checkout-ticket tfoot tr.order-total td {
    padding-top: 30px !important;
    background: transparent !important;
}

table.crc-checkout-ticket tfoot tr.order-total th strong {
    font-size: 14px;
    text-transform: uppercase;
    color: var(--yellow);
    display: block;
    letter-spacing: 1px;
}

table.crc-checkout-ticket tfoot tr.order-total th small {
    font-size: 11px;
    color: var(--gray);
    font-weight: 400;
}

/* Forza il contenitore del totale ad allineare i blocchi verticalmente */
table.crc-checkout-ticket tfoot tr.order-total td {
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* Allinea tutto a destra essendo un ticket */
    line-height: 1.2 !important; /* Regola l'interlinea per non sovrapporre i testi */
}

/* Gestione della dicitura IVA (il tag <small>) */
table.crc-checkout-ticket tfoot tr.order-total td small.includes_tax {
    display: block; /* Lo manda a capo */
    font-size: 12px !important; /* Dimensione più piccola per eleganza */
    font-weight: 600;
    color: var(--gray) !important; /* Colore grigio come da tuo design */
    margin-top: 8px; /* Spazio tra il prezzo gigante e l'IVA */
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Assicurati che il prezzo principale non abbia margini che disturbano */
table.crc-checkout-ticket tfoot tr.order-total td strong {
    display: block;
}


/* Compatibilità WooCommerce standard */
.woocommerce-checkout-review-order-table { width: 100% !important; }

.product-name  { font-weight: 700; color: var(--white); font-size: 16px; }
.product-total { text-align: right; color: var(--yellow); font-weight: 900; font-size: 18px; }

.order-total th { font-size: 14px; text-transform: uppercase; color: var(--gray); }
.order-total td { font-size: 36px; font-weight: 900; color: var(--yellow) !important; text-align: right; }

.order-total .woocommerce-Price-amount {
    font-size: 35px;
    color: var(--yellow);
}

.order-total small,
.order-total small .woocommerce-Price-amount {
    font-size: 15px;
    color: var(--gray);
    font-weight: 400;
}

/* Nasconde #payment e place_order dalla colonna riepilogo (gestiti separatamente) */
.crc-sticky-order-review #payment,
.crc-sticky-order-review #place_order,
.crc-sticky-order-review .woocommerce-terms-and-conditions-wrapper {
    display: none !important;
}


/* ==========================================================================
   07. TICKET: NOME AUTO & META BREAKDOWN
   ========================================================================== */

.crc-item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.crc-car-name {
    font-size: 20px !important;
    font-weight: 900 !important;
    color: var(--yellow) !important;
    text-transform: uppercase;
    display: block;
    margin-bottom: 8px;
}

.crc-item-total-price {
    font-size: 20px;
    font-weight: 900;
    color: var(--white);
}

/* Variation breakdown (griglia label/valore) */
.crc-rental-meta dl.variation {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 8px 20px;
    margin: 15px 0 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    padding-top: 10px;
}

.crc-rental-meta dl.variation dt {
    font-size: 13px !important;
    color: rgba(255, 255, 255, 0.6) !important;
    font-weight: 500 !important;
    text-transform: none !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    gap: 8px;
}

.crc-rental-meta dl.variation dd {
    font-size: 13px !important;
    color: rgba(255, 255, 255, 0.6) !important;
    text-align: right;
    font-weight: 700 !important;
    margin: 0 !important;
}

.crc-rental-meta dl.variation dd p {
    margin: 0 !important;
    display: inline-block;
}

/* Meta label/value generici */
.wcr-meta-label {
    font-size: 12px !important;
    color: rgba(255, 255, 255, 0.5) !important;
    font-weight: 500 !important;
    text-transform: none !important;
}

.wcr-meta-value {
    font-size: 12px !important;
    color: var(--white) !important;
    text-align: right;
    font-weight: 700 !important;
    margin: 0 !important;
}

/* Cauzione */
dt.variation-DepositoCauzione,
dd.variation-DepositoCauzione,
.wcr-meta-label[name*="Deposito"],
.wcr-meta-value:has(strong) {
    color: var(--yellow) !important;
    border-top: 1px dashed rgba(255, 215, 0, 0.2);
    padding-top: 5px;
    margin-top: 5px !important;
}

/* Emoji inline */
.crc-rental-meta .emoji {
    width: 14px !important;
    height: 14px !important;
    vertical-align: middle;
}

/* Rimuove titoli duplicati del plugin docs */

.wcr-manual-docs-wrapper .wcr-step-number {
    background: var(--yellow);
    color: var(--dark);
}


/* ==========================================================================
   08. PROMO CODE
   ========================================================================== */

.crc-promo-code-section {
    margin: 25px 0;
    padding-bottom: 25px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.crc-coupon-wrapper {
    margin: 20px 0;
}

.crc-coupon-inner {
    display: flex;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 10px;
    gap: 10px;
}

.crc-coupon-input {
    background: transparent !important;
    border: none !important;
    color: #fff !important;
    height: 40px !important;
    font-size: 14px !important;
    text-transform: uppercase;
    flex-grow: 1;
}

.crc-coupon-btn {
    background: var(--yellow) !important;
    color: var(--dark) !important;
    border-radius: 8px !important;
    border: none;
    cursor: pointer;
    padding: 0 15px !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    text-transform: uppercase;
}


/* ==========================================================================
   09. PAYMENT TERMINAL
   ========================================================================== */

/* Wrapper principale */
.crc-payment-terminal-wrapper {
    grid-column: span 2;
    background: #0f0f0f !important;
    padding: 40px !important;
    border-radius: 30px !important;
    border: 1px solid rgba(255, 215, 0, 0.1) !important;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.4) !important;
    margin-top: 40px;
}

/* Lista metodi */
#payment ul.payment_methods {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

#payment ul.payment_methods li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Label metodo */
#payment ul.payment_methods li label {
    background: rgba(255, 255, 255, 0.02) !important;
    border: 2px solid rgba(255, 255, 255, 0.05) !important;
    padding: 15px 25px !important;
    border-radius: 12px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    color: rgba(255, 255, 255, 0.7) !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

/* Pallino radio custom */
#payment ul.payment_methods li label::before {
    content: '';
    width: 12px;
    height: 12px;
    border: 2px solid #444;
    border-radius: 50%;
    margin-right: 20px;
    flex-shrink: 0;
    transition: all 0.3s ease;
}

/* Nasconde radio originale WC */
#payment ul.payment_methods li input[type="radio"] {
    display: none !important;
}

/* Metodo selezionato */
#payment ul.payment_methods li input[type="radio"]:checked + label {
    border-color: var(--yellow) !important;
    color: #fff !important;
    padding-left: 35px !important;
}

#payment ul.payment_methods li input[type="radio"]:checked + label::before {
    background: var(--yellow);
    border-color: var(--yellow);
    box-shadow: 0 0 10px var(--yellow);
}

/* Loghi circuiti (Visa, Mastercard…) */
#payment ul.payment_methods li label img {
    max-height: 20px !important;
    margin-left: auto !important;
    filter: grayscale(1) brightness(2);
    opacity: 0.6;
}

#payment ul.payment_methods li input[type="radio"]:checked + label img {
    filter: grayscale(0) brightness(1);
    opacity: 1;
}

/* Box descrizione metodo */
#payment div.payment_box {
    background: #1a1a1a !important;
    color: #aaa !important;
    padding: 20px !important;
    border-radius: 0 0 12px 12px !important;
    margin-top: -10px !important;
    margin-bottom: 15px !important;
    border: 1px solid rgba(255, 215, 0, 0.1) !important;
    border-top: none !important;
    font-size: 13px !important;
    line-height: 1.6;
    animation: slideDownPayment 0.4s ease forwards;
}

@keyframes slideDownPayment {
    from { opacity: 0; transform: translateY(-10px); }
    to   { opacity: 1; transform: translateY(0); }
}


/* Sezione pagamento standalone (sotto il riepilogo) */
.crc-standalone-payment-section {
    margin-top: 30px;
    background: var(--dark) !important;
    padding: 40px !important;
    border-radius: 40px !important;
    box-shadow: var(--shadow-premium) !important;
    color: var(--white) !important;
    border: 1px solid rgba(255, 215, 0, 0.1);
    position: relative;
}

.crc-standalone-payment-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255, 215, 0, 0.03) 1px, transparent 1px);
    background-size: 20px 20px;
    pointer-events: none;
    border-radius: 40px;
}

.crc-standalone-payment-section ul.payment_methods {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 0 !important;
    list-style: none !important;
    margin: 20px 0 !important;
}

#place_order {
    display: block !important;
    width: 100% !important;
    margin-top: 25px !important;
    background: linear-gradient(135deg, var(--yellow) 0%, #e6c200 100%) !important;
    color: var(--dark) !important;
    height: 75px !important; /* Leggermente più alto per importanza */
    border-radius: 20px !important;
    font-weight: 900 !important;
    font-size: 20px !important;
    text-transform: uppercase;
    letter-spacing: 3px;
    border: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
    box-shadow: 0 10px 30px rgba(255, 215, 0, 0.2), inset 0 -4px 0 rgba(0,0,0,0.1) !important;
    animation: ignition-pulse 2s infinite;
}

/* Riflesso "Carrozzeria" che attraversa il pulsante */
#place_order::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -150%;
    width: 50%;
    height: 200%;
    background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.6), transparent);
    transform: rotate(30deg);
    transition: none;
}

#place_order:hover::after {
    left: 150%;
    transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1);
}

#place_order:hover {
    transform: translateY(-5px) scale(1.01) !important;
    background: #fff !important; /* Diventa bianco puro al passaggio */
    color: var(--primary) !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4), 0 0 20px rgba(255, 215, 0, 0.4) !important;
    letter-spacing: 4px; /* Espansione tipografica */
}

#place_order:active {
    transform: translateY(2px) scale(0.98) !important;
}

/* Animazione Pulsazione Energetica */
@keyframes ignition-pulse {
    0% { box-shadow: 0 10px 30px rgba(255, 215, 0, 0.2), 0 0 0 0 rgba(255, 215, 0, 0.4); }
    70% { box-shadow: 0 10px 30px rgba(255, 215, 0, 0.2), 0 0 0 20px rgba(255, 215, 0, 0); }
    100% { box-shadow: 0 10px 30px rgba(255, 215, 0, 0.2), 0 0 0 0 rgba(255, 215, 0, 0); }
}

/* Stato Caricamento (Quando WooCommerce elabora l'ordine) */
#place_order.processing {
    background: var(--dark) !important;
    color: var(--yellow) !important;
    pointer-events: none;
}


/* ==========================================================================
   10. ORDER NOTES
   ========================================================================== */

.crc-order-notes-area {
    margin-bottom: 50px;
}

.crc-order-notes-area textarea#order_comments {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 2px solid rgba(255, 255, 255, 0.08) !important;
    color: var(--white) !important;
    border-radius: 20px !important;
    padding: 25px !important;
    font-size: 16px !important;
    min-height: 150px !important;
    transition: all 0.3s ease !important;
}

.crc-order-notes-area textarea#order_comments:focus {
    border-color: var(--yellow) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    box-shadow: 0 0 20px rgba(255, 215, 0, 0.1) !important;
}

.crc-order-notes-area label {
    display: none;
}

/* Box note custom (bianco) */
.custom-box-checkout {
    background: #fff;
    padding: 25px;
    border-radius: 20px;
    border: 1px solid #eee;
    margin: 20px 0;
}

.custom-box-checkout textarea {
    min-height: 100px !important;
}

/* Box note con override dark (quando dentro .crc-order-notes-area) */
.crc-order-notes-area.custom-box-checkout {
    background: #fff;
    padding: 30px;
    border-radius: 25px;
    border: 1px solid #e2e8f0;
}

#order_comments_field {
    margin: 20px 0!important;
}


/* ==========================================================================
   11. DOCS UPLOAD SECTION
   ========================================================================== */

.wcr-checkout-docs-section {
    margin: 40px 0;
}

/* Griglia upload */
.wcr-upload-grid {
    display: grid;
    /* Riduciamo il minimo da 200px a 150px per dare più respiro alla colonna */
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 15px;
    margin-top: 20px;
    width: 100%;
}

/* Singola box upload */
.wcr-upload-box {
    position: relative;
    background: #1a1a1a;
    border: 2px dashed #333;
    border-radius: 20px;
    padding: 30px 20px;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    overflow: hidden;
}

.wcr-upload-box .upload-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    pointer-events: none;
}

.wcr-upload-box .dashicons {
    font-size: 36px;
    width: 36px;
    height: 36px;
    color: #444;
    transition: all 0.3s ease;
}

.wcr-upload-box strong {
    color: #ffffff;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: 1.3;
}

.wcr-upload-box .file-limit-info {
    font-size: 10px;
    color: rgba(255, 255, 255, 0.25);
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.wcr-upload-box .file-status {
    font-size: 11px;
    color: rgba(255, 255, 255, 0.35);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 5px;
    transition: color 0.3s ease;
}

/* Input file invisibile, cliccabile su tutta la box */
.wcr-upload-box input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

.wcr-upload-box input[type="hidden"] {
    display: none;
}

/* Stato: Hover */
.wcr-upload-box:hover {
    border-color: rgba(255, 215, 0, 0.4);
    background: #222;
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.wcr-upload-box:hover .dashicons {
    color: var(--yellow);
    filter: drop-shadow(0 0 8px rgba(255, 215, 0, 0.4));
    transform: scale(1.5);
}

.wcr-upload-box:hover .file-status {
    color: var(--yellow);
}

/* Stato: Drag Over */
.wcr-upload-box.drag-over {
    border-color: var(--yellow);
    background: rgba(255, 215, 0, 0.05);
    transform: scale(1.02);
    box-shadow: 0 0 30px rgba(255, 215, 0, 0.15);
}

.wcr-upload-box.drag-over .dashicons {
    color: var(--yellow);
    filter: drop-shadow(0 0 12px rgba(255, 215, 0, 0.6));
    transform: scale(1.2);
}

/* Stato: Caricato */
.wcr-upload-box.is-uploaded {
    border-style: solid;
    border-color: #10b981;
    background: rgba(16, 185, 129, 0.05);
}

.wcr-upload-box.is-uploaded .dashicons  { color: #10b981; }
.wcr-upload-box.is-uploaded .file-status { color: #10b981; }

/* Stato: Errore */
.wcr-upload-box.has-error {
    border-color: var(--red);
    background: rgba(236, 25, 32, 0.05);
}

.wcr-upload-box.has-error .dashicons  { color: var(--red); }
.wcr-upload-box.has-error .file-status { color: var(--red); }


/* ==========================================================================
   12. PROGRESS BAR
   ========================================================================== */

.crc-checkout-progress-bar {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin: 0 auto 60px;
    max-width: 800px;
}

.crc-checkout-progress-bar .step {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 900;
    text-transform: uppercase;
    font-size: 13px;
    color: var(--gray);
    letter-spacing: 1px;
}

.crc-checkout-progress-bar .step span {
    width: 35px;
    height: 35px;
    border: 2px solid var(--gray);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.crc-checkout-progress-bar .line {
    flex-grow: 1;
    height: 2px;
    background: #e2e8f0;
}

/* Step attivo */
.crc-checkout-progress-bar .step.active {
    color: var(--primary);
}

.crc-checkout-progress-bar .step.active span {
    border-color: var(--yellow);
    background: var(--yellow);
    color: var(--dark);
    box-shadow: 0 0 15px rgba(255, 215, 0, 0.4);
}

/* Step completato */
.crc-checkout-progress-bar .step.completed {
    color: #10b981;
}

.crc-checkout-progress-bar .step.completed span {
    border-color: #10b981;
    background: #10b981;
    color: #fff;
}


/* ==========================================================================
   13. MESSAGGI WOOCOMMERCE
   ========================================================================== */

.woocommerce-message {
    display: none !important;
}

.woocommerce-error {
    display: block !important;
    background: #fff5f5 !important;
    border-left: 5px solid var(--red) !important;
    color: #c53030 !important;
    border-radius: 15px !important;
    padding: 20px 30px !important;
    font-weight: 700 !important;
    margin-bottom: 30px !important;
    list-style: decimal !important;
}

.woocommerce-privacy-policy-text {
    color: #888;
    font-size: 12px;
}


/* 
 * SILENT CHECKOUT LOADER 
 * Rende l'overlay di blocco invisibile per un'esperienza più fluida
 */
.blockUI.blockOverlay {
    background: transparent !important;
    backdrop-filter: none !important;
    border: none !important;
    opacity: 0 !important;
}

/* Nasconde il messaggio e lo spinner standard di WooCommerce */
.blockUI.blockMsg.blockElement {
    display: none !important;
}

/* --- CHECKOUT BREAKDOWN SECTIONS --- */
.wcr-checkout-breakdown {
    margin-top: 15px;
}

/* BREAKDOWN LABELS (Stile Prodotto) */
.wcr-checkout-section-label {
    display: block;
    font-size: 10px !important;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--yellow); /* Oro come nel prodotto */
    letter-spacing: 1.5px;
    margin: 18px 0 8px 0;
    padding-bottom: 5px;
}

.wcr-checkout-section-label.cauzione-label {
    color: #fff;
    border-bottom-color: rgba(255, 215, 0, 0.3);
}


/* Sincronizzazione icone e variazioni */
.crc-rental-meta dl.variation {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 6px 15px;
    margin-bottom: 10px !important;
}

.crc-rental-meta dl.variation dt {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 12px !important;
    display: flex;
    align-items: center;
    gap: 6px;
}

.crc-rental-meta dl.variation dd {
    color: #fff !important;
    font-size: 12px !important;
    text-align: right;
    font-weight: 700;
}


/* Icone nel checkout */
.wcr-cart-icon svg {
    width: 14px !important;
    height: 14px !important;
    vertical-align: middle;
}

/* Tasti Azione */
.btn-edit-ticket, .btn-remove-ticket {
    transition: all 0.3s ease;
}

.btn-edit-ticket:hover {
    background: var(--yellow) !important;
    transform: translateY(-2px);
}

.btn-remove-ticket:hover {
    background: var(--red) !important;
    color: #fff !important;
    transform: translateY(-2px);
}

/* ==========================================================================
   UNIFIED TERMS & PRIVACY STYLING (Cockpit - No Flex Version)
   ========================================================================== */

/* 1. Il Contenitore Esterno */
.wcr-terms-acceptance-wrapper,
.woocommerce-terms-and-conditions-wrapper {
    margin: 20px 0 !important;
    padding: 25px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border-radius: 20px !important;
    border: 1px solid rgba(255, 215, 0, 0.15) !important;
    box-shadow: inset 0 0 20px rgba(0,0,0,0.2) !important;
    clear: both;
}

/* Reset del paragrafo e dello span di WooCommerce */
.wcr-terms-acceptance-wrapper p.form-row,
.wcr-terms-acceptance-wrapper span.woocommerce-input-wrapper {
    margin: 0 !important;
    display: block !important;
    background: transparent !important;
}

/* 2. Il Label (Il blocco di testo) */
.wcr-terms-acceptance-wrapper .woocommerce-form__label {
    display: block !important;
    position: relative !important; /* Fondamentale per posizionare la checkbox */
    padding-left: 35px !important; /* Crea lo spazio a sinistra per la checkbox */
    color: #ffffff !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    cursor: pointer;
    text-transform: none !important;
    text-align: left !important; /* Tutto il testo a sinistra */
    font-weight: 500 !important;
}

/* 3. La Checkbox (Posizionata precisamente a sinistra del testo) */
.wcr-terms-acceptance-wrapper input[type="checkbox"] {
    position: absolute !important;
    left: 0 !important;
    top: 2px !important; /* Allineamento millimetrico con la prima riga di testo */
    width: 20px !important;
    height: 20px !important;
    margin: 0 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background: #111 !important;
    border: 2px solid #444 !important;
    border-radius: 6px !important;
    cursor: pointer;
    z-index: 1;
}

/* Checkbox quando è selezionata */
.wcr-terms-acceptance-wrapper input[type="checkbox"]:checked {
    background: var(--yellow) !important;
    border-color: var(--yellow) !important;
}

/* Icona spunta (V) */
.wcr-terms-acceptance-wrapper input[type="checkbox"]:checked::after {
    content: '✓';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: var(--dark);
    font-weight: 900;
    font-size: 12px;
}

/* 4. Link e asterisco */
.wcr-terms-acceptance-wrapper a {
    color: var(--yellow) !important;
    text-decoration: underline !important;
    font-weight: 700;
}

.wcr-terms-acceptance-wrapper .required {
    color: var(--red) !important;
    text-decoration: none !important;
    display: inline-block;
}

/* Stato Errore (Bordo Rosso) */
.wcr-terms-acceptance-wrapper.woocommerce-invalid {
    border-color: #ec1920 !important;
    background: rgba(236, 25, 32, 0.05) !important;
}
.woocommerce-validated label::after {
    content: ' ✓';
    color: #10b981;
    font-weight: bold;
}

.woocommerce-checkout .form-row .description {
    font-size: 9px !important;
    color: rgba(255,255,255,0.3) !important;
    text-transform: uppercase;
    margin-top: 5px;
    display: block;
}

/* --- SISTEMA VALIDAZIONE PREMIUM --- */

/* Stato Neutro / Default */
.crc-ultimate-checkout .form-row input.input-text {
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Stato Valido (Verde Racing) */
.woocommerce-checkout .form-row.woocommerce-validated input.input-text,
.woocommerce-checkout .form-row.woocommerce-validated select,
.woocommerce-checkout .form-row.woocommerce-validated .select2-selection--single {
    border-color: #10b981 !important;
    background: rgba(16, 185, 129, 0.03) !important;
    box-shadow: 0 0 10px rgba(16, 185, 129, 0.1) !important;
}

/* Aggiunta icona check su campi validati */
.woocommerce-checkout .form-row.woocommerce-validated label::after {
    content: ' \f147';
    font-family: dashicons;
    color: #10b981;
    font-size: 14px;
    vertical-align: middle;
    margin-left: 5px;
    animation: crcPopIn 0.3s ease;
}

/* Stato Errore (Rosso Racing) */
.woocommerce-checkout .form-row.woocommerce-invalid input.input-text,
.woocommerce-checkout .form-row.woocommerce-invalid select,
.woocommerce-checkout .form-row.woocommerce-invalid .select2-selection--single,
.wcr-upload-box.has-error {
    border-color: #ec1920 !important;
    background: rgba(236, 25, 32, 0.03) !important;
    box-shadow: 0 0 15px rgba(236, 25, 32, 0.15) !important;
}

/* Forza il testo dell'errore ad essere sotto il campo */
.crc-error-label {
    color: #ec1920;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 8px;
    display: block;
    animation: crcFadeInDown 0.3s ease;
}

/* Correzione specifica per il blocco Termini */
#wcr_terms_section {
    transition: all 0.3s ease;
    border: 1px solid rgba(255, 215, 0, 0.15); /* Bordo default sottile */
}

/* Stato Errore sul contenitore principale */
#wcr_terms_section.woocommerce-invalid {
    border: 2px solid #ec1920 !important;
    background: rgba(236, 25, 32, 0.05) !important;
    box-shadow: 0 0 20px rgba(236, 25, 32, 0.2) !important;
}

/* Stato Valido sul contenitore principale */
#wcr_terms_section.woocommerce-validated {
    border-color: #10b981 !important;
    background: rgba(16, 185, 129, 0.03) !important;
}

/* Nascondi il bordo rosso del paragrafo interno (perché ora lo gestisce il div esterno) */
#wcr_terms_section .form-row.woocommerce-invalid {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    box-shadow: none !important;
}

@keyframes crcPopIn {
    0% { transform: scale(0); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

@keyframes crcFadeInDown {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Checkbox Errore */
.wcr-terms-acceptance-wrapper.woocommerce-invalid {
    border: 1px solid #ff4d4d !important;
    padding: 20px;
    border-radius: 15px;
}


/* Rimuove eventuali margini che creano lo spazio bianco sotto l'header */
.woocommerce-checkout {
    padding-top: 0 !important; /* Rimuoviamo il padding top se c'è la hero */
    margin-top: 0 !important;
}

.crc-hero-master {
    margin-top: 0 !important;
    top: 0;
}


/* Fix per adattare il ticket alla pagina carrello */
.crc-cart-layout {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 40px;
    align-items: start;
    margin: 0 0 80px 0;
}

@media (max-width: 991px) {
    .crc-cart-layout {
        grid-template-columns: 1fr;
    }
}

/* Layout Carrello Classico */
.crc-cart-layout {
    display: grid;
    grid-template-columns: 1fr 450px;
    gap: 50px;
    align-items: start;
}

.crc-cart-totals-sidebar .cart_totals {
    background: var(--dark);
    padding: 40px;
    border-radius: 40px;
    box-shadow: var(--shadow-premium);
}

.crc-cart-totals-sidebar .cart_totals h2,
.crc-cart-totals-sidebar .cart_totals th {
    color: var(--gray);
}

.crc-cart-totals-sidebar .checkout-button {
    display: block;
    width: 100%;
    text-align: center;
    background: var(--yellow) !important;
    color: var(--dark) !important;
    padding: 20px;
    border-radius: 15px;
    font-weight: 900;
    text-transform: uppercase;
    margin-top: 20px;
}

.wcr-item-visual-header {
    display: flex;
    gap: 10px;
    transition: all 0.3s ease;
}

.wcr-item-visual-header:hover {
    background: rgba(255,255,255,0.05) !important;
    border-color: var(--yellow) !important;
}

.wcr-item-thumb {
    flex: 0 0 120px;
    height: 65px;
    border-radius: 12px; overflow: hidden; display: flex;
    align-items: center; justify-content: center;
}

.wcr-item-thumb img {
    transform: scale(1.1); /* Leggero zoom per far risaltare l'auto */
    transition: transform 0.4s ease;
}

.wcr-item-visual-header:hover img {
    transform: scale(1.2);
}

.wcr-item-brief span:last-child {
    letter-spacing: -0.5px;
    line-height: 1.1;
    display: block;
}

/* Unificazione look Ticket Carrello e Checkout */
.crc-cart-item-card, .crc-ticket-item {
    background: var(--dark) !important;
    padding: 30px !important;
    border-radius: 30px !important;
    color: var(--white) !important;
    box-shadow: var(--shadow-premium) !important;
}

/* Stile per la riga del totale finale dell'item */
.wcr-item-final-total {
    position: relative;
    overflow: hidden;
}

.wcr-item-final-total::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 4px; height: 100%;
    background: var(--yellow);
}

/* Azioni ticket nel carrello */
.btn-edit-ticket:hover {
    background: var(--yellow) !important;
    transform: translateY(-2px);
}

.btn-remove-ticket:hover {
    background: var(--red) !important;
    color: #fff !important;
    transform: translateY(-2px);
}


/* ==========================================================================
   WCR TICKET ACTIONS - CSS SPECIFICO
   ========================================================================== */

/* Contenitore a griglia per affiancare i tasti */
.wcr-item-actions-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    margin-top: 20px !important;
    width: 100% !important;
}

/* Stile base dei pulsanti */
.wcr-item-actions-grid .btn-ticket {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 42px !important; /* Altezza fissa per allineamento perfetto */
    border-radius: 10px !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    text-decoration: none !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    border: none !important;
}

/* Gestione Emoji dentro il tasto Modifica */
.wcr-item-actions-grid .btn-ticket img.emoji {
    width: 14px !important;
    height: 14px !important;
    margin-right: 8px !important;
    margin-bottom: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
}

/* Tasto MODIFICA - Stile "Light" */
.wcr-item-actions-grid .btn-edit-ticket {
    background: #ffffff !important;
    color: #181818 !important;
}

.wcr-item-actions-grid .btn-edit-ticket:hover {
    background: var(--yellow) !important; /* Diventa giallo al passaggio */
    transform: translateY(-2px) !important;
    box-shadow: 0 5px 15px rgba(255, 215, 0, 0.2) !important;
}

/* Tasto ELIMINA - Stile "Warning Outline" */
.wcr-item-actions-grid .btn-remove-ticket {
    background: rgba(255, 77, 77, 0.05) !important;
    color: #ff4d4d !important;
    border: 1px solid #ff4d4d !important;
}

.wcr-item-actions-grid .btn-remove-ticket:hover {
    background: #ff4d4d !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 5px 15px rgba(255, 77, 77, 0.3) !important;
}

/* Metadato tecnico stile Cockpit nella Thank You Page */
.wcr-auth-technical-line {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px dashed rgba(255, 255, 255, 0.1);
    display: flex;
    justify-content: space-between;
    gap: 15px;
}

.wcr-auth-technical-line .tech-id {
    font-family: monospace;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.3);
    letter-spacing: 2px;
    font-weight: 600;
}

/* Fix per Mobile: se lo spazio è troppo stretto (es. smartphone piccoli) */
@media (max-width: 380px) {
    .wcr-item-actions-grid {
        grid-template-columns: 1fr !important; /* Li mette uno sotto l'altro */
    }
}

@media (max-width: 1100px) {
    .crc-cart-layout {
        grid-template-columns: 1fr;
    }
}


/* Responsive */
@media (max-width: 1200px) {
    .crc-order-pay-wrapper {
        margin-top: -40px;
    }
}



/* Feedback sul tasto se già in fase di invio */
#place_order.processing {
    background: #fff !important;
    color: var(--primary) !important;
    opacity: 1 !important;
}

/* ==========================================================================
   FIX DEFINITIVO SELECT / DROPDOWN BIANCHI (CHECKOUT)
   ========================================================================== */

/* 1. FIX PER LE SELECT NATIVE (Quello che vede il browser prima di caricare JS) */
.crc-ultimate-checkout select option {
    background-color: #1a1a1a !important; /* Sfondo scuro */
    color: #ffffff !important;           /* Testo bianco */
}

/* 2. FIX PER SELECT2 (La libreria usata da WooCommerce) */

/* Il contenitore della tendina che appare nel corpo della pagina */
body .select2-container--default .select2-dropdown {
    background-color: #1a1a1a !important;
    border: 1px solid var(--yellow) !important;
    border-radius: 12px !important;
    z-index: 999999 !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5) !important;
}

/* Le singole voci nella lista */
body .select2-container--default .select2-results__option {
    background-color: #1a1a1a !important;
    color: rgba(255, 255, 255, 0.8) !important;
    padding: 12px 20px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    font-size: 14px !important;
}

/* L'opzione quando ci passi sopra col mouse (Hover/Highlight) */
body .select2-container--default .select2-results__option--highlighted[aria-selected],
body .select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: var(--primary) !important; /* Blu del brand */
    color: var(--yellow) !important;             /* Giallo del brand */
}

/* Il campo di ricerca (se presente) dentro la tendina */
body .select2-container--default .select2-search--dropdown {
    background-color: #1a1a1a !important;
    padding: 10px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

body .select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: #000 !important;
    border: 1px solid #333 !important;
    color: #fff !important;
    border-radius: 8px !important;
    outline: none !important;
}

/* Fix per messaggi "Nessun risultato" */
body .select2-container--default .select2-results__message {
    background-color: #1a1a1a !important;
    color: rgba(255, 255, 255, 0.4) !important;
    font-size: 12px !important;
}

/* 3. FIX SPECIFICO PER "TIPOLOGIA CLIENTE" (Se non usa Select2) */
#billing_customer_type {
    color: #fff !important;
    background-color: rgba(255, 255, 255, 0.05) !important;
}

/* Forza lo sfondo scuro anche su iOS Safari che ignora molti stili */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    select {
        background-color: #1a1a1a !important;
    }
}


/* Se ci sono errori, l'overlay di blocco non deve MAI intercettare i click */
.woocommerce-checkout.woocommerce-invalid .blockUI,
.woocommerce-checkout.woocommerce-invalid .blockOverlay {
    display: none !important;
    pointer-events: none !important;
}

/* Assicura che il pulsante non rimanga bloccato se non ha la classe processing */
#place_order:not(.processing) {
    pointer-events: auto !important;
    cursor: pointer !important;
}

/* ==========================================================================
   14. RESPONSIVE - FIX MOBILE & OVERFLOW
   ========================================================================== */

/* --- TABLET (Sotto 1200px) --- */
@media (max-width: 1200px) {
    .crc-checkout-grid { 
        display: block !important; /* Forza lo stacking verticale */
    }
    
    .crc-checkout-column-right {
        margin-top: 50px;
    }

    .crc-sticky-order-review { 
        position: static; 
        margin-bottom: 30px;
    }
}



/* --- MOBILE (Sotto 768px) --- */
@media (max-width: 768px) {
    
    /* 1. Riduzione Padding per evitare overflow */
    .woocommerce-billing-fields > div,
    .custom-box-checkout,
    .wcr-checkout-docs-section,
    .crc-payment-terminal-wrapper,
    .crc-sticky-order-review,
    .crc-standalone-payment-section {
        padding: 20px !important; /* Padding ridotto */
        border-radius: 20px !important; /* Rende il raggio uniforme su mobile */
    }

    /* 2. Fix Griglia Campi: trasformiamo tutto in colonna singola */
    .woocommerce-billing-fields__field-wrapper {
        display: block !important; /* Rimuove la griglia a 12 colonne */
    }

    .woocommerce-checkout .form-row {
        width: 100% !important;
        margin-bottom: 15px !important;
    }

    /* 3. Header degli Step: testo più piccolo */
    .crc-checkout-step-header h2 {
        font-size: 20px;
    }
    
    .crc-checkout-step-header .step-num {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }

    /* 4. Fix Ticket e Prezzi */
    .order-total td {
        font-size: 28px !important;
    }

    .crc-car-name {
        font-size: 16px !important;
    }

    .crc-item-total-price {
        font-size: 16px;
    }

    /* 5. Terminale Pagamento */
    #payment ul.payment_methods li label {
        padding: 12px 15px !important;
        font-size: 12px !important;
    }

    /* Progress bar fissa in alto */
    .crc-checkout-progress-bar {
        position: fixed;
        top: 60px; /* Altezza header mobile */
        left: 0;
        width: 100%;
        background: var(--white);
        z-index: 1000;
        padding: 10px;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
        margin-bottom: 0;
        gap: 10px;
    }

    .crc-checkout-progress-bar .step {
        font-size: 10px;
    }

    .woocommerce-checkout { 
        padding-top: 0 !important; 
    }

    /* 6. Documenti upload su una colonna */
    .wcr-upload-grid {
        grid-template-columns: 1fr !important;
    }

    /* 7. Bottone Start Engine */
    #place_order {
        height: 65px !important;
        font-size: 16px !important;
        letter-spacing: 1px;
    }
}

/* --- SMALL MOBILE (Sotto 480px) --- */
@media (max-width: 480px) {
    .crc-ticket-item .crc-item-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }

    .crc-item-total-price {
        text-align: left !important;
    }

    /* Nascondiamo le etichette tecniche nell'angolo per pulizia */
    .woocommerce-billing-fields > div::after,
    .custom-box-checkout::after {
        display: none !important;
    }
}

/* Impedisce click multipli durante il caricamento */
#place_order.processing {
    pointer-events: none !important;
    cursor: not-allowed !important;
}

/* Animazione rotazione icona (se non già presente) */
.spin {
    animation: crc-spin 1s infinite linear;
    display: inline-block;
}

@keyframes crc-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* ==========================================================================
   CHECKOUT LOGIN MODULE - COCKPIT EDITION (FULL UNIFIED & MOBILE READY)
   ========================================================================== */

/* 1. Barra informativa "Sei già cliente?" */
.woocommerce-form-login-toggle .woocommerce-info {
    background: #121212 !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-left: 4px solid var(--yellow) !important;
    padding: 20px 25px !important;
    border-radius: 15px !important;
    font-size: 14px !important;
    font-weight: 600;
    margin-bottom: 25px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    display: flex;
    align-items: center;
    gap: 15px;
}

.woocommerce-form-login-toggle .woocommerce-info a.showlogin {
    color: var(--yellow) !important;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1px;
    text-decoration: none !important;
    background: rgba(255, 215, 0, 0.1);
    padding: 8px 15px;
    border-radius: 8px;
    margin-left: auto;
    transition: all 0.3s ease;
}

/* 2. Il Box del Form di Login */
form.woocommerce-form-login.login {
    background: #121212 !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-left: 4px solid var(--yellow) !important;
    padding: 40px !important;
    border-radius: 0 30px 30px 0 !important;
    margin: 0 0 60px 0 !important;
    box-shadow: 20px 20px 60px rgba(0, 0, 0, 0.3);
    display: block; /* Cambiato da grid a block per gestione riga per riga */
    position: relative;
}

/* Testo descrittivo iniziale */
form.woocommerce-form-login.login p:first-of-type {
    color: rgba(255, 255, 255, 0.5);
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

/* 3. INPUT DESIGN - IDENTICO A SEZIONE 05 */
form.woocommerce-form-login.login .form-row {
    margin-bottom: 20px !important;
    width: 100% !important;
    float: none !important;
}

form.woocommerce-form-login.login input.input-text {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: rgba(255, 255, 255, 0.6) !important;
    border-radius: 12px !important;
    padding: 0 20px !important; /* Padding laterale */
    font-size: 16px !important;
    font-weight: 600 !important;
    width: 100% !important;
    height: 50px !important; /* Altezza precisa come billing fields */
    transition: all 0.2s ease !important;
    box-shadow: none !important;
    outline: none !important;
    box-sizing: border-box !important;
}

form.woocommerce-form-login.login input.input-text:focus {
    border-color: var(--yellow) !important;
    background: rgba(255, 215, 0, 0.05) !important;
    box-shadow: 0 0 20px rgba(255, 215, 0, 0.1) !important;
}

/* Label: Grigio tech, identico al checkout */
form.woocommerce-form-login.login label {
    color: var(--gray) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    margin-bottom: 10px !important;
    display: block;
}

/* 4. RIGA AZIONI (Ricordami e Bottone) */

/* Checkbox Ricordami */
form.woocommerce-form-login.login .woocommerce-form-login__rememberme {
    display: inline-flex !important;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px !important;
    cursor: pointer;
    text-transform: none !important;
    color: rgba(255,255,255,0.7) !important;
}

form.woocommerce-form-login.login .woocommerce-form-login__rememberme input {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 20px !important;
    height: 20px !important;
    background: #111 !important;
    border: 2px solid #444 !important;
    border-radius: 6px !important;
    margin: 0 !important;
    position: relative;
    cursor: pointer;
}

form.woocommerce-form-login.login .woocommerce-form-login__rememberme input:checked {
    background: var(--yellow) !important;
    border-color: var(--yellow) !important;
}

form.woocommerce-form-login.login .woocommerce-form-login__rememberme input:checked::after {
    content: '✓';
    position: absolute;
    top: 50%; left: 50%; transform: translate(-50%, -50%);
    color: var(--dark); font-weight: 900; font-size: 12px;
}

/* Bottone Accedi */
form.woocommerce-form-login.login .button {
    display: block !important;
    width: 100% !important; /* Full width su desktop e mobile */
    background: var(--yellow) !important;
    color: var(--dark) !important;
    height: 55px !important;
    border-radius: 12px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    border: none !important;
    cursor: pointer;
    transition: all 0.3s ease !important;
    box-shadow: 0 8px 20px rgba(255, 215, 0, 0.2) !important;
}

form.woocommerce-form-login.login .button:hover {
    background: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(255, 215, 0, 0.3) !important;
}

/* Link Password dimenticata */
form.woocommerce-form-login.login .lost_password {
    text-align: center;
    margin-top: 20px !important;
}

form.woocommerce-form-login.login .lost_password a {
    color: rgba(255, 255, 255, 0.3) !important;
    font-size: 11px;
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: 1px;
    transition: color 0.3s;
}

form.woocommerce-form-login.login .lost_password a:hover {
    color: var(--yellow) !important;
}

/* 5. RESPONSIVE OPTIMIZATION */
@media (max-width: 768px) {
    form.woocommerce-form-login.login {
        padding: 25px !important;
        border-radius: 20px !important; /* Raggio uniforme su mobile */
    }

    form.woocommerce-form-login.login p:first-of-type {
        font-size: 13px;
    }

    form.woocommerce-form-login.login .woocommerce-form-login__rememberme {
        width: 100%;
        margin-bottom: 25px !important;
    }
}

/* Rimuove la scritta facoltativo dal Codice Fiscale quando siamo in modalità privato */
.wcr-field-privato .optional,
#billing_cf_field .optional {
    display: none !important;
}

/* Assicura che l'asterisco sia visibile se il campo è obbligatorio */
.validate-required label .required {
    display: inline-block !important;
    visibility: visible !important;
}

/* Nasconde il (facoltativo) nativo ma lascia l'asterisco nativo pulito */
.woocommerce-checkout label .optional {
    display: none !important;
}

.woocommerce-checkout label .required {
    color: var(--red) !important;
    text-decoration: none !important;
    font-weight: 900 !important;
    margin-left: 4px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: rgba(255, 255, 255, 0.6) !important; 
    line-height: 1!important;   
}

/* ==========================================================================
   DESIGN CUSTOM: TOGGLE CONDUCENTE COINCIDENTE
   ========================================================================== */

/* 1. Il Contenitore (Card) */
#billing_is_driver_field {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 215, 0, 0.1) !important;
    border-radius: 18px !important;
    padding: 0 !important; /* Reset padding per gestire l'area cliccabile */
    margin: 30px 0 !important;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    position: relative;
    overflow: hidden;
}

/* 2. L'area cliccabile (Label) */
#billing_is_driver_field label.checkbox {
    display: flex !important;
    align-items: center !important;
    padding: 22px 25px !important;
    cursor: pointer;
    width: 100%;
    margin: 0 !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px;
}

/* 3. Nascondi il checkbox originale */
#billing_is_driver_field input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 24px !important;
    height: 24px !important;
    background: #111 !important;
    border: 2px solid #444 !important;
    border-radius: 6px !important;
    margin-right: 15px !important;
    position: relative;
    cursor: pointer;
    flex-shrink: 0;
}

/* 4. Stato Checked (Attivato) */
#billing_is_driver_field.woocommerce-validated,
#billing_is_driver_field:has(input:checked) {
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.05) 0%, rgba(0, 0, 0, 0) 100%) !important;
    border-color: var(--yellow) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

#billing_is_driver_field input[type="checkbox"]:checked {
    background: var(--yellow) !important;
    border-color: var(--yellow) !important;
}

/* Icona V dentro il checkbox */
#billing_is_driver_field input[type="checkbox"]:checked::after {
    content: '✓';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: var(--dark);
    font-weight: 900;
    font-size: 14px;
}

/* 5. Nasconde la scritta (facoltativo) */
#billing_is_driver_field .optional {
    display: none !important;
}

/* 6. Effetto Hover */
#billing_is_driver_field:hover {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 215, 0, 0.4) !important;
    transform: translateY(-2px);
}

/* ==========================================================================
   FIX POSIZIONAMENTO FRECCIA SELECT2
   ========================================================================== */

/* 1. Spostiamo l'intero contenitore della freccia verso sinistra */
.select2-container--default .select2-selection--single .select2-selection__arrow {
    right: 15px !important; /* Aumenta questo valore per portarla più a sinistra */
    top: 50% !important;
    transform: translateY(-50%) !important;
    height: 26px !important;
    width: 20px !important;
}

/* 2. Opzionale: Rendiamo la freccia color oro per coerenza col brand */
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: var(--yellow) transparent transparent transparent !important;
    border-width: 6px 5px 0 5px !important; /* La rendiamo un pelo più grande e visibile */
}

/* 3. Stato quando la tendina è aperta (la freccia punta in alto) */
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent var(--yellow) transparent !important;
    border-width: 0 5px 6px 5px !important;
}

/* 4. Evitiamo che il testo della selezione finisca sopra la freccia */
.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-right: 45px !important; /* Crea spazio di sicurezza a destra */
}

/* ==========================================================================
   SELECT2 SEARCH BAR: FIX PLACEHOLDER E STYLE
   ========================================================================== */

/* Il contenitore della barra di ricerca nel dropdown */
body .select2-container--default .select2-search--dropdown {
    background-color: #1a1a1a !important;
    padding: 12px !important;
    border-bottom: 1px solid rgba(255, 215, 0, 0.1) !important;
}

/* Il campo di input reale */
body .select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: #000 !important;
    border: 1px solid #333 !important;
    color: #fff !important;
    border-radius: 8px !important;
    padding: 10px 12px 10px 35px !important; 
    outline: none !important;
    font-size: 13px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
}

/* FORZA IL COLORE DEL PLACEHOLDER (Il testo "Cerca...") */
body .select2-container--default .select2-search--dropdown .select2-search__field::-webkit-input-placeholder {
    color: rgba(255, 255, 255, 0.4) !important;
    font-style: italic;
}
body .select2-container--default .select2-search--dropdown .select2-search__field::-moz-placeholder {
    color: rgba(255, 255, 255, 0.4) !important;
    font-style: italic;
}
body .select2-container--default .select2-search--dropdown .select2-search__field:-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.4) !important;
    font-style: italic;
}

/* Quando l'input di ricerca è focalizzato */
body .select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: var(--yellow) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23FFD700' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E") !important;
}

#billing_cf, 
#billing_vat {
    text-transform: uppercase !important;
}

#wc-stripe-upe-form {
    border: 0;
    padding: 0;   
}