/* ══════════════════════════════
   КНОПКИ
══════════════════════════════ */

.btn {
  font-family: var(--font) !important;
  font-weight: 600 !important;
  border-radius: var(--radius) !important;
  transition: all var(--transition) !important;
  height: 44px;
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  padding: 0 18px !important;
  font-size: 14px !important;
  border: none;
  cursor: pointer;
  white-space: nowrap;
}

/* Primary — синяя */
.btn-primary {
  background: var(--blue) !important;
  border-color: var(--blue) !important;
  color: var(--white) !important;
}
.btn-primary:hover,
.btn-primary:focus {
  background: var(--blue-hover) !important;
  border-color: var(--blue-hover) !important;
  color: var(--white) !important;
}

/* Secondary — серая */
.btn-secondary {
  background: var(--gray-200) !important;
  border-color: var(--gray-200) !important;
  color: var(--gray-700) !important;
}
.btn-secondary:hover { background: var(--gray-300) !important; }

/* Accent — оранжевая (CTA) */
.btn-warning {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: var(--white) !important;
}
.btn-warning:hover {
  background: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
  color: var(--white) !important;
}

/* Outline */
.btn-outline-primary {
  background: transparent !important;
  border: 2px solid var(--blue) !important;
  color: var(--blue) !important;
}
.btn-outline-primary:hover {
  background: var(--blue) !important;
  color: var(--white) !important;
}

/* Danger */
.btn-danger {
  background: var(--error) !important;
  border-color: var(--error) !important;
  color: var(--white) !important;
}

/* Disabled */
.btn:disabled,
.btn.disabled {
  opacity: .5 !important;
  cursor: not-allowed !important;
}

/* Размеры */
.btn-sm { height: 32px !important; padding: 0 12px !important; font-size: var(--small) !important; }
.btn-lg { height: 52px !important; padding: 0 24px !important; font-size: 16px !important; }

/* Форм кнопки Drupal */
.form-submit,
input[type="submit"],
button[type="submit"] {
  font-family: var(--font) !important;
  border-radius: var(--radius) !important;
  cursor: pointer;
}

/* ══════════════════════════════
   ПОЛЯ ВВОДА
══════════════════════════════ */

.form-control,
.form-select,
input[type="text"],
input[type="search"],
input[type="email"],
input[type="tel"],
input[type="number"],
textarea,
select {
  font-family: var(--font) !important;
  font-size: var(--body) !important;
  color: var(--gray-900) !important;
  background: var(--gray-50) !important;
  border: 1.5px solid var(--gray-200) !important;
  border-radius: var(--radius) !important;
  padding: 0 var(--gap) !important;
  height: 44px;
  outline: none !important;
  transition: border-color var(--transition), background var(--transition) !important;
  box-shadow: none !important;
}

textarea {
  height: auto !important;
  padding: var(--gap) !important;
  resize: vertical;
  min-height: 100px;
}

.form-control:focus,
.form-select:focus,
input[type="text"]:focus,
input[type="search"]:focus,
input[type="email"]:focus {
  border-color: var(--blue) !important;
  background: var(--white) !important;
  box-shadow: 0 0 0 3px rgba(26,111,212,.1) !important;
}

.form-control::placeholder,
input::placeholder {
  color: var(--gray-400) !important;
}

/* Состояние ошибки */
.form-control.is-invalid,
.has-error .form-control {
  border-color: var(--error) !important;
}

.invalid-feedback,
.form-text.text-danger {
  color: var(--error) !important;
  font-size: var(--small) !important;
}

.valid-feedback,
.form-text.text-success {
  color: var(--success) !important;
  font-size: var(--small) !important;
}

/* Чекбоксы и радио */
.form-check-input:checked {
  background-color: var(--blue) !important;
  border-color: var(--blue) !important;
}
.form-check-input:focus {
  box-shadow: 0 0 0 3px rgba(26,111,212,.2) !important;
}

/* ══════════════════════════════
   АЛЕРТЫ / УВЕДОМЛЕНИЯ
══════════════════════════════ */

.alert {
  border-radius: var(--radius) !important;
  border: none !important;
  padding: 14px 16px !important;
  font-family: var(--font) !important;
  font-size: var(--body) !important;
  display: flex;
  align-items: flex-start;
  gap: var(--gap);
}

.alert-success {
  background: rgba(22,163,74,.1) !important;
  color: #14532d !important;
  border-left: 4px solid var(--success) !important;
}
.alert-warning {
  background: rgba(245,158,11,.1) !important;
  color: #78350f !important;
  border-left: 4px solid var(--warning) !important;
}
.alert-danger {
  background: rgba(220,38,38,.1) !important;
  color: #7f1d1d !important;
  border-left: 4px solid var(--error) !important;
}
.alert-info {
  background: rgba(2,132,199,.1) !important;
  color: #0c4a6e !important;
  border-left: 4px solid var(--info) !important;
}

/* Drupal system messages */
.messages--status  { @extend .alert-success; }
.messages--warning { @extend .alert-warning; }
.messages--error   { @extend .alert-danger; }

/* ══════════════════════════════
   ХЛЕБНЫЕ КРОШКИ
══════════════════════════════ */

.breadcrumb {
  background: transparent !important;
  padding: 12px 0 !important;
  margin: 0 !important;
  font-size: var(--small) !important;
  font-family: var(--font) !important;
}
.breadcrumb-item { color: var(--gray-500) !important; }
.breadcrumb-item a {
  color: var(--blue) !important;
  text-decoration: none !important;
  transition: color var(--transition);
}
.breadcrumb-item a:hover { color: var(--blue-hover) !important; }
.breadcrumb-item.active { color: var(--gray-700) !important; }
.breadcrumb-item + .breadcrumb-item::before {
  color: var(--gray-400) !important;
  content: '›' !important;
}

/* ══════════════════════════════
   ПАГИНАЦИЯ
══════════════════════════════ */

.pagination { gap: 4px !important; }
.page-link {
  font-family: var(--font) !important;
  font-size: var(--small) !important;
  color: var(--blue) !important;
  border: 1px solid var(--gray-200) !important;
  border-radius: var(--radius) !important;
  padding: 6px 12px !important;
  transition: all var(--transition) !important;
}
.page-link:hover {
  background: var(--sky) !important;
  border-color: var(--blue) !important;
  color: var(--blue) !important;
}
.page-item.active .page-link {
  background: var(--blue) !important;
  border-color: var(--blue) !important;
  color: var(--white) !important;
}
.page-item.disabled .page-link {
  color: var(--gray-400) !important;
  border-color: var(--gray-200) !important;
}

/* ══════════════════════════════
   БЕЙДЖИ / СТАТУСЫ
══════════════════════════════ */

.badge {
  font-family: var(--font) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 3px 8px !important;
  border-radius: 4px !important;
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* Статусы товара */
.badge-used    { background: var(--gray-700) !important; color: var(--white) !important; }
.badge-new     { background: var(--success)  !important; color: var(--white) !important; }
.badge-orig    { background: var(--blue)     !important; color: var(--white) !important; }
.badge-sale    { background: var(--error)    !important; color: var(--white) !important; }
.badge-last    { background: var(--accent)   !important; color: var(--white) !important; }

/* Bootstrap badge override */
.badge.bg-primary   { background: var(--blue)    !important; }
.badge.bg-success   { background: var(--success) !important; }
.badge.bg-warning   { background: var(--warning) !important; color: var(--gray-900) !important; }
.badge.bg-danger    { background: var(--error)   !important; }
.badge.bg-secondary { background: var(--gray-500)!important; }

/* ══════════════════════════════
   ТАБЛИЦЫ
══════════════════════════════ */

.table {
  font-family: var(--font) !important;
  font-size: var(--body) !important;
  color: var(--gray-900) !important;
}
.table th {
  font-weight: 700 !important;
  color: var(--gray-700) !important;
  background: var(--gray-50) !important;
  border-color: var(--gray-200) !important;
  font-size: var(--small) !important;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 10px var(--gap) !important;
}
.table td {
  border-color: var(--gray-100) !important;
  padding: 10px var(--gap) !important;
  vertical-align: middle;
}
.table-hover tbody tr:hover { background: var(--sky) !important; }

/* ══════════════════════════════
   DRUPAL TABS (local tasks)
══════════════════════════════ */

.nav-tabs {
  border-color: var(--gray-200) !important;
  gap: 2px;
}
.nav-tabs .nav-link {
  font-family: var(--font) !important;
  font-size: 14px !important;
  color: var(--gray-600) !important;
  border-radius: var(--radius) var(--radius) 0 0 !important;
  padding: 8px 16px !important;
  border-color: transparent !important;
  transition: all var(--transition) !important;
}
.nav-tabs .nav-link:hover { color: var(--blue) !important; background: var(--sky) !important; }
.nav-tabs .nav-link.active {
  color: var(--blue) !important;
  border-color: var(--gray-200) var(--gray-200) var(--white) !important;
  font-weight: 600 !important;
}

/* ══════════════════════════════
   МОДАЛЬНЫЕ ОКНА
══════════════════════════════ */

.modal-content {
  border: none !important;
  border-radius: var(--radius) !important;
  box-shadow: 0 20px 60px rgba(15,45,94,.2) !important;
}
.modal-header {
  border-color: var(--gray-200) !important;
  padding: 16px !important;
}
.modal-title {
  font-family: var(--font) !important;
  font-weight: 700 !important;
  font-size: var(--h3) !important;
}
.modal-footer {
  border-color: var(--gray-200) !important;
  padding: 16px !important;
}

/* ══════════════════════════════
   КАРТОЧКИ (Bootstrap card)
══════════════════════════════ */

.card {
  border: 1px solid var(--gray-200) !important;
  border-radius: var(--radius) !important;
  box-shadow: none !important;
  transition: box-shadow var(--transition) !important;
}
.card:hover { box-shadow: 0 4px 16px rgba(15,45,94,.08) !important; }
.card-body { padding: 16px !important; }
.card-title {
  font-family: var(--font) !important;
  font-weight: 700 !important;
  color: var(--gray-900) !important;
}

/* ══════════════════════════════
   ХЛЕБНЫЕ КРОШКИ — 36px, 10px padding
══════════════════════════════ */
.region-breadcrumb,
.block-system-breadcrumb-block {
  background: var(--white);
  border-bottom: 1px solid var(--gray-100);
}
.breadcrumb-wrap,
nav[aria-label="Breadcrumb"],
.block-system-breadcrumb-block nav {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 10px;
  min-height: 36px;
  display: flex;
  align-items: center;
}
.breadcrumb {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 36px;
  align-items: center;
  background: transparent !important;
  font-size: 13px !important;
}
.breadcrumb-item { color: var(--gray-500) !important; }
.breadcrumb-item a {
  color: var(--blue) !important;
  text-decoration: none !important;
  transition: color var(--transition);
}
.breadcrumb-item a:hover { color: var(--blue-hover) !important; }
.breadcrumb-item.active { color: var(--gray-700) !important; }
.breadcrumb-item + .breadcrumb-item::before {
  content: '›' !important;
  color: var(--gray-400) !important;
}

/* ══════════════════════════════
   LOCAL TASKS (View/Edit/Delete)
   Только для авторизованных.
   По умолчанию: иконка-значок справа.
   При наведении: разворачивается.
══════════════════════════════ */



/* Скрытая по умолчанию полоска, видна иконка */
#block-lideravto-lider-tabs .block-local-tasks-block,
#block-lideravto-lider-tabs > nav,
#block-lideravto-lider-tabs > div {
  background: var(--navy);
  border-radius: 8px 0 0 8px;
  padding: 6px 0;
  overflow: hidden;
  max-width: 28px;               /* только иконка видна */
  transition: max-width .25s ease, box-shadow .2s;
  white-space: nowrap;
  box-shadow: -2px 2px 8px rgba(0,0,0,.15);
}

#block-lideravto-lider-tabs:hover > nav,
#block-lideravto-lider-tabs:hover > div,
#block-lideravto-lider-tabs:hover .block-local-tasks-block {
  max-width: 300px;              /* разворачивается */
  box-shadow: -4px 4px 20px rgba(15,45,94,.25);
}

/* Иконка-якорь (видна всегда) */
#block-lideravto-lider-tabs::before {
  content: '✏️';
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 32px;
  background: var(--navy);
  border-radius: 8px 0 0 8px;
  font-size: 14px;
  cursor: pointer;
  flex-shrink: 0;
  position: absolute;
  left: -28px;
  box-shadow: -2px 2px 8px rgba(0,0,0,.15);
}

/* Ссылки внутри */
#block-lideravto-lider-tabs .nav-link,
#block-lideravto-lider-tabs a {
  display: inline-flex !important;
  align-items: center;
  padding: 6px 14px !important;
  color: rgba(255,255,255,.8) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  font-family: var(--font) !important;
  text-decoration: none !important;
  white-space: nowrap;
  border-bottom: none !important;
  transition: color var(--transition), background var(--transition);
}
#block-lideravto-lider-tabs .nav-link:hover,
#block-lideravto-lider-tabs a:hover {
  color: var(--white) !important;
  background: rgba(255,255,255,.1) !important;
}
#block-lideravto-lider-tabs .nav-link.is-active {
  color: var(--accent) !important;
}

/* Убираем Bootstrap border и фон на ul */
#block-lideravto-lider-tabs ul,
#block-lideravto-lider-tabs .nav-tabs {
  border: none !important;
  display: flex !important;
  flex-direction: column !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
#block-lideravto-lider-tabs li { margin: 0 !important; padding: 0 !important; }


/* ══════════════════════════════
/* ══════════════════════════════
   LOCAL TASKS (View / Edit / Delete / Revisions)
   Стандартный Drupal — всегда видны для admin.
   Компактные tabs под хлебными крошками.
══════════════════════════════ */
#block-lideravto-lider-tabs {
  margin: 0 0 16px 0;
}
#block-lideravto-lider-tabs .tabs,
#block-lideravto-lider-tabs nav {
  display: flex;
}
#block-lideravto-lider-tabs ul {
  display: flex !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 4px;
  flex-wrap: wrap;
}
#block-lideravto-lider-tabs li { padding: 0 !important; }
#block-lideravto-lider-tabs a,
#block-lideravto-lider-tabs .nav-link {
  display: inline-flex !important;
  align-items: center;
  height: 32px;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  font-family: var(--font) !important;
  color: var(--gray-600) !important;
  background: var(--gray-100) !important;
  border: 1px solid var(--gray-200) !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  transition: all var(--transition);
}
#block-lideravto-lider-tabs a:hover,
#block-lideravto-lider-tabs .nav-link:hover {
  background: var(--sky) !important;
  border-color: var(--blue) !important;
  color: var(--blue) !important;
}
#block-lideravto-lider-tabs .is-active,
#block-lideravto-lider-tabs a.is-active {
  background: var(--blue) !important;
  border-color: var(--blue) !important;
  color: var(--white) !important;
}

/* ══════════════════════════════
   LOCAL TASKS — View / Edit / Delete / Revisions
   Стандартный Drupal, видны только admin.
   Компактные таблетки, не плавающие.
══════════════════════════════ */
#block-lideravto-lider-tabs {
  margin-bottom: 16px;
}
#block-lideravto-lider-tabs ul {
  display: flex !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 4px;
  flex-wrap: wrap;
}
#block-lideravto-lider-tabs li {
  margin: 0 !important;
  padding: 0 !important;
}
#block-lideravto-lider-tabs a,
#block-lideravto-lider-tabs .nav-link {
  display: inline-flex !important;
  align-items: center;
  height: 32px;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  font-family: var(--font) !important;
  color: var(--gray-600) !important;
  background: var(--gray-100) !important;
  border: 1px solid var(--gray-200) !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  transition: all var(--transition);
}
#block-lideravto-lider-tabs a:hover,
#block-lideravto-lider-tabs .nav-link:hover {
  background: var(--sky) !important;
  border-color: var(--blue) !important;
  color: var(--blue) !important;
}
#block-lideravto-lider-tabs .is-active {
  background: var(--blue) !important;
  border-color: var(--blue) !important;
  color: var(--white) !important;
}

/* ══════════════════════════════
   LOCAL TASKS — View / Edit / Delete / Revisions
   Горизонтальные таблетки для авторизованных.
   Целимся по Bootstrap классам Barrio.
══════════════════════════════ */

/* Блок с табами */
#block-lideravto-lider-tabs,
.block-local-tasks-block { margin-bottom: 16px; }

/* nav.tabs — обёртка из Barrio block--local-tasks-block.html.twig */
#block-lideravto-lider-tabs nav.tabs,
.block-local-tasks-block nav.tabs { display: block; }

/* ul — горизонтальная строка таблеток */
#block-lideravto-lider-tabs ul,
.block-local-tasks-block ul,
ul.tabs.primary {
  display: flex !important;
  flex-direction: row !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 4px;
  flex-wrap: wrap;
  border-bottom: none !important;
}

/* li */
#block-lideravto-lider-tabs li,
.block-local-tasks-block li,
ul.tabs.primary li {
  margin: 0 !important;
  padding: 0 !important;
}

/* ссылки — таблетки */
#block-lideravto-lider-tabs a,
#block-lideravto-lider-tabs .nav-link,
.block-local-tasks-block a,
ul.tabs.primary a {
  display: inline-flex !important;
  align-items: center;
  height: 30px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  font-family: var(--font) !important;
  color: var(--gray-600) !important;
  background: var(--gray-100) !important;
  border: 1px solid var(--gray-200) !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  transition: all var(--transition);
  white-space: nowrap;
}
#block-lideravto-lider-tabs a:hover,
#block-lideravto-lider-tabs .nav-link:hover,
.block-local-tasks-block a:hover,
ul.tabs.primary a:hover {
  background: var(--sky) !important;
  border-color: var(--blue) !important;
  color: var(--blue) !important;
}
#block-lideravto-lider-tabs .is-active,
#block-lideravto-lider-tabs a.is-active,
ul.tabs.primary .is-active {
  background: var(--blue) !important;
  border-color: var(--blue) !important;
  color: var(--white) !important;
}

/* Contextual links — pencil icon (из Drupal core) */
.contextual-region { position: relative; }
.contextual { position: absolute; top: 4px; right: 4px; z-index: 500; }
.contextual-links { 
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  box-shadow: 0 4px 16px rgba(15,45,94,.1);
  font-size: 13px;
  min-width: 120px;
}
.contextual-links li { padding: 0; }
.contextual-links a {
  display: block;
  padding: 7px 14px;
  color: var(--gray-700) !important;
  text-decoration: none !important;
  transition: background var(--transition);
}
.contextual-links a:hover {
  background: var(--sky) !important;
  color: var(--blue) !important;
}

/* ══════════════════════════════
   LOCAL TASKS FIX — точный селектор из DOM
   NAV.tabs > UL.nav.primary.nav-tabs
══════════════════════════════ */
nav.tabs ul.nav {
  display: flex !important;
  flex-direction: row !important;
  gap: 4px !important;
  flex-wrap: wrap !important;
  border: none !important;
  margin: 0 !important;
  padding: 4px 0 !important;
}
nav.tabs ul.nav li.nav-item {
  margin: 0 !important;
  padding: 0 !important;
}
nav.tabs ul.nav a.nav-link {
  height: 30px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  font-family: var(--font) !important;
  color: var(--gray-600) !important;
  background: var(--gray-100) !important;
  border: 1px solid var(--gray-200) !important;
  border-bottom: 1px solid var(--gray-200) !important;
  border-radius: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap;
  transition: all var(--transition);
  text-decoration: none !important;
}
nav.tabs ul.nav a.nav-link:hover {
  background: var(--sky) !important;
  border-color: var(--blue) !important;
  color: var(--blue) !important;
}
nav.tabs ul.nav a.nav-link.active,
nav.tabs ul.nav a.nav-link.is-active {
  background: var(--blue) !important;
  border-color: var(--blue) !important;
  color: var(--white) !important;
}

/* ══════════════════════════════
   LOCAL TASKS — вне потока, не ломают вёрстку
   Прозрачные ярлыки, position:absolute
══════════════════════════════ */

/* Контейнер nav.tabs — выводим из потока */
nav.tabs {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 200;
  height: 0;             /* не занимает высоту */
  overflow: visible;
}

/* UL — горизонтальная строка */
nav.tabs ul.nav {
  display: flex !important;
  flex-direction: row !important;
  gap: 2px !important;
  flex-wrap: nowrap !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0;            /* скрыты по умолчанию */
  transition: opacity .2s ease;
}

/* Показываем при наведении на родительский блок */
.contextual-region:hover nav.tabs ul.nav,
#content:hover nav.tabs ul.nav,
section.section:hover nav.tabs ul.nav {
  opacity: 1;
}

/* Ярлыки */
nav.tabs ul.nav li.nav-item {
  margin: 0 !important;
  padding: 0 !important;
}
nav.tabs ul.nav a.nav-link {
  height: 22px !important;
  padding: 0 8px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  font-family: var(--font) !important;
  color: var(--gray-600) !important;
  background: rgba(255,255,255,.85) !important;
  backdrop-filter: blur(4px);
  border: 1px solid var(--gray-200) !important;
  border-radius: 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap;
  transition: all .15s ease;
  text-decoration: none !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.1);
}
nav.tabs ul.nav a.nav-link:hover {
  background: var(--white) !important;
  border-color: var(--blue) !important;
  color: var(--blue) !important;
}
nav.tabs ul.nav a.nav-link.active,
nav.tabs ul.nav a.nav-link.is-active {
  background: var(--blue) !important;
  border-color: var(--blue) !important;
  color: var(--white) !important;
}

/* Родитель должен иметь relative для позиционирования */
.region-content,
section.section,
#content { position: relative; }

/* ══════════════════════════════════════════════════
   ПОДВАЛ V1 — финальный стиль (2026-05-20)
   Структура: lider-footer-col1 | col | col | col
══════════════════════════════════════════════════ */

/* Регион подвала */
footer,
.region-footer {
  background: var(--navy) !important;
}

/* Сетка подвала */
.region-footer {
  max-width: var(--cont-max);
  margin: 0 auto;
  padding: 44px var(--cont-pad) 0;
  display: grid !important;
  grid-template-columns: 2fr 1fr 1fr 1fr !important;
  gap: 40px !important;
}

/* Отступ под сеткой */
.region-footer > * {
  margin-bottom: 36px;
}

/* Колонка 1: лого + описание + телефон */
.lider-footer-col1 { display: flex; flex-direction: column; gap: 0; }

.footer-logo { height: 34px !important; width: auto !important; display: block !important; margin-bottom: 14px !important; }

.footer-desc {
  color: rgba(255,255,255,.5);
  font-size: 13px;
  line-height: 1.65;
  font-family: var(--font);
  margin: 0 0 14px;
  max-width: 280px;
}

.footer-phone {
  display: block;
  font-size: 22px !important;
  font-weight: 800 !important;
  color: var(--white) !important;
  font-family: var(--font) !important;
  text-decoration: none !important;
  letter-spacing: -.02em;
  line-height: 1;
  margin-bottom: 5px;
  transition: color var(--transition);
}
.footer-phone:hover { color: var(--accent) !important; }

.footer-email {
  display: block;
  color: rgba(255,255,255,.45) !important;
  font-size: 13px !important;
  font-family: var(--font) !important;
  text-decoration: none !important;
  transition: color var(--transition);
}
.footer-email:hover { color: rgba(255,255,255,.8) !important; }

/* Колонки 2-4: заголовок + ссылки */
.region-footer h2,
.region-footer h3,
.region-footer h4 {
  font-size: 10px !important;
  font-weight: 700 !important;
  color: rgba(255,255,255,.3) !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  margin: 0 0 12px !important;
  font-family: var(--font) !important;
}

.region-footer ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.region-footer ul li {
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}
.region-footer ul li::before { display: none !important; }

.region-footer ul li a,
.region-footer .block a {
  display: block;
  color: rgba(255,255,255,.65) !important;
  font-size: 14px !important;
  font-family: var(--font) !important;
  text-decoration: none !important;
  padding: 3px 0 !important;
  transition: color var(--transition);
}
.region-footer ul li a:hover,
.region-footer .block a:hover {
  color: var(--white) !important;
}

/* Контакты — адрес */
.region-footer address {
  font-style: normal;
  color: rgba(255,255,255,.55);
  font-size: 13px;
  font-family: var(--font);
  line-height: 1.7;
}

/* Нижняя строка копирайта */
.region-footer-bottom,
#block-lideravto-lider-footer-bottom {
  background: var(--navy);
  border-top: 1px solid rgba(255,255,255,.1);
  padding: 14px var(--cont-pad);
  color: rgba(255,255,255,.3);
  font-size: 12px;
  font-family: var(--font);
  text-align: left;
  max-width: 100%;
}

/* Адаптив */
@media (max-width: 991.98px) {
  .region-footer {
    grid-template-columns: 1fr 1fr !important;
    gap: var(--gap) !important;
    padding-top: 32px;
  }
}
@media (max-width: 575.98px) {
  .region-footer {
    grid-template-columns: 1fr !important;
  }
}

/* Телефон в подвале — принудительно крупный */
footer .footer-phone,
.region-footer .footer-phone,
.lider-footer-col1 .footer-phone {
  font-size: 24px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  display: block !important;
  margin-bottom: 6px !important;
  letter-spacing: -.03em !important;
  line-height: 1.1 !important;
  text-decoration: none !important;
}

/* ══ ПОДВАЛ: исправления выравнивания 2026-05-20 ══ */

/* Убираем рамки и паддинги с блоков подвала */
#block-lideravto-lider-footer-about,
#block-lideravto-lider-footer-contacts,
#block-lideravto-lider-footer-menu,
#block-lideravto-lider-footer-brands,
#block-lideravto-lider-footer-brands-block,
#block-lideravto-lider-footer-systems-block,
.region-footer .block {
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Сетка — выравнивание по верхнему краю */
.region-footer {
  align-items: start !important;
  padding-bottom: 40px !important;
}

/* Все заголовки блоков подвала — единый стиль */
.region-footer .block__title,
.region-footer h2.block-title,
.region-footer .block > h2,
.region-footer .block > h3 {
  font-size: 10px !important;
  font-weight: 700 !important;
  color: rgba(255,255,255,.3) !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  font-family: var(--font) !important;
  line-height: 1 !important;
}

/* Колонка 1: убираем visually-hidden и block-title если есть */
#block-lideravto-lider-footer-about .block__title { display: none !important; }

/* Логотип в подвале — белый через CSS (без PNG-артефактов) */
#block-lideravto-lider-footer-about .footer-logo,
.lider-footer-col1 .footer-logo {
  height: 34px !important;
  width: auto !important;
  max-width: 240px !important;
  display: block !important;
  margin-bottom: 14px !important;
  /* Не используем PNG-фильтр — белая PNG уже правильная */
}

/* ══ ПОДВАЛ: правильная сетка Barrio 2026-05-20 ══
   Barrio рендерит: .site-footer__top > section.region-footer-*
   Каждая section = колонка подвала
══════════════════════════════════════════════════ */

/* Обёртка footer */
footer.site-footer {
  background: var(--navy) !important;
  padding: 0 !important;
  margin: 0 !important;
}
footer.site-footer .container {
  max-width: var(--cont-max) !important;
  padding: 0 var(--cont-pad) !important;
}

/* Сетка: 4 секции в одну строку */
.site-footer__top {
  display: grid !important;
  grid-template-columns: 2fr 1fr 1fr 1fr !important;
  gap: 40px !important;
  align-items: start !important;  /* ← ВСЕ по верхнему краю */
  padding: 44px 0 40px !important;
  width: 100% !important;
  float: none !important;
  clear: none !important;
}
.site-footer__top::after { display: none !important; } /* убираем clearfix */

/* Каждая секция-колонка */
.site-footer__top section.region {
  float: none !important;
  clear: none !important;
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Убрать Bootstrap .row отступы */
.site-footer__top .row {
  margin: 0 !important;
}

/* Заголовки колонок — единый верхний стиль */
.site-footer__top .block__title,
.site-footer__top h2:not(.lider-footer-col1 h2),
.site-footer__top h3:not(.lider-footer-col1 h3) {
  font-size: 10px !important;
  font-weight: 700 !important;
  color: rgba(255,255,255,.3) !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  font-family: var(--font) !important;
  line-height: 1 !important;
  border: none !important;
}

/* Ссылки в подвале */
.site-footer__top ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.site-footer__top ul li { padding: 0 !important; list-style: none !important; }
.site-footer__top ul li::before { display: none !important; }
.site-footer__top ul li a,
.site-footer__top .block a:not(.footer-logo-link):not(.footer-phone):not(.footer-email) {
  color: rgba(255,255,255,.65) !important;
  font-size: 14px !important;
  font-family: var(--font) !important;
  text-decoration: none !important;
  padding: 3px 0 !important;
  display: block;
  transition: color var(--transition);
}
.site-footer__top ul li a:hover,
.site-footer__top .block a:hover {
  color: #fff !important;
}

/* Нижняя строка */
.site-footer__bottom,
footer.site-footer .site-footer__bottom {
  border-top: 1px solid rgba(255,255,255,.1) !important;
  padding: 14px 0 !important;
  color: rgba(255,255,255,.3) !important;
  font-size: 12px !important;
  font-family: var(--font) !important;
  background: var(--navy) !important;
}
.site-footer__bottom .container { padding: 0 var(--cont-pad) !important; }

/* Адаптив */
@media (max-width: 991.98px) {
  .site-footer__top {
    grid-template-columns: 1fr 1fr !important;
    gap: var(--gap) !important;
    padding: 32px 0 !important;
  }
}
@media (max-width: 575.98px) {
  .site-footer__top { grid-template-columns: 1fr !important; }
}

/* ══ ЛОГОТИП В ПОДВАЛЕ: CSS-трюк без PNG-артефактов ══
   filter:invert → белый фон становится чёрным
   mix-blend-mode:screen → чёрный на тёмном фоне = невидим
   текст становится белым/светлым → читается ✅
════════════════════════════════════════════════════ */
.site-footer__top .footer-logo,
footer .footer-logo,
.lider-footer-col1 img {
  filter: invert(1) !important;
  mix-blend-mode: screen !important;
  height: 36px !important;
  width: auto !important;
  max-width: 260px !important;
  display: block !important;
  margin-bottom: 14px !important;
}

/* Контакты - align-self fix */
.region-footer-fourth,
section.region-footer-fourth {
  align-self: start !important;
}

/* Отмена filter+blend trick — белый PNG достаточен */
.site-footer__top .footer-logo,
footer .footer-logo,
.lider-footer-col1 img {
  filter: none !important;
  mix-blend-mode: normal !important;
}

/* ══ HERO — главная страница ══ */
.lider-hero-wrap { margin: 0 0 32px; }
.lider-hero { background: linear-gradient(135deg, var(--navy) 0%, #0a4a9e 55%, #112244 100%); }
.lider-hero-inner { max-width: var(--cont-max); margin: 0 auto; padding: 48px var(--cont-pad); display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.lider-hero-left { flex: 1; }
.lider-hero-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.lider-chip { display: inline-flex; align-items: center; gap: 5px; background: rgba(255,255,255,.12); color: rgba(255,255,255,.9); font-size: 13px; font-weight: 500; padding: 5px 12px; border-radius: 20px; font-family: var(--font); }
.lider-chip i { font-size: 13px; }
.lider-hero-h1 { font-size: clamp(22px,3.5vw,40px); font-weight: 800; color: #fff; margin: 0 0 10px; line-height: 1.15; font-family: var(--font); }
.lider-hero-sub { font-size: 15px; color: rgba(255,255,255,.65); margin: 0 0 24px; font-family: var(--font); }
.lider-hero-search { display: flex; align-items: center; background: rgba(255,255,255,.1); border: 1.5px solid rgba(255,255,255,.2); border-radius: var(--radius); padding: 0 16px; max-width: 560px; }
.lider-hero-search i { color: rgba(255,255,255,.5); font-size: 16px; flex-shrink: 0; }
.lider-hero-search input { flex: 1; background: transparent; border: none; outline: none; padding: 12px 12px; font-size: 15px; font-family: var(--font); color: #fff; }
.lider-hero-search input::placeholder { color: rgba(255,255,255,.45); }
.lider-hero-search button { height: 40px; padding: 0 20px; background: var(--accent); color: #fff; border: none; border-radius: 6px; font-size: 15px; font-weight: 700; font-family: var(--font); cursor: pointer; flex-shrink: 0; transition: background var(--transition); }
.lider-hero-search button:hover { background: var(--accent-hover); }
.lider-hero-hint { font-size: 12px; color: rgba(255,255,255,.4); margin: 8px 0 0; font-family: var(--font); }
.lider-hero-stats { display: flex; gap: 24px; flex-shrink: 0; }
.lider-hero-stat { text-align: center; }
.lider-hero-num { display: block; font-size: 32px; font-weight: 800; color: #fff; line-height: 1; font-family: var(--font); }
.lider-hero-label { display: block; font-size: 12px; color: rgba(255,255,255,.5); margin-top: 4px; font-family: var(--font); }

/* ══ POPULAR PARTS — карточки ══ */
.lider-popular-wrap { padding: 0 0 32px; }
.lider-section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--gap); }
.lider-section-title { font-size: var(--h2); font-weight: 700; color: var(--gray-900); font-family: var(--font); margin: 0; }
.lider-more-link { display: flex; align-items: center; gap: 4px; font-size: var(--small); color: var(--blue); font-family: var(--font); font-weight: 600; }
.lider-popular-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: var(--gap); }
@media (max-width:991.98px) { .lider-popular-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width:575.98px) { .lider-popular-grid { grid-template-columns: 1fr; } }
.lider-pcard { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; transition: box-shadow var(--transition); }
.lider-pcard:hover { box-shadow: 0 4px 20px rgba(15,45,94,.1); border-color: var(--blue); }
.lider-pcard-img { position: relative; height: 180px; overflow: hidden; background: var(--gray-50); }
.lider-pcard-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.lider-pcard:hover .lider-pcard-img img { transform: scale(1.04); }
.lider-badge-used { position: absolute; top: 8px; right: 8px; background: var(--blue); color: #fff; font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 4px; }
.lider-badge-sale { position: absolute; top: 8px; left: 8px; background: var(--error); color: #fff; font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 4px; }
.lider-pcard-body { padding: 12px; flex: 1; display: flex; flex-direction: column; gap: 5px; }
.lider-pcard-oem { font-family: monospace; font-size: 11px; color: var(--gray-500); background: var(--gray-100); padding: 1px 6px; border-radius: 3px; display: inline-block; }
.lider-pcard-name { font-size: 14px; font-weight: 600; color: var(--gray-900); line-height: 1.3; flex: 1; }
.lider-pcard-meta { display: flex; gap: 4px; flex-wrap: wrap; }
.lider-chip-brand { background: var(--sky); color: var(--navy); font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 10px; }
.lider-chip-gen { background: var(--gray-100); color: var(--gray-700); font-size: 11px; padding: 2px 8px; border-radius: 10px; }
.lider-pcard-price { display: flex; align-items: baseline; gap: 8px; }
.lider-price { font-size: 18px; font-weight: 700; color: var(--navy); font-family: var(--font); }
.lider-price-old { font-size: 13px; color: var(--gray-400); text-decoration: line-through; }
.lider-btn-cart { display: flex; align-items: center; justify-content: center; gap: 5px; height: 36px; background: var(--accent); color: #fff !important; border-radius: var(--radius); font-size: 13px; font-weight: 700; font-family: var(--font); text-decoration: none !important; transition: background var(--transition); margin-top: 4px; }
.lider-btn-cart:hover { background: var(--accent-hover); }

/* ── ЛОГО В ПОДВАЛЕ: JPG → белый через CSS filter ── */
.site-footer__top .footer-logo,
footer .footer-logo,
.lider-footer-col1 .footer-logo {
  filter: brightness(0) invert(1) !important;
  mix-blend-mode: normal !important;
  height: 36px !important;
  width: auto !important;
  max-width: 280px !important;
  display: block !important;
  margin-bottom: 14px !important;
}

/* ── ЛОГО В ПОДВАЛЕ: JPG в белой плашке (решение без PNG-артефактов) ── */
.site-footer__top .footer-logo,
footer .footer-logo,
.lider-footer-col1 .footer-logo {
  filter: none !important;
  mix-blend-mode: normal !important;
  height: 36px !important;
  width: auto !important;
  max-width: 260px !important;
  display: block !important;
  margin-bottom: 14px !important;
  background: rgba(255,255,255,0.95) !important;
  padding: 5px 10px !important;
  border-radius: 6px !important;
}