html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem #000, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
  background-color: #181a1b;
  color: #e6e6e6;
}

/* --- Dark-theme overrides (covers Bootstrap 5 classes used across views) --- */
:root { color-scheme: dark; }

a { color: #6ea8fe; }
a:hover { color: #9ec5fe; }

.navbar.bg-white, .navbar-light { background-color: #1f1f1f !important; }
.navbar .nav-link.text-dark, .navbar-brand.text-dark,
.navbar .nav-link, .navbar-brand { color: #e6e6e6 !important; }
.navbar .nav-link.text-muted { color: #adb5bd !important; }

.card { background-color: #23272a; color: #e6e6e6; border-color: #343a40; }
.card-header { background-color: #2a2f33 !important; color: #e6e6e6; border-color: #343a40; }
.card-header.bg-light { background-color: #2a2f33 !important; color: #e6e6e6; }
.card-body.bg-light, .card.bg-light, .bg-light { background-color: #23272a !important; color: #e6e6e6 !important; }

.table { --bs-table-color: #e6e6e6; --bs-table-bg: transparent; color: #e6e6e6; }
.table > :not(caption) > * > * { background-color: transparent; color: #e6e6e6; border-color: #343a40; }
.table-light, .thead-light, .table thead.table-light th,
.table > thead { background-color: #2a2f33 !important; color: #e6e6e6 !important; border-color: #343a40 !important; }
.table-striped > tbody > tr:nth-of-type(odd) > * { background-color: #1f2326; color: #e6e6e6; }
.table-hover > tbody > tr:hover > * { background-color: #2d3236; color: #fff; }

.form-control, .form-select {
  background-color: #1f2326; color: #e6e6e6; border-color: #343a40;
}
.form-control::placeholder { color: #8a8f94; }
.form-control:focus, .form-select:focus {
  background-color: #1f2326; color: #fff; border-color: #6ea8fe;
  box-shadow: 0 0 0 0.2rem rgba(110,168,254,.25);
}
/* Bootstrap <5.3 paints readonly inputs with a light grey bg and leaves the
   text colour alone ? on our dark theme that comes out as white-on-white.
   Force the same dark colours used by editable inputs. */
.form-control[readonly],
.form-control:read-only,
.form-control-plaintext {
  background-color: #1f2326 !important;
  color: #e6e6e6 !important;
  border-color: #343a40 !important;
  -webkit-text-fill-color: #e6e6e6; /* Chrome autofill edge-case */
}
.form-control:disabled,
.form-control[disabled] {
  background-color: #2a2f33 !important;
  color: #adb5bd !important;
}
.form-label { color: #e6e6e6; }

/* btn-outline-dark is unreadable on a dark body; remap it to a light-outline
   button so existing views with that class stay visible. */
.btn-outline-dark {
  color: #e6e6e6 !important;
  border-color: #6c757d !important;
  background-color: transparent !important;
}
.btn-outline-dark:hover,
.btn-outline-dark:focus {
  color: #0b0d0e !important;
  background-color: #e6e6e6 !important;
  border-color: #e6e6e6 !important;
}

.text-dark { color: #e6e6e6 !important; }
.text-muted, .small.text-muted { color: #9aa0a6 !important; }
.border-bottom { border-color: #343a40 !important; }

.alert-success { background-color: #103a22; color: #a3e2b8; border-color: #1f5c38; }
.alert-danger  { background-color: #3a1013; color: #f1aeb5; border-color: #5c1f25; }

code, .code, pre { color: #f1a7ff; }

.btn-outline-secondary { color: #cfd3d7; border-color: #5a6268; }
.btn-outline-secondary:hover { background-color: #343a40; color: #fff; }
.btn-light { background-color: #343a40; color: #e6e6e6; border-color: #495057; }
.btn-light:hover { background-color: #495057; color: #fff; }

.footer { background-color: #181a1b; color: #9aa0a6; border-color: #343a40 !important; }

/* Modal overlay used by the "Fetch before Create Share" JS flow. */
.mv-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.65);
  display: flex; align-items: center; justify-content: center;
  z-index: 1060;
}
.mv-overlay .panel {
  background: #23272a; color: #e6e6e6; border: 1px solid #343a40;
  border-radius: .5rem; padding: 1.5rem; width: min(440px, 92vw);
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
}