/* ===========================================
   BARTOLI · RICAMBI
   Override specifici solo per la sezione Ricambi
   =========================================== */

/* Scope: solo dentro la sezione Ricambi */
#sezioneElencoRicambi {
  width: 100%;
}

/* 1) Immagine del ricambio: full-width dentro la colonna */
#sezioneElencoRicambi a.rimorchioLink {
  display: block !important;
  width: 100% !important;
}

#sezioneElencoRicambi a.rimorchioLink > img.imgRimorchioNoleggio {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  aspect-ratio: 4 / 3 !important; /* rimuovi se non vuoi il taglio 4:3 */
}

/* Fallback: qualunque immagine ricambi con quella classe riempie la colonna */
#sezioneElencoRicambi img.imgRimorchioNoleggio,
#sezioneElencoRicambi img.imgRimorchioNoleggio.type3 {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}

/* 2) Nascondi eventuale immagine duplicata subito dopo il link */
#sezioneElencoRicambi a.rimorchioLink + img.imgRimorchioNoleggio,
#sezioneElencoRicambi a.rimorchioLink + img.imgRimorchioNoleggio.type3 {
  display: none !important;
}

/* 3) Allineamento titoli e testo RICAMBI: tutti i figli dentro la card */
#sezioneElencoRicambi .infoRimorchioNoleggio > * {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

/* ===========================================
   RICAMBI – E-COMMERCE VISIBILE SOLO SE LOGGATO
   (login legacy: classe .bartoli-user-logged sul body)
   =========================================== */

/* Se NON loggato (manca .bartoli-user-logged), nascondi prezzi, quantità e pulsanti carrello nelle card */
body:not(.bartoli-user-logged)
#sezioneElencoRicambi .qntyRicambio,
body:not(.bartoli-user-logged)
#sezioneElencoRicambi input[name="quantity"],
body:not(.bartoli-user-logged)
#sezioneElencoRicambi label[for="quantity"],
body:not(.bartoli-user-logged)
#sezioneElencoRicambi ngcart-addtocart,
body:not(.bartoli-user-logged)
#sezioneElencoRicambi ngcart-addtocart .btn,
body:not(.bartoli-user-logged)
#sezioneElencoRicambi ngcart-addtocart .glyphicon {
  display: inline;
}

/* Prezzo nascosto se NON loggato */
body:not(.bartoli-user-logged)
#sezioneElencoRicambi .infoRimorchioNoleggio p.ng-binding:last-of-type {
  display: none !important;
}

/* Blocchi “Mostra/Nascondi carrello” + riepilogo nascosti se NON loggato */
body:not(.bartoli-user-logged)
#sezioneElencoRicambi .cartTop,
body:not(.bartoli-user-logged)
#sezioneElencoRicambi .cart-summary,
body:not(.bartoli-user-logged)
#sezioneElencoRicambi a.btn.btn-primary.cart-toggle {
  display: none !important;
}


/* Pulsante "Aggiungi" dentro le card ricambi (stile simile a "Invia ordine") */
#sezioneElencoRicambi ngcart-addtocart .btn {
  padding: 4px 14px;
  font-size: 13px;
  font-weight: 600;
  background-color: #0c1c40;
  border-color: #0c1c40;
  color: #ffffff !important;
  border-radius: 4px;
  text-transform: none;
}
/* Ricambi: quando è "RIMUOVI" deve essere rosso (override del bottone blu) */
#sezioneElencoRicambi ngcart-addtocart .btn.btn-danger,
#sezioneElencoRicambi ngcart-addtocart .btn[ng-click*="remove"],
#sezioneElencoRicambi ngcart-addtocart .btn[ng-click*="removeItem"]{
  background: #d32f2f !important;
  border-color: #d32f2f !important;
  color: #fff !important;
}

#sezioneElencoRicambi ngcart-addtocart .btn.btn-danger:hover,
#sezioneElencoRicambi ngcart-addtocart .btn[ng-click*="remove"]:hover,
#sezioneElencoRicambi ngcart-addtocart .btn[ng-click*="removeItem"]:hover{
  background: #b71c1c !important;
  border-color: #b71c1c !important;
}

#sezioneElencoRicambi ngcart-addtocart .btn:hover {
  background-color: #122a60;
  border-color: #122a60;
  color: #ffffff !important;
}

/* ===========================================
   NGCart – ripristino tabella (quantità / importo / totale)
   =========================================== */

#htmlOfPage .ngcart-cart-container table.ngCart-cart-table {
  width: 100%;
  border-collapse: collapse;
}

#htmlOfPage .ngCart-cart-table thead,
#htmlOfPage .ngCart-cart-table tbody,
#htmlOfPage .ngCart-cart-table tfoot {
  display: table-row-group !important;
}

#htmlOfPage .ngCart-cart-table tr {
  display: table-row !important;
}

#htmlOfPage .ngCart-cart-table th,
#htmlOfPage .ngCart-cart-table td {
  display: table-cell !important;
  visibility: visible !important;
  padding: 8px 10px;
  vertical-align: middle;
}

/* colonna rimozione più stretta */
#htmlOfPage .ngCart-cart-table .ngcart-remove {
  width: 40px;
  text-align: center;
}

#htmlOfPage .ngCart-cart-table .ngcart-remove .ngcart-remove-btn{
  cursor: pointer;
  width: 26px;
  height: 26px;
  line-height: 22px;
  border-radius: 4px;
  border: 1px solid #c0392b;
  background: #c0392b;
  color: #fff;
  font-weight: 700;
  padding: 0;
}
#htmlOfPage .ngCart-cart-table .ngcart-remove .ngcart-remove-btn:hover{
  background: #e74c3c;
  border-color: #e74c3c;
}

/* opzionale: quando qty=1, il “−” diventa “attenzione” ma resta cliccabile */
.ngCart-cart-table .ngcart-qty .btn-qty.is-last{
  background: #c0392b;
  border-color: #c0392b;
}
.ngCart-cart-table .ngcart-qty .btn-qty.is-last:hover{
  background: #e74c3c;
  border-color: #e74c3c;
}


/* immagine */
#htmlOfPage .ngCart-cart-table .ngcart-image {
  width: 90px;
}

/* ===========================================
   Quantità: bottoni + / - stile Bartoli
   =========================================== */

.ngcart-cart-container {
  max-width: 1160px;
  margin: 0 auto;
}

.ngCart-cart-table th,
.ngCart-cart-table td {
  vertical-align: middle;
}

/* colonna quantità */
.ngCart-cart-table .ngcart-qty {
  white-space: nowrap;
  text-align: center;
}

/* bottoni + e - (stile coerente con "Invia ordine") */
.ngCart-cart-table .ngcart-qty .btn-qty {
  cursor: pointer;
  padding: 3px 8px;
  border-radius: 4px;
  border: 1px solid #0c1c40;
  margin: 0 4px;
  font-size: 12px;
  line-height: 1;
  display: inline-block;
  background-color: #0c1c40;
  color: #ffffff;
  font-weight: 600;
}

.ngCart-cart-table .ngcart-qty .btn-qty:hover:not(.disabled) {
  background-color: #122a60;
  border-color: #122a60;
}

.ngCart-cart-table .ngcart-qty .btn-qty.disabled {
  opacity: 0.4;
  cursor: default;
  pointer-events: none;
}

/* valore numerico quantità */
.ngCart-cart-table .ngcart-qty-value {
  display: inline-block;
  min-width: 24px;
  text-align: center;
}

/* ===========================================
   Totale carrello
   =========================================== */

#htmlOfPage .ngCart-cart-table .ngcart-total-label {
  text-align: right;
  font-weight: 600;
}

#htmlOfPage .ngCart-cart-table .ngcart-total-value {
  font-weight: 700;
}

/* ===========================================
   Cursori e stile pulsanti e-commerce
   =========================================== */

#htmlOfPage a.btn,
#htmlOfPage button.btn,
#htmlOfPage .ngCart.cart span[ng-click],
#htmlOfPage .ngCart-cart-table span[ng-click] {
  cursor: pointer !important;
}

/* Pulsanti Mostra/Nascondi carrello */
#sezioneCarrello .btn {
  padding: 6px 18px;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
}

#sezioneCarrello .btn-primary {
  background-color: #0c1c40;
  border-color: #0c1c40;
}

#sezioneCarrello .btn-primary:hover {
  background-color: #0c1c40;
  border-color: #0c1c40;
}

#sezioneCarrello .btn-danger {
  background-color: #c0392b;
  border-color: #c0392b;
}

#sezioneCarrello .btn-danger:hover {
  background-color: #e74c3c;
  border-color: #e74c3c;
}

/* Spazio fra pulsante mostra/nascondi e riepilogo carrello */
#sezioneCarrello .sezioneCarrello-header ngcart-summary {
  margin-left: 20px;
  display: inline-block;
}

/* Box di conferma ordine (pagina ricambi) */
#htmlOfPage .alert-success {
  background-color: #0c1c40;
  border-color: #0c1c40;
  color: #ffffff;
}

/* Box warning “crema” */
#htmlOfPage .alert-warning {
  background-color: #fdf4d0;
  border-color: #f0c36d;
  color: #444;
}

/* ===========================================
   SEZIONE CARRELLO: FULL WIDTH + CENTRATO
   =========================================== */

/* 1) Il contenitore deve ignorare la griglia bootstrap */
#sezioneCarrello {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

/* 2) La prima riga (pulsanti) deve essere centrata */
#sezioneCarrello > .row:first-child {
  margin: 0 auto !important;
  text-align: center !important;
  width: 100% !important;
}

/* 3) La col-md-12 che contiene i pulsanti non deve restringersi */
#sezioneCarrello > .row:first-child > .col-md-12 {
  width: 100% !important;
  max-width: 100% !important;
  padding: 30px 0 !important;
}

/* 4) La tabella deve essere full-width e centrata */
#sezioneCarrello .table-responsive {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

#sezioneCarrello table.ngCart.cart {
  width: 100% !important;
  border-collapse: collapse;
}

/* 5) Colonne allineate CENTRO (anche descrizione) */
#sezioneCarrello table.ngCart.cart th,
#sezioneCarrello table.ngCart.cart td {
  vertical-align: middle;
  text-align: center !important;
}

/* Rimuovo vecchio "text-align:left" sulla descrizione */
#sezioneCarrello table.ngCart.cart td:nth-child(3) {
  text-align: center !important;
}

/* 6) Rimuovi padding dei contenitori Bootstrap sotto */
#sezioneCarrello .row,
#sezioneCarrello .col-md-12 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Wrapper per riga carrello visibile */
#sezioneCarrello .row[ng-show="mostraCarrello == 1"] {
  margin: 0 auto !important;
  width: 100% !important;
}

#sezioneCarrello .row[ng-show="mostraCarrello == 1"] > .col-md-12 {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 10px 0 !important;
}

/* wrapper Bootstrap della tabella */
#sezioneCarrello .table-responsive.col-lg-12 {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

/* la tabella ngCart deve usare il 100% della larghezza disponibile */
#sezioneCarrello .table-responsive.col-lg-12 > table.ngCart.cart {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

/* ===========================================
   Box commenti carrello
   =========================================== */

.commenti-wrapper {
  background: #fbf5dc;
  border: 1px solid #e5d8aa;
  padding: 25px 30px;
  margin-top: 20px;
  margin-bottom: 30px;
  width: 100%;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 4px;
}

.commenti-wrapper .row {
  margin-bottom: 12px;
}

.commenti-wrapper textarea {
  width: 100% !important;
  border: 1px solid #ccc;
  padding: 10px;
  border-radius: 3px;
  resize: vertical;
}

.commenti-wrapper input[type="text"] {
  border: 1px solid #ccc;
  padding: 6px;
  border-radius: 3px;
}

.commenti-wrapper label {
  margin-left: 6px;
}

/* Allinea il box crema alla larghezza della tabella */
#sezioneCarrello .commenti-wrapper {
  margin-top: 15px;
  border-radius: 0;
  border: none;
}

/* ===========================================
   Pulsanti checkout (Procedi all'acquisto + Invia ordine)
   =========================================== */

#sezioneCarrello .ngcart-checkout-wrapper {
  text-align: center;
  margin: 20px 0 10px;
}

/* Bottoni dentro il wrapper, affiancati e centrati */
#sezioneCarrello .ngcart-checkout-wrapper .btn {
  display: inline-block;
  min-width: 170px;
  margin: 0 6px;
  font-weight: 600;
}

/* Stile pulsante Invia ordine */
#sezioneCarrello .btn-invia-ordine {
  display: inline-block;
  background-color: #0c1c40;
  border-color: #0c1c40;
  font-weight: 600;
  padding: 8px 22px;
  color: #fff !important;
}

#sezioneCarrello .btn-invia-ordine:hover {
  background-color: #122a60;
  border-color: #122a60;
}

/* ============================================================
   PAGINA GRAZIE (inviaOrdine)
   ============================================================ */
#ringraziamentoRicambi.pagina-grazie-ricambi {
    background-color: #e8f8ea !important; /* verde chiarissimo */
    border: 1px solid #b5e3b8 !important;
    color: #2d4f2f !important;
    padding: 30px !important;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

/* Rimuove completamente il rosso delle classi Bootstrap */
#ringraziamentoRicambi.alert,
#ringraziamentoRicambi.alert-success,
#ringraziamentoRicambi.jumbotron {
    background-color: transparent !important;
    border: none !important;
    color: inherit !important;
}

/* Titolo */
#ringraziamentoRicambi h2 {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 15px;
    color: #2d4f2f !important;
}

/* Paragrafi */
#ringraziamentoRicambi p {
    font-size: 18px;
    margin-bottom: 10px;
}

/* Pulsante */
#ringraziamentoRicambi .btn-grazie-ricambi {
    background-color: #2d8a34 !important;
    border-color: #2d8a34 !important;
    color: #fff !important;
    padding: 12px 26px;
    border-radius: 8px;
    font-size: 18px;
    margin-top: 15px;
}

#ringraziamentoRicambi .btn-grazie-ricambi:hover {
    background-color: #256f2b !important;
    border-color: #256f2b !important;
}
/* ===========================================
   NASCONDI CARRELLO SE UTENTE NON LOGGATO
   (usa la classe body aggiunta dal PHP)
   =========================================== */

body:not(.bartoli-user-logged) .bartoli-cart-wrapper,
body:not(.bartoli-user-logged) .bartoli-cart-toggle,
body:not(.bartoli-user-logged) .bartoli-cart-title,
body:not(.bartoli-user-logged) .bartoli-cart-panel {
    display: none !important;
}
/* NGCart - scheda ricambio: quantità centrata + bottoni sotto */
#htmlOfPage .ngcart-addtocart-detail {
  text-align: center;
}

#htmlOfPage .ngcart-addtocart-detail .qntyRicambio {
  width: 90px !important;
  max-width: 90px !important;
  display: inline-block;
  text-align: center;
}

#htmlOfPage .ngcart-addtocart-detail__actions {
  margin-top: 10px;
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}
/* NGCart - scheda ricambio: bottoni custom (NO bootstrap) */
#htmlOfPage .ngcart-addtocart-detail__actions .ngcart-btn{
  display: inline-block;
  min-width: 140px;
  padding: 8px 22px;
  border-radius: 4px;
  font-weight: 600;
  text-align: center;
  text-decoration: none !important;
  cursor: pointer;

  box-shadow: 0 6px 18px rgba(0,0,0,.08);
  transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease, background-color .12s ease, border-color .12s ease;
}

#htmlOfPage .ngcart-addtocart-detail__actions .ngcart-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(0,0,0,.12);
}

#htmlOfPage .ngcart-addtocart-detail__actions .ngcart-btn:active{
  transform: translateY(0);
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
}

/* Aggiungi = blu Bartoli */
#htmlOfPage .ngcart-addtocart-detail__actions .ngcart-btn--add{
  background-color: #0c1c40;
  border: 1px solid #0c1c40;
  color: #ffffff !important;
}

#htmlOfPage .ngcart-addtocart-detail__actions .ngcart-btn--add:hover{
  background-color: #122a60;
  border-color: #122a60;
}

/* Rimuovi = rosso */
#htmlOfPage .ngcart-addtocart-detail__actions .ngcart-btn--remove{
  background-color: #c0392b;
  border: 1px solid #c0392b;
  color: #ffffff !important;
}

#htmlOfPage .ngcart-addtocart-detail__actions .ngcart-btn--remove:hover{
  background-color: #e74c3c;
  border-color: #e74c3c;
}

/* Disabled: Rimuovi quando non è in carrello */
#htmlOfPage .ngcart-addtocart-detail__actions .disabled{
  pointer-events: none;
  opacity: .45;
  box-shadow: none;
  transform: none;
}
/* Ricambi: titolo "Trova veicolo" in grassetto */
body.page-id-16464 #bartoli-sidebar-search-slot .bartoli-filter-widget--search .bartoli-filter-title,
body.page-id-16464 #bartoli-sidebar-search-slot .bartoli-filter-widget--search label,
body.page-id-16464 #bartoli-sidebar-search-slot .bartoli-filter-widget--search legend{
  font-weight: 700 !important;
  font-size: 14px;
}