:root{
  --pg-gap: 12px; --pg-radius: 8px; --pg-border: #e5e7eb; --pg-bg: #fff; --pg-text:#111;
  --pg-chip-bg:#f3f4f6; --pg-chip-border:#e5e7eb; --pg-chip-text:#111;
  --pg-btn-bg:#111; --pg-btn-color:#fff; --pg-btn-radius:6px;
  --pg-aspect: 4/5;
}
.pg{display:block; color:var(--pg-text)}
.pg .pg-toolbar{display:flex; gap:var(--pg-gap); flex-wrap:wrap; align-items:center; margin-bottom:8px}
.pg .is-hidden{display:none !important}
.pg .pg-select{display:flex; flex-direction:column; gap:4px}
.pg .pg-select select{appearance:none; border:1px solid var(--pg-border); border-radius:var(--pg-radius); padding:8px 10px; background:var(--pg-bg); color:var(--pg-text)}
.pg .pg-select.is-locked select[disabled]{
  opacity:.55; cursor:not-allowed; pointer-events:none;
  background:#f6f6f6; color:#666; border-color:#e5e5e5;
}
.pg .pg-select.is-locked > span{ color:#7a7a7a; opacity:.9; }
.pg .pg-back{display:inline-block; border:1px solid var(--pg-border); border-radius:var(--pg-radius); padding:8px 10px; text-decoration:none; color:var(--pg-text); background:var(--pg-bg)}
.pg .pg-chips{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:8px}
.pg .pg-chip{display:inline-flex; align-items:center; gap:6px; background:var(--pg-chip-bg); border:1px solid var(--pg-chip-border); color:var(--pg-chip-text); border-radius:999px; padding:4px 8px; font-size:12px; user-select:none; cursor:default}
.pg .pg-chip .pg-chip-x{display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; border-radius:50%; border:0; background:var(--pg-chip-border); color:var(--pg-chip-text); cursor:pointer; line-height:1; font-size:12px; padding:0}
.pg .pg-chip .pg-chip-x:hover{background:var(--pg-chip-text); color:#fff}
.pg .pg-chip.pg-chip-reset{cursor:pointer}
.pg .pg-grid{display:grid; grid-template-columns:repeat(var(--pg-cols-d,4),minmax(0,1fr)); gap:var(--pg-gap)}
.pg .pg-card{display:grid; gap:6px; border:1px solid var(--pg-border); border-radius:var(--pg-radius); padding:10px; background:var(--pg-bg); position:relative}
.pg .pg-card .img img{width:100%; height:auto; aspect-ratio:var(--pg-aspect); object-fit:cover; border-radius:calc(var(--pg-radius) - 2px)}
.pg .pg-card .t{font-weight:600; text-decoration:none; color:var(--pg-text); display:block; line-height:1.3; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.pg .pg-card .price{font-weight:700}
.pg .pg-card .cta{margin-top:var(--pg-cta-mt,8px)}
.pg .pg-card .cta .button{display:inline-block; background:var(--pg-cta-bg,#111); color:var(--pg-cta-color,#fff); border:var(--pg-cta-bw,1px) solid var(--pg-cta-border,#111); border-radius:var(--pg-cta-radius,8px); padding:var(--pg-cta-pad-y,8px) var(--pg-cta-pad-x,12px); text-decoration:none; transition:transform .15s ease, background .2s ease, border-color .2s ease; font-size:var(--pg-cta-fs,inherit); font-weight:var(--pg-cta-fw,inherit); font-family:var(--pg-cta-ff,inherit)}
.pg .pg-card .cta .button:hover,.pg .pg-card .cta .button:focus-visible{background:var(--pg-cta-bg-hover,#000); border-color:var(--pg-cta-border-hover,var(--pg-cta-border,#111)); outline:2px solid transparent; outline-offset:2px}
.pg .pg-card .cta .button.disabled,.pg .pg-card .cta .button[aria-disabled="true"]{opacity:var(--pg-cta-disabled-opacity,.5); cursor:not-allowed}
.pg .pg-card .badge{position:absolute; top:8px; right:8px; background:var(--pg-badge-bg,#111); color:var(--pg-badge-color,#fff); border-radius:var(--pg-badge-radius,4px); font-size:12px; padding:4px 8px}
.pg .pg-more{margin-top:12px; display:inline-block; background:var(--pg-btn-bg); color:var(--pg-btn-color); border:0; border-radius:var(--pg-btn-radius); padding:8px 12px; cursor:pointer; outline:none; box-shadow:none; -webkit-appearance:none; appearance:none}
.pg .pg-more:hover,.pg .pg-more:focus{border:0; outline:none; box-shadow:none}
.pg .pg-apply{margin-top:12px; display:inline-block; background:var(--pg-btn-bg,#111); color:var(--pg-btn-color,#fff); border:0; border-radius:var(--pg-btn-radius,6px); padding:10px 14px; cursor:pointer}
.pg .pg-apply.is-hidden{ display:none }
.pg .pg-card .cta .btn{border:0 !important; outline:none !important; box-shadow:none !important}
.pg .pg-card .cta .btn:hover,.pg .pg-card .cta .btn:focus{border:0 !important; outline:none !important; box-shadow:none !important}
@media(max-width:1024px){ .pg .pg-grid{grid-template-columns:repeat(var(--pg-cols-t,2),minmax(0,1fr));} }
@media(max-width:767px){ .pg .pg-grid{grid-template-columns:repeat(var(--pg-cols-m,1),minmax(0,1fr));} }

/* Reduce layout shift on search pages: reserve vertical space for initial grid */
body.search .pg .pg-grid{ min-height: 60vh; }
@media (max-width: 767px){ body.search .pg .pg-grid{ min-height: 70vh; } }

/* Off-canvas basic styles */
.pg .pg-filter-toggle{display:none}
@media(max-width:767px){ .pg .pg-filter-toggle{display:inline-block; border:1px solid var(--pg-border); background:var(--pg-bg); color:var(--pg-text); border-radius:var(--pg-radius); padding:8px 10px;}}
.pg .pg-sheet{position:fixed; inset:0; background:rgba(0,0,0,.4); display:none}
.pg .pg-sheet.is-open{display:block}
.pg .pg-sheet__panel{position:absolute; bottom:0; left:0; right:0; background:var(--pg-bg); border-top-left-radius:16px; border-top-right-radius:16px; padding:16px; max-height:80vh; overflow:auto}
.pg .pg-sheet__actions{display:flex; gap:8px; justify-content:flex-end; margin-top:8px}
.pg .pg-btn{background:var(--pg-btn-bg); color:var(--pg-btn-color); border:0; border-radius:var(--pg-btn-radius); padding:8px 12px; cursor:pointer}

/* Screen-reader-only element without causing horizontal overflow */
.pg .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Nur über dem Filter/Controls */
.cpas-controls-overlay {
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,.45);
  backdrop-filter: blur(1px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .16s ease;
  z-index: 5;
}
.cpas-controls-overlay.active {
  opacity: 1;
  pointer-events: auto;
}

/* Crossfade fürs Grid */
.cpas-grid-stage {
  position: relative;
}
.cpas-grid-stage .cpas-grid-old,
.cpas-grid-stage .cpas-grid-new {
  transition: opacity .22s ease;
}
.cpas-grid-stage > .cpas-grid-old{ position:absolute; inset:0; width:100%; }
.cpas-grid-stage .cpas-grid-old { opacity: 1; }
.cpas-grid-stage .cpas-grid-old.fade-out { opacity: 0; }
.cpas-grid-stage .cpas-grid-new { opacity: 0; position: absolute; inset: 0; }
.cpas-grid-stage .cpas-grid-new.fade-in { opacity: 1; }

/* Respektiere reduzierte Bewegungen */
@media (prefers-reduced-motion: reduce) {
  .cpas-grid-stage .cpas-grid-old,
  .cpas-grid-stage .cpas-grid-new,
  .cpas-controls-overlay { transition: none; }
}

/* Disabled category select */
.pg .pg-select select:disabled, .pg .pg-select select[aria-disabled="true"]{ opacity:.5; cursor:not-allowed; pointer-events:none; }
