/**
 * ECOA-4999 UX F10 (ECOA-4976 D12/D13) — mobilní lišta Filtry · Řadit, chipy, bottom sheet filtrů,
 * „Načíst další“. Linkováno jen za branou AG_UX_PREVIEW_CATALOG_F10, vše navíc scopované na
 * body.ag-ux-catalog-f10. Desktop (≥ 1024 px) beze změny.
 */
.ag-f10-bar, .ag-f10-more, .ag-f10-sheet-close, .ag-f10-sheet-foot { display: none; }

@media (max-width: 1023px) {
  /* původní tlačítko „Filtry“ nahrazuje lišta; řazení je v liště */
  body.ag-ux-catalog-f10 .ag-cat-main > .js-sidebar-toggle { display: none !important; }
  body.ag-ux-catalog-f10 .ag-toolbar .ag-toolbar__sort { display: none; }

  body.ag-ux-catalog-f10 .ag-f10-bar {
    display: block;
    position: sticky; top: 0; z-index: 60;
    margin: 0 -12px 12px; padding: 8px 12px;
    background: #fff; border-bottom: 1px solid var(--ag-line, #E5E7EB);
  }
  .ag-f10-bar__row { display: flex; align-items: stretch; gap: 8px; }
  .ag-f10-bar__btn {
    position: relative; flex: 1 1 0; min-height: 44px; margin: 0;
    display: flex; align-items: center; justify-content: center; gap: 6px;
    border: 1px solid var(--ag-line, #D7DBE2); border-radius: 10px; background: #fff;
    font: 600 15px/1.2 var(--ag-font-body, sans-serif); color: var(--ag-navy, #1F2A44); cursor: pointer;
  }
  .ag-f10-bar__btn[hidden] { display: none; }
  .ag-f10-bar__n { color: var(--ag-green-deep, #2E8C32); }
  .ag-f10-bar__sep { display: none; }
  /* nativní select přes celé tlačítko → systémový výběr jedním klepnutím */
  .ag-f10-bar__sort select {
    position: absolute; inset: 0; width: 100%; height: 100%;
    opacity: 0; cursor: pointer; font-size: 16px;
  }

  .ag-f10-chips {
    display: flex; gap: 8px; margin: 8px -12px 0; padding: 0 12px 2px;
    overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .ag-f10-chips[hidden] { display: none; }
  /* kurátorované rychlé filtry ag_model_chips přesunuté do lišty */
  .ag-f10-bar .ag-qf {
    order: 0; flex: none; max-width: none; margin: 8px -12px 0; padding: 0 12px 2px;
    flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .ag-f10-bar .ag-qf::-webkit-scrollbar { display: none; }
  /* „Vymazat“ je v patičce panelu */
  body.ag-ux-catalog-f10 .ag-sidebar-header .js-ag-clear-filters { display: none; }
  .ag-f10-chips::-webkit-scrollbar { display: none; }
  .ag-f10-chip {
    flex: 0 0 auto; display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px;
    border: 1px solid var(--ag-line, #D7DBE2); border-radius: 999px; background: #fff;
    font: 500 14px/1 var(--ag-font-body, sans-serif); color: var(--ag-navy, #1F2A44);
    text-decoration: none; white-space: nowrap;
  }
  .ag-f10-chip:hover, .ag-f10-chip:focus { text-decoration: none; color: var(--ag-navy, #1F2A44); }
  .ag-f10-chip.is-on {
    border-color: var(--ag-green-deep, #2E8C32); background: var(--ag-green-50, #ECF7ED);
    color: var(--ag-green-deep, #2E8C32);
  }
  .ag-f10-chip.is-on::after { content: '\00D7'; margin-left: 6px; font-size: 16px; }

  /* filtry = bottom sheet místo levého šuplíku */
  body.ag-ux-catalog-f10 .ag-cat-sidebar {
    top: auto; bottom: 0; left: 0; right: 0;
    width: 100%; max-width: none; height: auto; max-height: 85vh;
    padding: 16px 16px 0; border-radius: 16px 16px 0 0;
    transform: translateY(105%); transition: transform .25s ease;
    box-shadow: 0 -8px 32px rgba(0, 0, 0, .18);
    overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
    z-index: 1100; /* nad #header (z-index 1000), jinak ho po AJAX scrollu nahoru překryje */
  }
  body.ag-ux-catalog-f10 .ag-sidebar-backdrop { z-index: 1099; }
  /* facety v sheetu jsou vždy rozbalené; pravidla .collapse-icons z tématu platí jen pod #left-column → obě šipky */
  body.ag-ux-catalog-f10 .ag-cat-sidebar .facet .title .collapse-icons { display: none; }
  body.ag-ux-catalog-f10 .ag-cat-sidebar.ag-sidebar--open { left: 0; transform: none; }
  body.ag-ux-catalog-f10 .ag-sidebar-header {
    position: sticky; top: -16px; z-index: 2; background: #fff; margin: -16px -16px 8px; padding: 16px;
    border-bottom: 1px solid var(--ag-line, #E5E7EB);
  }
  .ag-f10-sheet-close {
    display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
    margin-left: 12px; width: 36px; height: 36px; border: 0; border-radius: 50%;
    background: var(--ag-bg-soft, #F3F4F6); font-size: 22px; line-height: 1; color: var(--ag-navy, #1F2A44);
  }
  .ag-f10-sheet-foot {
    position: sticky; bottom: 0; z-index: 2; display: flex; gap: 8px;
    margin: 8px -16px 0; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
    background: #fff; border-top: 1px solid var(--ag-line, #E5E7EB);
  }
  .ag-f10-sheet-clear, .ag-f10-sheet-show {
    min-height: 48px; border-radius: 10px; font: 600 15px/1.2 var(--ag-font-body, sans-serif);
  }
  .ag-f10-sheet-clear {
    flex: 0 0 auto; padding: 0 16px; border: 1px solid var(--ag-line, #D7DBE2); background: #fff;
    color: var(--ag-navy, #1F2A44);
  }
  .ag-f10-sheet-show {
    flex: 1 1 auto; border: 0; background: var(--ag-green, #3DAA3F); color: #fff;
  }
  .ag-f10-sheet-show[disabled] { opacity: .7; }

  /* D12 Načíst další */
  body.ag-ux-catalog-f10 .ag-f10-more { display: block; margin: 20px 0 8px; text-align: center; }
  body.ag-ux-catalog-f10 .ag-f10-more[hidden] { display: none; }
  .ag-f10-more__info { margin: 0 0 10px; font: 400 14px/1.4 var(--ag-font-body, sans-serif); color: var(--ag-navy-2, #3A455F); }
  .ag-f10-more__btn {
    width: 100%; max-width: 420px; min-height: 48px; border-radius: 10px;
    border: 1px solid var(--ag-navy, #1F2A44); background: #fff;
    font: 600 15px/1.2 var(--ag-font-body, sans-serif); color: var(--ag-navy, #1F2A44);
  }
  .ag-f10-more__btn[disabled] { opacity: .6; }
  body.ag-ux-catalog-f10.ag-f10-lm nav.pagination { display: none; }
  /* grid 1fr se roztáhne o min-content dlouhého slova v připojené kartě → vodorovný přetok */
  body.ag-ux-catalog-f10 #js-product-list > *,
  body.ag-ux-catalog-f10 #js-product-list .products > * { min-width: 0; }
}