/* === abpf-filters.css (v19 - FULL + mobile sort full width) === */
:root{
  --abpf-blue:#009cff;
  --abpf-bg:#fff;
  --abpf-border:#dcdcdc;
  --abpf-radius:8px;
  --abpf-shadow:0 10px 24px rgba(0,0,0,.14);
  --abpf-text:#333;
  --abpf-muted:#888;
}

.abpf-toprow{
  display:block;
  width:100%;
  margin:0 0 18px 0;
  position:relative;
  z-index:80;
  clear:both;
  padding-bottom:10px;
  border-bottom:1px solid #eee;
}

.abpf-bar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
}

.abpf-dd{ position:relative; }

.abpf-dd--sort{
  margin-left:auto;
  padding-left:12px;
}

.abpf-btn{
  background:var(--abpf-bg);
  border:1px solid var(--abpf-border);
  border-radius:var(--abpf-radius);
  padding:10px 12px;
  min-width:150px;
  font-size:14px;
  font-weight:700;
  color:var(--abpf-text);
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
  transition:all .2s ease;
  height:auto !important;
  line-height:1.35 !important;
  margin:0 !important;
  box-shadow:none !important;
  text-transform:none !important;
}

.abpf-btn:hover,
.abpf-btn.is-active{
  border-color:var(--abpf-blue);
  color:var(--abpf-blue);
}
.abpf-btn.is-active{ background:#f0f8ff; }

.abpf-caret{
  width:12px;height:12px;
  fill:currentColor;
  opacity:.7;
  margin-left:8px;
}

.abpf-panel{
  display:none;
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  width:340px;
  max-height:460px;
  overflow-y:auto;
  background:#fff;
  border:1px solid var(--abpf-border);
  border-radius:var(--abpf-radius);
  box-shadow:var(--abpf-shadow);
  z-index:1000;
  padding:14px 14px 12px;
}
.abpf-panel.is-open{ display:block; }

@media (max-width:768px){
  .abpf-panel{
    width:92vw;
    max-width:380px;
    position:fixed;
    top:50% !important;
    left:50% !important;
    transform:translate(-50%,-50%);
  }
}

.abpf-panel__head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid #eee;
  padding-bottom:10px;
  margin-bottom:10px;
  font-weight:800;
  color:#000;
}
.abpf-panel__close{
  background:none;border:0;
  font-size:26px;cursor:pointer;color:#999;
}

.abpf-item{
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  width:100%;
  padding:10px 10px;
  color:var(--abpf-text);
  cursor:pointer;
  background:none;
  border:none;
  border-bottom:1px solid #f0f0f0;
  text-align:left;
  font-size:14px;
  border-radius:6px;
}
.abpf-item:hover{ background:#f9f9f9; }
.abpf-item.is-selected{
  font-weight:800;
  color:var(--abpf-blue);
  background:#f0f8ff;
  border-bottom-color:transparent;
}
.abpf-item input{
  width:16px !important;
  height:16px !important;
  pointer-events:none;
}

.abpf-range-wrap{
  position:relative;
  height:54px;
  margin-top:16px;
  margin-bottom:10px;
}
.abpf-track-bg{
  position:absolute;
  top:50%;
  left:0;
  width:100%;
  height:6px;
  background:#eee;
  border-radius:999px;
  transform:translateY(-50%);
}
.abpf-range-input{
  position:absolute;
  top:50%;
  left:0;
  width:100%;
  transform:translateY(-50%);
  appearance:none;
  -webkit-appearance:none;
  background:transparent;
  pointer-events:none;
  margin:0;
}
.abpf-range-input::-webkit-slider-thumb{
  -webkit-appearance:none;
  pointer-events:auto;
  width:24px;height:24px;
  border-radius:50%;
  background:var(--abpf-blue);
  border:2px solid #fff;
  box-shadow:0 3px 10px rgba(0,0,0,.28);
  cursor:pointer;
}
.abpf-range-input::-moz-range-thumb{
  pointer-events:auto;
  width:24px;height:24px;
  border-radius:50%;
  background:var(--abpf-blue);
  border:2px solid #fff;
  box-shadow:0 3px 10px rgba(0,0,0,.28);
  cursor:pointer;
}
.abpf-range-vals{
  display:flex;
  justify-content:center;
  gap:8px;
  font-size:16px;
  color:#000;
  font-weight:900;
  margin-top:2px;
}
.abpf-autoapply-note{
  text-align:center;
  font-size:12px;
  color:var(--abpf-muted);
  margin-top:6px;
}
.abpf-autoapply-status{
  text-align:center;
  font-size:12px;
  color:var(--abpf-muted);
  margin-top:6px;
  min-height:16px;
}

.abpf-active-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
  width:100%;
}

.abpf-tag{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:#eef7ff;
  color:var(--abpf-blue);
  border:1px solid rgba(0,156,255,.45);
  padding:6px 12px;
  border-radius:999px;
  font-size:13px;
  font-weight:800;
  cursor:pointer;
  user-select:none;
}
.abpf-tag:focus{
  outline:none;
  box-shadow:0 0 0 3px rgba(0,156,255,.18);
}
.abpf-tag__x{
  font-style:normal;
  font-weight:900;
  opacity:.75;
  line-height:1;
}
.abpf-tag:hover .abpf-tag__x{ opacity:1; }

.abpf-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.42);
  z-index:70;
  display:none;
}
.abpf-overlay.is-on{ display:block; }

.abpf-original-hidden{
  visibility:hidden !important;
  height:0 !important;
  overflow:hidden !important;
  margin:0 !important;
  padding:0 !important;
  position:absolute !important;
  z-index:-1;
}

/* Schovat defaultní Shoptet řazení */
#products-listing-order,
.products-listing-order-heading,
.category-header form fieldset,
#content .category-header .d-flex.justify-content-between.align-items-center,
.sortingToggle,
.listSorting__controls,
[aria-controls="listSortingControls"],
.filters-unveil-button-wrapper,
.btn.unveil-button[data-unveil="filters"],
.filters-wrapper .btn.unveil-button,
.mobile-ordering-link,
.products-sorting{
  display:none !important;
}

/* Schovat ten velký nativní blok filtrů */
body.abpf-loaded #filters,
body.abpf-loaded .filters-wrapper,
body.abpf-loaded .box-filters,
body.abpf-loaded #filters-wrapper{
  display:none !important;
}

/* ✅ MOBILE: 5 tlačítek, ať to vypadá symetricky + Řadit podle přes celou šířku */
@media (max-width: 768px){
  .abpf-bar{ gap:10px; }
  .abpf-dd{ flex: 1 1 calc(50% - 10px); }
  .abpf-btn{ width:100%; min-width:0; }

  /* Řadit podle: full width na mobilu */
  .abpf-dd--sort{
    margin-left:0;
    padding-left:0;
    flex: 1 1 100%;
  }
}
