:root {
  --page-bg: #ffffff;
  --panel-bg: #ffffff;
  --panel-bg-secondary: #f8f9fa;
  --text-primary: #212529;
  --text-secondary: #6c757d;
  --border-color: #dee2e6;
  --input-bg: #ffffff;
  --input-text: #212529;
  --input-placeholder: #6c757d;
  --link-color: #0d6efd;
  --button-bg: #0d6efd;
  --button-text: #ffffff;
  --table-header-bg: #f8f9fa;
  --table-row-hover: #f2f5f8;
  --shadow-color: rgba(0, 0, 0, .15);
  --focus-color: #0d6efd;
}

html[data-theme="dark"] {
  --page-bg: #080a0d;
  --panel-bg: #161a1f;
  --panel-bg-secondary: #20262d;
  --text-primary: #f8f9fa;
  --text-secondary: #c7ced6;
  --border-color: #66717d;
  --input-bg: #11151a;
  --input-text: #ffffff;
  --input-placeholder: #aeb7c1;
  --link-color: #70b7ff;
  --button-bg: #2788ef;
  --button-text: #ffffff;
  --table-header-bg: #252c34;
  --table-row-hover: #29323b;
  --shadow-color: rgba(0, 0, 0, .65);
  --focus-color: #75c0ff;
  color-scheme: dark;
}

html,
body {
  min-height: 100%;
  background-color: var(--page-bg);
  color: var(--text-primary);
}

.card,
.modal-content,
.dropdown-menu,
.list-group-item,
.offcanvas,
.toast {
  background-color: var(--panel-bg);
  color: var(--text-primary);
}

.card,
.modal-content,
.dropdown-menu,
.list-group-item,
.offcanvas,
.toast,
.border,
hr {
  border-color: var(--border-color) !important;
}

.card,
.dropdown-menu,
.modal-content,
.toast {
  box-shadow: 0 .25rem .75rem var(--shadow-color);
}

a:not(.btn):not(.badge):not(.nav-link):not(.navbar-brand) {
  color: var(--link-color);
}

.text-muted,
.form-text,
.small-muted {
  color: var(--text-secondary) !important;
}

.form-control,
.form-select,
.form-check-input,
.input-group-text {
  background-color: var(--input-bg);
  color: var(--input-text);
  border-color: var(--border-color);
}

.form-control::placeholder,
textarea::placeholder,
input::placeholder {
  color: var(--input-placeholder);
  opacity: 1;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.btn:focus-visible,
a:focus-visible,
button:focus-visible {
  border-color: var(--focus-color);
  box-shadow: 0 0 0 .25rem color-mix(in srgb, var(--focus-color) 45%, transparent);
  outline: 2px solid transparent;
}

.form-control:focus,
.form-select:focus {
  background-color: var(--input-bg);
  color: var(--input-text);
}

.form-control:disabled,
.form-select:disabled,
.form-check-input:disabled,
.form-control[readonly] {
  background-color: var(--panel-bg-secondary);
  color: var(--text-secondary);
  opacity: .8;
}

select option,
select optgroup {
  background-color: var(--input-bg);
  color: var(--input-text);
}

html[data-theme="dark"] input:-webkit-autofill,
html[data-theme="dark"] input:-webkit-autofill:hover,
html[data-theme="dark"] input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--input-text);
  box-shadow: 0 0 0 1000px var(--input-bg) inset;
  caret-color: var(--input-text);
}

html[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
html[data-theme="dark"] input[type="time"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
}

.table {
  --bs-table-bg: var(--panel-bg);
  --bs-table-color: var(--text-primary);
  --bs-table-border-color: var(--border-color);
  --bs-table-hover-bg: var(--table-row-hover);
  --bs-table-hover-color: var(--text-primary);
  color: var(--text-primary);
}

.table > thead,
.table-light {
  --bs-table-bg: var(--table-header-bg);
  --bs-table-color: var(--text-primary);
  --bs-table-border-color: var(--border-color);
}

html[data-theme="dark"] .table-striped {
  --bs-table-striped-bg: #1d232a;
  --bs-table-striped-color: var(--text-primary);
}

html[data-theme="dark"] .table-secondary {
  --bs-table-bg: #303842;
  --bs-table-color: #f8f9fa;
}

.sticky-col {
  background-color: var(--panel-bg) !important;
}

html[data-theme="dark"] .text-dark:not(.badge):not(.btn) {
  color: var(--text-primary) !important;
}

html[data-theme="dark"] .text-success { color: #75efa6 !important; }
html[data-theme="dark"] .text-danger { color: #ff8f99 !important; }
html[data-theme="dark"] .text-warning { color: #ffe07a !important; }
html[data-theme="dark"] .text-info { color: #81e8ff !important; }

html[data-theme="dark"] .alert-success { color: #d4ffe4; background: #123c27; border-color: #43b877; }
html[data-theme="dark"] .alert-danger { color: #ffe1e4; background: #4a171d; border-color: #df6671; }
html[data-theme="dark"] .alert-warning { color: #fff1bd; background: #493800; border-color: #d8ad20; }
html[data-theme="dark"] .alert-info { color: #d8f8ff; background: #123b46; border-color: #3ea8bd; }

html[data-theme="dark"] .btn-outline-secondary {
  --bs-btn-color: #e1e6eb;
  --bs-btn-border-color: #9ba5af;
  --bs-btn-hover-color: #080a0d;
  --bs-btn-hover-bg: #d6dce2;
}

html[data-theme="dark"] .btn-outline-dark {
  --bs-btn-color: #f8f9fa;
  --bs-btn-border-color: #aeb7c1;
  --bs-btn-hover-color: #080a0d;
  --bs-btn-hover-bg: #f8f9fa;
}

html[data-theme="dark"] .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
}

.theme-toggle {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .58);
  border-radius: .5rem;
  color: #ffffff;
  background: rgba(255, 255, 255, .08);
  font-size: 1.25rem;
  line-height: 1;
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
  color: #ffffff;
  background: rgba(255, 255, 255, .2);
  border-color: #ffffff;
}

.tooltip-inner {
  background-color: var(--panel-bg-secondary);
  color: var(--text-primary);
  border: 1px solid var(--border-color);
}

html[data-theme="dark"] .leaflet-popup-content-wrapper,
html[data-theme="dark"] .leaflet-popup-tip {
  background: var(--panel-bg);
  color: var(--text-primary);
}

html[data-theme="dark"] .leaflet-container {
  background: #1c2228;
}

html[data-theme="dark"] .leaflet-tile-pane {
  filter: brightness(.95) contrast(1.08) saturate(.9);
}

html[data-theme="dark"] .leaflet-control a {
  background-color: var(--panel-bg);
  color: var(--text-primary);
}

.inventory-list {
  background: var(--panel-bg);
}

.inventory-item-row + .inventory-item-row {
  border-top: 1px solid var(--border-color);
}

.inventory-item-row {
  min-height: 4.25rem;
  transition: background-color .15s ease, box-shadow .15s ease;
}

.inventory-item-row:hover {
  background: var(--table-row-hover);
}

.inventory-item-inactive {
  opacity: .72;
}

.inventory-item-name {
  overflow-wrap: anywhere;
}

.inventory-step-button {
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  font-size: 1.35rem;
  line-height: 1;
}

.inventory-quantity-input {
  width: 4.5rem;
  height: 2.75rem;
  padding-left: .25rem;
  padding-right: .25rem;
}

.inventory-row-changed {
  background: color-mix(in srgb, var(--focus-color) 12%, var(--panel-bg));
  box-shadow: inset .25rem 0 0 var(--focus-color);
}

@media (max-width: 575.98px) {
  .inventory-item-row {
    padding-left: .75rem !important;
    padding-right: .75rem !important;
  }

  .inventory-quantity-stepper {
    gap: .35rem !important;
  }

  .inventory-item-row-restock {
    flex-wrap: wrap;
  }

  .inventory-item-row-restock > .min-w-0 {
    width: 100%;
  }

  .inventory-item-row-restock .inventory-quantity-stepper {
    margin-left: auto;
  }

  .inventory-step-button {
    width: 2.6rem;
  }

  .inventory-quantity-input {
    width: 3.75rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}