/* Migliora numeri allineati e leggibilità su mobile */
.font-mono {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

/* Tabella: evita overflow su colonne strette */
.table td, .table th { vertical-align: middle; white-space: nowrap; }
.table td:nth-child(2) { white-space: normal; } /* la colonna "Nome" può andare a capo */

/* Bottoni più comodi al tocco */
.btn { border-radius: 10px; }

/* Barra azioni sticky (solo mobile) */
.mobile-sticky-actions {
  position: sticky;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(33,37,41,0.95);
  color: #fff;
  border-top: 1px solid rgba(255,255,255,0.15);
  z-index: 1030;
  backdrop-filter: saturate(1.2) blur(6px);
}

/* Spaziatura contenuti principale su schermi piccoli */
@media (max-width: 767.98px) {
  body { background-color: #f8f9fa; }
  main.container { padding-bottom: 4.5rem; } /* spazio per la barra sticky */
}

/* --- Brand / tema --- */
:root {
  --prussian-blue: #003153; /* Blu di Prussia */
}

/* Sfondo globale */
body.app-bg {
  background-color: var(--prussian-blue) !important;
  min-height: 100vh;
}

/* Navbar in tinta */
.bg-prussian {
  background-color: var(--prussian-blue) !important;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

/* Leggibilità su tema scuro */
.table td, .table th { vertical-align: middle; }

.table { color: #e8f0ff; }
.table thead th { color: #ffffff; }
.table-hover tbody tr:hover { background-color: rgba(255,255,255,0.06); }

.card {
  background-color: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.15);
}

.mobile-sticky-actions {
  position: sticky;
  bottom: 0;
  background: linear-gradient(180deg, rgba(0,49,83,0.85) 0%, rgba(0,49,83,1) 40%);
  backdrop-filter: blur(6px);
  border-top: 1px solid rgba(255,255,255,.12);
}

/* Link e badge un filo più luminosi */
a { color: #b9d5ff; }
a:hover { color: #d5e6ff; }

/* Monospace per colonne numeriche, già usato nei template */
.font-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }

/* ====== Tema blu scurissimo ====== */
:root {
  --prussian-blue: #003153;   /* sfondo principale */
  --blue-deep:     #001a2d;   /* al posto del nero pieno */
  --ink-weak:      rgba(255,255,255,0.65);
}

/* Sfondo globale (già assegnato dal body.app-bg in base.html) */
body.app-bg {
  background-color: var(--prussian-blue) !important;
  min-height: 100vh;
}

/* Navbar coerente */
.bg-prussian {
  background-color: var(--prussian-blue) !important;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

/* Card e contenitori su blu molto scuro (no nero) */
.card {
  background-color: var(--blue-deep) !important;
  border-color: rgba(255,255,255,0.15) !important;
}

/* Tabella su tema scuro */
.table { color: #e8f0ff; background: transparent; }
.table thead th { color: #fff; background: rgba(255,255,255,0.05); }
.table-hover tbody tr:hover { background-color: rgba(255,255,255,0.06); }

/* Scorrimento orizzontale mobile sempre visibile */
.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Colonne ordinabili */
th.sortable { cursor: pointer; user-select: none; white-space: nowrap; }
th.sortable .sort-ind { opacity: .7; margin-left: .25rem; font-size: .8em; }
th.sortable.sorted { text-decoration: underline dotted; text-underline-offset: .2em; }

/* Badge per locations */
.badge.text-bg-secondary {
  background: rgba(255,255,255,0.12) !important;
  color: #e8f0ff !important;
  border: 1px solid rgba(255,255,255,0.15);
}

/* Barra mobile sticky */
.mobile-sticky-actions {
  position: sticky;
  bottom: 0;
  background: linear-gradient(180deg, rgba(0,26,45,0.85) 0%, rgba(0,26,45,1) 40%); /* usa blue-deep */
  backdrop-filter: blur(6px);
  border-top: 1px solid rgba(255,255,255,.12);
}

/* Monospace per numeri */
.font-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

/* ====== Tema blu scurissimo ====== */
:root {
  --prussian-blue: #003153;   /* sfondo principale */
  --blue-deep:     #001a2d;   /* al posto del nero pieno */
  --ink-weak:      rgba(255,255,255,0.65);
}

/* Sfondo globale (già assegnato dal body.app-bg in base.html) */
body.app-bg {
  background-color: var(--prussian-blue) !important;
  min-height: 100vh;
}

/* Navbar coerente */
.bg-prussian {
  background-color: var(--prussian-blue) !important;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

/* Card e contenitori su blu molto scuro (no nero) */
.card {
  background-color: var(--blue-deep) !important;
  border-color: rgba(255,255,255,0.15) !important;
}

/* Tabella su tema scuro */
.table { color: #e8f0ff; background: transparent; }
.table thead th { color: #fff; background: rgba(255,255,255,0.05); }
.table-hover tbody tr:hover { background-color: rgba(255,255,255,0.06); }

/* Scorrimento orizzontale mobile sempre visibile */
.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Colonne ordinabili */
th.sortable { cursor: pointer; user-select: none; white-space: nowrap; }
th.sortable .sort-ind { opacity: .7; margin-left: .25rem; font-size: .8em; }
th.sortable.sorted { text-decoration: underline dotted; text-underline-offset: .2em; }

/* Badge per locations */
.badge.text-bg-secondary {
  background: rgba(255,255,255,0.12) !important;
  color: #e8f0ff !important;
  border: 1px solid rgba(255,255,255,0.15);
}

/* Barra mobile sticky */
.mobile-sticky-actions {
  position: sticky;
  bottom: 0;
  background: linear-gradient(180deg, rgba(0,26,45,0.85) 0%, rgba(0,26,45,1) 40%); /* usa blue-deep */
  backdrop-filter: blur(6px);
  border-top: 1px solid rgba(255,255,255,.12);
}

/* Monospace per numeri */
.font-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.period-btn.active {
  background-color: rgba(255,255,255,.15) !important;
  border-color: rgba(255,255,255,.25) !important;
}
