/* Mobile 2-Button UI (nur Darstellung, keine Logik) */
@media (max-width:1023px){
  /* Nur verbergen, wenn Overlay-Modus aktiv ist */
  .pg.use-overlay .pg-toolbar{display:none}
  .pg.use-overlay .cpas-two{display:grid}
  .cpas-two{display:none;grid-template-columns:1fr 1fr;gap:12px;margin:12px 12px 8px;position:static}
  .cpas-two [data-action]{
    display:inline-flex;align-items:center;justify-content:center;
    min-height:var(--cpas-two-h,52px);
    border-radius:var(--cpas-two-radius,10px);
    padding:var(--cpas-two-pad,0 14px);
    background:var(--cpas-two-bg,#ff6a00);
    color:var(--cpas-two-color,#fff);
    font-weight:600; font-size:var(--cpas-two-fs,16px);
    border:1px solid var(--cpas-two-border,transparent); line-height:1; cursor:pointer
  }
  .cpas-two [data-action]:hover{ background:var(--cpas-two-bg-h,#e55f00); color:var(--cpas-two-color-h,#fff); border-color:var(--cpas-two-border-h,var(--cpas-two-border,transparent)); }
  .pg[data-mobile-buttons="filter"] .cpas-two{ grid-template-columns:1fr }
}
@media (min-width:1024px){ .cpas-two{display:none} }

/* Mobile Inline-Toolbar-Optimierung (kein Overlay) */
@media (max-width:1023px){
  .pg .pg-toolbar{ display:grid; grid-template-columns:1fr; gap:12px; padding:0 12px; }
  .pg .pg-select select{ width:100%; min-height:44px; }
  .pg .pg-back{ margin:0 12px 8px; }
  .pg .pg-chips{ padding:0 12px; }
}

/* Overlay Grundgerüst (mobil) */
.pg{ position:relative; }
.cpas-ovl{position:fixed;inset:0;z-index:9999;display:none}
.cpas-ovl.is-open{display:block}
.cpas-ovl::before{content:"";position:absolute;inset:0;background:var(--cpas-ovl-backdrop,rgba(0,0,0,.45))}
.cpas-sheet{position:absolute;left:0;right:0;bottom:0;max-height:78vh;overflow:auto;background:var(--cpas-sheet-bg,#fff);border-radius:var(--cpas-sheet-radius,16px) var(--cpas-sheet-radius,16px) 0 0;box-shadow:0 -10px 30px rgba(0,0,0,.15);padding:16px 16px 12px}
.cpas-sheet h3{margin:0 0 10px;font-size:18px}
.cpas-body--filter .pg-select{display:block;margin:8px 0}
.cpas-body--filter .pg-select select{width:100%}
.cpas-body--filter .pg-select{ transition: opacity .18s ease, transform .18s ease; }
.cpas-body--filter .pg-select.cpas-anim-enter{ opacity:0; transform: translateY(-4px); }
.cpas-body--filter .pg-select.cpas-anim-visible{ opacity:1; transform: translateY(0); }
/* Disable transitions during initial render or while focused to avoid iOS picker glitches */
.cpas-body--filter.cpas-no-anim .pg-select,
.cpas-body--filter .pg-select:focus-within{ transition: none !important; transform: none !important; }
/* Disabled selects (e.g., locked category) */
.cpas-body--filter .pg-select select:disabled, .cpas-body--filter .pg-select select[aria-disabled="true"]{ opacity:.5; cursor:not-allowed; pointer-events:none; }
.cpas-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:12px}
.cpas-actions .btn{min-height:44px;border-radius:var(--cpas-act-radius,8px);padding:0 14px;border-style:solid;border-width:var(--cpas-act-bw,1px);border-color:var(--cpas-act-border,#e5e5ea);background:var(--cpas-act-bg,#f5f5f7);color:var(--cpas-act-color,inherit);cursor:pointer}
.cpas-actions .btn:hover{background:var(--cpas-act-bg-h,var(--cpas-act-bg,#f5f5f7));color:var(--cpas-act-color-h,var(--cpas-act-color,inherit));border-color:var(--cpas-act-border-h,var(--cpas-act-border,#e5e5ea))}
.cpas-actions .btn.apply{background:var(--cpas-act-apply-bg,#ff6a00);color:var(--cpas-act-apply-color,#fff);border-color:var(--cpas-act-apply-border,#ff6a00);border-width:var(--cpas-apply-bw, var(--cpas-act-bw,1px))}
.cpas-actions .btn.apply:hover{background:var(--cpas-apply-bg-h, var(--cpas-act-apply-bg,#ff6a00));color:var(--cpas-apply-color-h, var(--cpas-act-apply-color,#fff));border-color:var(--cpas-apply-border-h, var(--cpas-act-apply-border,#ff6a00))}
.cpas-actions .btn.reset{background:var(--cpas-reset-bg, var(--cpas-act-bg,#f5f5f7));color:var(--cpas-reset-color, var(--cpas-act-color,inherit));border-color:var(--cpas-reset-border, var(--cpas-act-border,#e5e5ea));border-width:var(--cpas-reset-bw, var(--cpas-act-bw,1px))}
.cpas-actions .btn.reset:hover{
  background:var(--cpas-reset-bg-h, var(--cpas-act-bg-h,var(--cpas-act-bg,#f5f5f7)));
  color:var(--cpas-reset-color-h, var(--cpas-act-color-h,var(--cpas-act-color,inherit)));
  border-color:var(--cpas-reset-border-h, var(--cpas-act-border-h,var(--cpas-act-border,#e5e5ea)));
}

/* Sort-Overlay Buttons (schön, ohne Frames) */
.cpas-body--sort{display:flex;flex-wrap:wrap;gap:8px}
.cpas-body--sort .btn{
  display:inline-block; padding:8px 14px; border-radius:var(--cpas-sort-radius,10px);
  background:var(--cpas-sort-bg,#ff6a00); color:var(--cpas-sort-color,#fff);
  border-style:solid; border-width:var(--cpas-sort-bw,0); border-color:var(--cpas-sort-border,transparent);
  cursor:pointer; font-weight:600; outline:none; box-shadow:none; -webkit-tap-highlight-color:transparent;
}
/* remove any hover/focus frame from theme defaults */
.cpas-body--sort .btn:hover,
.cpas-body--sort .btn:focus,
.cpas-body--sort .btn:focus-visible{ outline:none; box-shadow:none; border-width:var(--cpas-sort-bw,0) !important; }
.cpas-body--sort .btn:hover{
  background:var(--cpas-sort-bg-h,var(--cpas-sort-bg,#ff6a00));
  color:var(--cpas-sort-color-h,var(--cpas-sort-color,#fff));
  border-color:var(--cpas-sort-border-h,var(--cpas-sort-border,transparent)) !important;
}
.cpas-body--sort .btn.is-active{
  background:var(--cpas-sort-active-bg,var(--cpas-sort-bg,#ff6a00));
  color:var(--cpas-sort-active-color,var(--cpas-sort-color,#fff));
  border-color:var(--cpas-sort-active-border,var(--cpas-sort-border,transparent)) !important;
  border-width:var(--cpas-sort-bw,0) !important;
}

/* Ghost overlay to keep old grid visible during reload */
.pg .cpas-grid-ghost{ position:absolute; z-index:5; pointer-events:none; opacity:1; transition:opacity .18s ease; }
.pg .cpas-grid-ghost.is-out{ opacity:0; }
/* Prevent animations inside ghost to avoid flicker */
.pg .cpas-grid-ghost .pg-card{ animation: none !important; opacity: 1 !important; }

/* Smooth grid item appearance (mobile only) */
@media (max-width:1023px){
  @keyframes cpasCardIn{ from{ opacity:0; transform: translateY(8px); } to{ opacity:1; transform: translateY(0); } }
  .pg .pg-grid > .pg-card{ opacity:0; animation: cpasCardIn .22s ease forwards; will-change: transform,opacity; }
  .pg .pg-grid > .pg-card:nth-child(1){ animation-delay: 10ms; }
  .pg .pg-grid > .pg-card:nth-child(2){ animation-delay: 20ms; }
  .pg .pg-grid > .pg-card:nth-child(3){ animation-delay: 30ms; }
  .pg .pg-grid > .pg-card:nth-child(4){ animation-delay: 40ms; }
  .pg .pg-grid > .pg-card:nth-child(5){ animation-delay: 50ms; }
  .pg .pg-grid > .pg-card:nth-child(6){ animation-delay: 60ms; }
  .pg .pg-grid > .pg-card:nth-child(7){ animation-delay: 70ms; }
  .pg .pg-grid > .pg-card:nth-child(8){ animation-delay: 80ms; }
  .pg .pg-grid > .pg-card:nth-child(9){ animation-delay: 90ms; }
  .pg .pg-grid > .pg-card:nth-child(10){ animation-delay: 100ms; }
  .pg .pg-grid > .pg-card:nth-child(11){ animation-delay: 110ms; }
  .pg .pg-grid > .pg-card:nth-child(12){ animation-delay: 120ms; }
}

/* Disable intro animation when flagged */
.pg .pg-grid.no-anim > .pg-card{ opacity:1 !important; animation:none !important; }

/* Mobile Drawer: Kategorie-Select sichtbar ausgegraut und gesperrt (inkl. iOS) */
.cpas-ovl .pg-select.is-locked select[disabled],
.cpas-ovl .cpas-m-cat.is-locked select[disabled],
.cpas-ovl select.cpas-m-cat[disabled].is-locked{
  opacity: 0.55 !important;
  background-color: #f6f6f6 !important;
  border-color: #e5e5e5 !important;
  color: #666 !important;
  -webkit-text-fill-color: #666 !important; /* iOS Safari */
  cursor: not-allowed !important;
  box-shadow: none !important;
}
.cpas-ovl .pg-select.is-locked > span{
  color: #7a7a7a; opacity: .9;
}
