/* ============================================================================
 * omegamed.ru — ТЕМА (поверх Bootstrap 5.3). Сохраняем каркас и палитру legacy,
 * модернизируем отзывчивость/типографику. Подробно: analyze/DESIGN.md
 * ============================================================================ */

body{
  font-family: var(--bs-body-font-family);
  color: var(--om-text);
  background: #eef2f3;                     /* нижняя половина фона — светлая */
  font-size: 15px;
  position: relative;
  display: flow-root;                      /* BFC: не даёт margin-top карточки «продавить» фон (дырка сверху) */
}

/* ── ФОН «НА ПОПОЛАМ»: верхняя зелёная полоса — ТОТ ЖЕ официальный зелёный, что и навигация ── */
.om-bg-top{
  position: absolute; top: 0; left: 0; right: 0; height: 470px; z-index: -1; pointer-events: none;
  /* базовый цвет — как было (#14897C) + лёгкий белый блик под 45°, медленно слева направо */
  background-color: var(--om-primary);   /* #14897C */
  background-image: linear-gradient(45deg,
                    rgba(255,255,255,0) 42%, rgba(255,255,255,.16) 50%, rgba(255,255,255,0) 58%);
  background-size: 260% 260%;
  background-repeat: no-repeat;
  animation: omBgSheen 13s linear infinite;
}
@keyframes omBgSheen{
  0%   { background-position: -45% 50%; }
  100% { background-position: 145% 50%; }
}
@media (prefers-reduced-motion: reduce){ .om-bg-top{ animation: none; background-image: none; } }
@media (max-width: 768px){ .om-bg-top{ height: 320px; } }

/* Montserrat — заголовки, бренд, навигация, секции (display); тело — Open Sans */
h1, h2, h3, h4, h5, h6,
.om-logo, .om-grena, .om-section-title, .om-phone,
.om-nav .navbar-nav .nav-link,
.om-hero h1, .om-content h1, .om-content h2, .om-content h3,
.om-cattree-head, .om-cat-card .om-cat-title{
  font-family: var(--om-font-display);
}

a{ color: var(--om-primary); text-decoration: none; }
a:hover{ color: var(--om-link-hover); text-decoration: underline; }

/* ── центрированная «карточка» сайта (legacy <table width=850>) ───────────── */
.om-shell{
  max-width: 1080px;
  margin: 22px auto;
  background: #fff;
  border: 6px solid #fff;
  border-radius: 10px;
  box-shadow: 0 10px 40px rgba(20,137,124,.12), 0 2px 8px rgba(0,0,0,.05);
  overflow: hidden;
}

/* ── ШАПКА ─────────────────────────────────────────────────────────────────── */
.om-topbar{ padding: 14px 22px; border-bottom: 1px solid var(--om-border); }
.om-logo{
  font-weight: 800; font-size: clamp(25px, 2.4vw, 31px); letter-spacing: .5px;
  text-transform: uppercase; white-space: nowrap; text-decoration: none;
  /* вивидный оранжевый + бегущий лёгкий светлый блик (градиент ползёт по тексту) */
  background: linear-gradient(105deg,
              #E8821E 0%, #E8821E 43%, #ffd49a 50%, #E8821E 57%, #E8821E 100%);
  background-size: 250% 100%;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  animation: omLogoShine 4.5s linear infinite;
}
.om-logo:hover{ text-decoration: none; opacity: .92; }
@keyframes omLogoShine{
  0%   { background-position: 130% 0; }
  100% { background-position: -30% 0; }
}
@media (prefers-reduced-motion: reduce){ .om-logo{ animation: none; } }
.om-contacts{ font-size: 12.5px; color: var(--om-primary); line-height: 1.45; }
/* шапка флексом: лого слева, адреса прижаты к правой стороне (отступ от логотипа), телефон у правого края */
.om-addrs{ display: flex; gap: 22px; }
.om-contacts .om-addr{ border-left: 1px solid var(--om-border); padding-left: 8px; font-size: 11px; line-height: 1.45; text-align: left; }
@media (min-width: 768px){
  .om-head{ flex-wrap: wrap; row-gap: 6px; }  /* на узких десктопах телефон переносится, а не вылезает */
  .om-addrs{ margin-left: auto; }              /* свободное место уходит влево → отступ от логотипа */
  .om-headphone{ margin-left: 14px; }          /* небольшой зазор между адресами и телефоном */
}
.om-contacts .om-addr strong{ font-size: 12.5px; }   /* город крупнее улицы */
.om-phone{ font-size: 20px; font-weight: 700; color: var(--om-text); white-space: nowrap; }
.om-phone .om-phone-accent{ color: var(--om-accent); }
.om-contacts a{ color: var(--om-primary); }

/* ── HERO-СЛАЙДЕР (Bootstrap carousel) ──────────────────────────────────────── */
.om-hero{ position: relative; background:#0e6b60; }
.om-hero .carousel-item img{ width:100%; aspect-ratio: 822 / 232; object-fit: cover; display:block; }
.om-hero .carousel-indicators{ margin-bottom: 46px; }   /* выше плашки-подписи */
.om-hero .carousel-indicators [data-bs-target]{ width:10px; height:10px; border-radius:50%; border:0; }
.om-hero .carousel-control-prev, .om-hero .carousel-control-next{ width:7%; opacity:.65; }
.om-hero .carousel-control-prev{ margin-bottom:40px; } .om-hero .carousel-control-next{ margin-bottom:40px; }
/* плашка-подпись внизу слайдера (как в легаси) */
.om-hero-caption{
  position:absolute; left:0; right:0; bottom:0; z-index:5; display:block;
  background: rgba(18,28,32,.62); color:#fff; padding:11px 20px; font-size:14px; line-height:1.4;
  text-decoration:none; border-top:1px solid rgba(255,255,255,.12);
}
.om-hero-caption:hover{ background: rgba(20,137,124,.85); color:#fff; text-decoration:underline; }
@media (max-width: 576px){ .om-hero-caption{ font-size:12px; padding:8px 14px; } }

/* ── НАВИГАЦИЯ (чуть темнее, с градиентом) ─────────────────────────────────── */
.om-nav{ background: linear-gradient(180deg, #11796d 0%, #0c5f56 100%); }
.om-nav .navbar-nav{ padding: 6px 0; }
.om-nav .navbar-nav .nav-link{
  color: #fff; font-weight: 700; font-size: 13px; padding: 7px 11px;
  margin: 0 1px; border-radius: 8px; text-transform: none; transition: .15s; white-space: nowrap;
}
/* меню + поиск — в одну строку, без переноса (на десктопе) */
@media (min-width: 992px){
  .om-nav .navbar-collapse{ flex-wrap: nowrap; }
  .om-nav .navbar-nav{ flex-wrap: nowrap; }
  .om-navsearch{ flex: 0 0 auto; }
  .om-navsearch .form-control{ width: 150px; }
}
/* выделенные пункты — оранжевый градиент + закруглённые углы */
.om-nav .navbar-nav .nav-link:hover,
.om-nav .navbar-nav .nav-link.active{
  background: linear-gradient(135deg, #ffac39 0%, #ff8a00 100%);
  color: #fff; box-shadow: 0 3px 10px rgba(255,138,0,.32);
}
.om-nav .navbar-nav .nav-link:hover{ box-shadow: 0 2px 8px rgba(255,138,0,.28); }
/* бейдж корзины: на оранжевой плашке (hover/active) делаем белым, чтобы не сливался */
.om-nav .navbar-nav .nav-link:hover .om-cart-badge,
.om-nav .navbar-nav .nav-link.active .om-cart-badge{ background: #fff; color: var(--om-accent); }
.om-nav .navbar-toggler{ border-color: rgba(255,255,255,.4); }
.om-nav .navbar-toggler-icon{ filter: invert(1) grayscale(1) brightness(2); }
.om-navsearch{ gap: 8px; }                                            /* отбивка кнопки от поля */
.om-navsearch .form-control{ border:0; height: 36px; border-radius: 7px; }
.om-navsearch .btn{ background:#fff; color: var(--om-primary); border:0; border-radius: 7px; padding: 0 12px; }
.om-navsearch .btn:hover{ background: var(--om-accent); color:#fff; }

/* ── КОНТЕНТ / ТИПОГРАФИКА ─────────────────────────────────────────────────── */
.om-content{ padding: 26px 30px 34px; }
.om-content h1{ color: var(--om-primary); font-weight: 800; font-size: 24px; margin-bottom: 14px; }
.om-content h2{ color: var(--om-heading-muted); text-transform: uppercase; font-weight: 800; font-size: 18px; letter-spacing:.4px; margin: 6px 0 14px; }
.om-content h3{ color: var(--om-accent); font-weight: 700; font-size: 18px; }
.om-section-title{ color: var(--om-primary); font-weight: 800; text-transform: uppercase; font-size: 18px; letter-spacing:.4px; }

/* ── КНОПКИ ────────────────────────────────────────────────────────────────── */
.om-btn-accent{ background: var(--om-accent-warm); border:0; color:#fff; font-weight:700; }
.om-btn-accent:hover{ background: var(--om-accent); color:#fff; }
.btn-primary{ --bs-btn-bg: var(--om-primary); --bs-btn-border-color: var(--om-primary);
  --bs-btn-hover-bg: var(--om-primary-dark); --bs-btn-hover-border-color: var(--om-primary-dark);
  --bs-btn-active-bg: var(--om-primary-dark); }

/* ── КАТАЛОГ (таблица / карточки) ──────────────────────────────────────────── */
.om-catalog-table{ font-size:12px; }                                  /* каталог — 12px */
.om-catalog-table td, .om-catalog-table th{ font-size:12px; }
.om-catalog-table td .fw-semibold{ font-size:12px; }
.om-catalog-table thead th{ background:#F4F8FB; color:#81A8C5; font-size:11px; font-weight:600; border-color:var(--om-border-2); text-transform:uppercase; }
.om-catalog-table tbody tr:hover{ background: var(--om-row-hover); }
/* кнопка «в корзину» + количество в строке каталога (по центру колонки) */
.om-cat-actions{ text-align:center; }
.om-cat-actions .om-qty-group{ display:inline-flex; width:auto; flex-wrap:nowrap; }   /* не переносить кнопку под поле (в т.ч. на мобиле) */
.om-cat-actions .om-qty-group .form-control{ flex:0 0 50px; width:50px; text-align:center; font-size:12px; }  /* фикс. ширина — поле не растягивается */
.om-cat-actions .om-qty-group .btn{ flex:0 0 auto; padding:3px 9px; }                /* значок корзины прилипает к полю количества */
.om-cat-actions .om-qty-group .btn .material-icons{ font-size:18px; vertical-align:-4px; }
.om-cat-actions .om-more{ display:inline-block; margin-top:6px; font-size:11px; color:var(--om-muted); text-decoration:none; }
.om-cat-actions .om-more:hover{ color:var(--om-primary); text-decoration:underline; }
.om-btn-accent.om-added{ background:var(--om-primary); }
.om-cat-card{ border:1px solid var(--om-border); border-radius:10px; transition:.15s; height:100%; }
.om-cat-card:hover{ border-color: var(--om-primary); box-shadow:0 6px 20px rgba(20,137,124,.12); }
.om-cat-card .om-cat-title{ color: var(--om-catalog-title); font-weight:700; }

/* ── ПОДВАЛ ────────────────────────────────────────────────────────────────── */
.om-footer{ background:#fff; border-top:1px solid var(--om-border); padding:18px 30px; font-size:13px; color: var(--om-primary); }
.om-footer a{ color: var(--om-primary); padding:2px 6px; }
.om-footer .om-copy{ color: var(--om-muted); font-size:12px; }

/* ── HOME промо-плитки ─────────────────────────────────────────────────────── */
.om-tile{ display:block; border:1px solid var(--om-border); border-radius:10px; padding:18px; height:100%; color:var(--om-text); transition:.15s; }
.om-tile:hover{ border-color:var(--om-primary); box-shadow:0 6px 20px rgba(20,137,124,.10); text-decoration:none; color:var(--om-text); }
.om-tile .om-tile-ic{ color:var(--om-primary); font-size:30px; }

/* ── ДЕРЕВО КАТЕГОРИЙ ───────────────────────────────────────────────────────── */
.om-cattree{ border:1px solid var(--om-border); border-radius:10px; overflow:hidden; }
.om-cattree-head{ background:var(--om-primary); color:#fff; font-weight:700; padding:10px 14px; font-size:14px; }
.om-cattree ul{ margin:0; padding:6px 0; }
.om-cattree .om-cat-li > a{ display:flex; padding:6px 14px; color:var(--om-text); font-size:13.5px; border-radius:6px; }
.om-cattree .om-cat-li > a:hover{ background:var(--om-primary-soft); color:var(--om-primary); text-decoration:none; }
.om-cattree .om-cat-li > a.fw-bold{ color:var(--om-primary); }
.om-cat-badge{ background:var(--om-primary-soft); color:var(--om-primary); font-weight:600; font-size:11px; }

/* ── бейдж корзины в навигации ─────────────────────────────────────────────── */
.om-cart-link{ position:relative; }
.om-cart-badge{ background:var(--om-accent); color:#fff; font-size:11px; }

.om-error-page{ background:#eef2f3; }

/* ── каталоги / документация (PDF) ─────────────────────────────────────────── */
.om-catalog-card{ display:flex; flex-direction:column; border:1px solid var(--om-border); border-radius:12px; overflow:hidden; background:#fff; }
.om-catalog-coverwrap{ display:block; background:#f6f9fb; border-bottom:1px solid var(--om-border); text-align:center; }
.om-catalog-cover{ max-width:100%; height:auto; max-height:300px; display:inline-block; }
.om-catalog-body{ padding:12px 14px; }
.om-catalog-name{ font-weight:600; font-size:14px; line-height:1.35; color:var(--om-text); }
/* список даташитов на странице производителя */
.om-ds-link{ display:flex; align-items:center; gap:8px; border:1px solid var(--om-border); border-radius:9px; padding:9px 12px; background:#fff; color:var(--om-text); text-decoration:none; height:100%; transition:background .15s, border-color .15s; }
.om-ds-link:hover{ background:var(--om-row-hover); border-color:var(--om-accent); color:var(--om-text); }
.om-ds-ic{ font-size:20px; color:#c0392b; flex:0 0 auto; }
.om-ds-name{ flex:1 1 auto; font-size:13.5px; line-height:1.3; }
.om-ds-size{ flex:0 0 auto; font-size:11px; color:var(--om-muted); white-space:nowrap; }
/* компактный блок документации на странице категории каталога */
.om-ds-box{ border:1px solid var(--om-border); border-left:3px solid var(--om-primary); border-radius:10px; padding:11px 16px; background:var(--om-primary-soft); }
.om-ds-box-title{ font-weight:700; color:var(--om-primary); margin-bottom:5px; }
.om-ds-box-list{ margin:0; padding-left:18px; }
.om-ds-box-list li{ margin:3px 0; }
.om-ds-box-list a{ color:var(--om-primary); }
.om-ds-box-list a:hover{ color:var(--om-link-hover); }

/* ── адаптив ───────────────────────────────────────────────────────────────── */
@media (max-width: 768px){
  .om-shell{ margin: 0; border-width:0; border-radius:0; }
  .om-topbar{ text-align:center; }
  .om-content{ padding: 18px; }
}
