/* =============================================================
   restyle.css — restyling conservativo dell'interfaccia.

   Si carica DOPO bootstrap e styles.css e non tocca il markup:
   struttura, menu, colori semantici e gradiente #667eea -> #764ba2
   restano quelli di prima. Cambia il disegno: superfici piu' quiete,
   colore semantico spostato dai fondi pieni alle icone, tabelle piu'
   respirate, numeri in cifre tabellari.

   Le card statistiche col gradiente (inline, .card-gradient,
   .card-grad) restano volutamente a gradiente: sono l'ancora visiva
   della pagina. Solo le varianti a tinta piena (.bg-success e simili)
   diventano chiare.
   ============================================================= */

:root {
  --odv-accento: #667eea;
  --odv-accento-2: #764ba2;
  --odv-grad: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --odv-pagina: #f6f7fb;
  --odv-inchiostro: #212529;
  --odv-muto: #6c757d;
  --odv-linea: #e9ecef;
  --odv-linea-tenue: #f1f3f5;
  --odv-bordo-card: rgba(16, 24, 40, .07);
  --odv-ombra: 0 1px 2px rgba(16, 24, 40, .06);
  --odv-ombra-alta: 0 8px 24px rgba(16, 24, 40, .10);
  --odv-raggio: 12px;
}

/* ---------------------------------------------------- fondamenta */
body {
  background: var(--odv-pagina);
  color: var(--odv-inchiostro);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 { letter-spacing: -.014em; }

/* titolo di pagina: 26px invece di 32px, piu' vicino al sottotitolo */
h1.h2 { font-size: 1.625rem; font-weight: 650; letter-spacing: -.024em; }
h1.h2 + p, h1.h2 ~ p.text-muted { font-size: .855rem; }

/* i numeri non devono ballare quando cambiano */
.table td, .table th, .num, .stat-card h2, .stat-card h3 { font-variant-numeric: tabular-nums; }

/* --------------------------------------------------------- card */
.card {
  border: 1px solid var(--odv-bordo-card);
  border-radius: var(--odv-raggio);
  box-shadow: var(--odv-ombra);
}
.card.shadow-sm { box-shadow: var(--odv-ombra) !important; }
.card > .card-header:first-child { border-radius: var(--odv-raggio) var(--odv-raggio) 0 0; }
.card > .card-footer:last-child,
.card > .table-responsive:last-child,
.card > .card-body:last-child { border-radius: 0 0 var(--odv-raggio) var(--odv-raggio); }

.card-header {
  padding: .8rem 1.15rem;
  border-bottom: 1px solid rgba(16, 24, 40, .06);
}
.card-header h5, .card-header h6 { font-size: .95rem; font-weight: 650; }
.card-header.bg-white, .card-header.bg-light { background-color: #fff !important; }

.card-body { padding: 1.15rem; }

/* ------------------------------------------- card statistiche */
.stat-card {
  border: 1px solid var(--odv-bordo-card);
  border-radius: var(--odv-raggio);
  transition: transform .18s ease, box-shadow .18s ease;
}
.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--odv-ombra-alta) !important;
}
.stat-card .card-body { padding: 1.1rem 1.25rem; }

.stat-card h6 {
  font-size: .69rem;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  opacity: 1 !important;
}
.stat-card h2 { font-size: 1.55rem; font-weight: 650; letter-spacing: -.02em; }
.stat-card .opacity-75 { opacity: 1 !important; }

/* pastiglia icona: da cerchio 50px a quadrato arrotondato 40px */
.stat-card .stat-icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 10px !important;
  font-size: 1.05rem !important;
}

/* varianti a tinta piena -> fondo bianco, colore sull'icona */
.card.stat-card.bg-primary,
.card.stat-card.bg-success,
.card.stat-card.bg-warning,
.card.stat-card.bg-danger,
.card.stat-card.bg-info,
.card.stat-card.bg-secondary,
.card.stat-card.bg-dark { background-color: #fff !important; }

.card.stat-card.bg-primary .card-body,
.card.stat-card.bg-success .card-body,
.card.stat-card.bg-warning .card-body,
.card.stat-card.bg-danger .card-body,
.card.stat-card.bg-info .card-body,
.card.stat-card.bg-secondary .card-body,
.card.stat-card.bg-dark .card-body { color: var(--odv-inchiostro) !important; }

.card.stat-card.bg-primary .card-body h6,
.card.stat-card.bg-success .card-body h6,
.card.stat-card.bg-warning .card-body h6,
.card.stat-card.bg-danger .card-body h6,
.card.stat-card.bg-info .card-body h6,
.card.stat-card.bg-secondary .card-body h6,
.card.stat-card.bg-dark .card-body h6,
.card.stat-card.bg-primary .card-body small,
.card.stat-card.bg-success .card-body small,
.card.stat-card.bg-warning .card-body small,
.card.stat-card.bg-danger .card-body small,
.card.stat-card.bg-info .card-body small,
.card.stat-card.bg-secondary .card-body small,
.card.stat-card.bg-dark .card-body small,
.card.stat-card.bg-primary .card-body .small,
.card.stat-card.bg-success .card-body .small,
.card.stat-card.bg-warning .card-body .small,
.card.stat-card.bg-danger .card-body .small,
.card.stat-card.bg-info .card-body .small,
.card.stat-card.bg-secondary .card-body .small,
.card.stat-card.bg-dark .card-body .small { color: var(--odv-muto) !important; }

/* barre di avanzamento dentro le card diventate chiare */
.card.stat-card.bg-primary .progress,
.card.stat-card.bg-success .progress,
.card.stat-card.bg-warning .progress,
.card.stat-card.bg-danger .progress,
.card.stat-card.bg-info .progress,
.card.stat-card.bg-secondary .progress { background-color: var(--odv-linea) !important; }
.card.stat-card.bg-primary .progress-bar.bg-white { background-color: #0d6efd !important; }
.card.stat-card.bg-success .progress-bar.bg-white { background-color: #198754 !important; }
.card.stat-card.bg-warning .progress-bar.bg-white { background-color: #cc9a06 !important; }
.card.stat-card.bg-danger .progress-bar.bg-white { background-color: #dc3545 !important; }
.card.stat-card.bg-info .progress-bar.bg-white { background-color: #0aa2c0 !important; }
.card.stat-card.bg-secondary .progress-bar.bg-white { background-color: #6c757d !important; }

/* tinta dell'icona per variante */
.card.stat-card.bg-primary .stat-icon { background-color: rgba(13, 110, 253, .10) !important; color: #0a58ca !important; }
.card.stat-card.bg-success .stat-icon { background-color: rgba(25, 135, 84, .10) !important; color: #146c43 !important; }
.card.stat-card.bg-warning .stat-icon { background-color: rgba(255, 193, 7, .18) !important; color: #997404 !important; }
.card.stat-card.bg-danger .stat-icon { background-color: rgba(220, 53, 69, .10) !important; color: #b02a37 !important; }
.card.stat-card.bg-info .stat-icon { background-color: rgba(13, 202, 240, .16) !important; color: #087990 !important; }
.card.stat-card.bg-secondary .stat-icon { background-color: rgba(108, 117, 125, .10) !important; color: #495057 !important; }
.card.stat-card.bg-dark .stat-icon { background-color: rgba(33, 37, 41, .08) !important; color: #212529 !important; }

/* la card a gradiente resta a gradiente: la sua icona resta chiara */
.stat-card.card-gradient .stat-icon,
.stat-card.card-grad .stat-icon { background-color: rgba(255, 255, 255, .22) !important; }

/* ------------------------------------------------------ tabelle */
.table { --bs-table-hover-bg: #f9fafb; }
.table > thead > tr > th,
.table > thead.table-light > tr > th {
  --bs-table-bg: #f8f9fa;
  --bs-table-accent-bg: transparent;
  background-color: #f8f9fa;
  color: var(--odv-muto);
  font-size: .69rem;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  padding: .72rem 1.1rem;
  border-bottom: 1px solid var(--odv-linea);
}
.table > tbody > tr > td {
  padding: .85rem 1.1rem;
  border-color: var(--odv-linea-tenue);
}
.table > tbody > tr:last-child > td { border-bottom-width: 0; }

/* azioni di riga: quadratini soffici invece dei bottoni a tinta piena */
.table .btn-group .btn-sm,
.table .btn-group-sm > .btn {
  border-radius: 8px;
  border: 1px solid rgba(16, 24, 40, .06);
}
.table .btn-group .btn-sm.btn-primary   { background-color: rgba(13, 110, 253, .10); color: #0a58ca; }
.table .btn-group .btn-sm.btn-success   { background-color: rgba(25, 135, 84, .10);  color: #146c43; }
.table .btn-group .btn-sm.btn-warning   { background-color: rgba(255, 193, 7, .18);  color: #997404; }
.table .btn-group .btn-sm.btn-danger    { background-color: rgba(220, 53, 69, .10);  color: #b02a37; }
.table .btn-group .btn-sm.btn-info      { background-color: rgba(13, 202, 240, .16); color: #087990; }
.table .btn-group .btn-sm.btn-secondary { background-color: rgba(108, 117, 125, .10); color: #495057; }
.table .btn-group .btn-sm:hover { filter: brightness(.96); }

/* -------------------------------------------------------- badge */
.badge {
  border-radius: 999px;
  padding: .34em .7em;
  font-size: .715rem;
  font-weight: 650;
}
.badge.bg-primary   { background-color: rgba(13, 110, 253, .10) !important; color: #0a58ca !important; }
.badge.bg-success   { background-color: rgba(25, 135, 84, .10) !important;  color: #146c43 !important; }
.badge.bg-warning   { background-color: rgba(255, 193, 7, .18) !important;  color: #997404 !important; }
.badge.bg-danger    { background-color: rgba(220, 53, 69, .10) !important;  color: #b02a37 !important; }
.badge.bg-info      { background-color: rgba(13, 202, 240, .16) !important; color: #087990 !important; }
.badge.bg-secondary { background-color: rgba(108, 117, 125, .10) !important; color: #495057 !important; }
/* i badge dentro le intestazioni a gradiente restano chiari */
.card-header .badge.bg-white, .badge.bg-light { color: #344054 !important; }

/* ------------------------------------------------------ bottoni */
.btn { border-radius: 8px; font-weight: 600; }
.btn-sm { border-radius: 7px; }
.btn-lg { border-radius: 10px; }
.btn i { margin-right: .3rem; }
.btn-outline-secondary { border-color: #dee2e6; color: #344054; }
.btn-outline-secondary:hover { background-color: #f8f9fa; border-color: #cfd4dc; color: #212529; }

/* -------------------------------------------------------- form */
.form-label { font-size: .8rem; font-weight: 650; color: #344054; margin-bottom: .4rem; }
.form-control, .form-select {
  border-radius: 9px;
  border-color: #dee2e6;
  min-height: 42px;
}
.form-control-sm, .form-select-sm { min-height: 34px; border-radius: 7px; }
.form-control:focus, .form-select:focus {
  border-color: #a3b0f2;
  box-shadow: 0 0 0 4px rgba(102, 126, 234, .15);
}
.input-group-text {
  border-radius: 9px;
  background-color: #fff;
  border-color: #dee2e6;
  color: #98a2b3;
}
.form-check-input { border-radius: 5px; border-color: #cfd4dc; }
.form-check-input:focus { border-color: #a3b0f2; box-shadow: 0 0 0 4px rgba(102, 126, 234, .15); }

/* ------------------------------------------------------ navbar */
.navbar.py-3 { padding-top: .45rem !important; padding-bottom: .45rem !important; }
.navbar-brand img { height: 32px !important; }
.navbar-brand small { font-size: .68rem !important; opacity: .62; letter-spacing: .01em; }
.navbar-nav .nav-item.mx-2 { margin-left: 2px !important; margin-right: 2px !important; }
.navbar .nav-link {
  padding: .45rem .7rem;
  border-radius: 8px;
  font-size: .875rem;
  font-weight: 500;
  color: rgba(255, 255, 255, .74);
  transition: background-color .15s ease, color .15s ease;
}
.navbar .nav-link:hover, .navbar .nav-link:focus {
  background-color: rgba(255, 255, 255, .10);
  color: #fff;
}
.navbar .nav-link.active, .navbar .nav-link.show {
  background-color: rgba(255, 255, 255, .13);
  color: #fff;
  font-weight: 600;
}
.navbar .dropdown-toggle::after { opacity: .5; }

.dropdown-menu {
  border-radius: var(--odv-raggio);
  border: 1px solid rgba(16, 24, 40, .08);
  box-shadow: 0 12px 28px rgba(16, 24, 40, .12);
  padding: .35rem;
}
.dropdown-item { border-radius: 8px; padding: .48rem .7rem; font-size: .875rem; }
.dropdown-item i { width: 1.1rem; }
.dropdown-header {
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: #98a2b3;
  padding: .5rem .7rem .3rem;
}

/* ------------------------------------------------ avvisi, modali */
.alert { border-radius: var(--odv-raggio); border: 1px solid rgba(16, 24, 40, .06); }
.modal-content { border-radius: 14px; border: 0; box-shadow: 0 24px 60px rgba(16, 24, 40, .18); }
.modal-header, .modal-footer { border-color: var(--odv-linea); }

/* ---------------------------------------------------- DataTables */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
  border: 1px solid #dee2e6;
  border-radius: 8px;
  padding: .3rem .6rem;
  min-height: 34px;
}
.dataTables_wrapper .dataTables_filter input:focus,
.dataTables_wrapper .dataTables_length select:focus {
  outline: 0;
  border-color: #a3b0f2;
  box-shadow: 0 0 0 4px rgba(102, 126, 234, .15);
}
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter { font-size: .82rem; color: var(--odv-muto); }
.dataTables_wrapper .dataTables_paginate .paginate_button { border-radius: 8px !important; }
.page-link { border-radius: 8px; margin: 0 2px; border-color: var(--odv-linea); }

/* -------------------------------------------------------- footer */
footer.bg-light {
  background-color: #fff !important;
  border-top: 1px solid var(--odv-linea);
  color: #98a2b3;
}

/* ================================================================
   Dashboard (index.html): stesse card, stesso testo, disposizione
   in riga invece che centrata. La tinta della pastiglia deriva dal
   colore dell'icona (text-primary, text-success, ...), cosi' non
   serve una regola per variante.
   ================================================================ */
h3.dash-section {
  display: flex;
  align-items: center;
  gap: .75rem;
  font-size: .72rem !important;
  font-weight: 750;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: #5a6fd6 !important;
}
h3.dash-section::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: var(--odv-linea);
}

.hover-card { border: 1px solid var(--odv-bordo-card); border-radius: var(--odv-raggio); }
.hover-card .card-body {
  display: grid;
  grid-template-columns: 40px 1fr;
  column-gap: .85rem;
  align-items: center;
  text-align: left !important;
  padding: 1rem 1.1rem !important;
}
.hover-card .card-body > i {
  grid-row: span 2;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem !important;
  margin-bottom: 0 !important;
  background: var(--odv-linea-tenue);
  background: color-mix(in srgb, currentColor 12%, transparent);
}
.hover-card .card-title {
  grid-column: 2;
  margin: 0;
  font-size: .93rem;
  font-weight: 650;
  letter-spacing: -.012em;
  color: var(--odv-inchiostro);
}
.hover-card .card-text {
  grid-column: 2;
  margin: .1rem 0 0 !important;
  font-size: .785rem;
  line-height: 1.35;
}
