/* @version: 52 | 2025-10-30 17:30:34 | autore: Simone De Marchi */
/* @version: 6 | 2025-09-29 | autore: Simone De Marchi
   COMPONENTS.CSS – UI di base cross-pagina
   - Non cambia la palette: usa le variabili Bootstrap di bs-theme-overrides.css
   - Montserrat, bottoni/campi arrotondati
   - Card-header: titolo a sx, azioni a dx (fix allineamento xcrud-search)
   - Tabelle XCRUD: sticky opt-in + scroll orizzontale
   ------------------------------------------------------------------------- */

/* Tipografia di base */
:root { --comp-surface: #fff; }
body { font-family: 'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }

/* ------------------------------------------------------------------ */
/* Bottoni + campi form: arrotondati coerenti                         */
/* ------------------------------------------------------------------ */
.btn,
.button {
  border-radius: 999px !important;                 /* bottoni pill */
}
.form-control,
.input,
.form-select,
.input-group .form-control,
.input-group .form-select {
  border-radius: var(--bs-border-radius, .75rem) !important;
}

/* Coerenza colori testo btn-primary con bs-theme-overrides */
.btn.btn-primary,
.btn.btn-primary:focus,
.btn.btn-primary:active,
.btn.btn-primary:disabled {
  color: var(--bs-btn-color, #000);
}

/* Checkbox/radio: focus pulito */
.form-check-input:focus {
  box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb, 116,139,173), .25);
}
.form-check-input:active { filter: none; box-shadow: none; }

/* ------------------------------------------------------------------ */
/* Card & Card Header                                                  */
/* ------------------------------------------------------------------ */
.card { padding: 20px; }  /* padding in mod. desktop 0px in snmartphone */

.card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;   /* titolo a sx, azioni a dx */
  gap: .75rem;
  background: transparent;          /* lascia palette a Bootstrap */
  border-radius: var(--bs-border-radius, .75rem);
  padding: .75rem 1rem;
}

/* Controlli nel card-header arrotondati */
.card-header .form-control,
.card-header .form-select,
.card-header .btn { border-radius: 999px !important; }

/* ------ FIX DEFINITIVO: blocco search a destra senza spazi fantasma */
.card-header .xcrud-search.form-inline {
  margin-left: auto !important;     /* spinge tutto a dx */
  margin-right: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: .5rem;
  padding: 0 !important;
  width: auto !important;
}
.card-header .xcrud-search.form-inline.row,
.card-header .xcrud-search.form-inline.col-auto {
  margin-left: 0 !important;
  margin-right: 0 !important;
  /*padding-left: 0 !important;
  padding-right: 0 !important;
  flex: 0 0 auto !important;*/        /* evita stretching */
}

/* ====== FIX spazi laterali xcrud-search dentro card-header ====== */
/* 1) Elimina i gutter del .row applicato allo span.xcrud-search */
.card-header .xcrud-search.form-inline.row {
  --bs-gutter-x: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  /*padding-left: 0 !important;
  padding-right: 0 !important;*/
  display: inline-flex;            /* mantiene il layout “in linea” */
  gap: .5rem;                      /* spazio tra i campi (sostituisce i gutter) */
}

/*============== Pulsanti CARD HEADER (in testa alla pagina) =================*/

.header-btn {
    /*border-bottom: 1px solid #dee2ea;*/
    padding-bottom: 15px !important;
    text-align: end !important;
    text-transform: uppercase;
}


/*====== BOX ALERT alert-white  ======*/
.alert-white{
border:1px solid #dde2ea !important;
}

/* 2) I figli .col-auto non devono avere padding laterale */
.card-header .xcrud-search.form-inline.row > [class*="col-"] {
  /*padding-left: 0 !important;
  padding-right: 0 !important;*/
}

/* 3) Spingi tutto il blocco controlli a destra */
.card-header > .d-flex.align-items-center,
.card-header > .btn-group.pull-right {
  margin-left: auto !important;
}

/* 4) Mantieni arrotondamenti coerenti */
.card-header .form-control,
.card-header .form-select,
.card-header .btn { border-radius: 999px !important; }

/* 5) Padding della card richiesto */
.card { padding: 20px; }

/* ------------------------------------------------------------------ */
/* NAVBAR TOPBAR: layout icone/dropdown stabile                        */
/* ------------------------------------------------------------------ */
.navbar.topbar,
.navbar.navbar-expand.bg-white.shadow.mb-4.topbar {
  display: flex;
  align-items: center;
}
.navbar.topbar .navbar-nav,
.navbar.navbar-expand.bg-white.shadow.mb-4.topbar .navbar-nav {
  display: flex;
  align-items: center;
  gap: .5rem;                        /* evita sovrapposizioni icone */
}
.navbar.topbar .nav-item.dropdown,
.navbar.navbar-expand.bg-white.shadow.mb-4.topbar .nav-item.dropdown {
  position: relative;
}
.navbar.topbar .dropdown-menu,
.navbar.navbar-expand.bg-white.shadow.mb-4.topbar .dropdown-menu {
  position: absolute;
}

/* ------------------------------------------------------------------ */
/* TABELLE XCRUD – scroll orizzontale + sticky opt-in  */
/* ------------------------------------------------------------------ */

/* Contenitore scrollabile */
.xcrud-list-container {
  overflow-x: auto !important;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  position: relative;
  background: var(--comp-surface);
  padding: 0;                        /* no padding nel box tabella */
}

/* Tabella: occupa full width; scrolla quando serve */
.xcrud-list.table {
  width: 100%;
  min-width: 900px;                  /* crea scroll su schermi stretti */
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
}

/* Header sticky (ATTIVO se aggiungi .table-sticky-header alla table) */
.table-sticky-header thead th {
  position: sticky;
  top: 0;
  z-index: 5;
  background: var(--bs-primary-bg-subtle, #E3E8EF);
  color: var(--bs-primary-text-emphasis, #2E3845);
  border-bottom: 1px solid var(--bs-primary-border-subtle, #C7D1DE);
}

/* Prima colonna sticky (ATTIVO se aggiungi .table-sticky-col alla table) */
.table-sticky-col td:first-child,
.table-sticky-col th:first-child {
  position: sticky;
  left: 0;
  z-index: 6;
  background: inherit;
  box-shadow: 1px 0 0 rgba(0,0,0,.06);
}

/* Intersezione header+prima colonna sopra tutto */
.table-sticky-header.table-sticky-col thead th:first-child { z-index: 7; }

/* Righe alternate + hover (palette da bs-theme-overrides) */
.xcrud-list.table tbody tr:nth-child(even) td {
  background: color-mix(in srgb, var(--bs-primary-bg-subtle, #E3E8EF) 40%, #fff 60%);
}
.xcrud-list.table tbody tr:hover td {
  background: color-mix(in srgb, var(--bs-primary-bg-subtle, #E3E8EF) 60%, #fff 40%);
  cursor: pointer;
}

/* Dropdown nelle celle sopra alle sticky */
.xcrud-list .dropdown { position: relative; }
.xcrud-list .dropdown-menu { position: absolute; z-index: 10000; }
/* se il menu è aperto, alza lo z-index della prima colonna coinvolta */
.xcrud-list td:first-child:has(.dropdown-menu.show) { z-index: 999; }

/* Iconcine info nelle tabelle */
i.fa.fa-info { padding-inline: 7px; margin-top: 8px; }



/* ------------------------------------------------------------------ */
/* Barra sotto tabella (limiti + paginazione)                          */
/* ------------------------------------------------------------------ */
.xcrud-nav.form-inline.btn-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem .75rem;
  padding: .5rem .75rem;
}

/* Bottoni 25/50/100/All come “pill” */
.xcrud-nav .xcrud-limit-buttons .btn {
  border-radius: 999px;
  padding: .35rem .75rem;
  border: 1px solid var(--bs-secondary-border-subtle, #BAC6D7);
  background: #fff;
  color: var(--bs-secondary-text-emphasis, #212D3E);
}
.xcrud-nav .xcrud-limit-buttons .btn.active,
.xcrud-nav .xcrud-limit-buttons .btn:hover,
.xcrud-nav .xcrud-limit-buttons .btn:focus {
  background: var(--bs-secondary, #52709c);
  border-color: var(--bs-secondary, #52709c);
  color: #fff;
}

/* Pagination arrotondata + palette */
.pagination { gap: .25rem; }
.pagination .page-link {
  border-radius: 999px !important;
  border: 1px solid var(--bs-primary-border-subtle, #C7D1DE);
  color: var(--bs-primary-text-emphasis, #2E3845);
  padding: .35rem .65rem;
  margin-bottom: 0 !important;
}
ul.pagination.col-auto { margin-bottom: 0 !important; }
.pagination .page-item.active .page-link,
.pagination .page-link:hover {
  background: var(--bs-primary, #748bad);
  border-color: var(--bs-primary, #748bad);
  color: #fff;
}

/* ------------------------------------------------------------------ */
/* Azioni XCRUD: dropdown e pulsanti uniformati                        */
/* ------------------------------------------------------------------ */
.xcrud-actions .btn,
.xcrud-actions .dropdown-menu .btn {
  border-radius: 25px;
  padding: .35rem .6rem;
}
.xcrud-actions .dropdown-toggle.btn {
  border: 1px solid var(--bs-primary-border-subtle, #C7D1DE);
  background: #fff;
  color: var(--bs-primary-text-emphasis, #2E3845);
}
.xcrud-actions .dropdown-toggle.btn:hover {
  background: var(--bs-primary-bg-subtle, #E3E8EF);
}

/* bottoni dropdown */

ul.dropdown-menu.show {
    padding: 8px;
    border-radius: 25px;
}

ul.dropdown-menu a.btn {
    width: 100% !important;
    border: 1px solid white;
}

ul.dropdown-menu .btn-group, .btn-group-vertical {
  /* display: inline-flex; */
  display:block !important;
}


/* ------------------------------------------------------------------ */
/* Mobile refinements                                                  */
/* ------------------------------------------------------------------ */
@media (max-width: 768px) {
  .xcrud-list-container {
    height: auto !important;
    max-height: none;
    overflow-x: auto;
    overflow-y: visible;
  }
  .xcrud-list.table { min-width: 720px; }

.card { padding: 0px; }  /* padding cartd in mod. desktop 20px */

  /* card-header a colonne su mobile */
  .card-header {
    flex-direction: column;
    align-items: stretch;
    gap: .5rem;
  }

  .header-btn a.btn
 {
    width: 100%;
    margin-bottom: 10px;
 }

  .card-header .xcrud-search.form-inline { margin-left: 0 !important; }
}