.login-page-body {
  background: #071015 !important;
  min-height: 100vh;
}

.login-page-shell {
  min-height: 100vh;
}

.login-identity-screen {
  background:
    radial-gradient(circle at 84% 16%, rgba(156, 183, 197, 0.14), transparent 30rem),
    linear-gradient(110deg, rgba(6, 12, 16, 0.86) 0%, rgba(6, 12, 16, 0.68) 47%, rgba(7, 16, 21, 0.96) 48%, #071015 100%),
    url("../img/login-cave-rescue.png") center / cover no-repeat;
  color: #f5f8fa;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(26rem, 0.98fr);
  min-height: 100vh;
  overflow: hidden;
  position: relative;
}

.login-identity-screen::before {
  background:
    linear-gradient(90deg, rgba(7, 16, 21, 0.18), rgba(7, 16, 21, 0.64)),
    radial-gradient(circle at 22% 78%, rgba(0, 0, 0, 0.34), transparent 24rem);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.login-brand-panel,
.login-form-panel {
  min-height: 100vh;
  position: relative;
  z-index: 1;
}

.login-brand-panel {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(2rem, 6vw, 6.5rem);
}

.login-brand-copy {
  max-width: 34rem;
  transform: translateY(-2vh);
}

.login-logo {
  display: block;
  height: auto;
  margin-bottom: 1.2rem;
  max-width: min(30rem, 82vw);
  width: 100%;
}

.login-system-name {
  color: rgba(245, 248, 250, 0.92);
  font-size: clamp(1rem, 1.65vw, 1.55rem);
  line-height: 1.55;
  margin: 0;
  text-transform: uppercase;
}

.login-red-rule {
  background: #e32731;
  display: block;
  height: 3px;
  margin: 1.7rem 0 1.6rem;
  width: 4.6rem;
}

.login-tagline,
.login-operation-words,
.login-card-footer {
  color: rgba(245, 248, 250, 0.76);
  font-size: 0.86rem;
  letter-spacing: 0;
  text-transform: uppercase;
}

.login-tagline {
  font-size: clamp(0.86rem, 1.2vw, 1.12rem);
  margin: 0;
}

.login-operation-words {
  bottom: 2.5rem;
  left: clamp(2rem, 6vw, 6.5rem);
  margin: 0;
  position: absolute;
}

.login-form-panel {
  align-items: center;
  display: flex;
  justify-content: center;
  padding: clamp(1.25rem, 4vw, 4rem);
}

.login-topographic {
  background:
    repeating-radial-gradient(ellipse at 76% 28%, transparent 0 3.4rem, rgba(151, 178, 192, 0.13) 3.45rem 3.5rem),
    repeating-radial-gradient(ellipse at 90% 82%, transparent 0 4rem, rgba(151, 178, 192, 0.1) 4.05rem 4.1rem);
  inset: 0;
  opacity: 0.7;
  pointer-events: none;
  position: absolute;
}

.login-card {
  background:
    linear-gradient(145deg, rgba(42, 58, 67, 0.78), rgba(7, 16, 21, 0.78)),
    rgba(13, 27, 35, 0.74);
  border: 1px solid rgba(205, 220, 230, 0.24);
  border-radius: 8px;
  box-shadow: 0 1.5rem 5rem rgba(0, 0, 0, 0.42);
  max-width: 34rem;
  padding: clamp(1.5rem, 4vw, 3.9rem);
  width: min(100%, 34rem);
}

@supports (backdrop-filter: blur(18px)) {
  .login-card {
    backdrop-filter: blur(18px);
  }
}

.login-card-header {
  margin-bottom: 2rem;
}

.login-card h1 {
  color: #fff;
  font-size: clamp(1.75rem, 2.4vw, 2.45rem);
  font-weight: 500;
  line-height: 1.15;
  margin: 0 0 1rem;
}

.login-card-header p {
  color: rgba(238, 244, 247, 0.82);
  font-size: 1.05rem;
  line-height: 1.55;
  margin: 0;
}

.login-alerts .alert {
  border-radius: 8px;
}

.login-form {
  display: grid;
  gap: 1rem;
}

.login-field .form-label {
  color: rgba(238, 244, 247, 0.8);
  font-size: 0.88rem;
  font-weight: 650;
  margin-bottom: 0.45rem;
}

.login-field .form-control {
  background: rgba(10, 22, 29, 0.58);
  border: 1px solid rgba(204, 220, 230, 0.28);
  border-radius: 8px;
  color: #fff;
  font-size: 1.05rem;
  min-height: 3.75rem;
  padding: 0.95rem 1rem;
}

.login-field .form-control:focus {
  background: rgba(10, 22, 29, 0.82);
  border-color: rgba(231, 39, 49, 0.8);
  box-shadow: 0 0 0 0.22rem rgba(231, 39, 49, 0.22);
  color: #fff;
}

.login-remember {
  color: rgba(245, 248, 250, 0.88);
  margin: 0.2rem 0 0.55rem;
}

.login-remember .form-check-input {
  background-color: rgba(10, 22, 29, 0.62);
  border-color: rgba(204, 220, 230, 0.56);
}

.login-remember .form-check-input:checked {
  background-color: #d9232e;
  border-color: #d9232e;
}

.login-submit {
  background: linear-gradient(180deg, #ef4248, #bd2028);
  border: 1px solid rgba(255, 110, 116, 0.42);
  border-radius: 8px;
  color: #fff;
  font-size: 1.12rem;
  font-weight: 650;
  min-height: 3.9rem;
}

.login-submit:hover,
.login-submit:focus {
  background: linear-gradient(180deg, #ff4b50, #ca2530);
  border-color: rgba(255, 150, 154, 0.72);
  color: #fff;
}

.login-submit:focus {
  box-shadow: 0 0 0 0.22rem rgba(231, 39, 49, 0.28);
}

.login-card-footer {
  align-items: center;
  border-top: 1px solid rgba(204, 220, 230, 0.22);
  display: flex;
  gap: 1rem;
  justify-content: center;
  margin-top: 2.2rem;
  padding-top: 1.25rem;
}

.login-footer-rule {
  background: #e32731;
  display: inline-block;
  height: 2px;
  width: 1.6rem;
}

@media (max-width: 1399.98px) {
  .login-identity-screen {
    grid-template-columns: minmax(24rem, 0.9fr) minmax(25rem, 1.1fr);
  }

  .login-card {
    padding: 2.1rem;
  }

  .login-card-header {
    margin-bottom: 1.4rem;
  }

  .login-field .form-control {
    min-height: 3.3rem;
  }

  .login-submit {
    min-height: 3.4rem;
  }

  .login-card-footer {
    margin-top: 1.5rem;
  }
}

@media (max-width: 991.98px) {
  .login-identity-screen {
    background:
      linear-gradient(180deg, rgba(6, 12, 16, 0.76), rgba(7, 16, 21, 0.94)),
      url("../img/login-cave-rescue.png") center / cover no-repeat;
    display: block;
    min-height: 100vh;
    overflow: auto;
  }

  .login-brand-panel {
    min-height: auto;
    padding: 1.5rem clamp(1rem, 5vw, 2.5rem) 0;
  }

  .login-brand-copy {
    max-width: 18rem;
    transform: none;
  }

  .login-logo {
    margin-bottom: 0.65rem;
    max-width: 16rem;
  }

  .login-system-name,
  .login-red-rule,
  .login-tagline,
  .login-operation-words,
  .login-card-footer {
    display: none;
  }

  .login-form-panel {
    min-height: auto;
    padding: 1rem clamp(1rem, 5vw, 2.5rem) 1.5rem;
  }

  .login-card {
    max-width: 32rem;
    padding: 1.5rem;
  }
}

@media (max-width: 575.98px) {
  .login-brand-panel {
    padding-top: 1rem;
  }

  .login-logo {
    max-width: 12rem;
  }

  .login-form-panel {
    padding-top: 0.75rem;
  }

  .login-card {
    padding: 1.15rem;
  }

  .login-card h1 {
    font-size: 1.55rem;
  }

  .login-card-header p {
    font-size: 0.95rem;
  }

  .login-field .form-control {
    font-size: 1rem;
    min-height: 3.1rem;
  }
}

.cave-workspace {
  color: #212529;
}

.cave-toolbar {
  border-bottom: 1px solid #dee2e6;
  padding-bottom: 0.75rem;
}

.cave-map-file {
  max-width: 230px;
}

.cave-map-frame {
  position: relative;
}

.cave-map-viewport {
  border: 1px solid #ced4da;
  border-radius: 6px;
  height: clamp(460px, 72vh, 780px);
  overflow: auto;
}

.cave-map-surface {
  background: #f1f3f5;
  display: block;
  min-height: 100%;
  position: relative;
  width: 100%;
}

.cave-map-surface .konvajs-content {
  margin-left: auto;
  margin-right: auto;
}

.cave-map-empty {
  align-items: center;
  color: #6c757d;
  display: flex;
  justify-content: center;
  min-height: 420px;
  width: 100%;
}

.cave-inspector {
  background: #fff;
  border: 1px solid #ced4da;
  border-radius: 6px;
  box-shadow: 0 0.5rem 1.25rem rgba(33, 37, 41, 0.2);
  max-height: calc(100% - 2rem);
  overflow: auto;
  position: absolute;
  right: 1rem;
  top: 1rem;
  width: min(320px, calc(100% - 2rem));
  z-index: 6;
}

.cave-inspector-header {
  background: #f8f9fa;
  border-bottom: 1px solid #dee2e6;
  min-height: 2.75rem;
  padding: 0.65rem 0.75rem;
  cursor: move;
  touch-action: none;
  user-select: none;
}

.cave-inspector-body {
  padding: 0.75rem;
}

.cave-inspector .form-label {
  font-size: 0.82rem;
  font-weight: 600;
  margin-bottom: 0.25rem;
}

.cave-sector-swatch {
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 50%;
  display: inline-block;
  flex: 0 0 0.85rem;
  height: 0.85rem;
  vertical-align: middle;
  width: 0.85rem;
}

.cave-sector-teams {
  border: 1px solid #dee2e6;
  border-radius: 4px;
  max-height: 10rem;
  overflow-y: auto;
}

.cave-sector-team {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 0.6rem;
  margin: 0;
  padding: 0.35rem 0.6rem;
}

.cave-sector-team + .cave-sector-team { border-top: 1px solid #edf0f2; }
.cave-sector-team:hover { background: #f5f8fa; }
.cave-sector-team .form-check-input { flex: 0 0 auto; margin: 0; }

.cave-marker-swatch {
  align-items: center;
  background: #495057;
  border-radius: 50%;
  color: #fff;
  display: inline-flex;
  flex: 0 0 1.55rem;
  font-size: 1rem;
  font-weight: 800;
  height: 1.55rem;
  justify-content: center;
  width: 1.55rem;
}

.cave-marker-patient { background: #fff; border: 2px solid #dc3545; color: #dc3545; font-size: 1.2rem; }
.cave-marker-entrance { background: #0f766e; }
.cave-marker-base { background: #0d6efd; }
.cave-marker-danger { background: #b42318; }
.cave-marker-vox { background: #7048a3; }
.cave-marker-stretcher { background: #b7790b; }
.cave-marker-note { background: #495057; }

.cave-list-row {
  cursor: pointer;
}

.cave-list-row:hover > * {
  background: #f1f6fc;
}

.cave-notes-cell {
  max-width: 220px;
}

.cave-zoom-controls {
  background: #fff;
  border: 1px solid #ced4da;
  border-radius: 6px;
  box-shadow: 0 0.2rem 0.6rem rgba(33, 37, 41, 0.16);
  display: flex;
  left: 1rem;
  overflow: hidden;
  position: absolute;
  top: 1rem;
  z-index: 5;
}

.cave-zoom-controls .btn {
  border: 0;
  border-radius: 0;
  font-size: 1.1rem;
  height: 2.25rem;
  padding: 0;
  width: 2.25rem;
}

.cave-zoom-controls .btn + .btn {
  border-left: 1px solid #dee2e6;
}

.cave-zoom-controls .cave-zoom-value {
  font-size: 0.75rem;
  font-weight: 700;
  width: 3.25rem;
}

@media (max-width: 991.98px) {
  .cave-map-viewport {
    height: clamp(380px, 65vh, 620px);
  }
}

@media (max-width: 575.98px) {
  .cave-toolbar > div:last-child,
  #map-upload {
    width: 100%;
  }

  .cave-map-file {
    max-width: none;
    min-width: 0;
  }

  #map-upload .btn {
    flex: 0 0 auto;
  }
}

#tab-weather canvas {
  display: block;
  width: 100%;
  height: 140px;
}

.weather-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  color: #6c757d;
  font-size: 0.875rem;
}

.weather-chart-legend span {
  align-items: center;
  display: inline-flex;
  gap: 0.35rem;
}

.weather-legend-line {
  display: inline-block;
  width: 1.75rem;
}

.weather-legend-bar {
  background: #0d6efd;
  display: inline-block;
  height: 0.75rem;
  width: 0.75rem;
}

.weather-legend-line::before {
  border-top: 2px solid #0d6efd;
  content: "";
  display: block;
}

.weather-legend-line-apparent::before {
  border-color: #6c757d;
  border-style: dashed;
  border-width: 1.5px 0 0;
}

.weather-legend-line-probability::before {
  border-color: #dc3545;
}

.demo-runner-panel {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 1040;
  width: min(26rem, calc(100vw - 2rem));
  padding: 1rem;
  border: 1px solid rgba(13, 110, 253, 0.22);
  border-radius: 0.5rem;
  background: rgba(255, 255, 255, 0.98);
}

.demo-runner-panel.is-minimized {
  display: none;
}

.demo-runner-minimize {
  align-items: center;
  display: inline-flex;
  font-size: 1.1rem;
  font-weight: 700;
  height: 1.7rem;
  justify-content: center;
  line-height: 1;
  padding: 0;
  width: 1.7rem;
}

.demo-runner-restore {
  bottom: 1rem;
  position: fixed;
  right: 1rem;
  z-index: 1040;
}

.demo-progress {
  height: 0.4rem;
}

.demo-step-list {
  border-top: 1px solid #dee2e6;
  max-height: 18rem;
  overflow: auto;
  padding-top: 0.5rem;
}

.demo-step-number {
  align-items: center;
  background: #e9ecef;
  border-radius: 999px;
  color: #495057;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 0.75rem;
  font-weight: 700;
  height: 1.4rem;
  justify-content: center;
  width: 1.4rem;
}

.demo-runner-steps {
  display: grid;
  gap: 0.25rem;
  max-height: 11rem;
  overflow: auto;
}

.demo-runner-step {
  align-items: center;
  color: #6c757d;
  display: flex;
  gap: 0.5rem;
}

.demo-runner-step-current {
  color: #212529;
  font-weight: 600;
}

.demo-runner-step-current .demo-step-number {
  background: #0d6efd;
  color: #fff;
}

.demo-runner-step-done .demo-step-number {
  background: #198754;
  color: #fff;
}

.team-status-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  gap: 0.75rem;
}

.team-status-card {
  min-height: 12.5rem;
}

.team-status-card .badge {
  max-width: 5rem;
  overflow: hidden;
  text-overflow: ellipsis;
}

#tab-teams > .row > .col-12:nth-child(even) .team-card {
  background: #fbfcff;
}

#tab-teams > .row > .col-12:nth-child(odd) .team-card {
  background: #fff;
}

.team-card {
  border-color: #cfd8e3;
}

.stretcher-panel {
  background: #fff;
  border: 1px solid #cfd8e3;
  border-left: 5px solid #d39e00;
  border-radius: 6px;
  padding: 1rem;
}

.stretcher-status {
  background: #e9ecef;
  color: #212529;
}

.stretcher-status-packed {
  background: #d1e7dd;
  color: #0a3622;
}

.stretcher-status-resting {
  background: #fff3cd;
  color: #664d03;
}

.stretcher-status-out {
  background: #212529;
  color: #fff;
}

.stretcher-actions .btn {
  min-height: 2rem;
}

.stretcher-latest {
  border-top: 1px solid #e9ecef;
}

.stretcher-history-item + .stretcher-history-item {
  border-top: 1px solid #e9ecef;
}

.rescuer-status-history {
  max-height: 18rem;
  overflow-y: auto;
}

.rescuer-status-history-item + .rescuer-status-history-item {
  border-top: 1px solid #e9ecef;
}

@media (max-width: 575.98px) {
  .stretcher-actions {
    width: 100%;
  }

  .stretcher-actions .btn {
    flex: 1 1 auto;
  }

  .stretcher-history-item {
    flex-direction: column;
    gap: 0.15rem !important;
  }
}

.team-card-header {
  border-left: 4px solid #0d6efd;
  padding-left: 0.75rem;
}

.team-card-title {
  font-size: 1.08rem;
  font-weight: 750;
  line-height: 1.2;
}

.team-section-title {
  color: #2f3742;
  font-weight: 700;
}

.team-timeline-block {
  background: #fff;
  border: 1px solid #e7ebf0;
  border-radius: 6px;
  padding: 0.35rem;
}

.log-time-cell {
  min-width: 9.6rem;
  white-space: nowrap;
  width: 9.6rem;
}

.log-source-cell,
.log-unit-cell {
  min-width: 12rem;
  width: 16rem;
}

.log-source-cell {
  white-space: normal;
}

.log-unit-cell {
  white-space: normal;
}

.log-message-cell {
  min-width: 22rem;
  overflow-wrap: anywhere;
  white-space: normal;
  word-break: normal;
}

.log-category-cell {
  min-width: 12rem;
  width: 13rem;
}

.log-category-select {
  border-left-width: 4px;
}

.log-category-none { border-left-color: #a8afb6; }
.log-category-casualty { border-left-color: #cf5a55; }
.log-category-stretcher { border-left-color: #3183a3; }
.log-category-team { border-left-color: #4b9363; }
.log-category-command { border-left-color: #bf943c; }

.log-category-badge {
  background: #f5f6f7;
  border-left-style: solid;
  border-left-width: 4px;
  border-radius: 3px;
  color: #28323a;
  font-weight: 500;
  white-space: normal;
}

@media (max-width: 767.98px) {
  .log-source-cell,
  .log-unit-cell {
    min-width: 10rem;
    width: 12rem;
  }

  .log-message-cell {
    min-width: 18rem;
  }
}

.movement-mention-menu {
  background: #fff;
  border: 1px solid #ced4da;
  border-radius: 6px;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.12);
  max-height: 14rem;
  overflow: auto;
  padding: 0.25rem;
  position: absolute;
  z-index: 1080;
}

.movement-mention-item {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 4px;
  color: #212529;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
  padding: 0.4rem 0.5rem;
  text-align: left;
  width: 100%;
}

.movement-mention-item:hover,
.movement-mention-item.active {
  background: #e9f2ff;
}

.movement-mention-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.movement-mention-type {
  color: #6c757d;
  flex: 0 0 auto;
  font-size: 0.78rem;
}

.nav-link-inner {
  color: inherit;
  font: inherit;
  text-decoration: none;
}

.nav-link-inner:hover,
.nav-link-inner:focus {
  color: inherit;
  text-decoration: none;
}

.operations-log-close {
  font-size: 0.65rem;
}

tr > th:first-child,
tr > td:first-child {
  position: sticky;
  left: 0;
}

.team-timeline-heading {
  min-width: 76px;
  text-align: center;
  vertical-align: middle;
}

.team-timeline-heading span {
  display: block;
  line-height: 1.15;
  margin-bottom: 0.2rem;
}

.team-now-btn {
  font-size: 0.68rem;
  line-height: 1;
  min-width: 2.2rem;
  padding: 0.18rem 0.28rem;
}

.team-leader-badge {
  cursor: pointer;
  font-size: 0.72rem;
  line-height: 1;
  padding: 0.28rem 0.45rem;
}

.team-member-action {
  font-size: 0.72rem;
  line-height: 1;
  margin-left: 0.3rem;
  padding: 0.25rem 0.4rem;
}

.team-equipment-section {
  background: #f6f9fc;
  border: 1px solid #dbe5ef;
  border-left: 4px solid #198754;
  border-radius: 6px;
  padding: 0.8rem;
}

.team-equipment-section .table {
  background: #fff;
}

.team-equipment-section .table-light th {
  background: #eef4f8;
}

.team-equipment-summary {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
}

.team-equipment-summary-card li + li {
  border-top: 1px solid #e9ecef;
  margin-top: 0.35rem;
  padding-top: 0.35rem;
}

.team-equipment-total-card {
  border-color: #9ec5fe;
}

.chart-stat {
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: 6px;
  min-height: 84px;
  padding: 0.75rem;
}

.chart-stat-ok {
  border-color: #198754;
}

.chart-stat-warn {
  border-color: #dc3545;
}

.cave-detail-item {
  background: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: 6px;
  padding: 0.55rem 0.65rem;
}

#rc-summary {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.rc-summary-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.rc-status-card {
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 6px;
  display: inline-flex;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.15;
  min-height: 2.25rem;
  padding: 0.45rem 0.8rem;
}

.rc-status-card-onsite {
  background: #cff4fc;
  border-color: #9eeaf9;
  color: #055160;
}

.rc-status-card-assigned {
  background: #cfe2ff;
  border-color: #9ec5fe;
  color: #052c65;
}

.rc-status-card-unassigned,
.rc-status-card-away,
.rc-status-card-secondary {
  background: #e2e3e5;
  border-color: #c4c8cb;
  color: #2b2f32;
}

.rc-status-card-in-cave {
  background: #f8d7da;
  border-color: #f1aeb5;
  color: #58151c;
}

.rc-status-card-waiting {
  background: #d1e7dd;
  border-color: #a3cfbb;
  color: #0a3622;
}

.rc-status-card-resting {
  background: #fff3cd;
  border-color: #ffe69c;
  color: #664d03;
}

.chart-legend span {
  align-items: center;
  display: inline-flex;
  gap: 0.4rem;
}

.chart-swatch {
  align-items: center;
  border: 1px solid #6c757d;
  display: inline-flex;
  font-size: 0.7rem;
  font-style: normal;
  font-weight: 800;
  height: 1rem;
  justify-content: center;
  line-height: 0.9rem;
  width: 1.25rem;
}

.chart-board {
  border: 1px solid #dee2e6;
  border-radius: 6px;
  max-height: 72vh;
  overflow: auto;
}

.chart-grid {
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.78rem;
  min-width: max-content;
  width: 100%;
}

.chart-grid th,
.chart-grid td {
  border-bottom: 1px solid #c9d4df;
  border-right: 1px solid #c9d4df;
}

.chart-grid thead th {
  background: #f8f9fa;
  position: sticky;
  text-align: center;
  top: 0;
  z-index: 4;
}

.chart-name-col {
  background: #fff;
  left: 0;
  min-width: 160px;
  width: 160px;
  position: sticky;
  z-index: 3;
}

.chart-status-col {
  background: #fff;
  left: 160px;
  min-width: 96px;
  width: 96px;
  position: sticky;
  z-index: 3;
}

.chart-duration-col {
  background: #fff;
  left: 256px;
  min-width: 74px;
  width: 74px;
  position: sticky;
  text-align: center;
  z-index: 3;
}

.chart-grid thead .chart-name-col,
.chart-grid thead .chart-status-col,
.chart-grid thead .chart-duration-col {
  z-index: 5;
}

.chart-hour-col {
  min-width: 44px;
  padding: 0.25rem 0.2rem;
}

.chart-hour-col span,
.chart-hour-col small {
  display: block;
  line-height: 1.1;
}

.chart-hour-col small {
  color: #6c757d;
  font-size: 0.62rem;
}

.chart-cell {
  font-weight: 800;
  height: 30px;
  min-width: 44px;
  padding: 0;
  text-align: center;
  vertical-align: middle;
}

.chart-section-row th {
  background: #e9ecef;
  color: #495057;
  font-weight: 700;
  padding: 0.35rem 0.5rem;
  position: sticky;
  left: 0;
  z-index: 2;
}

.chart-stretcher-row .chart-name-col,
.chart-stretcher-row .chart-status-col,
.chart-stretcher-row .chart-duration-col {
  background: #fbfbfb;
  color: #6c757d;
}

.chart-cell-empty {
  background: #fff;
}

.chart-cell-outside {
  background: #cfeeff;
}

.chart-cell-work {
  background: #b7dfc2;
  color: #174f2a;
}

.chart-cell-entering {
  background: #8fd3a7;
  color: #123f22;
}

.chart-cell-rigging {
  background: #ffe08a;
  color: #5c4100;
}

.chart-cell-connected {
  background: #74c69d;
  color: #0b3d27;
}

.chart-cell-waiting {
  background: #9fc5e8;
  color: #123a5c;
}

.chart-cell-stretcher {
  background: #f4a261;
  color: #4a2705;
}

.chart-cell-stretcher-rest {
  background: #fff3cd;
  color: #664d03;
  font-weight: 700;
}

.chart-cell-base {
  background: #b8e0d2;
  color: #17483b;
}

.chart-cell-headquarters {
  background: #d5c6e8;
  color: #46345d;
}

.chart-cell-exit {
  background: #f5a3a3;
  color: #641c1c;
}

.chart-cell-out {
  background: #fff;
  color: #dc3545;
  font-weight: 800;
}

.patient-sheet {
  --patient-red: #d81920;
  color: #222;
}

.patient-section {
  border-top: 2px solid var(--patient-red);
  padding: 0.85rem 0 1.1rem;
}

.patient-section h3 {
  color: var(--patient-red);
  font-size: 0.92rem;
  font-weight: 800;
  letter-spacing: 0;
  margin: 0 0 0.75rem;
  text-transform: uppercase;
}

.patient-subtitle {
  color: var(--patient-red);
  font-size: 0.86rem;
  font-weight: 800;
  margin: 0 0 0.5rem;
}

.patient-checkline {
  align-items: center;
  display: flex;
  gap: 0.5rem;
  justify-content: flex-start;
}

.patient-checkline span {
  font-size: 0.86rem;
  font-weight: 600;
  flex: 0 1 auto;
  min-width: 0;
}

.patient-toggle .btn {
  font-weight: 700;
  min-width: 2.2rem;
}

.patient-grid {
  border: 1px solid #212529;
  min-width: 760px;
}

.patient-grid th,
.patient-grid td {
  border-color: #212529;
  font-size: 0.78rem;
  vertical-align: middle;
}

.patient-grid thead th,
.patient-grid tbody th {
  background: #fff;
  font-weight: 700;
}

.patient-grid td {
  background: #f1f3f5;
}

.patient-grid .form-control,
.patient-grid .btn {
  font-size: 0.76rem;
}

.patient-vitals-table {
  min-width: 1500px;
}

.patient-body-card {
  align-items: center;
  border: 1px solid #dee2e6;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.75rem;
}

.patient-body-card img {
  display: block;
  max-width: 360px;
  width: 100%;
}

.operation-reminders {
  display: grid;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.operation-reminder-alert {
  margin-bottom: 0;
}

.patient-instructions {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* cROMS night-operations visual system */
.croms-app-body {
  --croms-bg: #0a1014;
  --croms-surface: #111a20;
  --croms-surface-raised: #172229;
  --croms-surface-soft: #1d2a32;
  --croms-border: #34434c;
  --croms-border-strong: #52636d;
  --croms-text: #edf2f5;
  --croms-muted: #a5b3bc;
  --croms-red: #df3842;
  --croms-red-hover: #f04a53;
  --croms-cyan: #53b8d5;
  --croms-green: #53aa73;
  --croms-amber: #d8a343;
  --croms-danger: #e45b63;
  --bs-body-bg: var(--croms-bg);
  --bs-body-bg-rgb: 10, 16, 20;
  --bs-body-color: var(--croms-text);
  --bs-body-color-rgb: 237, 242, 245;
  --bs-emphasis-color: #fff;
  --bs-secondary-color: var(--croms-muted);
  --bs-tertiary-bg: var(--croms-surface-soft);
  background: var(--croms-bg);
  color: var(--croms-text);
  min-height: 100vh;
}

.croms-navbar {
  background: #080d10;
  border-bottom: 1px solid #29363e;
  box-shadow: 0 0.35rem 1.5rem rgba(0, 0, 0, 0.24);
  min-height: 3.65rem;
}

.croms-navbar .navbar-brand {
  align-items: center;
  color: #fff;
  display: inline-flex;
  font-size: 1.25rem;
  font-weight: 750;
  gap: 0.62rem;
}

.croms-navbar .navbar-brand::before {
  background: var(--croms-red);
  content: "";
  display: inline-block;
  height: 1.15rem;
  width: 0.28rem;
}

.croms-main {
  max-width: 1800px;
}

.croms-app-body a:not(.btn):not(.nav-link):not(.dropdown-item):not(.navbar-brand) {
  color: #72c6df;
}

.croms-app-body a:not(.btn):not(.nav-link):not(.dropdown-item):not(.navbar-brand):hover {
  color: #a0dded;
}

.croms-app-body .text-muted,
.croms-app-body .form-text {
  color: var(--croms-muted) !important;
}

.croms-app-body .card,
.croms-app-body .modal-content,
.croms-app-body .dropdown-menu,
.croms-app-body .list-group-item,
.croms-app-body .accordion-item,
.croms-app-body .offcanvas {
  --bs-card-bg: var(--croms-surface);
  --bs-card-border-color: var(--croms-border);
  background: var(--croms-surface);
  border-color: var(--croms-border);
  color: var(--croms-text);
}

.croms-app-body .card {
  box-shadow: 0 0.45rem 1.25rem rgba(0, 0, 0, 0.16) !important;
}

.croms-app-body .card-header,
.croms-app-body .modal-header,
.croms-app-body .modal-footer {
  background: var(--croms-surface-raised);
  border-color: var(--croms-border);
}

.croms-app-body .dropdown-item {
  color: var(--croms-text);
}

.croms-app-body .dropdown-item:hover,
.croms-app-body .dropdown-item:focus {
  background: var(--croms-surface-soft);
  color: #fff;
}

.croms-app-body .dropdown-item.active,
.croms-app-body .dropdown-item:active {
  background: var(--croms-red);
  color: #fff;
}

.croms-app-body .form-label {
  color: #d9e2e7;
  font-weight: 600;
}

.croms-app-body .form-control,
.croms-app-body .form-select,
.croms-app-body .form-check-input,
.croms-app-body .input-group-text {
  background-color: #0d151a;
  border-color: var(--croms-border-strong);
  color: var(--croms-text);
}

.croms-app-body .form-control::placeholder {
  color: #7f909a;
}

.croms-app-body .form-control:focus,
.croms-app-body .form-select:focus,
.croms-app-body .form-check-input:focus {
  background-color: #101a20;
  border-color: var(--croms-red);
  box-shadow: 0 0 0 0.2rem rgba(223, 56, 66, 0.2);
  color: #fff;
}

.croms-app-body .form-control:disabled,
.croms-app-body .form-select:disabled {
  background-color: #202b31;
  color: #87959d;
  opacity: 1;
}

.croms-app-body .form-control[type="date"],
.croms-app-body .form-control[type="time"],
.croms-app-body .form-control[type="datetime-local"] {
  color-scheme: dark;
}

.croms-app-body .form-control[type="date"]::-webkit-calendar-picker-indicator,
.croms-app-body .form-control[type="time"]::-webkit-calendar-picker-indicator,
.croms-app-body .form-control[type="datetime-local"]::-webkit-calendar-picker-indicator {
  background-color: #c6d1d7;
  border-radius: 3px;
  cursor: pointer;
  filter: none;
  margin-inline-start: 0.25rem;
  opacity: 1;
  padding: 0.18rem;
}

.croms-app-body .form-check-input:checked {
  background-color: var(--croms-red);
  border-color: var(--croms-red);
}

.croms-app-body .btn-primary {
  --bs-btn-bg: var(--croms-red);
  --bs-btn-border-color: var(--croms-red);
  --bs-btn-hover-bg: var(--croms-red-hover);
  --bs-btn-hover-border-color: var(--croms-red-hover);
  --bs-btn-active-bg: #bd2731;
  --bs-btn-active-border-color: #bd2731;
}

.croms-app-body .btn-outline-primary {
  --bs-btn-color: #f06a71;
  --bs-btn-border-color: #b9474e;
  --bs-btn-hover-bg: var(--croms-red);
  --bs-btn-hover-border-color: var(--croms-red);
}

.croms-app-body .btn-secondary,
.croms-app-body .btn-outline-secondary {
  --bs-btn-color: #d9e2e7;
  --bs-btn-border-color: #61717a;
  --bs-btn-hover-bg: #34434c;
  --bs-btn-hover-border-color: #71818a;
  --bs-btn-hover-color: #fff;
}

.croms-app-body .btn-close {
  filter: invert(1) grayscale(1) brightness(1.8);
}

.croms-app-body .nav-tabs {
  border-bottom-color: var(--croms-border);
  gap: 0.15rem;
}

.croms-app-body .nav-tabs .nav-link,
.croms-app-body .nav-pills .nav-link {
  color: #b5c2c9;
}

.croms-app-body .nav-tabs .nav-link:hover,
.croms-app-body .nav-tabs .nav-link:focus {
  background: var(--croms-surface-raised);
  border-color: var(--croms-border) var(--croms-border) transparent;
  color: #fff;
}

.croms-app-body .nav-tabs .nav-link.active {
  background: var(--croms-surface);
  border-color: var(--croms-border) var(--croms-border) var(--croms-surface);
  box-shadow: inset 0 3px 0 var(--croms-red);
  color: #fff;
}

.croms-app-body .nav-pills .nav-link.active {
  background: #354650;
  box-shadow: inset 3px 0 0 var(--croms-red);
  color: #fff;
}

.croms-app-body .table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--croms-text);
  --bs-table-border-color: var(--croms-border);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.025);
  --bs-table-striped-color: var(--croms-text);
  --bs-table-hover-bg: rgba(83, 184, 213, 0.08);
  --bs-table-hover-color: #fff;
  margin-bottom: 0;
}

.croms-app-body .table-light,
.croms-app-body .table-light > * {
  --bs-table-bg: #1b272e;
  --bs-table-color: #dfe7eb;
  --bs-table-border-color: #3b4a53;
}

.croms-app-body .table-secondary,
.croms-app-body .table-secondary > * {
  --bs-table-bg: #202b31;
  --bs-table-color: #94a2aa;
  --bs-table-border-color: #3b4850;
}

.croms-app-body .table-responsive {
  border-color: var(--croms-border);
}

.croms-app-body .bg-light,
.croms-app-body .bg-white,
.croms-app-body .bg-body {
  background-color: var(--croms-surface-raised) !important;
  color: var(--croms-text);
}

.croms-app-body .tab-content.bg-body {
  background-color: var(--croms-surface) !important;
}

.croms-app-body .border,
.croms-app-body .border-top,
.croms-app-body .border-bottom {
  border-color: var(--croms-border) !important;
}

.croms-app-body .alert {
  background: var(--croms-surface-raised);
  border-color: var(--croms-border);
  border-left-width: 4px;
  color: var(--croms-text);
}

.croms-app-body .alert-info {
  border-left-color: var(--croms-cyan);
}

.croms-app-body .alert-success {
  border-left-color: var(--croms-green);
}

.croms-app-body .alert-warning {
  border-left-color: var(--croms-amber);
}

.croms-app-body .alert-danger {
  border-left-color: var(--croms-danger);
}

.croms-app-body .alert-secondary,
.croms-app-body .alert-light {
  border-left-color: #72838c;
}

.croms-app-body .text-bg-light {
  background: #26343c !important;
  color: #e3ebef !important;
}

.croms-app-body .pagination {
  --bs-pagination-bg: var(--croms-surface);
  --bs-pagination-border-color: var(--croms-border);
  --bs-pagination-color: #9fd7e7;
  --bs-pagination-hover-bg: var(--croms-surface-soft);
  --bs-pagination-hover-border-color: var(--croms-border-strong);
  --bs-pagination-active-bg: var(--croms-red);
  --bs-pagination-active-border-color: var(--croms-red);
}

.croms-app-body .cave-workspace,
.croms-app-body .patient-sheet {
  color: var(--croms-text);
}

.croms-app-body .cave-map-viewport,
.croms-app-body .cave-inspector,
.croms-app-body .cave-zoom-controls,
.croms-app-body .cave-sector-teams {
  border-color: var(--croms-border);
}

.croms-app-body .cave-map-surface {
  background: #0d1418;
}

.croms-app-body .cave-map-empty,
.croms-app-body .weather-chart-legend {
  color: var(--croms-muted);
}

.croms-app-body .cave-inspector,
.croms-app-body .cave-zoom-controls,
.croms-app-body .movement-mention-menu,
.croms-app-body .demo-runner-panel {
  background: rgba(17, 26, 32, 0.98);
  border-color: var(--croms-border);
  color: var(--croms-text);
}

.croms-app-body .cave-inspector-header {
  background: var(--croms-surface-raised);
  border-color: var(--croms-border);
}

.croms-app-body .cave-sector-team + .cave-sector-team,
.croms-app-body .cave-zoom-controls .btn + .btn {
  border-color: var(--croms-border);
}

.croms-app-body .cave-sector-team:hover,
.croms-app-body .cave-list-row:hover > *,
.croms-app-body .movement-mention-item:hover,
.croms-app-body .movement-mention-item.active {
  background: #22323b;
}

.croms-app-body .movement-mention-item {
  color: var(--croms-text);
}

.croms-app-body .movement-mention-type {
  color: var(--croms-muted);
}

.croms-app-body #tab-teams > .row > .col-12:nth-child(even) .team-card,
.croms-app-body #tab-teams > .row > .col-12:nth-child(odd) .team-card,
.croms-app-body .stretcher-panel,
.croms-app-body .team-timeline-block,
.croms-app-body .team-equipment-section,
.croms-app-body .team-equipment-section .table,
.croms-app-body .chart-stat,
.croms-app-body .cave-detail-item {
  background: var(--croms-surface);
  border-color: var(--croms-border);
  color: var(--croms-text);
}

.croms-app-body .team-section-title {
  color: #d9e3e8;
}

.croms-app-body .team-equipment-section .table-light th {
  background: #1b272e;
}

.croms-app-body .log-category-badge {
  background: #202c33;
  color: #e1e8ec;
}

.croms-app-body .log-category-select.log-category-none,
.croms-app-body .log-category-badge.log-category-none {
  border-left-color: #909da5;
}

.croms-app-body .log-category-select.log-category-casualty,
.croms-app-body .log-category-badge.log-category-casualty {
  border-left-color: var(--croms-danger);
}

.croms-app-body .log-category-select.log-category-stretcher,
.croms-app-body .log-category-badge.log-category-stretcher {
  border-left-color: var(--croms-cyan);
}

.croms-app-body .log-category-select.log-category-team,
.croms-app-body .log-category-badge.log-category-team {
  border-left-color: var(--croms-green);
}

.croms-app-body .log-category-select.log-category-command,
.croms-app-body .log-category-badge.log-category-command {
  border-left-color: var(--croms-amber);
}

.croms-app-body #rc-table tr.table-success .rc-details,
.croms-app-body #rc-table tr.table-danger .rc-details,
.croms-app-body #rc-table tr.table-warning .rc-details,
.croms-app-body #rc-table tr.table-primary .rc-details {
  background: rgba(255, 255, 255, 0.5);
  border-color: rgba(15, 28, 35, 0.62);
  color: #122028;
}

.croms-app-body #rc-table tr.table-success .rc-details:hover,
.croms-app-body #rc-table tr.table-danger .rc-details:hover,
.croms-app-body #rc-table tr.table-warning .rc-details:hover,
.croms-app-body #rc-table tr.table-primary .rc-details:hover {
  background: #172229;
  border-color: #172229;
  color: #fff;
}

.croms-app-body #rc-table tr.table-secondary .rc-details {
  background: rgba(255, 255, 255, 0.04);
  border-color: #82919a;
  color: #f0f4f6;
}

.croms-app-body .patient-grid {
  border-color: var(--croms-border-strong);
}

.croms-app-body .patient-grid th,
.croms-app-body .patient-grid td {
  border-color: var(--croms-border-strong);
}

.croms-app-body .patient-grid thead th,
.croms-app-body .patient-grid tbody th {
  background: #18242b;
}

.croms-app-body .patient-grid td,
.croms-app-body .patient-body-card {
  background: #10191e;
  border-color: var(--croms-border);
}

.croms-app-body .chart-board,
.croms-app-body .chart-grid th,
.croms-app-body .chart-grid td {
  border-color: var(--croms-border);
}

.croms-app-body .chart-grid thead th,
.croms-app-body .chart-name-col,
.croms-app-body .chart-status-col,
.croms-app-body .chart-duration-col,
.croms-app-body .chart-cell-empty,
.croms-app-body .chart-cell-out {
  background: #111a20;
}

.croms-app-body .chart-section-row th {
  background: #202c33;
  color: #d4dee3;
}

.croms-app-body .chart-stretcher-row .chart-name-col,
.croms-app-body .chart-stretcher-row .chart-status-col,
.croms-app-body .chart-stretcher-row .chart-duration-col {
  background: #151f25;
  color: var(--croms-muted);
}

@media (max-width: 575.98px) {
  .croms-navbar .container-fluid {
    align-items: flex-start;
    gap: 0.7rem;
  }

  .croms-navbar .d-flex {
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .croms-main {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}