/* ============================================================================
   svoboda-v4 — Мобильная адаптация (всегда «живой» файл).

   Этот файл подключается НАПРЯМУЮ в template.php с авто-версией ?rev=filemtime,
   В ОБХОД бандла-минификатора Moguta (minify-css.css). Поэтому любые правки здесь
   применяются сразу, без ручной чистки кэша mg-cache.

   Сюда выносим глобальные мобильные правила, которые должны работать на ЛЮБОЙ
   странице независимо от состояния кэша. Подключается ПОСЛЕ style.css/бандла и
   corp-page.css, поэтому имеет приоритет при равной специфичности.
   ========================================================================== */

/* --- Mobile nav: scroll-lock, backdrop, touch targets, safe-area --- */
.nav-mobile-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 38;
  background: rgba(0, 14, 75, 0.28);
  -webkit-tap-highlight-color: transparent;
}

.nav-mobile-backdrop:not([hidden]) {
  display: block;
}

body.nav-open {
  overflow: hidden !important;
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
}

body.nav-open .nav-mobile-backdrop:not([hidden]) {
  display: block;
}

.nav-mobile-group {
  border-top: 1px solid var(--border, #e6e8ee);
}

.nav-mobile-head--sub {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--muted-foreground, #6b7280) !important;
  padding: 10px 4px 10px 12px !important;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.nav-mobile-body--sub {
  padding-bottom: 4px;
}

@media (max-width: 1000px) {
  /* Touch targets ≥44px */
  .nav-burger {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: 5px !important;
    margin: 0 -6px 0 0;
    padding: 0 6px;
    box-sizing: border-box;
  }

  .nav-utils .icn,
  .nav-utils--main .icn,
  .nav-utils--top .icn {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px;
    min-height: 44px;
  }

  .nav-mobile-head {
    min-height: 44px;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }

  .nav-mobile-item {
    min-height: 44px;
    display: flex !important;
    align-items: center;
    box-sizing: border-box;
  }

  .nav-mobile {
    z-index: 41 !important;
    max-height: calc(100dvh - var(--nav-height, 62px) - var(--nav-mobile-bar-h, 0px) - env(safe-area-inset-bottom, 0px));
    padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  }
}

@media (max-width: 760px) {
  html { overflow-x: hidden; }
  body { overflow-x: hidden; }

  /* Bottom bar + safe area (iPhone home indicator) */
  :root {
    --nav-mobile-bar-h: calc(56px + env(safe-area-inset-bottom, 0px));
  }

  body {
    padding-bottom: var(--nav-mobile-bar-h) !important;
  }

  .nav-mobile-bar {
    height: var(--nav-mobile-bar-h) !important;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    box-sizing: border-box;
  }

  .nav-mobile-bar a {
    min-height: 44px;
  }

  /* Главная: секции и карточки */
  .v4-landing .home-section,
  .v4-landing .home-trust,
  .v4-landing .home-why,
  .v4-landing .home-cta {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .v4-landing .home-hero-cta {
    flex-direction: column;
    align-items: stretch;
    width: 100% !important;
    max-width: 100% !important;
  }
  .v4-landing .home-hero-cta a {
    text-align: center;
  }
  .v4-landing #intro-topmeta {
    font-size: 9px !important;
    letter-spacing: 0.12em !important;
    text-align: center !important;
    max-width: 100% !important;
    padding: 0 8px;
  }

  /* Hero: центр карусели + воздух между рамкой и текстом */
  .v4-landing #intro {
    padding: 44px 34px 48px !important;
  }
  .v4-landing #intro .intro-frame {
    inset: 6px !important;
  }
  .v4-landing #intro-gallery {
    perspective-origin: 50% 50% !important;
    -webkit-perspective-origin: 50% 50% !important;
  }
  .v4-landing .intro-carousel__ring {
    left: auto !important;
    right: auto !important;
    margin: 0 auto !important;
    transform-origin: 50% 50% !important;
  }
  .v4-landing .hero-slider {
    max-width: min(100%, 300px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .v4-landing .hero-slider__track {
    height: clamp(140px, 38vw, 180px) !important;
    overflow: visible;
  }

  /* Главная: товары 2 в ряд, компактные карточки */
  .v4-landing .home-rail .vd-grid,
  .v4-landing .home-rail__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  .v4-landing .card {
    padding: 6px 4px 12px !important;
    border-radius: 16px !important;
  }
  .v4-landing .card-media {
    margin-bottom: 6px !important;
  }
  .v4-landing .card-media img {
    max-width: 82% !important;
    max-height: 82% !important;
  }
  .v4-landing .card-name {
    font-size: 13px !important;
    -webkit-line-clamp: 2 !important;
  }
  .v4-landing .card-buy {
    font-size: 11px !important;
    padding: 10px 8px !important;
  }

  /* Каталог тоже держим 2 колонки на phone */
  .vd-grid,
  .products-wrapper,
  .catalog-main .products-wrapper,
  .by-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  .card {
    padding: 6px 4px 12px;
  }
  .card-media {
    aspect-ratio: 1 / 1;
  }
  .card-name {
    font-size: 13px !important;
    -webkit-line-clamp: 2 !important;
  }
  .card-buy,
  .card .card-buy {
    font-size: 11px !important;
    padding: 10px 8px !important;
  }

  /* Каталог: chips в одну горизонтальную полосу */
  .catalog-cats .sub-cats:not(.grid),
  .catalog .sub-cats:not(.grid),
  .products-wrapper + .sub-cats:not(.grid),
  .c-title + .sub-cats:not(.grid),
  h1 + .sub-cats:not(.grid),
  .catalog-main > .sub-cats:not(.grid) {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin-left: -4px;
    margin-right: -4px;
    padding: 2px 4px 10px;
    gap: 8px;
  }
  .catalog-cats .sub-cats:not(.grid)::-webkit-scrollbar,
  .catalog .sub-cats:not(.grid)::-webkit-scrollbar,
  h1 + .sub-cats:not(.grid)::-webkit-scrollbar,
  .catalog-main > .sub-cats:not(.grid)::-webkit-scrollbar {
    display: none;
  }
  .catalog-cats .sub-cats:not(.grid) a,
  .catalog .sub-cats:not(.grid) a,
  h1 + .sub-cats:not(.grid) a,
  .catalog-main > .sub-cats:not(.grid) a {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  /* Названия карточек — до 3 строк на узком экране */
  .card-name {
    -webkit-line-clamp: 3 !important;
  }

  /* Sticky ATC на PDP над bottom bar */
  .product-details-block .js-product-controls,
  .product-details-block .buttons-block {
    position: sticky;
    bottom: calc(var(--nav-mobile-bar-h, 56px) + 8px);
    z-index: 25;
    background: color-mix(in srgb, var(--card, #fff) 94%, transparent);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 10px 0;
    margin-left: -4px;
    margin-right: -4px;
    padding-left: 4px;
    padding-right: 4px;
  }
  .product-details-block .addToCart,
  .product-details-block .product-buy {
    min-height: 48px;
    flex: 1 1 auto;
  }

  /* Корзина / оформление — не уезжают под bar */
  .a-cart,
  .cart-wrapper,
  .order-form-wrapper,
  .checkout-form-wrapper,
  .payment-option-wrapper,
  .c-form,
  .enter-page,
  .personal {
    padding-bottom: 12px;
  }
  .a-cart .checkout-btn,
  .a-cart .cart-btns,
  .order .order-btn,
  .checkout-form .order-btn,
  .c-form .button,
  form .default-btn {
    margin-bottom: 8px;
  }
}

/* Touch: не прятать название/цену карточки после тапа */
@media (hover: none) {
  .card:hover .card-body,
  .v4-landing .card:hover .card-body {
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  .card:hover .card-media img,
  .v4-landing .card:hover .card-media img {
    transform: none !important;
    opacity: 1 !important;
  }
  .card:hover .card-hover-bg,
  .v4-landing .card:hover .card-hover-bg {
    opacity: 0 !important;
  }
}

/* Hover-эффекты карточек — только устройства с настоящим hover */
@media (hover: hover) and (pointer: fine) {
  .card:hover .card-body { opacity: 0; pointer-events: none; }
}

/* Tablet: sticky filter учитывает видимый top-ряд хедера */
@media (max-width: 1000px) and (min-width: 761px) {
  .catalog-filterbar {
    top: calc(var(--nav-top-h, 52px) + var(--nav-main-h, 62px) + 8px) !important;
  }
}

/* Corp / blog / auth / personal — mobile polish */
@media (max-width: 760px) {
  .corp-sidebar-toggle {
    min-height: 48px !important;
    width: 100%;
  }

  .corp-content table,
  .site-page .corp-content table,
  .mg-blog-article table,
  .blog-details table {
    display: block;
    width: 100% !important;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .corp-content iframe,
  .corp-content img,
  .corp-content video,
  .mg-blog-article img,
  .blog-details img {
    max-width: 100% !important;
    height: auto !important;
  }

  .personal-tabs,
  .tabs-nav,
  .l-person-nav,
  .personal .tab-links {
    display: flex !important;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 8px;
    scrollbar-width: none;
    margin-bottom: 16px;
  }
  .personal-tabs::-webkit-scrollbar,
  .tabs-nav::-webkit-scrollbar,
  .l-person-nav::-webkit-scrollbar {
    display: none;
  }
  .personal-tabs a,
  .personal-tabs button,
  .tabs-nav a,
  .l-person-nav a {
    flex: 0 0 auto;
    min-height: 44px;
    white-space: nowrap;
  }

  .enter-form,
  .create-user-form,
  .forgot-pass,
  .c-login,
  .c-register,
  form.login-form,
  .personal-content,
  .order-content,
  .cart-table,
  .order-table {
    padding: 16px !important;
    max-width: 100%;
    box-sizing: border-box;
  }

  .enter-form input,
  .create-user-form input,
  .forgot-pass input,
  .c-login input,
  .personal-content input,
  .personal-content select,
  .order-content input,
  .order-content select {
    min-height: 44px;
    font-size: 16px; /* iOS: без автозума */
  }

  .mg-main-news-list,
  .news-list,
  .blog-list {
    grid-template-columns: 1fr !important;
  }

  .mg-blog-article,
  .blog-details {
    padding-left: 0;
    padding-right: 0;
  }
}