/* =========================================================================
   LA ELITE – vyhledávání v hlavičce
   Vzhled → Editor vzhledu → Vlastní CSS  (vložte za menu.css)
   -------------------------------------------------------------------------
   Pouze vzhled prvků formuláře. Nesahá na rozložení hlavičky – žádné
   display / position / flex / grid a žádné šířky kontejnerů.
   ========================================================================= */

:root {
  --le-search-ink:    #14171a;
  --le-search-soft:   #8a929c;
  --le-search-line:   rgba(20,23,26,.14);
  --le-search-field:  #f6f5f2;   /* teplá světlá výplň pole */
  --le-search-accent: #b0894f;   /* mosazný akcent */
}

/* ---------------------------------------------------------------- rámeček */
.search-form fieldset {
  border: 0;
  padding: 0;
  margin: 0;
  background: none;
}

/* ------------------------------------------------------------- textové pole */
.search-form .search-input,
.search-form input[type="search"] {
  height: 46px;
  padding: 0 18px 0 46px;          /* místo vlevo pro ikonu lupy */
  background-color: var(--le-search-field);
  background-repeat: no-repeat;
  background-position: 18px 50%;
  background-size: 16px 16px;
  /* lupa jako SVG přímo v CSS – nic se nedonačítá */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a929c' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.4 15.4 21 21'/%3E%3C/svg%3E");
  border: 1px solid transparent;
  border-radius: 2px;
  box-shadow: none;
  font-family: inherit;
  font-size: 14px;
  letter-spacing: .02em;
  color: var(--le-search-ink);
  transition: background-color .25s ease, border-color .25s ease, box-shadow .25s ease;
  -webkit-appearance: none;
  appearance: none;
}
.search-form .search-input::placeholder { color: var(--le-search-soft); letter-spacing: .02em; }

.search-form .search-input:hover { background-color: #f1efea; }

.search-form .search-input:focus {
  outline: 0;
  background-color: #fff;
  border-color: var(--le-search-accent);
  box-shadow: 0 0 0 3px rgba(176, 137, 79, .14);
}

/* křížek pro smazání dotazu ve Webkitu */
.search-form .search-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
  height: 14px;
  width: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' stroke='%238a929c' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") no-repeat 50% / 12px 12px;
  cursor: pointer;
  opacity: .7;
}

/* --------------------------------------------------------------- tlačítko */
.search-form .btn,
.search-form .btn-default,
.search-form button[type="submit"] {
  height: 46px;
  padding: 0 26px;
  background-color: var(--le-search-ink);
  background-image: none;
  border: 1px solid var(--le-search-ink);
  border-radius: 2px;
  color: #fff;
  font-family: inherit;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-shadow: none;
  box-shadow: none;
  transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}
.search-form .btn-default:hover,
.search-form .btn-default:focus,
.search-form button[type="submit"]:hover,
.search-form button[type="submit"]:focus {
  background-color: var(--le-search-accent);
  border-color: var(--le-search-accent);
  color: #fff;
}

/* ------------------------------------------------- našeptávač (výsledky) */
.search-whisperer {
  background: #fff;
  border: 1px solid var(--le-search-line);
  border-top: 2px solid var(--le-search-accent);
  border-radius: 0;
  box-shadow: 0 24px 56px rgba(20, 23, 26, .16);
  overflow: hidden;
}
.search-whisperer a { color: var(--le-search-ink); }
.search-whisperer li,
.search-whisperer .search-whisperer-item { border-color: var(--le-search-line); }
.search-whisperer li:hover,
.search-whisperer li.active,
.search-whisperer .search-whisperer-item:hover { background: #f6f5f2; }
.search-whisperer .price,
.search-whisperer strong { color: var(--le-search-accent); }

/* =================================================================== mobil */
@media (max-width: 991px) {
  .search-form .search-input,
  .search-form input[type="search"] {
    height: 44px;
    padding: 0 14px 0 42px;
    background-position: 15px 50%;
    font-size: 16px;               /* 16px zabrání přiblížení stránky na iOS */
  }
  .search-form .btn,
  .search-form .btn-default,
  .search-form button[type="submit"] { height: 44px; padding: 0 18px; letter-spacing: .1em; }
}

@media (max-width: 543px) {
  .search-form .btn,
  .search-form .btn-default,
  .search-form button[type="submit"] { padding: 0 14px; font-size: 11px; }
}
