/*
 * bootstrap-ponte.css — mappatura dei token sui componenti Bootstrap 5.3.
 *
 * Attua l'Opzione A della decisione 7 (tematizzazione senza Sass), con una
 * variante rispetto a 05-proposta-restyle.md: il piano prevedeva di ripetere
 * questo blocco di override dentro OGNI file di tema (~80 righe x 6 tenant).
 * Non serve: le custom property CSS si risolvono al momento dell'uso, quindi
 * basta mappare una volta sola `--bs-*` su `--ld-*` qui, e lasciare che ogni
 * tema ridefinisca soltanto i propri 6 valori di `--ld-`.
 *
 * Risultato: ~480 righe di CSS di tema diventano ~40, e aggiungere un
 * componente Bootstrap si fa in un punto solo invece che in sei.
 *
 * Il file va caricato DOPO bootstrap.min.css e DOPO design-tokens.css, e
 * PRIMA del tema di tenant.
 */

/* ====================================================================
   BOTTONI
   ==================================================================== */

.btn-primary {
  --bs-btn-bg:                 var(--ld-primario);
  --bs-btn-border-color:       var(--ld-primario);
  --bs-btn-color:              var(--ld-su-primario);
  --bs-btn-hover-bg:           var(--ld-primario-scuro);
  --bs-btn-hover-border-color: var(--ld-primario-scuro);
  --bs-btn-hover-color:        var(--ld-su-primario);
  --bs-btn-active-bg:          var(--ld-primario-scuro);
  --bs-btn-active-border-color: var(--ld-primario-scuro);
  --bs-btn-active-color:       var(--ld-su-primario);
  --bs-btn-disabled-bg:        var(--ld-primario);
  --bs-btn-disabled-border-color: var(--ld-primario);
  --bs-btn-disabled-color:     var(--ld-su-primario);
}

.btn-outline-primary {
  --bs-btn-color:              var(--ld-primario-testo);
  --bs-btn-border-color:       var(--ld-bordo);
  --bs-btn-hover-bg:           var(--ld-primario);
  --bs-btn-hover-border-color: var(--ld-primario);
  --bs-btn-hover-color:        var(--ld-su-primario);
  --bs-btn-active-bg:          var(--ld-primario-scuro);
  --bs-btn-active-border-color: var(--ld-primario-scuro);
  --bs-btn-active-color:       var(--ld-su-primario);
  --bs-btn-disabled-color:     var(--ld-testo-disabilitato);
  --bs-btn-disabled-border-color: var(--ld-bordo-neutro);
}

/* Bottone terziario "ghost": nessuno sfondo finche' non ci passi sopra. */
.btn-ghost {
  --bs-btn-color:        var(--ld-testo);
  --bs-btn-bg:           transparent;
  --bs-btn-border-color: transparent;
  --bs-btn-hover-bg:     var(--ld-superficie-2);
  --bs-btn-hover-color:  var(--ld-primario-testo);
  --bs-btn-hover-border-color: transparent;
  --bs-btn-active-bg:    var(--ld-superficie-3);
  --bs-btn-active-color: var(--ld-primario-testo);
  --bs-btn-active-border-color: transparent;
}

/* Bottone d'accento: l'arancio condiviso. Attenzione al contrasto — a
   piena saturazione vuole testo scuro; la variante scura regge il bianco
   (06-palette-e-asset-tenant.md).                                       */
.btn-accento {
  --bs-btn-bg:                 var(--ld-accento);
  --bs-btn-border-color:       var(--ld-accento);
  --bs-btn-color:              var(--ld-su-accento);
  --bs-btn-hover-bg:           var(--ld-accento-scuro);
  --bs-btn-hover-border-color: var(--ld-accento-scuro);
  --bs-btn-hover-color:        #FFFFFF;
  --bs-btn-active-bg:          var(--ld-accento-scuro);
  --bs-btn-active-color:       #FFFFFF;
}

/* Densita' dei controlli, governata dalla direzione visiva. */
.btn {
  --bs-btn-padding-y: var(--ld-space-2);
  --bs-btn-padding-x: var(--ld-space-4);
  --bs-btn-font-weight: var(--ld-peso-medio);
  --bs-btn-border-radius: var(--ld-radius-md);
}

/* ====================================================================
   LINK
   ==================================================================== */

a {
  color: var(--ld-primario-testo);
  text-underline-offset: 0.2em;
}
a:hover, a:focus {
  color: var(--ld-primario-scuro);
}

/* ====================================================================
   CAMPI DI FORM
   ==================================================================== */

.form-control,
.form-select {
  --bs-border-color: var(--ld-bordo-neutro);
  border-radius: var(--ld-radius-md);
  padding: var(--ld-densita-controllo);
}

.form-control:focus,
.form-select:focus {
  /* --ld-bordo e' un neutro condiviso (design-tokens.css § 2): il
     focus resta l'unico bordo che parla del tenant, tramite --ld-focus. */
  border-color: var(--ld-focus);
  box-shadow: 0 0 0 0.2rem var(--ld-focus-anello);
}

.form-label {
  font-size: var(--ld-dim-piccolo);
  font-weight: var(--ld-peso-medio);
  color: var(--ld-testo);
  margin-bottom: var(--ld-space-1);
}

.form-text {
  font-size: var(--ld-dim-caption);
  color: var(--ld-testo-muted);
}

.form-check-input:checked {
  background-color: var(--ld-primario);
  border-color: var(--ld-primario);
}

/* ====================================================================
   NAVIGAZIONE, PAGINAZIONE, TAB
   ==================================================================== */

.nav-pills {
  --bs-nav-pills-link-active-bg: var(--ld-primario);
  --bs-nav-pills-link-active-color: var(--ld-su-primario);
  --bs-nav-pills-border-radius: var(--ld-radius-md);
}

.nav-tabs {
  --bs-nav-tabs-link-active-color: var(--ld-primario-testo);
  --bs-nav-tabs-link-active-border-color:
      var(--ld-bordo-neutro) var(--ld-bordo-neutro) var(--ld-superficie);
}

.pagination {
  --bs-pagination-color:            var(--ld-primario-testo);
  --bs-pagination-hover-color:      var(--ld-primario-scuro);
  --bs-pagination-hover-bg:         var(--ld-primario-chiaro);
  --bs-pagination-active-bg:        var(--ld-primario);
  --bs-pagination-active-border-color: var(--ld-primario);
  --bs-pagination-active-color:     var(--ld-su-primario);
  --bs-pagination-border-color:     var(--ld-bordo-neutro);
  --bs-pagination-border-radius:    var(--ld-radius-md);
}

.dropdown-menu {
  --bs-dropdown-link-active-bg:    var(--ld-primario);
  --bs-dropdown-link-active-color: var(--ld-su-primario);
  --bs-dropdown-border-color:      var(--ld-bordo-neutro);
  --bs-dropdown-border-radius:     var(--ld-radius-md);
  --bs-dropdown-box-shadow:        var(--ld-ombra-2);
}

/* ====================================================================
   CARD, ALERT, BADGE, TABELLE, MODALI, TOAST
   ==================================================================== */

.card {
  /* Senza questo, Bootstrap eredita --bs-card-bg da --bs-body-bg (il
     fondo avorio della pagina): la card sparisce nel fondo invece di
     stagliarsi come superficie sollevata. */
  --bs-card-bg:             var(--ld-superficie);
  --bs-card-border-color:   var(--ld-bordo-neutro);
  --bs-card-border-radius:  var(--ld-radius-lg);
  --bs-card-cap-bg:         var(--ld-superficie-2);
  --bs-card-spacer-y:       var(--ld-space-4);
  --bs-card-spacer-x:       var(--ld-space-4);
  /* Ombra tenue invece del solo bordo: sulla direzione "Ibrido D3" la
     card si stacca leggermente dal fondo avorio della pagina. */
  box-shadow: var(--ld-ombra-1);
}

.alert {
  --bs-alert-border-radius: var(--ld-radius-md);
}

/* I badge di stato ordine usano i colori semantici di Bootstrap, MAI
   l'accento: l'arancio significa "accento", non "attenzione"
   (07-piano-di-sviluppo.md § A6).                                      */
.badge {
  --bs-badge-font-weight: var(--ld-peso-medio);
  --bs-badge-border-radius: var(--ld-radius-sm);
}

.table {
  --bs-table-border-color: var(--ld-bordo-neutro);
  --bs-table-striped-bg:   var(--ld-superficie-2);
  --bs-table-hover-bg:     var(--ld-riga-hover);
}

.modal {
  --bs-modal-border-color:  var(--ld-bordo-neutro);
  --bs-modal-border-radius: var(--ld-radius-lg);
  --bs-modal-box-shadow:    var(--ld-ombra-3);
}

.toast {
  --bs-toast-border-color:  var(--ld-bordo-neutro);
  --bs-toast-border-radius: var(--ld-radius-md);
  --bs-toast-box-shadow:    var(--ld-ombra-2);
}

.offcanvas {
  --bs-offcanvas-border-color: var(--ld-bordo-neutro);
}

/* ====================================================================
   LIBRERIE DI TERZE PARTI
   ==================================================================== */

/* Tom Select: il tema bootstrap5 ufficiale copre quasi tutto, restano il
   colore di selezione e il raggio.                                      */
.ts-wrapper .ts-control {
  border-radius: var(--ld-radius-md);
  border-color: var(--ld-bordo-neutro);
}
.ts-dropdown .active {
  background-color: var(--ld-primario-chiaro);
  color: var(--ld-testo);
}

/* Flatpickr: il calendario e' disegnato dalla libreria, va ricondotto ai
   token. Su touch la libreria si ritira e lascia il campo nativo.       */
.flatpickr-day.selected,
.flatpickr-day.selected:hover {
  background: var(--ld-primario);
  border-color: var(--ld-primario);
  color: var(--ld-su-primario);
}
.flatpickr-day.today {
  border-color: var(--ld-bordo);
}

/* Dropzone: l'area di rilascio. */
.dropzone {
  border: 2px dashed var(--ld-bordo-neutro);
  border-radius: var(--ld-radius-lg);
  background: var(--ld-superficie-2);
  min-height: 8rem;
}
.dropzone:hover,
.dropzone.dz-drag-hover {
  border-color: var(--ld-primario);
  background: var(--ld-primario-chiaro);
}

/* DataTables 2.x, tema Bootstrap 5. */
div.dt-container .dt-paging .dt-paging-button.current {
  background: var(--ld-primario);
  border-color: var(--ld-primario);
  color: var(--ld-su-primario) !important;
}
div.dt-container .dt-search input:focus,
div.dt-container .dt-length select:focus {
  border-color: var(--ld-focus);
  box-shadow: 0 0 0 0.2rem var(--ld-focus-anello);
}
