html {
  font-size: 15px;
  min-height: 100%;
}

body {
  background: #f5f7f8;
  color: #182523;
  display: flex;
  flex-direction: column;
  margin: 0;
  min-height: 100vh;
}

.page-shell {
  flex: 1 0 auto;
  width: 100%;
}

.footer {
  flex-shrink: 0;
  line-height: 1.5;
  padding: 1.5rem 0;
}

.navbar {
  box-shadow: 0 1px 0 rgba(24, 37, 35, .08);
}

.portal-brand {
  align-items: center;
  display: inline-flex;
  min-height: 42px;
  padding-bottom: 0;
  padding-top: 0;
}

.portal-brand-logo {
  display: block;
  height: 30px;
  max-width: 160px;
  object-fit: contain;
  width: auto;
}

.portal-brand-text {
  color: #07183b;
  font-weight: 800;
  letter-spacing: 0;
  margin-left: .5rem;
}

.portal-brand-logo:not([src=""]) + .portal-brand-logo + .portal-brand-text {
  position: absolute;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  white-space: nowrap;
  width: 1px;
}

.portal-brand-logo-dark,
html[data-theme="dark"] .portal-brand-logo-light {
  display: none;
}

html[data-theme="dark"] .portal-brand-logo-dark {
  display: block;
}

.theme-mode-picker {
  display: inline-flex;
}

.theme-mode-picker .form-select {
  min-width: 94px;
}

.page-header {
  align-items: flex-start;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin: 1.5rem 0 1rem;
}

.page-title {
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: 0;
  margin: 0;
}

.muted {
  color: #64736f;
}

.panel {
  background: #fff;
  border: 1px solid #dfe7e4;
  border-radius: 8px;
}

.login-shell {
  align-items: center;
  display: flex;
  min-height: calc(100vh - 170px);
  padding: 2.5rem 0;
}

.login-panel {
  box-shadow: 0 18px 50px rgba(24, 37, 35, .08);
  margin: 0 auto;
  max-width: 420px;
  padding: 2rem;
  width: 100%;
}

.metric {
  border-left: 4px solid #37a18e;
  padding: 1rem;
}

.status-pill {
  background: #e9f6f2;
  border: 1px solid #c6e5dc;
  border-radius: 999px;
  color: #146b5c;
  display: inline-flex;
  font-size: .825rem;
  font-weight: 700;
  line-height: 1;
  padding: .4rem .65rem;
}

.table > :not(caption) > * > * {
  padding: .9rem 1rem;
}

.load-accordion {
  display: grid;
}

.load-accordion-header,
.load-row-summary {
  align-items: center;
  display: grid;
  gap: .75rem;
  grid-template-columns: minmax(105px, 1.05fr) minmax(95px, .75fr) minmax(120px, .9fr) minmax(125px, .95fr) minmax(125px, .95fr) minmax(145px, 1fr) minmax(118px, auto) 1.25rem;
}

.load-accordion-header {
  border-bottom: 1px solid #dfe7e4;
  color: #64736f;
  font-size: .825rem;
  font-weight: 700;
  padding: .8rem 1rem;
  text-transform: uppercase;
}

.load-row {
  border-bottom: 1px solid #e7eeeb;
}

.load-row:last-child {
  border-bottom: 0;
}

.load-row-summary {
  cursor: pointer;
  list-style: none;
  padding: 1rem;
}

.load-row-summary::-webkit-details-marker {
  display: none;
}

.load-row-summary::after {
  color: #64736f;
  content: "+";
  font-size: 1.25rem;
  font-weight: 700;
  justify-self: end;
}

.load-row[open] > .load-row-summary::after {
  content: "-";
}

.load-row-cell {
  display: grid;
  gap: .2rem;
  min-width: 0;
}

.load-row-label {
  color: #64736f;
  display: none;
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.load-row-details {
  background: #fbfcfc;
  border-top: 1px solid #e7eeeb;
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr auto;
  padding: 1rem;
}

.load-row-meta {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.load-row-meta dt {
  color: #64736f;
  font-size: .75rem;
  text-transform: uppercase;
}

.load-row-meta dd {
  margin: 0;
}

.load-row-actions {
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  justify-content: flex-end;
}

.load-row-summary-actions {
  align-items: center;
  flex-wrap: nowrap;
}

.stop-card {
  border-bottom: 1px solid #e7eeeb;
  padding: 1rem;
}

.stop-card:last-child {
  border-bottom: 0;
}

.timeline-dot {
  background: #37a18e;
  border-radius: 999px;
  display: inline-block;
  height: .65rem;
  margin-right: .5rem;
  width: .65rem;
}

.media-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
}

.media-tile {
  border: 1px solid #dfe7e4;
  border-radius: 8px;
  padding: .75rem;
}

.media-thumb-button {
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: grid;
  gap: .35rem;
  padding: 0;
  text-align: left;
  width: 100%;
}

.media-thumb-button:focus-visible {
  border-radius: 6px;
  outline: 3px solid rgba(55, 161, 142, .35);
  outline-offset: 3px;
}

.media-thumb-button img {
  aspect-ratio: 4 / 3;
  background: #eef4f1;
  border-radius: 6px;
  object-fit: cover;
  width: 100%;
}

.media-modal-image {
  background: #eef4f1;
  border-radius: 8px;
  display: block;
  max-height: 65vh;
  object-fit: contain;
  width: 100%;
}

.media-edit-panel {
  border-top: 1px solid #e7eeeb;
  padding-top: 1rem;
}

.load-map {
  border: 1px solid #d3dfdb;
  border-radius: 8px;
  display: block;
  height: 320px;
  min-height: 260px;
  width: 100%;
}

.entity-list {
  display: grid;
}

.entity-list-header,
.entity-row-summary {
  align-items: center;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(180px, 1.4fr) minmax(180px, 1.2fr) minmax(130px, .8fr) minmax(90px, auto) 1.25rem;
}

.entity-list-header {
  border-bottom: 1px solid #dfe7e4;
  color: #64736f;
  font-size: .825rem;
  font-weight: 700;
  padding: .8rem 1rem;
  text-transform: uppercase;
}

.entity-row {
  border-bottom: 1px solid #e7eeeb;
}

.entity-row:last-child {
  border-bottom: 0;
}

.entity-row-summary {
  cursor: pointer;
  list-style: none;
  padding: 1rem;
}

.entity-row-summary::-webkit-details-marker {
  display: none;
}

.entity-row-summary::after {
  color: #64736f;
  content: "+";
  font-size: 1.25rem;
  font-weight: 700;
  justify-self: end;
}

.entity-row[open] > .entity-row-summary::after {
  content: "-";
}

.entity-row-summary > span {
  display: grid;
  gap: .2rem;
  min-width: 0;
}

.entity-row-label {
  color: #64736f;
  display: none;
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.entity-row-details {
  background: #fbfcfc;
  border-top: 1px solid #e7eeeb;
  padding: 1rem;
}

.entity-row-actions {
  align-items: center;
  border-top: 1px solid #e7eeeb;
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  justify-content: flex-end;
  margin-top: 1rem;
  padding-top: 1rem;
}

html[data-theme="dark"] body {
  background: #07111f;
  color: #ecf4ff;
}

html[data-theme="dark"] .navbar {
  background: #07111f !important;
  border-bottom-color: #203149 !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .08);
}

html[data-theme="dark"] .navbar .nav-link,
html[data-theme="dark"] .navbar .navbar-text {
  color: #d7e6fb !important;
}

html[data-theme="dark"] .navbar .nav-link:hover,
html[data-theme="dark"] .navbar .nav-link:focus {
  color: #ffffff !important;
}

html[data-theme="dark"] .navbar-toggler {
  border-color: #4b6384;
}

html[data-theme="dark"] .navbar-toggler-icon {
  filter: invert(1);
}

html[data-theme="dark"] .footer {
  background: #07111f;
  border-top-color: #203149 !important;
  color: #b8c8df !important;
}

html[data-theme="dark"] .panel,
html[data-theme="dark"] .card,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .login-panel {
  background: #0d1a2b;
  border-color: #203149;
  color: #ecf4ff;
}

html[data-theme="dark"] .muted,
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .load-accordion-header,
html[data-theme="dark"] .load-row-label,
html[data-theme="dark"] .load-row-summary::after,
html[data-theme="dark"] .entity-list-header,
html[data-theme="dark"] .entity-row-label,
html[data-theme="dark"] .entity-row-summary::after {
  color: #aebfd7 !important;
}

html[data-theme="dark"] .load-row,
html[data-theme="dark"] .entity-row,
html[data-theme="dark"] .stop-card {
  border-bottom-color: #203149;
}

html[data-theme="dark"] .load-row-details,
html[data-theme="dark"] .entity-row-details {
  background: #0a1524;
  border-top-color: #203149;
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select {
  background: #091522;
  border-color: #31445f;
  color: #ecf4ff;
}

html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus {
  background: #091522;
  color: #ecf4ff;
}

html[data-theme="dark"] .table,
html[data-theme="dark"] .table > :not(caption) > * > * {
  color: #ecf4ff;
}

html[data-theme="dark"] .btn-outline-secondary {
  border-color: #6d86a8;
  color: #d7e6fb;
}

html[data-theme="dark"] .btn-outline-primary {
  border-color: #5fa3ff;
  color: #8fc0ff;
}

@media (max-width: 991.98px) {
  .page-header {
    align-items: stretch;
    flex-direction: column;
  }

  .load-accordion-header {
    display: none;
  }

  .load-row-summary {
    align-items: start;
    gap: .85rem;
    grid-template-columns: 1fr auto;
  }

  .load-row-summary::after {
    grid-column: 2;
    grid-row: 1;
  }

  .load-row-cell {
    grid-column: 1 / -1;
  }

  .load-row-cell:first-child {
    grid-column: 1;
    grid-row: 1;
  }

  .load-row-label {
    display: inline;
  }

  .load-row-details {
    grid-template-columns: 1fr;
  }

  .load-row-meta {
    grid-template-columns: 1fr;
  }

  .load-row-actions {
    justify-content: stretch;
  }

  .load-row-actions .btn,
  .load-row-actions form,
  .load-row-actions button {
    width: 100%;
  }

  .load-row-summary-actions {
    display: none;
  }

  .entity-list-header {
    display: none;
  }

  .entity-row-summary {
    align-items: start;
    grid-template-columns: 1fr auto;
  }

  .entity-row-summary::after {
    grid-column: 2;
    grid-row: 1;
  }

  .entity-row-summary > span {
    grid-column: 1 / -1;
  }

  .entity-row-summary > span:first-child {
    grid-column: 1;
    grid-row: 1;
  }

  .entity-row-label {
    display: inline;
  }

  .entity-row-actions,
  .entity-row-actions form,
  .entity-row-actions button {
    width: 100%;
  }
}