/* ============================================================
   Rotasjonsliste – komplett CSS
   ------------------------------------------------------------
   • Toppbar delt i tre soner (venstre/midten/høyre)
   • Header: blå bakgrunn, hvit tekst (alle tabeller)
   • Roterte årstall kun for rotasjonsliste
   • Adresse/Kommentar/Sum nederst-venstre
   • Body: pysjamas-striper og hover
   • Sticky første kolonne
   • Kompakte celler med ellipsis
   • Footer: synlig over scrollbar, blå bakgrunn
   ============================================================ */

/* --- TOPPLINJE --- */
.dt-container .dt-topbar {
  display: grid !important;
  grid-template-columns: auto 1fr auto !important; /* venstre | midten | høyre */
  align-items: center !important;
  gap: 12px !important;
  padding: 6px 0 !important;
}

.dt-container .dt-zone-left,
.dt-container .dt-zone-center,
.dt-container .dt-zone-right {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  gap: 8px !important;
}

/* Nøytraliser DataTables defaults */
.dt-container .dt-length,
.dt-container .dataTables_length,
.dt-container .dt-buttons,
.dt-container .dt-search,
.dt-container .dataTables_filter {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  white-space: nowrap !important;
}

/* Søkefelt kompakt */
.dt-container .dt-zone-right .dt-search .dt-input,
.dt-container .dt-zone-right .dataTables_filter input[type="search"] {
  width: auto !important;
  min-width: 160px !important;
  max-width: 220px !important;
  padding: 4px 6px !important;
  box-sizing: border-box !important;
}

/* --- HEADER (alle tabeller) --- */
.dt-container .dt-scroll-head th {
  background: #6699cc !important;   /* blå bakgrunn */
  color: #fff !important;           /* hvit tekst */
  border: 1px solid #ddd !important;
  text-align: center !important;
  height: 64px !important;
}

.dt-container table.dataTable thead th .dt-column-header {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  height: 100% !important;
}

/* --- Roterte headere (kun rotasjonsliste) --- */
.dt-container.rotasjonsliste table.dataTable thead th[class^="column-"]:not(.column-1):not(.column-57):not(.column-58) .dt-column-title {
  display: inline-block !important;
  transform: rotate(-90deg) !important;
  transform-origin: center center !important;
  white-space: nowrap !important;
  color: #fff !important;
}

/* Sorteringsikon under teksten (kun rotasjonsliste) */
.dt-container.rotasjonsliste table.dataTable thead th .dt-column-order {
  position: relative !important;
  top: 6px !important;
  margin: 0 !important;
  align-self: center !important;
}

/* Adresse/Kommentar/Sum nederst-venstre (kun rotasjonsliste) */
.dt-container.rotasjonsliste table.dataTable thead th.column-1 .dt-column-header,
.dt-container.rotasjonsliste table.dataTable thead th.column-57 .dt-column-header,
.dt-container.rotasjonsliste table.dataTable thead th.column-58 .dt-column-header {
  align-items: flex-start !important;
  justify-content: flex-end !important;
}
.dt-container.rotasjonsliste table.dataTable thead th.column-1 .dt-column-title,
.dt-container.rotasjonsliste table.dataTable thead th.column-57 .dt-column-title,
.dt-container.rotasjonsliste table.dataTable thead th.column-58 .dt-column-title {
  transform: none !important;
  white-space: normal !important;
}

/* --- BODY --- */
.dt-container table.dataTable.stripe tbody tr.odd td { background-color: #ffffff !important; }
.dt-container table.dataTable.stripe tbody tr.even td { background-color: #f9f9f9 !important; }
.dt-container table.dataTable.hover tbody tr:hover td {
  background-color: #e6f2ff !important;
  transition: background-color 0.15s ease-in-out;
}

/* Sticky første kolonne (kun rotasjonsliste) */
.dt-container.rotasjonsliste .dt-scroll-body tbody tr td:first-child {
  position: sticky !important;
  left: 0 !important;
  z-index: 6 !important;
  background-color: inherit !important;
  background-clip: padding-box !important;
  box-shadow: 1px 0 0 #ddd !important;
}

/* Kompakte celler (kun rotasjonsliste) */
.dt-container.rotasjonsliste .dt-scroll-body tbody td {
  padding: 4px 6px !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* --- FOOTER (kun rotasjonsliste) --- */
.dt-container.rotasjonsliste .dt-scroll-foot {
  background: #6699cc !important;   /* blå bakgrunn */
  color: #fff !important;           /* hvit tekst */
  position: sticky !important;
  bottom: 0 !important;
  z-index: 7 !important;
}
.dt-container.rotasjonsliste .dt-scroll-foot th,
.dt-container.rotasjonsliste .dt-scroll-foot td {
  background: inherit !important;
  color: inherit !important;
  text-align: center !important;
  padding: 4px 6px !important;
}
/* ============================================================
   Rotasjonsliste – komplett CSS
   ------------------------------------------------------------
   • Toppbar delt i tre soner (venstre/midten/høyre)
   • Header: blå bakgrunn, hvit tekst (alle tabeller)
   • Roterte årstall kun for rotasjonsliste
   • Adresse/Kommentar/Sum nederst-venstre
   • Body: pysjamas-striper og hover
   • Sticky første kolonne
   • Kompakte celler med ellipsis
   • Footer: synlig over scrollbar, blå bakgrunn
   ============================================================ */

/* --- TOPPLINJE --- */
.dt-container .dt-topbar {
  display: grid !important;
  grid-template-columns: auto 1fr auto !important; /* venstre | midten | høyre */
  align-items: center !important;
  gap: 12px !important;
  padding: 6px 0 !important;
}

.dt-container .dt-zone-left,
.dt-container .dt-zone-center,
.dt-container .dt-zone-right {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  gap: 8px !important;
}

/* Nøytraliser DataTables defaults */
.dt-container .dt-length,
.dt-container .dataTables_length,
.dt-container .dt-buttons,
.dt-container .dt-search,
.dt-container .dataTables_filter {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  white-space: nowrap !important;
}

/* Søkefelt kompakt */
.dt-container .dt-zone-right .dt-search .dt-input,
.dt-container .dt-zone-right .dataTables_filter input[type="search"] {
  width: auto !important;
  min-width: 160px !important;
  max-width: 220px !important;
  padding: 4px 6px !important;
  box-sizing: border-box !important;
}

/* --- HEADER (alle tabeller) --- */
.dt-container .dt-scroll-head th {
  background: #6699cc !important;   /* blå bakgrunn */
  color: #fff !important;           /* hvit tekst */
  border: 1px solid #ddd !important;
  text-align: center !important;
  height: 64px !important;
}

.dt-container table.dataTable thead th .dt-column-header {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  height: 100% !important;
}

/* Roter årstall (kun tabeller med klassen rotasjonsliste, kolonner 2–56) */
table.rotasjonsliste.dataTable thead th[class^="column-"]:not(.column-1):not(.column-57):not(.column-58) .dt-column-title {
  display: inline-block !important;
  transform: rotate(-90deg) !important;
  transform-origin: center center !important;
  white-space: nowrap !important;
  color: #fff !important;
}

/* Sorteringsikon under teksten (kun rotasjonsliste) */
.dt-container.rotasjonsliste table.dataTable thead th .dt-column-order {
  position: relative !important;
  top: 6px !important;
  margin: 0 !important;
  align-self: center !important;
}

/* Adresse/Kommentar/Sum nederst-venstre (kun rotasjonsliste) */
.dt-container.rotasjonsliste table.dataTable thead th.column-1 .dt-column-header,
.dt-container.rotasjonsliste table.dataTable thead th.column-57 .dt-column-header,
.dt-container.rotasjonsliste table.dataTable thead th.column-58 .dt-column-header {
  align-items: flex-start !important;
  justify-content: flex-end !important;
}
.dt-container.rotasjonsliste table.dataTable thead th.column-1 .dt-column-title,
.dt-container.rotasjonsliste table.dataTable thead th.column-57 .dt-column-title,
.dt-container.rotasjonsliste table.dataTable thead th.column-58 .dt-column-title {
  transform: none !important;
  white-space: normal !important;
}

/* --- BODY --- */
.dt-container table.dataTable.stripe tbody tr.odd td { background-color: #ffffff !important; }
.dt-container table.dataTable.stripe tbody tr.even td { background-color: #f9f9f9 !important; }
.dt-container table.dataTable.hover tbody tr:hover td {
  background-color: #e6f2ff !important;
  transition: background-color 0.15s ease-in-out;
}

/* Sticky første kolonne (kun rotasjonsliste) */
.dt-container.rotasjonsliste .dt-scroll-body tbody tr td:first-child {
  position: sticky !important;
  left: 0 !important;
  z-index: 6 !important;
  background-color: inherit !important;
  background-clip: padding-box !important;
  box-shadow: 1px 0 0 #ddd !important;
}

/* Kompakte celler (kun rotasjonsliste) */
.dt-container.rotasjonsliste .dt-scroll-body tbody td {
  padding: 4px 6px !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* --- FOOTER (kun rotasjonsliste) --- */
.dt-container.rotasjonsliste .dt-scroll-foot {
  background: #6699cc !important;   /* blå bakgrunn */
  color: #fff !important;           /* hvit tekst */
  position: sticky !important;
  bottom: 0 !important;
  z-index: 7 !important;
}
.dt-container.rotasjonsliste .dt-scroll-foot th,
.dt-container.rotasjonsliste .dt-scroll-foot td {
  background: inherit !important;
  color: inherit !important;
  text-align: center !important;
  padding: 4px 6px !important;
}
/* --- GRID / RUTENETT --- */

/* Alle celler får tydeligere kantlinjer */
.dt-container table.dataTable th,
.dt-container table.dataTable td {
  border: 1px solid #ccc !important;   /* lys grå kant */
}

/* Header og footer får litt mørkere kant for kontrast */
.dt-container table.dataTable thead th,
.dt-container table.dataTable tfoot th {
  border: 1px solid #999 !important;
}

/* Sikre at striping og hover fortsatt vises */
.dt-container table.dataTable.stripe tbody tr.odd td {
  background-color: #ffffff !important;
}
.dt-container table.dataTable.stripe tbody tr.even td {
  background-color: #f9f9f9 !important;
}
.dt-container table.dataTable.hover tbody tr:hover td {
  background-color: #e6f2ff !important;
}
/* --- FOOTER (rotasjonsliste) --- */
.dt-container .dt-scroll-foot {
  background: #6699cc !important;   /* blå bakgrunn */
  color: #fff !important;           /* hvit tekst */
  position: sticky !important;
  bottom: 0 !important;
  z-index: 7 !important;
}

.dt-container .dt-scroll-foot th,
.dt-container .dt-scroll-foot td {
  background: inherit !important;
  color: inherit !important;
  text-align: center !important;
  padding: 4px 6px !important;
}