/* beschicker.css — nur Beschicker-Seite */

.phead .count{display:inline-flex;align-items:center;gap:7px;margin-top:18px;font-size:.86rem;font-weight:700;color:var(--gruen-d);background:#e3f7e7;padding:7px 14px;border-radius:100px}

/* Filterleiste */
.filterbar{background:transparent;padding:clamp(30px,4.5vw,46px) 0 0}
.filter-row{display:block;padding-bottom:clamp(28px,3.2vw,36px);border-bottom:1px solid var(--linie)}
.filter-lead{display:flex;align-items:center;gap:12px}
.filterbar .search{position:relative;width:min(100%,300px);flex:0 1 300px;min-width:0}
.search svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:18px;height:18px;stroke:var(--grau);pointer-events:none}
.search input{width:100%;padding:12px 16px 12px 44px;border-radius:100px;border:1.5px solid var(--linie);background:#fff;font-size:.95rem;font-family:inherit;outline:none;transition:border-color .25s var(--takt),box-shadow .25s var(--takt)}
.search input:focus{border-color:var(--gruen);box-shadow:0 0 0 3px rgba(0,178,24,.08)}
.filter-toggle{display:none;position:relative}
.filter-panel{display:block}
.filter-panel-inner{display:grid;gap:14px;margin-top:14px;min-width:0}

/* Kategorien bleiben immer in genau einer Reihe. Die Pfeile werden nur dann
   eingeblendet, wenn wirklich Inhalt außerhalb des sichtbaren Bereichs liegt. */
.chip-scroller{display:grid;grid-template-columns:40px minmax(0,1fr) 40px;align-items:center;gap:8px;min-width:0;width:100%}
.chips{display:flex;align-items:center;gap:8px;min-width:0;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.chips::-webkit-scrollbar{display:none}
.category-chips{width:100%;max-width:100%;padding:3px 2px 6px;scroll-behavior:smooth;overscroll-behavior-inline:contain;scroll-snap-type:x proximity}
.category-chips .fchip{scroll-snap-align:start}
.fchip{-webkit-appearance:none;appearance:none;flex:0 0 auto;font-size:.88rem;font-weight:700;padding:9px 16px;border-radius:100px;background:#fff;border:1.5px solid var(--linie);color:var(--tinte-2);cursor:pointer;white-space:nowrap;font-family:inherit;transition:transform .25s var(--takt),background-color .25s var(--takt),border-color .25s var(--takt),color .25s var(--takt),box-shadow .25s var(--takt)}
.fchip:hover{border-color:var(--gruen);color:var(--gruen-d)}
.fchip.on{background:var(--verlauf);border-color:transparent;color:#fff;box-shadow:0 6px 16px -8px rgba(12,80,14,.5)}
.chip-arrow{width:40px;height:40px;display:grid;place-items:center;border:1.5px solid var(--linie);border-radius:50%;background:#fff;color:var(--gruen-d);cursor:pointer;box-shadow:0 5px 14px -11px rgba(17,58,24,.55);transition:transform .2s var(--takt),border-color .2s var(--takt),background-color .2s var(--takt),opacity .2s var(--takt)}
.chip-scroller:not(.is-ready) .chip-arrow{visibility:hidden;pointer-events:none}
.chip-arrow[hidden]{display:block!important;visibility:hidden!important;pointer-events:none!important}
.chip-arrow svg{width:17px;height:17px}
.chip-arrow:hover:not(:disabled){transform:translateY(-1px);border-color:var(--gruen);background:#f4faf3}
.chip-arrow:disabled{opacity:.28;cursor:default;transform:none}

.filter-secondary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:0}
.day-chips{flex:1 1 auto;min-width:0;padding:2px 0}
.filter-selects{display:flex;gap:8px;flex:0 0 auto;min-width:0}
.sort-control{position:relative;min-width:0}
.filter-selects select,.sort-menu-button{font:inherit;font-size:.86rem;font-weight:700;color:var(--tinte-2);background:#fff;border:1.5px solid var(--linie);border-radius:100px;padding:9px 36px 9px 14px;max-width:260px;min-height:42px}
.sort-menu-button{display:none;align-items:center;justify-content:space-between;gap:12px;min-width:145px;cursor:pointer;text-align:left}
.sort-menu-button svg{width:17px;height:17px;flex:0 0 auto;transition:transform var(--motion-ui,220ms) var(--takt)}
.sort-menu-button[aria-expanded="true"]{border-color:var(--gruen);box-shadow:0 0 0 3px rgba(0,178,24,.08)}
.sort-menu-button[aria-expanded="true"] svg{transform:rotate(180deg)}
.sort-control.is-enhanced select{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.sort-control.is-enhanced .sort-menu-button{display:inline-flex}
.sort-menu{position:fixed;z-index:1600;box-sizing:border-box;display:grid;gap:3px;width:max-content;min-width:180px;max-width:calc(100vw - 32px);max-height:min(320px,calc(100vh - 32px));padding:7px;border:1px solid var(--linie);border-radius:15px;background:#fff;box-shadow:0 18px 50px rgba(17,42,23,.18);overflow:auto;overscroll-behavior:contain}
.sort-menu[hidden]{display:none!important}
.sort-menu button{display:flex;align-items:center;width:100%;min-height:44px;padding:10px 12px;border:0;border-radius:10px;background:transparent;color:var(--tinte-2);font:inherit;font-size:.9rem;font-weight:700;text-align:left;cursor:pointer;white-space:normal;overflow-wrap:anywhere}
.sort-menu button:hover,.sort-menu button:focus-visible{background:#eef7ef;color:var(--gruen-d);outline:none}
.sort-menu button[aria-selected="true"]{background:var(--gruen-d);color:#fff}

.active-filters{display:flex;align-items:center;gap:7px;flex-wrap:wrap;min-height:32px;margin-top:10px;font-size:.78rem;color:var(--grau)}
.active-filters[hidden]{display:none}
.active-filters button{font:inherit;font-size:.78rem;font-weight:700;border:1px solid #cfe6d3;background:#f0f8f1;color:var(--gruen-d);border-radius:100px;padding:6px 10px;cursor:pointer}
.active-filters button span{margin-left:6px;font-size:1rem;line-height:0}
.active-filters .clear-all{background:transparent;border-color:transparent;color:var(--grau);text-decoration:underline}

/* Auf Mobil bleibt die Suche kompakt. Kategorien, Tage und Sortierung öffnen
   sich gemeinsam; die Kategoriezeile selbst bleibt auch dort horizontal. */
@media(max-width:860px){
  .filterbar{padding:clamp(22px,5vw,30px) 0 0}
  .filter-row{padding-bottom:26px}
  .filter-lead{gap:9px}
  .filterbar .search{width:auto;flex:1 1 auto}
  .search input{padding:10px 13px 10px 41px;font-size:.9rem}
  .filter-toggle{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;font:inherit;font-weight:700;font-size:.84rem;color:var(--tinte-2);background:#fff;border:1.5px solid var(--linie);border-radius:100px;padding:9px 13px;cursor:pointer;white-space:nowrap}
  .filter-toggle svg{width:17px;height:17px}
  .filter-toggle[aria-expanded="true"]{border-color:var(--gruen);color:var(--gruen-d)}
  .filter-toggle-count{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:100px;background:var(--verlauf);color:#fff;font-size:.72rem;font-weight:800;line-height:1}
  .filter-toggle-count[hidden]{display:none}
  .filter-panel{display:grid;grid-template-rows:0fr;overflow:hidden;visibility:hidden;opacity:0;margin-top:0;transition:grid-template-rows .34s var(--takt),margin-top .34s var(--takt),opacity .25s var(--takt),visibility 0s linear .34s}
  .filter-panel>*{min-height:0}
  .filter-panel.open{grid-template-rows:1fr;visibility:visible;opacity:1;margin-top:12px;transition:grid-template-rows .34s var(--takt),margin-top .34s var(--takt),opacity .25s var(--takt),visibility 0s}
  .filter-panel-inner{display:flex;flex-direction:column;gap:12px;margin:0;padding:1px 0 3px;min-height:0;min-width:0}
  .chip-scroller{grid-template-columns:34px minmax(0,1fr) 34px;gap:6px;width:100%}
  .chip-arrow{width:34px;height:34px}
  .category-chips{padding:3px 1px 5px}
  .filterbar .fchip{padding:8px 13px;font-size:.82rem}
  .filter-secondary{align-items:stretch;flex-direction:column;gap:10px}
  .day-chips{width:100%;padding-bottom:3px}
  .filter-selects{width:100%}
  .sort-control{width:100%}
  .filter-selects select,.sort-menu-button{width:100%;max-width:none}
  .sort-menu-button{min-width:0}
  .active-filters{margin-top:9px}
}
@media(max-width:430px){
  .filter-toggle span:not(.filter-toggle-count){display:none}
  .filter-toggle{width:42px;height:42px;justify-content:center;padding:0}
  .filter-toggle-count{position:absolute;transform:translate(13px,-13px)}
}
@media(prefers-reduced-motion:reduce){.category-chips{scroll-behavior:auto}.chip-arrow,.filter-panel{transition:none}}

/* Karten-Raster */
/* Karten-Bereich: kein eigener Hintergrund – heller Grundton der Seite, wie
   alle anderen Inhaltsbereiche. Der Abstand nach oben ist knapp gehalten, weil
   die Filterleiste darüber bereits Luft mitbringt (Rhythmus wie .markets-main). */
.blk{padding:clamp(34px,4.5vw,46px) 0 clamp(64px,9vw,96px)}
.b-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.bcard{background:#fff;border:1px solid var(--linie);border-radius:var(--r-l);overflow:hidden;cursor:pointer;transition:transform var(--motion-base) var(--takt),opacity var(--motion-base) var(--takt),background-color var(--motion-base) var(--takt),border-color var(--motion-base) var(--takt),color var(--motion-base) var(--takt),box-shadow var(--motion-base) var(--takt);display:flex;flex-direction:column}
.bcard:hover{transform:translateY(var(--lift-card));box-shadow:var(--sh-m);border-color:transparent}
.bcard .bphoto{aspect-ratio:16/10;position:relative;overflow:hidden;display:grid;place-items:center}
.bcard .bphoto.has-img{background:var(--papier-3);isolation:isolate}
.bcard .bphoto.has-img::before{content:"";position:absolute;inset:0;z-index:0;background-image:var(--card-image);background-size:cover;background-repeat:no-repeat;background-position:var(--card-focus,50% 50%);transition:transform var(--motion-slow) var(--ease-out);will-change:transform}
.bcard:hover .bphoto.has-img::before{transform:scale(1.025)}
/* Rückwärtskompatibilität für bereits gecachte alte Kartenausgaben. */
.bphoto-img{width:100%;height:100%;object-fit:cover;transition:transform var(--motion-slow) var(--ease-out)}
.bcard:hover .bphoto-img{transform:scale(1.025)}
.bcard .bphoto svg{width:40px;height:40px;stroke-width:1.6;opacity:.7;transition:transform var(--motion-slow) var(--takt)}
.bcard:hover .bphoto svg{transform:scale(1.12)}
.bcard .phlabel{position:absolute;bottom:10px;left:12px;font-size:.68rem;font-weight:600;color:rgba(22,32,26,.4)}
.bcard .bbody{padding:18px 19px;flex:1;display:flex;flex-direction:column}
.bcard h3{font-size:1.18rem;margin-bottom:6px}
.bcard .bdesc{font-size:.87rem;color:var(--grau);margin-bottom:14px;flex:1}
.bcard .babsence{margin:0 0 13px;align-self:flex-start}
.bcard .bfoot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:13px;border-top:1px solid var(--linie)}
.bcard .bdays{font-size:.78rem;font-weight:700;color:var(--gruen-d)}
.bcard .bmore{width:30px;height:30px;border-radius:50%;background:var(--papier-2);display:grid;place-items:center;transition:transform var(--motion-base) var(--takt),opacity var(--motion-base) var(--takt),background-color var(--motion-base) var(--takt),border-color var(--motion-base) var(--takt),color var(--motion-base) var(--takt),box-shadow var(--motion-base) var(--takt)}
.bcard:hover .bmore{background:var(--gruen)}
.bcard .bmore svg{width:14px;height:14px;stroke:var(--gruen-d);transition:stroke var(--motion-base) var(--takt)}
.bcard:hover .bmore svg{stroke:#fff}

.bphoto.c-veg{background:linear-gradient(150deg,#dff2e2,#bfe6c6)}
.bphoto.c-cheese{background:linear-gradient(150deg,#fdeecf,#f7d99b)}
.bphoto.c-bake{background:linear-gradient(150deg,#f6e2cf,#e6c39c)}
.bphoto.c-flower{background:linear-gradient(150deg,#f6dde2,#eeb9c5)}
.bphoto.c-fish{background:linear-gradient(150deg,#d7eaf7,#a9d2ee)}
.bphoto.c-honey{background:linear-gradient(150deg,#fcf2d2,#f5e3a0)}
.bphoto.c-herb{background:linear-gradient(150deg,#dff0e6,#b6e0c6)}
.bphoto.c-fine{background:linear-gradient(150deg,#efe8df,#d8c4ab)}
.bphoto.c-gastro{background:linear-gradient(150deg,#f4eadc,#dfc8a8)}

.noresult{text-align:center;padding:60px 20px;color:var(--grau)}
.noresult[hidden]{display:none}
.noresult svg{width:46px;height:46px;stroke:var(--linie);margin:0 auto 16px;display:block}
.noresult p{max-width:460px;margin:0 auto 18px}
.reset-filter{font-family:inherit;font-size:.92rem;font-weight:700;padding:11px 24px;border-radius:100px;border:none;background:var(--verlauf);color:#fff;cursor:pointer;box-shadow:0 6px 16px -8px rgba(12,80,14,.5);transition:transform var(--motion-base) var(--takt),filter var(--motion-base) var(--takt)}
.reset-filter:hover{transform:translateY(var(--lift-control));filter:brightness(1.05)}

@media(max-width:860px){.b-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.b-grid{grid-template-columns:1fr}}

/* Stände ohne eigene Detailseite — sichtbar, aber nicht anklickbar */
.bcard-static{cursor:default}
.bcard-static:hover{transform:none;box-shadow:none;border-color:var(--linie)}
.bcard-static:hover .bphoto svg{transform:none}


/* Karte ohne Foto, aber mit Logo: einheitliche Logo-Kachel (Hintergrund je Beschicker einstellbar) */
.bphoto.has-logo{display:flex;align-items:center;justify-content:center;background:var(--logo-surface,#fff);padding:22px;border-bottom:1px solid rgba(22,32,26,.08)}
.bphoto.has-logo .blogo{width:100%;height:100%;max-width:78%;max-height:68%;object-fit:contain;display:block;filter:drop-shadow(0 1px 1px rgba(22,32,26,.34))}
.bphoto.has-logo.logo-surface-dark .blogo{filter:drop-shadow(0 1px 1px rgba(255,255,255,.4))}
.bphoto.has-logo.logo-surface-original{padding:14px;background:#fff}
.bphoto.has-logo.logo-surface-original .blogo{max-width:92%;max-height:82%;filter:none}


.profile-page-note{margin:14px 0 0;max-width:720px;color:var(--grau);font-size:.9rem;line-height:1.5}
.bdesc{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;min-height:4.65em}
@media(max-width:560px){.profile-page-note{font-size:.84rem;margin-top:10px}.bdesc{-webkit-line-clamp:2;min-height:3.1em}}