/**
 * @file
 * Témakörkereső: csak az, amire nincs Bootstrap osztály. A keresősáv háttérszíne
 * menüpontonként (a téma body osztálya alapján), a Bootstrap színváltozói a
 * sávon belül a terv színeire állítva, a mező betűmérete, helyőrzője és
 * fókuszjelzése, az Előző/Következő gombok színei.
 */

.quick-search-form {
  --bs-border-color: var(--divider-default, #c7d2e0);
  --bs-body-color: var(--alap-szinek-sotetkek, #153159);
  --bs-emphasis-color: var(--alap-szinek-sotetkek, #153159);
  --bs-secondary-color: var(--text-body-text, #506d94);
  --bs-danger-rgb: 168, 52, 26;
  color: var(--bs-body-color);
}

.quick-search-form .quick-search-input {
  font-size: 0.95rem;
}

.quick-search-form .quick-search-input::placeholder {
  color: #7a8ca6;
}

.quick-search-field:focus-within {
  --bs-border-color: #0061e4;
  box-shadow: 0 0 0 3px rgba(0, 97, 228, 0.18);
}

.quick-search-tools .btn {
  --bs-btn-bg: #fff;
  --bs-btn-border-color: #b9c8dc;
  --bs-btn-hover-bg: #eef3fb;
  --bs-btn-hover-border-color: #b9c8dc;
  --bs-btn-hover-color: #0061e4;
}

/* A találatok jelzése: a Bootstrap warning színei a terv sárgáira állítva. */
.quick-search-block {
  --bs-warning-rgb: 255, 224, 102;
  --bs-warning-bg-subtle: #fffbea;
  --bs-warning-border-subtle: #e6b800;
  --bs-warning-text-emphasis: #5c4700;
  --bs-highlight-color: #1d1a00;
}

/*
 * A menü számlálója a blokkon kívül van, ezért saját magán kapja a színeket.
 * A helye a téma nyilához igazodik: az háttérkép 95%-on, 24 px széles.
 */
.quick-search-menu-count {
  --bs-warning-rgb: 255, 224, 102;
  --bs-warning-text-emphasis: #3d3000;
  right: calc(5% + 26px);
}

.quick-search-mark {
  padding: 0 1px;
  border-radius: 2px;
  box-shadow: 0 0 0 1px var(--bs-warning-border-subtle);
}

.quick-search-content .accordion.dobozos .quick-search-has-hit .accordion-header .accordion-button {
  background: #fffdf4;
}

/*
 * Akkordion: a HTML a blokk beállításaiból jön, a +/− ikon a téma ::after
 * háttérképe, ezért itt nem tudunk Bootstrap osztályt használni.
 */
.quick-search-content .accordion.dobozos .accordion-header .accordion-button {
  align-items: flex-start;
  gap: 1rem;
  padding: 18px 20px 16px 12px;
}

.quick-search-content .accordion.dobozos .accordion-button::after {
  width: 26px;
  height: 26px;
  margin-top: 6px;
  background-size: 26px auto;
}

.quick-search-content .accordion.dobozos .accordion-header .accordion-button .cim {
  gap: 4px;
}

.quick-search-content .accordion.dobozos .accordion-button .cim .focim {
  font-size: 1.12rem;
  line-height: 1.3;
}

.quick-search-content .accordion.dobozos .accordion-button .cim .alszoveg {
  font-size: 0.83rem;
  line-height: 1.45;
}

.quick-search-content .accordion.dobozos .accordion-body a.alelem .text {
  gap: 3px;
}

.quick-search-content .accordion.dobozos .accordion-body a.alelem .cim {
  font-size: 0.92rem;
  line-height: 1.45;
}

.quick-search-content .accordion.dobozos .accordion-body a.alelem .text .leiras {
  font-size: 0.83rem;
  line-height: 1.45;
}

.quick-search-content .accordion.dobozos .accordion-body a.alelem img {
  width: 14px;
}

.quick-search-content .accordion.dobozos .accordion-body .alelem {
  border-left: 3px solid transparent;
  border-radius: 4px;
}

.quick-search-content .accordion.dobozos .accordion-body .alelem.bg-warning-subtle {
  border-left-color: var(--bs-warning-border-subtle);
}

@media (min-width: 576px) {
  .quick-search-content .accordion.dobozos .accordion-body {
    padding: 0 20px 14px 54px;
  }

  .quick-search-content .accordion.dobozos .accordion-body .alelem {
    gap: 1rem;
    margin-bottom: 2px;
    padding: 12px 10px;
  }
}

.telepulesrendezes .quick-search-form {
  background-color: #ece4f4;
}

.tervezes .quick-search-form {
  background-color: #f8e4e0;
}

.energetika .quick-search-form {
  background-color: #e3f0e7;
}
