/*
Theme Name: April Dom
Theme URI: https://sem-dva.ru
Author: Sem-Dva (Семь-Два)
Author URI: https://sem-dva.ru
Description: Lightweight custom client theme for april-dom project. Developed by Sem-Dva.
Version: 1.0.16
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 8.0
Text Domain: april-dom
*/

html {
  background-color: #f7f6f5;
}

.header .header__compare-link,
.header .header__compare-link:visited,
.header .header__favorite-link,
.header .header__favorite-link:visited {
  color: #090a0a !important;
}

.header.white .header__compare-link,
.header.white .header__compare-link:visited,
.header.white .header__favorite-link,
.header.white .header__favorite-link:visited,
.header.white .header__phone a,
.header.white .header__phone a:visited {
  color: #f7f6f5 !important;
}

/* Header spacing and icon alignment */
.header__icns-wrap {
  gap: 16px;
}

.header__compare,
.header__favorite {
  display: flex;
  align-items: center;
}

.header__compare {
  margin-left: 14px;
}

.header__favorite {
  margin-left: 14px;
}

.header__compare-link,
.header__favorite-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: transform 0.25s ease, opacity 0.25s ease;
}

.header__compare-link:hover,
.header__favorite-link:hover {
  transform: translateY(-1px);
}

.header__phone {
  margin-left: 22px;
}

/* Desktop search animation and styling */
.header__search {
  flex: 0 0 48px;
  max-width: 48px;
  min-width: 48px;
  overflow: visible;
  transition: max-width 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.header__search form {
  width: 48px;
  overflow: hidden;
  justify-content: flex-end;
  border: 1px solid transparent;
  transition: border-color 0.35s ease, box-shadow 0.35s ease, background-color 0.35s ease;
}

.header__search.active {
  flex: 1 1 auto;
  max-width: min(560px, 52vw);
}

.header__search.active form {
  width: 100%;
  border-color: rgba(9, 10, 10, 0.2);
  box-shadow: 0 12px 28px rgba(9, 10, 10, 0.12);
}

.header__search .search-input {
  width: 0 !important;
  flex: 0 0 0 !important;
  padding: 0 !important;
  transform: translateX(8px);
  transition: opacity 0.25s ease, transform 0.35s ease;
}

.header__search.active .search-input {
  width: 95% !important;
  flex: 1 1 auto !important;
  padding: 0.5rem 0.5rem 0.5rem 1rem !important;
  transform: translateX(0);
}

.header__search .clear-btn,
.header__search .submit-btn {
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.header__search .clear-btn {
  display: none;
}

.header__search.active .clear-btn {
  display: inline-flex;
}

.header__search .submit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  padding: 0 !important;
}

.header__search.active .submit-btn {
  width: auto;
  height: auto;
  padding: 0 0.75rem !important;
}

.header__search.active .submit-btn {
  transform: scale(1.03);
}

@media (max-width: 768px) {
  .header__compare,
  .header__favorite {
    margin-left: 0 !important;
  }
}

/* Search results panel animation */
.search__list {
  display: block !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(8px) scale(0.985);
  transform-origin: top center;
  border: 1px solid rgba(9, 10, 10, 0.08);
  border-radius: 10px;
  background: #f7f6f5;
  box-shadow: 0 16px 38px rgba(9, 10, 10, 0.16);
  transition: opacity 0.22s ease, transform 0.28s ease, visibility 0.22s ease;
  max-height: min(60vh, 520px);
  overflow: auto;
}

.header__search.active .search__list.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

.search__list-group ul li a {
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.search__list-group ul li a:hover {
  background: rgba(227, 79, 52, 0.06);
  border-color: rgba(227, 79, 52, 0.25);
}

.footer__contacts-info {
  gap: 20px;
}