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 white, 0 0 0 0.25rem #258cfb;
}

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

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}
/* ---------------------------------------------------------------------------
   Flytbare modaler (makeModalDraggable i js/modal-draggable.js).
   Nøglet på .draggable-modal frem for et id, så Kunder og Medarbejdere deler
   reglerne.
   --------------------------------------------------------------------------- */
.draggable-modal .modal-header {
  cursor: move;
  user-select: none;
  touch-action: none;
}

.draggable-modal .modal-header .btn,
.draggable-modal .modal-header a {
  cursor: pointer;
}

/* Bootstrap animerer .modal-dialog med "transition: transform .3s ease-out".
   Den skal slås fra under træk, ellers halter modalen efter musen. */
.draggable-modal.modal.fade .modal-dialog.is-dragging {
  transition: none;
  will-change: transform;
}

/* Statusfarver for besøg, delt af Kunde- og Medarbejder-modalen. */
.status-available { color: #0d6efd; }
.status-done      { color: #198754; }
.status-cancelled { color: #dc3545; }
.status-moved     { color: #fd7e14; }

/* ------------------------------------------------------------------------
   Global søgning ("spotlight") - headerfelt, modal og resultatliste.
   ------------------------------------------------------------------------ */
.skyplan-search input {
  min-width: 14rem;
}

@media (max-width: 1199.98px) {
  .skyplan-search input { min-width: 9rem; }
}

#globalSearchModal .modal-header input {
  font-size: 1.1rem;
}

#globalSearchModal .modal-dialog {
  margin-top: 4rem;
}

.search-results {
  min-height: 6rem;
  transition: opacity .15s ease-in-out;
}

.search-results.is-loading {
  opacity: .5;
}

.search-empty {
  padding: 2rem 1.25rem;
  text-align: center;
}

.search-group + .search-group {
  border-top: 1px solid #dee2e6;
}

.search-group-heading {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: .5rem 1.25rem;
  background-color: #f8f9fa;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.search-show-all {
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
}

/* Hele rækken er et anker, så midterklik og cmd-klik virker som andre links. */
a.search-hit {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .55rem 1.25rem;
  color: inherit;
  text-decoration: none;
  border-left: 3px solid transparent;
}

a.search-hit.is-selected,
a.search-hit:hover {
  background-color: #eef1ff;
  border-left-color: #667eea;
  color: inherit;
}

.search-hit-main { min-width: 0; }

.search-hit-title {
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-hit-subtitle,
.search-hit-match {
  font-size: .8125rem;
  color: #6c757d;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-hit-field {
  display: inline-block;
  margin-right: .35rem;
  font-weight: 600;
}

.search-hit-meta {
  flex-shrink: 0;
  text-align: right;
  font-size: .8125rem;
  color: #6c757d;
}

.search-hit-secondary {
  display: block;
  margin-top: .15rem;
  color: #667eea;
  text-decoration: underline;
  cursor: pointer;
}

.search-badge {
  margin-left: .4rem;
  padding: .05rem .4rem;
  border-radius: .25rem;
  background-color: #e9ecef;
  color: #6c757d;
  font-size: .6875rem;
  font-weight: 600;
  text-transform: uppercase;
}

.search-results mark {
  padding: 0;
  background-color: #fff3cd;
}

.search-results-page {
  border: 1px solid #dee2e6;
  border-radius: .375rem;
  overflow: hidden;
  background-color: #fff;
}

/* Bootstrap's <kbd> er sorte klodser, som er alt for tunge i modalens fod.
   Her tegnes de i stedet som lyse tastaturknapper. */
#globalSearchModal .modal-footer kbd {
  display: inline-block;
  min-width: 1.4rem;
  margin-right: .15rem;
  padding: .05rem .3rem;
  border: 1px solid #ced4da;
  border-bottom-width: 2px;
  border-radius: .25rem;
  background-color: #fff;
  box-shadow: none;
  color: #495057;
  font-size: .75rem;
  line-height: 1.4;
  text-align: center;
}