/* ==========================================================================
   SAUERMANN — фирменный стиль
   Цвета сняты с логотипа: синий #0F7BCB, оранжевый #EE8222.
   Файл подключается ПОСЛЕДНИМ (после core/catalog/details.min.css)
   и только переопределяет существующие стили. Откат = убрать подключение.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

:root {
  --brand-blue: #0F7BCB;
  --brand-blue-600: #0B66AB;
  --brand-blue-800: #0A3F6B;
  --brand-blue-900: #072B4A;
  --brand-blue-50: #EEF6FD;
  --brand-blue-100: #DCEDFA;
  --brand-orange: #EE8222;
  --brand-orange-600: #D96E10;
  --brand-orange-50: #FEF3E8;

  --ink: #14212E;
  --ink-soft: #4B5B6B;
  --line: #E3EAF1;
  --surface: #FFFFFF;
  --page: #F4F7FA;

  --radius: 16px;
  --radius-sm: 10px;
  --shadow-sm: 0 1px 2px rgba(10, 63, 107, .06), 0 2px 8px rgba(10, 63, 107, .05);
  --shadow-md: 0 10px 30px -10px rgba(10, 63, 107, .25);
  --ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- База ---------- */
body {
  font-family: 'Manrope', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
  background-color: var(--page);
  color: var(--ink-soft);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  color: var(--ink);
  font-weight: 700;
  letter-spacing: -.01em;
}
a { color: var(--brand-blue); transition: color .2s var(--ease); }
a:hover { color: var(--brand-orange); }
::selection { background: var(--brand-orange); color: #fff; }

.text-primary { color: var(--brand-blue) !important; }
.bg-primary { background-color: var(--brand-blue) !important; }
.bg-primary-faded { background-color: var(--brand-blue-50) !important; }
.text-warning { color: var(--brand-orange) !important; }

/* ---------- Топбар ---------- */
.topbar {
  background: var(--brand-blue-900);
  border-bottom: 0;
}
.topbar .nav-link,
.topbar .nav-link.bg-white,
.topbar .nav-link.text-dark {
  background: transparent !important;
  color: rgba(255, 255, 255, .78) !important;
  letter-spacing: 0;
  font-size: .875rem;
}
.topbar .nav-link:hover { color: #fff !important; }
.topbar .nav-link.border-right { border-right-color: rgba(255, 255, 255, .14) !important; }
.topbar .nav-link svg { fill: var(--brand-orange); }
.topbar a[href*="/price/"] { color: var(--brand-orange) !important; }
.topbar a[href*="/price/"]:hover { color: #fff !important; }

/* ---------- Шапка ---------- */
header {
  background-color: rgba(255, 255, 255, .92);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  backdrop-filter: saturate(180%) blur(12px);
  box-shadow: 0 1px 0 var(--line), 0 6px 24px -18px rgba(10, 63, 107, .5);
  padding: .65rem 0;
}
header .logo { max-height: 36px; width: auto; }
header .nav-link.bg-white { background: transparent !important; }
.nav-main .nav-link { border-color: transparent; }

/* кнопка «Каталог» */
.nav-main > .dropdown > span > .nav-link {
  background: var(--brand-orange) !important;
  color: #fff !important;
  border-radius: 999px;
  padding: .45rem 1.25rem .45rem 1rem !important;
  font-size: 1rem !important;
  letter-spacing: 0;
  box-shadow: 0 6px 16px -6px rgba(238, 130, 34, .7);
  transition: background .2s var(--ease);
}
.nav-main > .dropdown > span > .nav-link svg { fill: #fff; margin-right: .35rem; width: 22px; height: 22px; }
.nav-main > .dropdown:hover > span > .nav-link { background: var(--brand-orange-600) !important; }

/* поиск + иконки */
.nav-circle .nav-link {
  transition: background .2s var(--ease), color .2s var(--ease);
}
.nav-circle .nav-link:hover { background: var(--brand-blue-50) !important; color: var(--brand-blue); }
.nav-circle .nav-link.border { border-color: var(--line) !important; background: var(--page) !important; }
.nav-circle .nav-link svg { fill: var(--brand-blue-800); }

/* поле «поиск по каталогу» — шире на ПК */
.nav-circle .nav-link.border[href="#searchModal"] {
  justify-content: flex-start;
  height: 44px;
  padding: 0 1.1rem;
  color: #8796A5;
  font-size: .95rem;
  border-radius: 999px !important;
}
.nav-circle .nav-link.border[href="#searchModal"]:hover {
  border-color: var(--brand-blue) !important;
  background: #fff !important;
  box-shadow: 0 0 0 .2rem rgba(15, 123, 203, .12);
}
@media (min-width: 992px) {
  .nav-circle .nav-link.border[href="#searchModal"] { width: 340px !important; }
}
@media (min-width: 1200px) {
  .nav-circle .nav-link.border[href="#searchModal"] { width: 440px !important; }
}
@media (min-width: 1400px) {
  .nav-circle .nav-link.border[href="#searchModal"] { width: 520px !important; }
}
.badge-primary { background-color: var(--brand-orange); color: #fff; }

/* линейные иконки кабинета и корзины */
header .nav-link.has-badge { color: var(--brand-blue-800); }
header .nav-link.has-badge:hover { color: var(--brand-blue); }
header svg.ico-line {
  fill: none !important;
  stroke: currentColor;
  stroke-width: 1.8;
  width: 24px;
  height: 24px;
}
header .nav-link.has-badge .badge {
  font-size: .65rem;
  min-width: 18px;
  border: 2px solid #fff;
  font-weight: 700;
}

/* мега-меню */
.dropdown-menu {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-md);
}
.dropdown-mega .dropdown-menu { padding: 1.25rem; }
.list-group-item-action:hover, .list-group-item-action:focus {
  background-color: var(--brand-blue-50);
  color: var(--brand-blue);
}
.dropdown-mega .h5 { border-bottom-color: var(--line) !important; font-size: .95rem; color: var(--ink-soft); }

/* ---------- Кнопки ---------- */
.btn { font-weight: 600; letter-spacing: .02em; transition: background-color .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease), box-shadow .2s var(--ease); }

.btn-primary {
  background-color: var(--brand-blue);
  border-color: var(--brand-blue);
  color: #fff;
}
.btn-primary:hover, .btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):active {
  background-color: var(--brand-blue-600);
  border-color: var(--brand-blue-600);
}
.btn-outline-primary { color: var(--brand-blue); border-color: var(--brand-blue); }
.btn-outline-primary:hover,
.btn-outline-primary:not(:disabled):not(.disabled):active {
  background-color: var(--brand-blue);
  border-color: var(--brand-blue);
  color: #fff;
}

/* акцентные CTA — оранжевые */
.btn-warning, .btn-success,
.btn-faded-primary {
  background-color: var(--brand-orange);
  border-color: var(--brand-orange);
  color: #fff;
}
.btn-warning:hover, .btn-success:hover, .btn-faded-primary:hover,
.btn-warning:focus, .btn-success:focus, .btn-faded-primary:focus,
.btn-warning:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled):active,
.btn-faded-primary:not(:disabled):not(.disabled):active {
  background-color: var(--brand-orange-600);
  border-color: var(--brand-orange-600);
  color: #fff;
  box-shadow: 0 8px 18px -8px rgba(238, 130, 34, .8);
}
.btn:focus, .btn.focus, .form-control:focus {
  box-shadow: 0 0 0 .2rem rgba(15, 123, 203, .2);
}
.form-control:focus { border-color: var(--brand-blue); }
.form-control { border-color: var(--line); border-radius: var(--radius-sm); }

/* ---------- Карточки ---------- */
.card { border-radius: var(--radius); }
.card-style1 {
  border: 1px solid var(--line);
  border-radius: 7px;
  box-shadow: none;
  overflow: hidden;
  transition: none;
}
.card-style1:hover {
  box-shadow: none;
  border-color: var(--brand-blue-100);
}
body div.card-img-div { background: #fff !important; }

/* плашки категорий */
.card-style1 > .card-link > .card-body.bg-primary-faded {
  background: linear-gradient(135deg, var(--brand-blue) 0%, var(--brand-blue-800) 100%) !important;
  color: #fff !important;
}
.card-style1 > .card-link > .card-body.bg-primary-faded .h5 { color: #fff; font-weight: 600; }
.card-style1:hover > .card-link > .card-body.bg-primary-faded {
  background: linear-gradient(135deg, var(--brand-orange) 0%, var(--brand-orange-600) 100%) !important;
}

/* карточка товара: блок покупки без заливки, кнопки зелёная + синяя */
form .form-row.card-body.bg-primary-faded { background: transparent !important; padding-left: 0; padding-right: 0; }
.btn.add2cart,
.btn.add2cart:hover, .btn.add2cart:focus,
.btn.add2cart:not(:disabled):not(.disabled):active {
  background-color: #1E9E4A !important;
  border-color: #1E9E4A !important;
  color: #fff !important;
  box-shadow: none;
}
.btn.add2cart:hover, .btn.add2cart:focus { background-color: #178A3F !important; border-color: #178A3F !important; }
.btn.btn-success[data-target="#сallMe"][data-title],
.btn.btn-success[data-target="#сallMe"][data-title]:focus,
.btn.btn-success[data-target="#сallMe"][data-title]:not(:disabled):not(.disabled):active {
  background-color: var(--brand-blue);
  border-color: var(--brand-blue);
  color: #fff;
  box-shadow: none;
}
.btn.btn-success[data-target="#сallMe"][data-title]:hover { background-color: var(--brand-blue-600); border-color: var(--brand-blue-600); }

.card-product .card-title, .card-product .card-link { color: var(--ink); }
.card-product .card-link:hover { color: var(--brand-blue); }
.card-product .card-footer { background: transparent; border-top: 0; padding-top: 0; }

/* каталог: крупнее изображения товаров */
.products-list > .card-product > .card-body { padding: .5rem .5rem .75rem; }
.products-list > .card-product .card-wrapper { border-radius: var(--radius-sm); margin-bottom: .5rem; }
.products-list > .card-product .card-img-top { object-fit: contain; }
@media (min-width: 992px) {
  .products-list > .card-product { flex: 0 0 33.3333%; max-width: 33.3333%; }
}

/* карточка товара: инфополоса оплата / доставка / сроки */
.info-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin: 1.5rem 0 2rem;
  background: var(--brand-blue-50);
  border: 1px solid var(--brand-blue-100);
  border-radius: 7px;
  overflow: hidden;
}
.info-strip__item {
  display: flex;
  align-items: flex-start;
  gap: .9rem;
  padding: 1.25rem 1.5rem;
}
.info-strip__item + .info-strip__item { border-left: 1px solid var(--brand-blue-100); }
.info-strip__icon {
  flex: 0 0 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #fff;
  color: var(--brand-blue);
}
.info-strip__title {
  color: var(--ink);
  font-weight: 700;
  font-size: .95rem;
  margin-bottom: .35rem;
}
.info-strip__text { font-size: .875rem; line-height: 1.55; color: var(--ink-soft); }
.info-strip__text b { color: var(--ink); font-weight: 600; }
.info-strip__muted { color: #8796A5; }
@media (max-width: 767.98px) {
  .info-strip { grid-template-columns: 1fr; }
  .info-strip__item + .info-strip__item { border-left: 0; border-top: 1px solid var(--brand-blue-100); }
}

/* цены */
.price span { color: var(--ink); font-weight: 800; }
.price span.del { color: #9AA8B6; font-weight: 500; }
.price span.del::after { border-color: var(--brand-orange); height: 2px; border-bottom: 0; }

/* заголовки секций на главной */
.text-center.my-4.h5 {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--ink);
  position: relative;
  padding-bottom: .75rem;
}
.text-center.my-4.h5::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 56px;
  height: 4px;
  margin-left: -28px;
  border-radius: 4px;
  background: linear-gradient(90deg, var(--brand-blue) 0 50%, var(--brand-orange) 50% 100%);
}
.text-center.my-4.h5 span[style] { color: var(--ink) !important; }
.text-center.my-4.h5 svg { fill: var(--brand-orange); }

/* слайдер */
#homeSlider { border-radius: var(--radius); overflow: hidden; }
.swiper-button-prev, .swiper-button-next {
  width: 44px; height: 44px;
  border-radius: 50%;
  background-color: #fff;
  box-shadow: var(--shadow-md);
  color: var(--brand-blue);
}
.swiper-button-prev::after, .swiper-button-next::after { font-size: 16px; font-weight: 800; }
.swiper-pagination-bullet-active { background: var(--brand-orange); }

/* ---------- Пагинация, хлебные крошки, вкладки ---------- */
.page-item.active .page-link { background-color: var(--brand-blue); border-color: var(--brand-blue); }
.page-link { color: var(--brand-blue); }
.breadcrumb { background: transparent; padding-left: 0; }
.nav-tabs .nav-link.active, .nav-pills .nav-link.active { color: var(--brand-blue); }
.nav-tabs .nav-link.active { box-shadow: inset 0 -3px 0 var(--brand-orange); }
.custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--brand-blue);
  border-color: var(--brand-blue);
}

/* ---------- Модалки ---------- */
.modal-content { border-radius: var(--radius); box-shadow: var(--shadow-md); }

/* ---------- Подвал ---------- */
.footer {
  margin-top: 3rem;
  padding-top: 3rem;
  background: var(--brand-blue-900);
  border-top: 4px solid var(--brand-orange);
  color: rgba(255, 255, 255, .72);
}
.footer .h5 {
  color: #fff;
  font-size: .85rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: 1rem;
}
.footer a, .footer a span { color: rgba(255, 255, 255, .85); }
.footer a:hover, .footer a:hover span { color: var(--brand-orange); }
.footer .list-group-sm .list-group-item {
  background-color: transparent;
  color: rgba(255, 255, 255, .72);
  padding-top: .3rem;
  padding-bottom: .3rem;
}
.footer .list-group-sm .list-group-item:hover,
.footer .list-group-sm .list-group-item:focus {
  background-color: transparent;
  color: var(--brand-orange);
}
.footer .btn-success { border-radius: 999px; color: #fff; }
.footer img[src*="visa-mast-mir"] { border-radius: 8px; border: 0 !important; }
.copyright {
  background: #051F36;
  color: rgba(255, 255, 255, .5);
  border-top: 1px solid rgba(255, 255, 255, .06);
}

/* ---------- Скроллбар ---------- */
::-webkit-scrollbar-thumb { background: #B8C6D4; border: 0; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: var(--brand-blue); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; }
}
