/* ==========================================================
   Hotel PMS - CSS Standard Globale
   File: /Hotel/css/app.css
   ========================================================== */

/* =============================
   VARIABILI + BASE
============================= */
:root{
  --pms-accent: #0d6efd;
  --pms-bg: #f6f7fb;
  --pms-text: #212529;
  --pms-border: rgba(0,0,0,0.07);
  --pms-shadow: 0 10px 28px rgba(0,0,0,0.05);
  --pms-radius-lg: 18px;
  --pms-radius-md: 12px;
  --pms-radius-pill: 999px;
  --pms-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", "Liberation Sans", sans-serif;
  --pms-modal-bg: #dbe7f7;
  --pms-modal-text: #010124;
  --pms-modal-border: rgb(0, 0, 0);
  --pms-modal-header-bg: #8dc1f57e;
  --pms-table-border: rgba(0,0,0,0.10);
  --pms-table-radius: 12px;
  --pms-table-head-bg: rgba(13,110,253,0.05);
  --pms-table-row-hover: rgba(13,110,253,0.06);
  --pms-table-row-alt: rgba(0,0,0,0.03);
  --pms-table-cell-pad-y: .38rem;
  --pms-table-cell-pad-x: .55rem;
  --pms-table-line-height: 1.25;
}

body{
  font-family: var(--pms-font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: radial-gradient(circle at 30% 30%, rgba(13, 57, 253, 0.25), rgba(13,110,253,0) 60%);
  color: var(--pms-text);
}

h1,h2,h3,h4,h5,h6{
  font-family: var(--pms-font-sans);
}

html, body{
  height: 100%;
}

/* testi */
h1,h2,h3{
  letter-spacing: .1px;
}

/* =============================
   NAVBAR PMS (light / no "epigrafe")
============================= */
.pms-navbar{
  background: linear-gradient(180deg, #2b333b 0%, #242b32 100%);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  padding-top: .35rem;
  padding-bottom: .35rem;
}

.pms-brand-dot{
  width: 8px;
  height: 8px;
  border-radius: var(--pms-radius-pill);
  background: var(--pms-accent);
  box-shadow: 0 0 0 5px rgba(13,110,253,0.16);
}

.pms-brand-logo{
  width: 28px;
  height: 28px;
  object-fit: contain;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.25));
}

.pms-brand-text{
  font-weight: 650;
  letter-spacing: .08px;
}

.pms-nav{
  gap: .15rem;
}

.pms-nav .nav-link{
  border-radius: 10px;
  padding: .45rem .65rem;
  color: rgba(255,255,255,0.78);
  font-weight: 500;
  position: relative;
  transition: color .15s ease, background-color .15s ease;
  background: transparent;
  box-shadow: none;
}

.pms-nav .nav-link:hover{
  color: rgba(255,255,255,0.95);
  background: rgba(255,255,255,0.04);
}

/* ACTIVE = underline elegante (non pillola “lapide”) */
.pms-nav .nav-link.active{
  color: rgba(255,255,255,0.96);
  font-weight: 650;
  background: transparent;
  box-shadow: none;
}

.pms-nav .nav-link.active::after{
  content: "";
  position: absolute;
  left: .65rem;
  right: .65rem;
  bottom: .22rem;
  height: 2px;
  background: rgba(13,110,253,0.85);
  border-radius: var(--pms-radius-pill);
}

.pms-nav .dropdown-toggle::after{
  margin-left: .42rem;
  vertical-align: .15rem;
  opacity: .88;
}

.pms-navbar .dropdown-menu{
  margin-top: .4rem;
  padding: .45rem;
  border-radius: 14px;
  border: 1px solid rgba(31,41,55,0.10);
  box-shadow: 0 14px 34px rgba(15,23,42,0.16);
}

.pms-navbar .dropdown-item{
  border-radius: 10px;
  padding: .48rem .78rem;
  font-weight: 500;
}

.pms-navbar .dropdown-item:hover,
.pms-navbar .dropdown-item:focus{
  background: rgba(13,110,253,0.08);
}

.pms-navbar .dropdown-item.active,
.pms-navbar .dropdown-item:active{
  background: rgba(13,110,253,0.14);
  color: var(--pms-accent);
}

.pms-user{
  color: rgba(255,255,255,0.90) !important;
  font-weight: 600;
}

.pms-hotel-badge{
  display:inline-block;
  padding: .32rem .58rem;
  border-radius: var(--pms-radius-pill);
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.84);
  font-size: .82rem;
}

.pms-season-badge{
  display:inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .28rem .55rem;
  border-radius: var(--pms-radius-pill);
  background: rgba(255, 193, 7, 0.15);
  border: 1px solid rgba(255, 193, 7, 0.35);
  color: rgba(255,255,255,0.92) !important;
  font-size: .80rem;
  transition: background .18s;
}
.pms-season-badge:hover{
  background: rgba(255, 193, 7, 0.28);
  border-color: rgba(255, 193, 7, 0.55);
}

/* Banner stagione corrente (persistente, sotto page-header) */
.pms-sc-banner{
  background: rgba(25, 135, 84, 0.08);
  border: 1px solid rgba(25, 135, 84, 0.25);
  color: var(--pms-text);
  font-size: .875rem;
}
.pms-sc-banner-nome{
  font-weight: 600;
  color: var(--bs-success-text-emphasis, #0a3622);
}
.pms-sc-banner-btn{
  font-size: .75rem;
  padding: .15rem .55rem;
  color: #198754;
  border: 1px solid #198754;
  white-space: nowrap;
}
.pms-sc-banner-btn:hover{
  background: #198754;
  color: #fff;
}

@media (max-width: 991.98px){
}

@media (prefers-reduced-motion: reduce){
}

/* =============================
   PAGE HEADER STANDARD (opzionale ma utile)
   Usa: <div class="pms-pagehead"> ... </div>
============================= */
.pms-pagehead{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 16px;

  padding: 10px 2px 14px 2px;
  margin: 8px 0 12px 0;

  border-bottom: 1px solid var(--pms-border);
}

.pms-pagehead-title{
  font-weight: 800;
  letter-spacing: .2px;
  line-height: 1.05;
  margin: 0;
}

.pms-pagehead-subtitle{
  color: rgba(33,37,41,0.65);
  font-size: 13px;
  margin-top: 2px;
}

.pms-pagehead-right{
  display:flex;
  align-items:center;
  gap: 12px;
  flex-wrap: wrap;
}

/* =============================
   CARD STANDARD
============================= */
.card{
  border: 1px solid var(--pms-border);
  border-radius: var(--pms-radius-lg);
  box-shadow: var(--pms-shadow);
}

.card .card-body{
  padding: 16px;
}

/* =============================
   FORM STANDARD PMS
============================= */
.form-control,
.form-select,
textarea{
  background-color: #f8f9fa;
  border-color: #ced4da;
  border-radius: var(--pms-radius-md);
}

.form-control:focus,
.form-select:focus,
textarea:focus{
  background-color: #ffffff;
  border-color: var(--pms-accent);
  box-shadow: 0 0 0 .15rem rgba(13,110,253,0.15);
}

.form-label{
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: #495057;
}

/* bottoni un po’ più “app” */
.btn{
  border-radius: 12px;
}

.btn-primary{
  box-shadow: 0 10px 20px rgba(13,110,253,0.12);
}

/* =============================
   DATATABLES STANDARD (globale)
============================= */
.dataTables_wrapper .dataTables_filter input{
  border-radius: 20px !important;
  padding-left: 2rem !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16'%3E%3Cpath fill='%236c757d' d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.65rem center !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.08) !important;
  border-color: #dee2e6 !important;
  transition: box-shadow .15s, border-color .15s !important;
}
.dataTables_wrapper .dataTables_filter input:focus{
  border-color: #86b7fe !important;
  box-shadow: 0 0 0 3px rgba(13,110,253,.15) !important;
  outline: none !important;
}

.dataTables_wrapper .dataTables_length select{
  border-radius: 12px !important;
  padding-right: 1.8rem !important; /* spazio per la freccia DataTables */
  appearance: none !important;
  -webkit-appearance: none !important;
  min-width: 4rem;
}

.dataTables_wrapper .dataTables_filter label,
.dataTables_wrapper .dataTables_length label{
  font-size: 12px;
  color: rgba(33,37,41,0.70);
}

table.dataTable thead th{
  white-space: nowrap;
  padding-right: 1.6rem !important; /* spazio per le frecce di ordinamento */
  position: relative;
}

/* frecce DataTables — posizionate a destra senza sovrapporsi al testo */
table.dataTable thead th.dt-orderable-asc,
table.dataTable thead th.dt-orderable-desc,
table.dataTable thead th.sorting,
table.dataTable thead th.sorting_asc,
table.dataTable thead th.sorting_desc {
  padding-right: 1.6rem !important;
}

table.dataTable thead th.sorting::after,
table.dataTable thead th.sorting_asc::after,
table.dataTable thead th.sorting_desc::after,
table.dataTable thead th.dt-orderable-asc span.dt-column-order,
table.dataTable thead th.dt-orderable-desc span.dt-column-order,
table.dataTable thead th.dt-ordering-asc span.dt-column-order,
table.dataTable thead th.dt-ordering-desc span.dt-column-order {
  position: absolute;
  right: .35rem;
  top: 50%;
  transform: translateY(-50%);
}

/* =============================
   DataTable Clienti: niente a capo (specifico)
============================= */
#clientiTable td,
#clientiTable th{
  white-space: nowrap;
}

/* =============================
   TAB con warning
============================= */
.nav-tabs .nav-link.tab-warning{
  color: #b02a37;
  font-weight: 600;
}

.nav-tabs .nav-link.tab-warning::after{
  content: " ⚠";
}

/* =============================
   Stop barra orizzontale su tutte le pagine
   (come richiesto)
============================= */
.table-responsive{
  overflow-x: visible !important;
}

/* =============================
   Tabelle specifiche (Agenzie)
============================= */
#tblAgenzie td,
#tblAgenzie th{
  vertical-align: middle;
}

/* =============================
   MODAL STANDARD (soft)
============================= */
.modal-content{
  border-radius: 18px;
  border: 1px solid var(--pms-modal-border);
  box-shadow: 0 18px 50px rgba(0,0,0,0.18);
  overflow: hidden;
  background: var(--pms-modal-bg);
  color: var(--pms-modal-text);
}

.modal-header{
  border-bottom: 1px solid var(--pms-modal-border);
  background: var(--pms-modal-header-bg);
}

.modal-footer{
  border-top: 1px solid var(--pms-modal-border);
}


/* ==========================================================
   ANTI-EPIGRAFE OVERRIDES (mettere IN FONDO a app.css)
   ========================================================== */

/* Navbar meno “lapide” */

/* Active elegante e leggero: underline sottile */

/* Hover soft */

/* Tipografia globale: meno “epigrafe” sui titoli */
h1{
  font-weight: 750 !important;
  letter-spacing: .08px !important;
  line-height: 1.08 !important;
  font-size: 2.25rem !important;                  /* Bootstrap spesso spara troppo */
  margin-bottom: .25rem;
}

h2{
  font-weight: 700 !important;
}

/* Sottotitoli coerenti e più “UI” */
.ag-subtitle, .rt-subtitle, .pms-pagehead-subtitle{
  color: rgba(33,37,41,0.62) !important;
  font-size: 13px !important;
}

/* Card: ombra più discreta */


/* ===== Navbar: da nero pieno a "graphite" ===== */

/* opzionale: micro-gradiente per dare “profondità” senza fare epigrafe */

/* ==========================================================
   Navbar: colore forzato (ID + Bootstrap var)
   ========================================================== */
#pmsTopbar{
  --bs-navbar-bg: #343c45;              /* bootstrap-safe */
  background-color: #091050 !important; /* fallback */
  background-image: none !important;
}
/* =============================
   Badge DEMO navbar
============================= */
.pms-demo-badge{
  display: inline-flex;
  align-items: center;
  padding: .22rem .55rem;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .02em;

  background: rgba(255,193,7,0.22);      /* warning soft */
  border: 1px solid rgba(255,193,7,0.35);
  color: rgba(255,255,255,0.92);
}

.pms-demo-badge.is-expired{
  background: rgba(220,53,69,0.20);      /* danger soft */
  border: 1px solid rgba(220,53,69,0.35);
  color: rgba(255,255,255,0.92);
}

/* Mobile: non “allunga” troppo la navbar */
@media (max-width: 576px){
  .pms-demo-badge{
    padding: .18rem .45rem;
    font-size: .72rem;
  }
}
/* =============================================
   Select2 "come form-select" (Bootstrap 5)
   ============================================= */
.select2-container { width: 100% !important; }

.select2-container--default .select2-selection--single{
  min-height: calc(1.5em + .75rem + 2px);
  padding: .375rem 2.25rem .375rem .75rem;
  border: 1px solid var(--bs-border-color, #ced4da);
  border-radius: .7rem;              /* allineala al tuo stile */
  background-color: var(--bs-body-bg, #fff);  /* <-- lo sfondo che ti manca */
  display: flex;
  align-items: center;
}

.select2-container--default .select2-selection--single .select2-selection__rendered{
  padding-left: 0;
  line-height: 1.5;
}

.select2-container--default .select2-selection--single .select2-selection__arrow{
  height: 100%;
  right: .75rem;
  top: 0;
}

.select2-container--default.select2-container--focus .select2-selection--single{
  border-color: rgba(var(--bs-primary-rgb, 13,110,253), .5);
  box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb, 13,110,253), .25);
}

.select2-dropdown{
  border-radius: .5rem;
  border: 1px solid var(--bs-border-color, #ced4da);
  overflow: hidden;
}
/* =========================================================
   MODAL - sfondo globale
   File: /Hotel/css/app.css
   ========================================================= */
/* =========================================================
   TABELLE - stile globale (compatto e moderno)
   File: /Hotel/css/app.css
   NOTE: escludiamo il planning (sticky) da queste regole globali
   ========================================================= */

/* base table (globale) */
table:not(#planningTable):not(.planning-table){
  border: 1px solid var(--pms-table-border);
  border-radius: var(--pms-table-radius);
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
}

/* celle compatte */
table:not(#planningTable):not(.planning-table) th,
table:not(#planningTable):not(.planning-table) td{
  padding: var(--pms-table-cell-pad-y) var(--pms-table-cell-pad-x);
  line-height: var(--pms-table-line-height);
  vertical-align: middle;
  border-bottom: 1px solid var(--pms-table-border);
}

/* header */
table:not(#planningTable):not(.planning-table) thead th{
  background: var(--pms-table-head-bg);
  font-weight: 700;
  border-bottom: 1px solid var(--pms-table-border);
}

/* zebra + hover */
table:not(#planningTable):not(.planning-table) tbody tr:nth-child(even){
  background: var(--pms-table-row-alt);
}
table:not(#planningTable):not(.planning-table) tbody tr:hover{
  background: var(--pms-table-row-hover);
}

/* evita doppio bordo sull’ultima riga */
table:not(#planningTable):not(.planning-table) tbody tr:last-child td{
  border-bottom: 0;
}

/* azioni/icone: spesso sono loro ad alzare la riga */
table:not(#planningTable):not(.planning-table) td .btn,
table:not(#planningTable):not(.planning-table) td .btn.btn-sm{
  padding: .18rem .35rem;
  line-height: 1;
  min-height: auto;
}

table:not(#planningTable):not(.planning-table) td .btn i,
table:not(#planningTable):not(.planning-table) td .btn svg{
  font-size: .95rem;
  width: 1em;
  height: 1em;
}

/* badge compatti */
table:not(#planningTable):not(.planning-table) td .badge{
  font-size: .75rem;
  padding: .20em .55em;
}

/* =========================================================
   AZIONI (DataTables) - bottoni icona uniformi
   File: /Hotel/css/app.css
   ========================================================= */
.dt-actions{
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: .35rem;
  white-space: nowrap;
}

.btn-icon{
  width: 28px;
  height: 28px;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 999px !important;
}

/* override delle regole compatte dentro le tabelle */
table:not(#planningTable):not(.planning-table) td .dt-actions .btn-icon{
  min-height: 28px;
}

.btn-icon .bi{
  font-size: 1rem;
  line-height: 1;
}


/* =========================================================
   DATATABLES TOOLBAR UNIFICATA
   - "Visualizza N elementi" (length menu) a sinistra
   - Bottoni (es. Colonne) accanto al length menu
   - Cerca a destra
   ========================================================= */
.dataTables_wrapper .dt-toolbar .dataTables_length label,
.dataTables_wrapper .dt-toolbar .dataTables_filter label{
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin: 0;
  white-space: nowrap;
}

/* v.2.25.r — allineamento verticale uniforme toolbar */
.dataTables_wrapper .dt-toolbar .dataTables_length select,
.dataTables_wrapper .dt-toolbar .dataTables_filter input {
  height: 32px;
}
.dataTables_wrapper .dt-toolbar .dataTables_filter {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.dataTables_wrapper .dt-toolbar .dataTables_filter{
  width: 100%;
}

.dataTables_wrapper .dt-toolbar .dataTables_filter input{
  max-width: 240px;
  border-radius: 20px !important;
  padding-left: 2rem !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16'%3E%3Cpath fill='%236c757d' d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.65rem center !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.08) !important;
  border-color: #dee2e6 !important;
  transition: box-shadow .15s, border-color .15s !important;
}
.dataTables_wrapper .dt-toolbar .dataTables_filter input:focus{
  border-color: #86b7fe !important;
  box-shadow: 0 0 0 3px rgba(13,110,253,.15) !important;
  outline: none !important;
}

/* se Buttons è attivo ma non ci sono bottoni, nascondi il contenitore */
.dataTables_wrapper .dt-buttons:empty{
  display: none !important;
}

/* ColVis: classe PMS (robusta contro override di DT/Bootstrap) */
.dt-buttons .pms-colvis-btn,
button.dt-button.pms-colvis-btn,
a.dt-button.pms-colvis-btn{
  background: var(--pms-accent) !important;
  background-color: var(--pms-accent) !important;
  background-image: none !important;
  border-color: var(--pms-accent) !important;
  color: #fff !important;
}

.dt-buttons .pms-colvis-btn:hover,
.dt-buttons .pms-colvis-btn:focus,
button.dt-button.pms-colvis-btn:hover,
button.dt-button.pms-colvis-btn:focus,
a.dt-button.pms-colvis-btn:hover,
a.dt-button.pms-colvis-btn:focus{
  background: rgba(13,110,253,0.90) !important;
  border-color: rgba(13,110,253,0.90) !important;
  color: #fff !important;
}

/* =========================================================
   DATATABLES BUTTONS (toolbar) - ColVis sempre leggibile
   Alcuni temi DT impostano background grigio sui .dt-button.
   Qui forziamo contrasto e riconoscibilità anche senza hover.
   ========================================================= */
.dataTables_wrapper .dt-buttons .dt-button{
  border-radius: 999px !important;
  font-weight: 650;
}

.dataTables_wrapper .dt-buttons .dt-button i,
.dataTables_wrapper .dt-buttons .dt-button span{
  opacity: 1 !important;
}

/* ColVis: SEMPRE blu.
   Alcuni temi DT forzano background grigio/gradient sui .dt-button.
   Qui imponiamo stile "primary" (utile perché il bottone deve essere riconoscibile anche a riposo).
*/
.dataTables_wrapper .dt-buttons .dt-button.buttons-colvis,
.dt-buttons .dt-button.buttons-colvis,
button.dt-button.buttons-colvis{
  background: var(--pms-accent) !important;
  background-color: var(--pms-accent) !important;
  background-image: none !important;
  border-color: var(--pms-accent) !important;
  color: #fff !important;

  /* allinea anche le variabili bootstrap se presenti */
  --bs-btn-bg: var(--pms-accent);
  --bs-btn-color: #fff;
  --bs-btn-border-color: var(--pms-accent);
  --bs-btn-hover-bg: rgba(13,110,253,0.90);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-border-color: rgba(13,110,253,0.90);
}

.dataTables_wrapper .dt-buttons .dt-button.buttons-colvis i.bi,
.dataTables_wrapper .dt-buttons .dt-button.buttons-collection i.bi,
.dataTables_wrapper .dt-buttons .dt-button.btn-outline-primary i.bi{
  margin-right: .35rem;
  color: inherit !important;
}

.dataTables_wrapper .dt-buttons .dt-button.buttons-colvis:hover,
.dataTables_wrapper .dt-buttons .dt-button.buttons-colvis:focus,
.dt-buttons .dt-button.buttons-colvis:hover,
.dt-buttons .dt-button.buttons-colvis:focus,
button.dt-button.buttons-colvis:hover,
button.dt-button.buttons-colvis:focus{
  background: rgba(13,110,253,0.90) !important;
  border-color: rgba(13,110,253,0.90) !important;
  color: #fff !important;
}

.dataTables_wrapper .dt-buttons .dt-button.buttons-colvis:active,
.dt-buttons .dt-button.buttons-colvis:active,
button.dt-button.buttons-colvis:active{
  background: rgba(13,110,253,0.85) !important;
  border-color: rgba(13,110,253,0.85) !important;
  color: #fff !important;
}


/* ===============================================================
   BookingModal condivisa — titolo con ID prenotazione evidenziato
   =============================================================== */

#bookingModal .modal-title{
  display:flex;
  align-items:center;
  gap:.5rem;
  flex-wrap:wrap;
}

#bookingModal .modal-title .booking-id-chip{
  display:inline-flex;
  align-items:center;
  padding:.12rem .55rem;
  border-radius:999px;
  font-size:.875rem;
  font-weight:700;
  line-height:1.2;
  color:#1a56db;
  background:#eef4ff;
  border:1px solid #c7d7f7;
}

/* ===============================================================
   Gruppi prenotazioni (booking_groups) – UI (bookingModal + Select2)
   =============================================================== */
.bk-group-swatch{
  display:inline-block;
  width: 14px;
  height: 14px;
  border-radius: 4px;
  border: 1px solid rgba(0,0,0,.18);
  background: transparent;
}

.bk-group-dot{
  display:inline-block;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.18);
}

/* ===============================================================
   Page Header — intestazione uniforme per tutte le pagine PMS
   =============================================================== */
.pms-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding-top: .75rem;
}

.pms-page-header-left {
  flex: 1 1 0;
  min-width: 0;
}

.pms-page-header-right {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .5rem;
  flex-shrink: 0;
}

.pms-page-title {
  font-size: 1.6rem;
  font-weight: 700;
  color: #1a2942;
  margin: 0 0 .15rem 0;
  line-height: 1.2;
  display: flex;
  align-items: center;
  gap: .45rem;
}

.pms-page-icon {
  font-size: 1.35rem;
  color: #2e75b6;
  opacity: .85;
  flex-shrink: 0;
}

.pms-page-subtitle {
  font-size: .8375rem;
  color: #6c757d;
  margin: 0;
  line-height: 1.4;
  max-width: 680px;
}

/* Separatore sottile sotto l'header */
.pms-page-header::after {
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, #dee2e6 0%, transparent 100%);
  margin-top: .6rem;
}

/* Planning toolbar toggle */
#btnPlanningToolbarToggle.active {
  background: var(--pms-accent);
  color: #fff;
  border-color: var(--pms-accent);
}


/* =========================================================
   FIX v.4.1.l - Topbar sempre visibile anche su pagine lunghe
   ========================================================= */
#pmsTopbar{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
}
body{
  padding-top: 64px;
}
body.has-debug-toolbar{
  padding-top: 96px;
}

/* =========================
   Documenti emessi filters
   ========================= */
.doc-emessi-filters {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  border: 1px solid #adb5bd;
  border-radius: 999px;
  overflow: hidden;
  background: #fff;
}

.doc-emessi-filter-pill {
  appearance: none;
  border: 0;
  border-right: 1px solid #d7dde5;
  background: #fff;
  color: #6c757d;
  padding: .52rem .95rem;
  font-size: .93rem;
  line-height: 1.2;
  transition: background-color .18s ease, color .18s ease, box-shadow .18s ease;
}

.doc-emessi-filter-pill:last-child {
  border-right: 0;
}

.doc-emessi-filter-pill:hover,
.doc-emessi-filter-pill:focus {
  background: #f8f9fa;
  color: #495057;
  outline: none;
}

.doc-emessi-filter-pill[data-filter-tipo=""] {
  color: #6c757d;
}

.doc-emessi-filter-pill[data-filter-tipo="Ricevuta"] {
  color: #198754;
}

.doc-emessi-filter-pill[data-filter-tipo="Fattura"] {
  color: #dc3545;
}

.doc-emessi-filter-pill.is-active[data-filter-tipo=""] {
  background: #6c757d;
  color: #fff;
}

.doc-emessi-filter-pill.is-active[data-filter-tipo="Ricevuta"] {
  background: rgba(25, 135, 84, 0.12);
  color: #146c43;
  box-shadow: inset 0 0 0 1px rgba(25, 135, 84, 0.28);
}

.doc-emessi-filter-pill.is-active[data-filter-tipo="Fattura"] {
  background: rgba(220, 53, 69, 0.12);
  color: #b02a37;
  box-shadow: inset 0 0 0 1px rgba(220, 53, 69, 0.28);
}

@media (max-width: 575.98px) {
  .doc-emessi-filters {
    display: flex;
    width: 100%;
  }

  .doc-emessi-filter-pill {
    flex: 1 1 auto;
    text-align: center;
    padding-left: .65rem;
    padding-right: .65rem;
  }
}