/* CHECKOUT.CSS — Stile specifico carrello (CSS puro) */
.table-wrap{overflow:auto;border-radius:var(--radius);border:1px solid var(--c-border);margin-bottom:12px;background:#fff}
.cart-table{width:100%;border-collapse:collapse;min-width:680px}
.cart-table th,.cart-table td{padding:12px;border-bottom:1px solid #f1f1f1;vertical-align:middle}
.cart-table thead th{background:#fff7f0;color:#3a3a3a;font-weight:600}
.right{text-align:right}
.center{text-align:center}
.qty-input{width:90px;text-align:center;padding:8px 10px;border:1px solid var(--c-border);border-radius:10px;font-weight:600}
.qty-input:focus{outline:2px solid color-mix(in oklab, var(--c-accent) 60%, white);border-color:var(--c-accent)}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.btn-link.danger{color:#b00020}
.empty{background:#fff;border:1px dashed var(--c-border);border-radius:var(--radius);padding:24px;text-align:center}
@media (max-width: 640px){.qty-input{width:72px}}

/*Azioni generiche (flex base) */
.actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}

/*Azioni legate alle tabelle */
.actions-table {
  padding-left: 12px; /* allinea al contenuto della prima colonna */
}

/*Azioni dentro un form (checkout) */
.actions-form {
  padding-left: 0; /* nessun disallineamento */
}




/***********************************************
 * STILE DI BASE PER TUTTI I BOTTONI .btn
 * (copiato dal CSS di riferimento)
 ***********************************************/
.btn {
  display: inline-block;
  padding: 7px 10px;
  background-color: #f2f2f2;
  color: #333;
  border-radius: 6px;
  text-decoration: none;
  font-weight: 600;
  transition: all 0.25s ease;
  border: 1px solid #d4a017;
  font-size: 14px;
  cursor: pointer; /* utile anche per <button> */
}

.btn:hover {
  background-color: #d4a017;
  color: #ffffff;
  border-color: #d4a017;
}

/***********************************************
 * BOTTONI PRINCIPALI: "CONFERMA ORDINE" E
 * "TORNA AL CARRELLO"
 *
 * In HTML:
 *  <button class="btn primary" ...>Conferma ordine</button>
 *  <a class="btn primary" href="/carrello.php">Torna al carrello</a>
 *
 * Usiamo .btn + .primary per poterli gestire come pulsanti principali,
 * ma lo stile di base rimane IDENTICO al riferimento.
 ***********************************************/

/* Opzionale: leggera evidenza per i bottoni primari, 
   mantenendo coerente lo stile di base */
.btn.primary {
  /* stesso stile di base, solo una leggera enfasi sul colore di sfondo */
  background-color: #f2f2f2;
  color: #333;
  border-color: #d4a017;
}

/* Al passaggio del mouse, si mantiene esattamente il comportamento del riferimento */
.btn.primary:hover {
  background-color: #d4a017;
  color: #ffffff;
  border-color: #d4a017;
}

/* Layout dell’area azioni in fondo al form checkout */

/*
.actions-table {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 15px;
}
*/

.actions-table {
  padding-left: 0; /* Rimuove il padding che causava il disallineamento */
  display: flex;
  gap: 12px; /* Mantiene lo spazio tra i bottoni */
  margin-top: 16px; /* Spazio verticale dalla sezione sopra */
}




.btn, 
a.btn {
  font-family: inherit; /* oppure font specifico, es: 'Inter', sans-serif */
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4; /* per centrare verticalmente il testo */
  text-align: center;
}



/***********************************************
 * BOTTONI "ASPORTO" E "DOMICILIO"
 *
 * In HTML:
 *  <div class="delivery-buttons">
 *    <button type="button" class="delivery-btn" data-type="asporto">Asporto</button>
 *    <button type="button" class="delivery-btn" data-type="domicilio">Domicilio</button>
 *  </div>
 *
 * Obiettivi:
 *  - centrati orizzontalmente nella pagina
 *  - larghezza proporzionata al contenuto
 *  - stile coerente con i bottoni .btn
 ***********************************************/

/* Contenitore dei bottoni: centrato con Flexbox */
.delivery-buttons {
  display: flex;
  justify-content: center;  /* centra orizzontalmente */
  align-items: center;
  gap: 12px;                /* spazio tra Asporto e Domicilio */
  margin: 10px 0 5px;
  flex-wrap: wrap;          /* in caso di schermi piccoli */
}

/* Stile dei bottoni "Asporto" e "Domicilio" */
.delivery-btn {
  /* layout / dimensioni */
  display: inline-flex;           /* per centrare il testo anche verticalmente */
  align-items: center;
  justify-content: center;
  padding: 7px 14px;              /* leggermente più ampio per pulsanti "scelta" */
  width: auto;                    /* larghezza legata al contenuto */
  /* fallback e supporto moderno */
  width: -moz-fit-content;
  width: fit-content;

  /* stile visivo coerente con .btn */
  background-color: #f2f2f2;
  color: #333;
  border-radius: 6px;
  border: 1px solid #d4a017;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.25s ease;
  box-sizing: border-box;
}

/* Hover coerente con .btn */
.delivery-btn:hover {
  background-color: #d4a017;
  color: #ffffff;
  border-color: #d4a017;
}

/* Stato attivo/selezionato (classe aggiunta via JS) */
.delivery-btn.active,
.delivery-btn[aria-pressed="true"] {
  background-color: #d4a017;
  color: #ffffff;
  border-color: #d4a017;
}

/***********************************************
 * PICCOLI AGGIUSTAMENTI DI CONTESTO
 ***********************************************/

/* Gruppo form che contiene i bottoni di consegna */
.form-group .delivery-buttons {
  margin-top: 8px;
}

/* Suggerimento inline vicino ai bottoni di conferma (già presente in HTML) */
.hint-inline {
  font-size: 13px;
  color: #555;
}
.hint-inline .btn.sm {
  padding: 4px 8px;
  font-size: 12px;
}