/* ============================================================
   Sistema Turni CB - Stile principale
   Cigno Bianco - Consorzio Casa Anziani Agno·Bioggio·Magliaso·Neggio
   ============================================================ */

/* ─── Variabili brand Cigno Bianco ──────────────────── */
:root {
  --cb-navy:      #0D3560;  /* navy scuro - testo logo */
  --cb-blue:      #1A5FA8;  /* blu primario brand */
  --cb-blue-mid:  #2B82D0;  /* blu medio - hover/interattivi */
  --cb-logo:      #5A9FD4;  /* blu logo (quadrati) */
  --cb-pale:      #EBF4FC;  /* sfondo azzurro pallido */
  --cb-border:    #B8D4ED;  /* bordi azzurri */
  --danger:       #c62828;
  --warn:         #f57f17;
  --cell-size:    34px;
  --font-main:    'Segoe UI', system-ui, -apple-system, sans-serif;
}

/* ─── Base ───────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: var(--font-main);
  background: #f5f7fa;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

a { color: var(--green-mid); }
a:hover { color: var(--green-dark); }

/* ─── Navbar ─────────────────────────────────────────── */
.bg-primary-custom { background-color: var(--cb-navy) !important; }
.text-primary-custom { color: var(--cb-blue) !important; }
.bg-info-custom { background-color: var(--cb-blue) !important; }

.navbar-dark .navbar-nav .nav-link.active {
  background: rgba(255,255,255,.15);
  border-radius: 6px;
}
.navbar-dark .navbar-nav .nav-link:hover {
  background: rgba(255,255,255,.1);
  border-radius: 6px;
}

/* ─── Footer ─────────────────────────────────────────── */
.footer-app {
  background: var(--cb-pale);
  border-top: 1px solid var(--cb-border);
  margin-top: auto;
}

/* ─── Dashboard Cards ────────────────────────────────── */
.card-dashboard {
  transition: transform .15s, box-shadow .15s;
}
.card-dashboard:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0,0,0,.12) !important;
}
.card-icon {
  font-size: 2rem;
  line-height: 1;
}
.card-value {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.1;
}
.card-label {
  font-size: .8rem;
  color: #666;
}

/* ─── Tabella Piano Turni ────────────────────────────── */
.table-turni {
  min-width: max-content;
  table-layout: fixed;
  font-size: .78rem;
}
.table-turni thead th {
  vertical-align: middle;
  white-space: nowrap;
}
.col-persona {
  width: 160px;
  min-width: 140px;
  text-align: left;
  position: sticky;
  left: 0;
  z-index: 2;
  background: #fff;
}
.table-turni thead .col-persona {
  background: #212529;
  z-index: 3;
}
.col-info  { width: 52px; min-width: 42px; }
.col-ore   { width: 58px; min-width: 52px; }
.col-giorno {
  width: var(--cell-size);
  min-width: 28px;
  padding: 2px 1px !important;
}

/* Celle turno */
.turno-cell {
  width: var(--cell-size);
  min-width: 28px;
  height: 32px;
  padding: 2px 1px !important;
  vertical-align: middle;
  position: relative;
  font-weight: 600;
  font-size: .73rem;
  transition: filter .1s;
}
.turno-cell:hover {
  filter: brightness(0.88);
  cursor: pointer;
}
.turno-code { display: block; line-height: 1.2; }

/* Giorno non lavorativo */
.bg-giorno-libero { background: #eceff1 !important; color: #90a4ae !important; }

/* Anomalie */
.col-anomalia { background: #fff3e0 !important; }
.cell-anomalia { outline: 2px solid #e53935 !important; outline-offset: -1px; }
.day-anomalia-dot {
  width: 6px; height: 6px;
  background: #e53935;
  border-radius: 50%;
  margin: 0 auto;
}

/* Modifica manuale */
.cell-manuale::after {
  content: '*';
  position: absolute;
  top: 0; right: 1px;
  font-size: 8px;
  color: #1565c0;
  font-weight: 700;
}
.manuale-dot {
  font-size: 8px;
  color: #1565c0;
  font-weight: 700;
  position: absolute;
  top: 0; right: 1px;
}

/* Intestazione giorno */
.day-dow { font-size: .65rem; opacity: .75; line-height: 1; }

/* Riga presenze */
.presenze-row td { font-size: .72rem; height: 20px; padding: 1px !important; }

/* Drag & Drop */
.turno-cell.drag-over {
  outline: 3px dashed var(--green-mid) !important;
  filter: brightness(0.92);
}
.turno-cell[draggable="true"] { cursor: grab; }
.turno-cell[draggable="true"]:active { cursor: grabbing; opacity: .8; }

/* ─── Tabella Piano Vacanze ──────────────────────────── */
.table-vacanze {
  min-width: max-content;
  font-size: .75rem;
}
.col-persona-vac {
  min-width: 140px;
  position: sticky;
  left: 0;
  background: #fff;
  z-index: 2;
}
.table-vacanze thead .col-persona-vac { background: #424242; z-index: 3; }
.col-vac-day { width: 28px; min-width: 22px; padding: 2px 1px !important; }
.vac-cell-clickable { cursor: pointer; transition: filter .1s; }
.vac-cell-clickable:hover { filter: brightness(.88); }

/* ─── Bottoni extra small ────────────────────────────── */
.btn-xs {
  padding: .15rem .35rem;
  font-size: .75rem;
  line-height: 1.3;
  border-radius: .25rem;
}

/* ─── Badges pulsanti legenda ────────────────────────── */
.badge-legenda {
  font-size: .7rem;
  cursor: default;
}

/* ─── Alert anomalie stampa ──────────────────────────── */
@media print {
  .navbar, .footer-app, button, .btn, .modal, .no-print { display: none !important; }
  .col-persona { position: static !important; }
  .col-persona-vac { position: static !important; }
  body { background: white; }
  .cell-anomalia { outline: 2px solid red !important; }
  @page { size: A4 landscape; margin: 8mm; }
}

/* ─── Spinner overlay ────────────────────────────────── */
#loadingOverlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,.35);
  display: flex; align-items: center; justify-content: center;
}

/* ─── Responsive ─────────────────────────────────────── */
@media (max-width: 576px) {
  .card-value { font-size: 1.4rem; }
  .col-persona { width: 110px; min-width: 90px; font-size: .72rem; }
}

@media (max-width: 768px) {
  .table-turni { font-size: .72rem; }
  .col-giorno, .turno-cell { width: 26px; min-width: 22px; font-size: .68rem; }
}

/* ─── Dark mode supporto base ────────────────────────── */
@media (prefers-color-scheme: dark) {
  body { background: #0a1628; color: #e0e0e0; }
  .card { background: #0d2040; border-color: #1a3d6e; }
  .table { color: #e0e0e0; }
  .col-persona, .col-persona-vac { background: #0d2040; }
  .bg-giorno-libero { background: #1a2a3e !important; }
}

/* ─── Scrollbar personalizzata ───────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb { background: var(--cb-border); border-radius: 3px; }
::-webkit-scrollbar-track { background: var(--cb-pale); }

/* ─── Navbar logo brand ──────────────────────────────── */
.navbar-logo-img {
  height: 38px;
  width: auto;
  filter: brightness(0) invert(1); /* Bianco su sfondo scuro */
}
.navbar-brand-text {
  line-height: 1.1;
}
.navbar-brand-text span.brand-title {
  font-size: .95rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.navbar-brand-text span.brand-sub {
  font-size: .62rem;
  letter-spacing: .06em;
  opacity: .8;
  display: block;
  text-transform: uppercase;
}

/* ─── Login page ─────────────────────────────────────── */
.login-bg {
  background: linear-gradient(140deg, var(--cb-navy) 0%, var(--cb-blue) 55%, var(--cb-logo) 100%);
}
.login-logo-wrap {
  background: white;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  box-shadow: 0 2px 12px rgba(0,0,0,.18);
}
.login-logo-wrap img {
  height: 56px;
  width: auto;
}
.login-logo-fallback {
  font-size: 3rem;
  color: var(--cb-blue);
}

/* ─── Badge CR intorno a vacanza ────────────────────── */
.cell-vacanza-surround {
  outline: 2px dashed var(--cb-blue-mid) !important;
  outline-offset: -1px;
}

/* ─── Turno equo highlight ───────────────────────────── */
.ore-ok    { color: #1B5E20; }
.ore-warn  { color: #E65100; font-weight: 600; }
.ore-info  { color: var(--cb-blue); font-weight: 600; }

/* ─── Card dashboard - bordi blu ────────────────────── */
.card-dashboard:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 20px rgba(26,95,168,.18) !important;
}

/* ─── Tabella intestazione blu ───────────────────────── */
.table-turni thead.thead-cb th,
.table-dark {
  background-color: var(--cb-navy) !important;
}

/* ─── Print: colori scritti in bn ────────────────────── */
@media print {
  .navbar, .footer-app, button:not(.print-keep),
  .btn, .modal, .no-print, #anomalie-banner .btn { display: none !important; }
  .col-persona, .col-persona-vac { position: static !important; }
  body { background: white; font-size: 8pt; }
  .cell-anomalia { outline: 2px solid red !important; }
  .table-turni { font-size: 7pt; }
  h4 { font-size: 11pt; }
  @page { size: A4 landscape; margin: 6mm; }
  /* Intestazione stampa */
  body::before {
    content: '';
    display: block;
  }
}