/* ============================================================
   Condominio Loverre — fondamenta visive
   Font variabili serviti in locale: niente CDN, funziona offline.
   ============================================================ */
@font-face{
  font-family:'Lexend';
  src:url('/vendor/fonts/lexend-latin-wght-normal.woff2') format('woff2-variations');
  font-weight:300 700;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Source Sans 3';
  src:url('/vendor/fonts/source-sans-3-latin-wght-normal.woff2') format('woff2-variations');
  font-weight:300 700;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Source Sans 3';
  src:url('/vendor/fonts/source-sans-3-latin-wght-italic.woff2') format('woff2-variations');
  font-weight:300 700;font-style:italic;font-display:swap;
}

:root{
  --cl-font-titoli:'Lexend',system-ui,-apple-system,'Segoe UI',sans-serif;
  --cl-font-testo:'Source Sans 3',system-ui,-apple-system,'Segoe UI',sans-serif;

  --cl-teal:#0d7d8c;
  --cl-teal-scuro:#075761;
  --cl-teal-tenue:#e3f2f4;

  --cl-radius:.75rem;
  --cl-radius-sm:.5rem;
  --cl-transizione:150ms ease;

  --bs-primary:var(--cl-teal);
  --bs-link-color-rgb:13,125,140;
  --bs-link-hover-color-rgb:7,87,97;
  --bs-body-font-family:var(--cl-font-testo);
  --bs-border-radius:var(--cl-radius-sm);
  --bs-border-radius-lg:var(--cl-radius);
}

/* Bootstrap non conosce il nostro teal */
.text-primary{color:var(--cl-teal)!important}
.link-primary{color:var(--cl-teal)!important}

[data-bs-theme="dark"]{
  --cl-teal:#3fb8c9;
  --cl-teal-scuro:#63cfdd;
  --cl-teal-tenue:#123136;
  --bs-link-color-rgb:63,184,201;
  --bs-link-hover-color-rgb:99,207,221;
}

body{
  font-family:var(--cl-font-testo);
  min-height:100dvh;
  padding-bottom:env(safe-area-inset-bottom);
  -webkit-tap-highlight-color:transparent;
  overflow-x:hidden;
}
h1,h2,h3,h4,h5,h6,.font-titoli{font-family:var(--cl-font-titoli);letter-spacing:-.02em}

/* i numeri di denaro devono incolonnarsi */
.num,td.num,.quota-importo,table td,table th{font-variant-numeric:tabular-nums}

/* ============================================================
   COMANDI — campi, menu a tendina, pulsanti
   Tocco >=44px, stati sempre visibili, transizioni 150ms.
   ============================================================ */

:root{
  --cl-campo-bg:#fff;
  --cl-campo-bordo:#cfd9de;
  --cl-campo-bordo-hover:#9fb3bb;
  --cl-campo-ombra:0 1px 2px rgba(16,40,50,.05);
  --cl-alone:rgba(13,125,140,.18);
  --cl-btn-ombra:0 1px 2px rgba(16,40,50,.08);
  --cl-btn-ombra-hover:0 4px 12px rgba(13,125,140,.25);
}
[data-bs-theme="dark"]{
  --cl-campo-bg:#1d272c;
  --cl-campo-bordo:#3a4a52;
  --cl-campo-bordo-hover:#54686f;
  --cl-campo-ombra:none;
  --cl-alone:rgba(63,184,201,.25);
  --cl-btn-ombra:none;
  --cl-btn-ombra-hover:0 4px 14px rgba(0,0,0,.45);
}

/* --- etichette --- */
.form-label{
  font-weight:600;font-size:.8125rem;letter-spacing:.01em;
  color:var(--bs-body-color);margin-bottom:.375rem;
}
.form-label .fw-normal,.form-text{color:var(--bs-secondary-color)}
.form-text{font-size:.8125rem;margin-top:.375rem}

/* --- campi di testo e menu a tendina --- */
.form-control,.form-select{
  min-height:46px;
  padding:.625rem .875rem;
  font-size:16px;                      /* sotto i 16px iOS zooma da solo */
  line-height:1.4;
  color:var(--bs-body-color);
  background-color:var(--cl-campo-bg);
  border:1.5px solid var(--cl-campo-bordo);
  border-radius:.625rem;
  box-shadow:var(--cl-campo-ombra);
  transition:border-color var(--cl-transizione),box-shadow var(--cl-transizione),background-color var(--cl-transizione);
}
.form-control::placeholder{color:var(--bs-secondary-color);opacity:.65}
.form-control:hover:not(:disabled):not(:focus),
.form-select:hover:not(:disabled):not(:focus){border-color:var(--cl-campo-bordo-hover)}

.form-control:focus,.form-select:focus{
  border-color:var(--cl-teal);
  box-shadow:0 0 0 .25rem var(--cl-alone);
  background-color:var(--cl-campo-bg);
}

.form-control:disabled,.form-select:disabled,
.form-control[readonly]{
  background-color:var(--bs-secondary-bg);
  opacity:.65;cursor:not-allowed;box-shadow:none;
}

/* freccia del menu a tendina disegnata a mano, cosi' segue il tema */
.form-select{
  padding-right:2.5rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%235b6b75' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .875rem center;background-size:1rem;
}
[data-bs-theme="dark"] .form-select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%239aabb4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
}

/* --- errori --- */
.form-control.is-invalid,.form-select.is-invalid{
  border-color:var(--bs-danger);background-image:none;
}
.form-select.is-invalid{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23dc3545' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E")}
.form-control.is-invalid:focus,.form-select.is-invalid:focus{box-shadow:0 0 0 .25rem rgba(220,53,69,.2)}
.invalid-feedback{font-size:.8125rem;font-weight:500}

/* --- gruppi con prefisso e suffisso (€, mc) --- */
.input-group>.form-control{border-radius:.625rem}
.input-group-text{
  background-color:var(--bs-tertiary-bg);
  border:1.5px solid var(--cl-campo-bordo);
  color:var(--bs-secondary-color);
  font-weight:600;font-size:.9375rem;
  padding:.625rem .875rem;min-height:46px;
  border-radius:.625rem;
  transition:border-color var(--cl-transizione),color var(--cl-transizione);
}
.input-group:focus-within .input-group-text{border-color:var(--cl-teal);color:var(--cl-teal)}
.input-group:focus-within>.form-control{z-index:3}

/* --- caselle e interruttori --- */
.form-check{padding-left:1.9em;min-height:1.5rem}
.form-check-input{
  width:1.15em;height:1.15em;margin-left:-1.9em;margin-top:.18em;
  border:1.5px solid var(--cl-campo-bordo);
  transition:background-color var(--cl-transizione),border-color var(--cl-transizione),box-shadow var(--cl-transizione);
}
.form-check-input:hover:not(:checked){border-color:var(--cl-campo-bordo-hover)}
.form-check-input:checked{background-color:var(--cl-teal);border-color:var(--cl-teal)}
.form-check-input:focus{border-color:var(--cl-teal);box-shadow:0 0 0 .25rem var(--cl-alone)}
.form-switch{padding-left:3em}
.form-switch .form-check-input{width:2.5em;height:1.35em;margin-left:-3em;margin-top:.12em;border-radius:2em}
.form-check-label{cursor:pointer;padding-top:.05em}

/* --- selettore colore --- */
.form-control-color{
  min-height:46px;padding:.3rem;cursor:pointer;
}
.form-control-color::-webkit-color-swatch{border-radius:.375rem;border:none}
.form-control-color::-moz-color-swatch{border-radius:.375rem;border:none}

/* --- pulsanti --- */
.btn{
  --bs-btn-padding-y:.625rem;
  --bs-btn-padding-x:1.125rem;
  --bs-btn-font-size:.9375rem;
  --bs-btn-border-radius:.625rem;
  min-height:44px;
  font-weight:600;letter-spacing:.005em;
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  box-shadow:var(--cl-btn-ombra);
  transition:background-color var(--cl-transizione),border-color var(--cl-transizione),
             box-shadow var(--cl-transizione),transform var(--cl-transizione),color var(--cl-transizione);
}
.btn-sm{--bs-btn-padding-y:.4rem;--bs-btn-padding-x:.75rem;--bs-btn-font-size:.875rem;--bs-btn-border-radius:.5rem;min-height:38px}
.btn-lg{--bs-btn-padding-y:.8rem;--bs-btn-padding-x:1.5rem;--bs-btn-font-size:1.0625rem;min-height:52px}

.btn:hover:not(:disabled){transform:translateY(-1px)}
.btn:active:not(:disabled){transform:translateY(0) scale(.985);box-shadow:none}
.btn:disabled,.btn.disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}

.btn-primary{
  --bs-btn-bg:var(--cl-teal);--bs-btn-border-color:var(--cl-teal);
  --bs-btn-hover-bg:var(--cl-teal-scuro);--bs-btn-hover-border-color:var(--cl-teal-scuro);
  --bs-btn-active-bg:var(--cl-teal-scuro);--bs-btn-active-border-color:var(--cl-teal-scuro);
  --bs-btn-disabled-bg:var(--cl-teal);--bs-btn-disabled-border-color:var(--cl-teal);
}
.btn-primary:hover:not(:disabled){box-shadow:var(--cl-btn-ombra-hover)}
[data-bs-theme="dark"] .btn-primary{--bs-btn-color:#06272b;--bs-btn-hover-color:#06272b;--bs-btn-active-color:#06272b}

.btn-outline-primary{
  --bs-btn-color:var(--cl-teal);--bs-btn-border-color:var(--cl-teal);
  --bs-btn-hover-bg:var(--cl-teal);--bs-btn-hover-border-color:var(--cl-teal);
  --bs-btn-active-bg:var(--cl-teal);--bs-btn-active-border-color:var(--cl-teal);
}
[data-bs-theme="dark"] .btn-outline-primary{--bs-btn-hover-color:#06272b;--bs-btn-active-color:#06272b}

.btn-outline-secondary{
  --bs-btn-color:var(--bs-body-color);
  --bs-btn-border-color:var(--cl-campo-bordo);
  --bs-btn-hover-bg:var(--bs-tertiary-bg);
  --bs-btn-hover-border-color:var(--cl-campo-bordo-hover);
  --bs-btn-hover-color:var(--bs-body-color);
  --bs-btn-active-bg:var(--bs-secondary-bg);
  --bs-btn-active-color:var(--bs-body-color);
  --bs-btn-active-border-color:var(--cl-campo-bordo-hover);
}
.btn-success{--bs-btn-bg:#1d8a4e;--bs-btn-border-color:#1d8a4e;--bs-btn-hover-bg:#176f3f;--bs-btn-hover-border-color:#176f3f}
[data-bs-theme="dark"] .btn-success{--bs-btn-bg:#25a05c;--bs-btn-border-color:#25a05c;--bs-btn-hover-bg:#2eb469;--bs-btn-hover-border-color:#2eb469}
.btn-outline-danger{--bs-btn-border-color:var(--cl-campo-bordo)}
.btn-outline-danger:hover{--bs-btn-border-color:var(--bs-danger)}

/* icona sola: quadrata, non schiacciata */
.btn:has(> i:only-child){padding-left:.7rem;padding-right:.7rem}
.btn .spinner-border-sm{width:.9rem;height:.9rem;border-width:.15em}

/* --- messa a fuoco da tastiera, sempre visibile --- */
a,button,summary,[role="button"]{cursor:pointer}
:focus-visible{outline:3px solid var(--cl-teal);outline-offset:2px;border-radius:.375rem}
.form-control:focus-visible,.form-select:focus-visible,.form-check-input:focus-visible{outline:none}

/* --- struttura --- */
.navbar-brand{font-family:var(--cl-font-titoli);font-weight:600;letter-spacing:-.02em}
.nav-link[aria-current="page"]{font-weight:600;color:var(--cl-teal)!important}
.card{border-radius:var(--cl-radius)}
.card-header{font-family:var(--cl-font-titoli);font-weight:600}

/* --- identità delle famiglie --- */
.pallino{display:inline-block;width:.7rem;height:.7rem;border-radius:50%;flex:0 0 auto}
.bordo-famiglia{border-left:4px solid var(--fc)!important}
.quota-importo{font-family:var(--cl-font-titoli);font-size:1.75rem;font-weight:650;letter-spacing:-.03em;color:var(--fc)}

/* --- riquadri indicatori --- */
.stat{border-radius:var(--cl-radius);padding:1rem 1.1rem;height:100%}
.stat .stat-etichetta{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;font-weight:600;color:var(--bs-secondary-color)}
.stat .stat-valore{font-family:var(--cl-font-titoli);font-size:1.6rem;font-weight:650;letter-spacing:-.03em;line-height:1.15;margin-top:.15rem}
.stat .stat-nota{font-size:.8rem;color:var(--bs-secondary-color)}

/* --- tabelle --- */
.tabella-scroll{overflow-x:auto}
.tabella-scroll table{margin-bottom:0}
table.dataTable tbody tr>.dtr-control::before{background-color:var(--cl-teal)!important;border-color:var(--cl-teal)!important}
table.dataTable>tbody>tr.child ul.dtr-details{width:100%}
.dt-container .dt-paging .page-link{min-height:38px;display:flex;align-items:center}
.dt-container .active>.page-link{background-color:var(--cl-teal);border-color:var(--cl-teal)}
.dt-container .dt-search input,.dt-container .dt-length select{min-height:38px}
.riga-dettaglio{background:var(--bs-tertiary-bg)}

/* --- pastiglie filtro --- */
.chip{border-radius:2rem;white-space:nowrap;transition:background-color var(--cl-transizione),border-color var(--cl-transizione),opacity var(--cl-transizione)}
.chip[aria-pressed="true"]{color:#fff;font-weight:600}
.chip[aria-pressed="false"]{opacity:.6}

/* --- caricamento --- */
.scheletro{
  background:linear-gradient(90deg,var(--bs-secondary-bg) 25%,var(--bs-tertiary-bg) 37%,var(--bs-secondary-bg) 63%);
  background-size:400% 100%;animation:scorrimento 1.2s ease-in-out infinite;border-radius:var(--cl-radius-sm);
}
@keyframes scorrimento{0%{background-position:100% 50%}100%{background-position:0 50%}}
.in-attesa{opacity:.55;pointer-events:none}

@media (max-width:640px){
  .tabella-scroll th:first-child,.tabella-scroll td:first-child{
    position:sticky;left:0;background:var(--bs-body-bg);box-shadow:1px 0 0 var(--bs-border-color)
  }
  .quota-importo{font-size:1.5rem}
  .stat .stat-valore{font-size:1.35rem}
  .chip-scroll{overflow-x:auto;flex-wrap:nowrap!important;scrollbar-width:none}
  .chip-scroll::-webkit-scrollbar{display:none}
  .navbar{position:sticky;top:0;z-index:1030}
}

@media (prefers-reduced-motion:reduce){
  *{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}
@media print{
  .navbar,.btn,.dt-container .dt-search,.dt-container .dt-length,.dt-container .dt-paging{display:none!important}
  .card{border:1px solid #ccc!important;box-shadow:none!important;break-inside:avoid}
}

/* colonna di apertura del dettaglio */
td.dettaglio-col{width:2.25rem;color:var(--bs-secondary-color);text-align:center}
td.dettaglio-col:hover{color:var(--cl-teal)}
tr.aperta>td{background:var(--bs-tertiary-bg)}
.dt-container .dt-layout-row{align-items:center}
.dt-container .dt-info{color:var(--bs-secondary-color);font-size:.875rem}

/* --- elenco rilevazioni su schermo stretto --- */
.scheda-rilevazione:first-child{border-top:0!important}
.quota-pillola{
  display:inline-flex;align-items:center;gap:.35rem;
  font-size:.8125rem;line-height:1;
  padding:.35rem .6rem;border-radius:2rem;
  border:1px solid var(--bs-border-color);
  background:var(--bs-tertiary-bg);
}
.quota-pillola b{font-weight:650}