/**
 * StockStrategy — PWA-специфичные стили
 * 
 * Применяются ТОЛЬКО в standalone-режиме (установленное PWA).
 * НЕ затрагивают обычный браузерный режим.
 * 
 * Используемые подходы:
 * - @media (display-mode: standalone) — стили только для PWA
 * - env(safe-area-inset-*) — безопасные зоны для iPhone с «чёлкой»
 * - overscroll-behavior — блокировка bounce/pull-to-refresh
 * - touch-action — устранение задержки 300ms при тапе
 */

/* ============================================================
   ГЛОБАЛЬНЫЕ СТИЛИ — standalone-режим
   ============================================================ */

@media (display-mode: standalone) {

    /* --- Блокировка overscroll (bounce-эффект, pull-to-refresh) --- */
    html {
        font-size: 85%;
        overscroll-behavior: none;
    }

    /* --- Убираем задержку 300ms на кнопках и ссылках --- */
    button,
    a,
    .btn,
    .nav-link,
    .tab button,
    [role="button"] {
        touch-action: manipulation;
    }

    /* --- Плавный momentum-scroll на iOS --- */
    .table_container,
    .navbar-vertical-content,
    .scrollbar,
    .simplebar-content-wrapper,
    [class*="overflow"] {
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-y: contain;
    }

    /* --- Запрет выделения текста в навигации (как в нативном приложении) --- */
    .navbar,
    .tab,
    footer {
        -webkit-user-select: none;
        user-select: none;
    }

    /* --- Скрыть элементы, не нужные в standalone --- */
    .install-banner,
    [data-pwa-hide] {
        display: none !important;
    }
}


/* ============================================================
   SAFE-AREA INSETS — для iPhone с «чёлкой» / Dynamic Island
   Работают только при viewport-fit=cover
   ============================================================ */

@media (display-mode: standalone) {

    /* --- Верхний навбар (user_base.html, admin/base.html) --- */
    .navbar-top.fixed-top {
        padding-top: env(safe-area-inset-top, 0px);
        padding-left: env(safe-area-inset-left, 0px);
        padding-right: env(safe-area-inset-right, 0px);
    }

    /* --- Вертикальный сайдбар (admin) --- */
    .navbar-vertical {
        padding-top: env(safe-area-inset-top, 0px);
        padding-left: env(safe-area-inset-left, 0px);
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }

    /* --- Основной контент (user_base.html) --- */
    .container-content {
        padding-bottom: env(safe-area-inset-bottom, 0px);
        padding-left: env(safe-area-inset-left, 0px);
        padding-right: env(safe-area-inset-right, 0px);
    }

    /* --- Футер --- */
    .footer,
    footer {
        padding-bottom: env(safe-area-inset-bottom, 0px);
        padding-left: env(safe-area-inset-left, 0px);
        padding-right: env(safe-area-inset-right, 0px);
    }

    /* --- Compact layout: header (7vh) --- */
    header {
        padding-top: env(safe-area-inset-top, 0px);
    }

    /* --- Compact layout: нижняя навигация (.tab) --- */
    .tab {
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }

    /* --- Compact layout: область контента между header и tab --- */
    .tabcontent {
        top: calc(7vh + env(safe-area-inset-top, 0px));
        bottom: calc(7vh + env(safe-area-inset-bottom, 0px));
        height: calc(86vh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
    }
}


/* ============================================================
   LAYOUT: SIDEBAR ↔ CONTENT — координация в standalone
   Правый сайдбар: 15.875rem (expanded) → 4rem (collapsed)
   Контент подстраивается через margin-right + transition
   ============================================================ */

@media (display-mode: standalone) and (min-width: 992px) {

    /* Sidebar EXPANDED — контент учитывает правый сайдбар */
    .container-content {
        width: auto !important;
        margin-left: 5% !important;
        margin-right: calc(15.875rem + 5%) !important;
        max-width: 1600px;
        transition: margin-right 0.2s ease;
    }

    /* Sidebar COLLAPSED — контент растягивается */
    .navbar-vertical-collapsed .navbar-vertical.right-expand-lg + .navbar.navbar-top ~ .container-content {
        margin-left: 5% !important;
        margin-right: calc(4rem + 5%) !important;
        width: auto !important;
        transition: margin-right 0.2s ease;
    }
}


/* ============================================================
   АДАПТАЦИЯ LANDING PAGE — standalone
   deep.html (браузер) и pwa_app.html (PWA)
   ============================================================ */

@media (display-mode: standalone) {

    /* Общие для лендингов */
    .gradient-bg.py-20,
    .gradient-bg.py-24 {
        padding-top: calc(5rem + env(safe-area-inset-top, 0px));
        padding-bottom: 5rem;
    }

    /* Footer safe-area */
    footer.bg-gray-900,
    footer {
        padding-bottom: calc(3rem + env(safe-area-inset-bottom, 0px));
        padding-left: calc(1.5rem + env(safe-area-inset-left, 0px));
        padding-right: calc(1.5rem + env(safe-area-inset-right, 0px));
    }

    /* PWA app page: header safe-area */
    .pwa-header {
        padding-top: env(safe-area-inset-top, 0px);
        height: calc(56px + env(safe-area-inset-top, 0px));
    }

    /* PWA app page: hero safe-area */
    .pwa-hero {
        padding-top: calc(32px + env(safe-area-inset-top, 0px));
    }

    /* PWA app page: content scroll area */
    .pwa-content {
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }

    /* PWA app page: bottom sheet safe-area */
    .pwa-modal {
        padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
    }
}


/* ============================================================
   ТЁМНАЯ ТЕМА + standalone
   ============================================================ */

@media (display-mode: standalone) {

    /* Loading overlay адаптация под тёмную тему */
    [data-bs-theme="dark"] #loading-overlay {
        background: rgba(15, 17, 26, 0.85);
    }

    /* Визуальная обратная связь при тапе на кнопки (как нативное приложение) */
    .btn:active:not(:disabled),
    button:active:not(:disabled) {
        transform: scale(0.97);
        transition: transform 0.1s ease;
    }

    /* Активные ссылки в навигации */
    .nav-link:active {
        opacity: 0.7;
    }
}


/* ============================================================
   МОБИЛЬНЫЕ + STANDALONE — оптимизация для телефонов
   ============================================================ */

@media (display-mode: standalone) and (max-width: 991.98px) {

    /* user_base: на мобильных контент на полную ширину */
    .container-content {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    /* user_base: скрыть правый сайдбар на мобильных в PWA */
    .navbar-vertical.right-expand-lg {
        transform: translateX(100%);
    }
}

@media (display-mode: standalone) and (max-width: 767.98px) {

    /* Увеличить область тапа для кнопок навигации */
    .nav-link,
    .navbar-nav-icons .nav-link {
        min-height: 44px;
        display: flex;
        align-items: center;
    }
}
