/* Mobile-only finishing layer. Desktop layouts are intentionally untouched. */
.mobile-filter-close { display: none; }
.mobile-filter-toggle-wrap { display: none; }
@media (max-width: 1199px) {
    .site-header {
        height: calc(72px + env(safe-area-inset-top));
        padding-top: env(safe-area-inset-top);
    }
    .site-mobile-head {
        min-height: calc(78px + env(safe-area-inset-top));
        padding-top: calc(10px + env(safe-area-inset-top));
    }
    .site-mobile-install[hidden], .site-mobile-install-hint[hidden] { display: none; }
    .site-mobile-footer { flex-wrap: wrap; }
    .site-mobile-install {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-height: 48px;
        border-radius: 12px;
        background: #e9efe9;
        color: #193c2c;
        font-size: 14px;
        font-weight: 750;
    }
    .site-mobile-install-hint {
        width: 100%;
        margin: 0;
        color: #52685a;
        font-size: 13px;
        line-height: 1.45;
    }
}

@media (max-width: 900px) {
    .mobile-filter-toggle-wrap { display: block; margin-bottom: 16px; }
    #toggle-filter { scroll-margin-top: calc(82px + env(safe-area-inset-top)); }
    #toggle-filter[aria-expanded="true"] { border-color: #2d5d4c; box-shadow: 0 0 0 2px rgba(45,93,76,.12); }
    .mobile-filter-chevron { margin-left: 4px; font-size: .7rem; transition: transform .2s ease; }
    #toggle-filter[aria-expanded="true"] .mobile-filter-chevron { transform: rotate(180deg); }
    .mobile-filter-close { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 44px; margin-top: 10px; border: 1px solid #dce5dc; border-radius: 10px; background: #fff; color: #1a3628; font-size: 13px; font-weight: 700; }
    .mobile-filter-close:focus-visible { outline: 2px solid #2d5d4c; outline-offset: 2px; }
    .home-filter-apply { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 46px; margin-top: 14px; border-radius: 10px; background: #1a3628; color: #fff; font-size: .84rem; font-weight: 800; }
}

@media (min-width: 768px) and (max-width: 900px) {
    .home-page .home-layout, .home-page .home-layout.cart-collapsed { grid-template-columns: minmax(0, 1fr); }
    .home-page .home-filter-panel { position: static; grid-column: 1; max-height: none; overflow: visible; }
    .home-page .home-products-panel { grid-column: 1; grid-row: 2; }
    .home-page.filters-open .home-cart-panel { display: none; }
    .catalog-browser-layout { display: block; }
    .catalog-filter-panel { position: static; max-height: none; overflow: visible; margin-bottom: 18px; }
    .catalog-page .catalog-filter-form { display: none; }
    .catalog-page .catalog-filter-form.mobile-filter-visible { display: block; }
    .catalog-filter-toggle { display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; min-height: 48px; margin-bottom: 18px; border: 1px solid #dce5dc; border-radius: 12px; background: #fff; color: #1a3628; font-size: .84rem; font-weight: 700; box-shadow: 0 4px 14px rgba(26,54,40,.035); }
}

@media (max-width: 767px) {
    .pwa-offline-notice { position: fixed; z-index: 100; top: calc(64px + env(safe-area-inset-top)); left: 12px; right: 12px; padding: 10px 14px; border-radius: 10px; background: #fff7e1; border: 1px solid #d9b75d; box-shadow: 0 8px 24px #0002; color: #553c0a; font-size: 13px; line-height: 1.4; }
    .pwa-offline-notice[hidden] { display: none; }
    body > main.container { padding-top: calc(80px + env(safe-area-inset-top)); }

    /* Long breadcrumb labels remain readable instead of being cut off. */
    main nav[aria-label="breadcrumb"] { overflow-x: visible; white-space: normal; }
    main nav[aria-label="breadcrumb"] ol { display: flex; flex-wrap: wrap; gap: 5px 0; min-width: 0; }
    main nav[aria-label="breadcrumb"] li { min-width: 0; }
    main nav[aria-label="breadcrumb"] li:last-child { display: block; flex-basis: 100%; overflow-wrap: anywhere; }
    body > main.container > nav:first-child { flex-wrap: wrap; }
    body > main.container > nav:first-child > span:last-child { min-width: 0; overflow-wrap: anywhere; }

    .auth-intro { padding: 24px; }
    .auth-intro .auth-perks { display: none; }
    .auth-intro h2 { margin-bottom: 0; }
    .auth-intro .register-title { font-size: clamp(1.65rem, 8vw, 2.25rem) !important; line-height: 1; letter-spacing: -.06em; }
    .auth-form-panel { padding: 24px; }
    .profile-hero { min-height: 0; }
    .profile-hero > div.relative { padding-top: 24px; padding-bottom: 24px; }
    .profile-hero nav { margin-bottom: 12px; }
    .profile-hero p { margin-bottom: 12px; }
    .profile-mobile-orders { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; margin-top: 15px; padding: 8px 14px; border-radius: 10px; background: #e9efe9; color: #193c2c; font-size: 13px; font-weight: 700; }
    #orders { scroll-margin-top: calc(88px + env(safe-area-inset-top)); }

    .order-items-table, .cookie-table { display: block; min-width: 0; }
    .order-items-table thead, .cookie-table thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .order-items-table tbody, .cookie-table tbody { display: block; }
    .order-items-table tbody tr, .cookie-table tbody tr { display: block; padding: 12px 0; border-bottom: 1px solid #e5e7eb; }
    .order-items-table td, .cookie-table td { display: flex; align-items: start; justify-content: space-between; gap: 12px; padding: 8px 0; text-align: right; white-space: normal; overflow-wrap: anywhere; }
    .order-items-table td::before, .cookie-table td::before { flex: 0 0 38%; color: #6b7280; font-size: 11px; font-weight: 700; line-height: 1.5; text-align: left; text-transform: uppercase; letter-spacing: .06em; content: attr(data-label); }
    .order-items-table td:first-child, .cookie-table td:first-child { display: block; text-align: left; }
    .order-items-table td:first-child::before, .cookie-table td:first-child::before { display: none; }
    .order-items-table td[colspan] { display: block; text-align: center; }
    .order-items-table td[colspan]::before { display: none; }
    .cookie-table td:nth-child(2)::before { content: 'Цель использования'; }
    .cookie-table td:nth-child(3)::before { content: 'Срок хранения'; }
    .cookie-table td { display: block; text-align: left; }
    .cookie-table td::before { display: block; margin-bottom: 3px; }

    /* Avoid iOS zoom on form focus and keep touch controls comfortable. */
    input:not([type="checkbox"]):not([type="radio"]), textarea, select { font-size: 16px; }
    .home-quantity, .home-quantity input, .home-quantity-button, .home-add-button,
    .home-quick-view, .catalog-page .catalog-category-row .accordion-toggle { min-height: 44px; }
    .home-quantity-button { min-width: 44px; }
    .catalog-category-row { grid-template-columns: 44px minmax(0, 1fr) 44px; }
    .catalog-category-check { width: 44px; min-height: 44px; }
    .catalog-category-row .accordion-toggle { width: 44px; }

    /* Floating controls stay clear of the search form and device gesture area. */
    .home-cart-panel { bottom: calc(16px + env(safe-area-inset-bottom)); }
    #scroll-top { bottom: calc(16px + env(safe-area-inset-bottom)); right: 16px; min-width: 44px; min-height: 44px; }
    body:has(.home-page) #scroll-top { bottom: calc(90px + env(safe-area-inset-bottom)); }
    body:has(#cookie-notification:not(.hidden)) .home-cart-panel,
    body:has(#cookie-notification:not(.hidden)) #scroll-top { display: none; }

    /* Make the checkout form reachable without scrolling past every cart item. */
    .checkout-page form > .grid { row-gap: 28px; }
    .checkout-page form h3 { margin-bottom: 0; }
    .checkout-page form .md\:col-span-2.pt-8 { padding-top: 12px; }
    .checkout-page form > .pt-16 { padding-top: 32px; margin-top: 32px; }
    .checkout-items summary { display: flex; align-items: center; min-height: 48px; margin: -8px 0 12px; color: #193c2c; font-size: 14px; font-weight: 700; cursor: pointer; }
    .checkout-items summary::marker { content: ''; }
    .checkout-items summary::-webkit-details-marker { display: none; }
    .checkout-items summary::after { content: '⌄'; margin-left: auto; font-size: 22px; line-height: 1; }
    .checkout-items[open] summary::after { transform: rotate(180deg); }
    .checkout-items .checkout-items-hide, .checkout-items[open] .checkout-items-show { display: none; }
    .checkout-items[open] .checkout-items-hide { display: inline; }

    /* The product quick view scrolls as a single sheet on shorter phones. */
    #quick-view-modal { padding: env(safe-area-inset-top) 0 env(safe-area-inset-bottom); }
    #modal-content { max-height: calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); margin: 0 12px; overflow-y: auto; }
    #quick-view-content { height: auto; }
    #quick-view-content > div { height: auto; overflow: visible; }
    #quick-view-content > div > div:last-child { height: auto; overflow: visible; }

    #cookie-notification { bottom: calc(10px + env(safe-area-inset-bottom)); padding: 16px; }
    #cookie-notification button { min-height: 44px; }
    footer a { min-height: 44px; }
    footer nav a { display: flex; align-items: center; }
    footer .border-t .flex.items-center.gap-6 { flex-wrap: wrap; justify-content: center; gap: 4px 18px; }
}

@media (max-width: 620px) {
    .site-mobile-menu { width: 100% !important; left: 0; }
}

@media (min-width: 768px) {
    .checkout-items summary { display: none; }
    .profile-mobile-orders { display: none; }
}
