/* assets/css/v3.css — Doktorfy "Version 3" im Lieferando-Stil. Alle Farben/Abstaende als Tokens. */ @import url('/assets/css/tokens.css'); /* Semantik-Tokens (--danger, --success, --warning ...); v3-eigene Neutraltoene unten ueberschreiben */ :root{ --brand:#1a9fd4;--brand-strong:#1384ba;--brand-soft:#e6f5fc;--brand-soft2:#cdebf8;--brand-light:#5cc4ee; --ink:#1d2a33;--sub:#66737d;--line:#e6eaee;--surface:#fff;--bg:#f2f5f8; --positive:#17824a;--positive-soft:#e7f5ec;--warning:#b45309;--critical:#d50525; --r-sm:8px;--r-md:12px;--r-lg:16px;--r-xl:24px;--r-pill:999px; --sh-1:0 1px 2px rgba(0,0,0,.06),0 2px 8px rgba(0,0,0,.06); --sh-2:0 4px 24px rgba(0,0,0,.12); --max:1240px; /* Variablen fuer geteilte ZLEAF-Widgets (KI-Assistent) */ --black:#1d2a33;--gray-1:#24323c;--gray-2:#4b5761;--gray-3:#8a949b;--gray-4:#d3d9de;--gray-5:#eef1f4;--gray-6:#f7f9fa;--white:#fff;--border:#e6eaee; } *{box-sizing:border-box} html{-webkit-text-size-adjust:100%} body{margin:0;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--surface);font-size:15px;line-height:1.45;padding-bottom:64px} a{color:inherit} img{display:block;max-width:100%} button{font-family:inherit;cursor:pointer} [hidden]{display:none!important} /* ── Buttons ── */ .v3-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--brand);color:#fff;border:0;border-radius:var(--r-pill);padding:12px 22px;font-weight:700;font-size:15px;text-decoration:none;white-space:nowrap;transition:background .15s} .v3-btn:hover{background:var(--brand-strong)} .v3-btn--dark{background:var(--ink)} .v3-btn--dark:hover{background:#000} .v3-btn--block{display:flex;width:100%} .v3-btn--lg{padding:15px 22px;font-size:16px} .v3-btn[disabled]{opacity:.6;pointer-events:none} /* ── Header ── */ .v3h{position:sticky;top:0;z-index:50;background:var(--surface);border-bottom:1px solid var(--line)} .v3h--brand{background:var(--brand);border-bottom:0;position:relative} .v3h-in{max-width:var(--max);margin:0 auto;display:flex;align-items:center;gap:14px;padding:12px 16px;min-height:64px} .v3h-logo{display:flex;align-items:center;text-decoration:none;font-weight:800;font-size:20px;flex:none} .v3h-logo img{height:28px;width:auto} .v3h--brand .v3h-logo{color:#fff} .v3h-loc{display:flex;align-items:center;gap:6px;margin:0 auto;border:0;background:var(--bg);border-radius:var(--r-pill);padding:9px 16px;font-weight:700;font-size:14px;color:var(--ink);max-width:46vw;overflow:hidden} .v3h-loc span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .v3h-loc svg{color:var(--brand);flex:none} .v3h-act{display:flex;gap:4px;margin-left:auto} .v3h-loc+.v3h-act{margin-left:0} .v3h-btn{position:relative;display:flex;align-items:center;gap:6px;padding:9px 12px;border-radius:var(--r-pill);text-decoration:none;font-weight:700;font-size:14px} .v3h-btn:hover{background:var(--bg)} .v3h--brand .v3h-btn{color:#fff} .v3h--brand .v3h-btn:hover{background:rgba(255,255,255,.15)} .v3h-badge{position:absolute;top:2px;right:2px;background:var(--ink);color:#fff;font-size:11px;min-width:18px;height:18px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 5px} .v3h--brand .v3h-badge{background:#fff;color:var(--brand)} .v3h-btn-t{display:none} @media(min-width:760px){.v3h-btn-t{display:inline}} /* ── Hero (Startseite) ── */ .v3-hero{background:var(--brand);color:#fff;position:relative;overflow:hidden} .v3-hero-in{max-width:var(--max);margin:0 auto;padding:20px 16px 70px;display:grid;gap:24px;align-items:center} .v3-hero h1{font-size:clamp(30px,6vw,52px);line-height:1.05;letter-spacing:-.02em;margin:0 0 12px;font-weight:800} .v3-hero p{margin:0 0 22px;font-size:17px;opacity:.95;max-width:520px} .v3-hero-curve{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:46px} .v3-hero-all{display:inline-flex;align-items:center;gap:4px;margin-top:16px;color:#fff;font-weight:700;text-decoration:none;font-size:14px} .v3-hero-all:hover{text-decoration:underline} .v3-hero-art{position:relative;height:220px;display:none} .v3-blob{position:absolute;inset:0;margin:auto;width:340px;height:340px;border-radius:46% 54% 40% 60%/55% 45% 55% 45%;background:rgba(255,255,255,.18)} .v3-hero-img{position:absolute;width:180px;height:180px;object-fit:contain;filter:drop-shadow(0 18px 24px rgba(0,0,0,.25))} .v3-hero-img--0{left:8%;top:18%;transform:rotate(-10deg)} .v3-hero-img--1{left:38%;top:0;width:220px;height:220px} .v3-hero-img--2{right:4%;top:30%;transform:rotate(12deg)} @media(min-width:960px){.v3-hero-in{grid-template-columns:1.1fr .9fr;padding:48px 24px 100px}.v3-hero-art{display:block;height:360px}} /* Lieferung/Abholung-Switch */ .v3-mode{display:inline-flex;background:rgba(0,0,0,.14);border-radius:var(--r-pill);padding:4px;margin-bottom:12px} .v3-mode button,.v3-mode a{display:flex;align-items:center;gap:6px;border:0;background:transparent;color:#fff;font-weight:700;font-size:14px;padding:9px 16px;border-radius:var(--r-pill);text-decoration:none} .v3-mode .on{background:#fff;color:var(--ink)} .v3-mode--sm{background:var(--bg);margin:0} .v3-mode--sm a{color:var(--ink);padding:8px 14px} .v3-mode--sm a.on{background:var(--surface);box-shadow:var(--sh-1)} .v3-mode-x{font-weight:600!important;color:var(--sub)!important} /* Adress-/PLZ-Feld */ .v3-addr{display:flex;align-items:center;gap:8px;background:#fff;border-radius:var(--r-pill);padding:6px 6px 6px 18px;box-shadow:var(--sh-2);max-width:580px;color:var(--ink)} .v3-addr-ic{color:var(--brand);display:flex;flex:none} .v3-addr input{flex:1;min-width:0;border:0;outline:0;font-size:16px;font-family:inherit;padding:10px 0;background:transparent;color:var(--ink)} .v3-addr-geo{border:0;background:var(--bg);color:var(--ink);width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none} .v3-addr-geo:hover{background:var(--line)} .v3-addr--sheet{box-shadow:none;border:1.5px solid var(--line);max-width:none} /* ── Sections ── */ .v3-main{max-width:var(--max);margin:0 auto;padding:8px 0 24px} .v3-sec{padding:18px 0 10px} .v3-sec-t{font-size:22px;font-weight:800;letter-spacing:-.01em;margin:0 16px 14px} .v3-sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-right:16px} .v3-sec-h a{font-weight:700;font-size:14px;color:var(--ink);white-space:nowrap} .v3-rail{display:flex;gap:12px;overflow-x:auto;padding:4px 16px 12px;scroll-snap-type:x proximity;scrollbar-width:none} .v3-rail::-webkit-scrollbar{display:none} .v3-rail>*{scroll-snap-align:start;flex:none} /* Kategorie-Rail (rund wie Lieferando "Kuechen") */ .v3-cat{display:flex;flex-direction:column;align-items:center;gap:6px;width:86px;text-decoration:none;text-align:center} .v3-cat-ic{width:72px;height:72px;border-radius:50%;background:var(--brand-soft);color:var(--brand-strong);display:flex;align-items:center;justify-content:center;transition:transform .15s,background .15s} .v3-cat:hover .v3-cat-ic{transform:scale(1.05)} .v3-cat b{font-size:13px;font-weight:700;line-height:1.2} .v3-cat small{font-size:11.5px;color:var(--sub);margin-top:-4px} .v3-cat.on .v3-cat-ic{background:var(--brand);color:#fff} .v3-cats--sm .v3-cat{width:70px} .v3-cats--sm .v3-cat-ic{width:52px;height:52px} .v3-cats--sm .v3-cat b{font-size:12px} /* Start-Karten */ .v3-start{display:grid;gap:12px;padding:0 16px} @media(min-width:760px){.v3-start{grid-template-columns:repeat(3,1fr)}} .v3-start-c{display:flex;align-items:center;gap:14px;padding:18px;border-radius:var(--r-lg);background:var(--bg);text-decoration:none;transition:box-shadow .15s,background .15s} .v3-start-c:hover{background:#fff;box-shadow:var(--sh-2)} .v3-start-c>span:nth-child(2){flex:1;display:flex;flex-direction:column;gap:2px} .v3-start-c b{font-size:16px} .v3-start-c small{font-size:13px;color:var(--sub)} .v3-start-ic{width:52px;height:52px;border-radius:var(--r-md);background:#fff;color:var(--brand);display:flex;align-items:center;justify-content:center;flex:none} .v3-start-c>svg{color:var(--sub)} /* Apotheken-Karte (Restaurant-Karte) */ .v3-pc{display:flex;flex-direction:column;text-decoration:none;border-radius:var(--r-lg);overflow:hidden;background:var(--surface);transition:transform .15s} .v3-rail--cards .v3-pc{width:280px} .v3-pc:hover{transform:translateY(-2px)} .v3-pc:hover .v3-pc-n{text-decoration:underline} .v3-pc-img{position:relative;aspect-ratio:16/9;border-radius:var(--r-lg);background:linear-gradient(135deg,var(--brand-soft),var(--brand-soft2));display:flex;align-items:center;justify-content:center;gap:0;overflow:hidden} .v3-pc-img img{width:34%;height:80%;object-fit:contain;filter:drop-shadow(0 8px 10px rgba(0,0,0,.15));margin:0 -4%} .v3-pc-img img:nth-child(2){transform:translateY(-6%) scale(1.12);z-index:1} .v3-pc-logo{position:absolute;left:10px;bottom:10px;width:46px;height:46px;border-radius:var(--r-sm);background:#fff;box-shadow:var(--sh-1);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;color:var(--brand-strong);z-index:2} .v3-pc-badge{position:absolute;top:10px;left:10px;display:flex;align-items:center;gap:3px;background:var(--ink);color:#fff;font-size:11.5px;font-weight:700;padding:4px 9px;border-radius:var(--r-pill);z-index:2} .v3-pc-b{padding:10px 2px 6px} .v3-pc-n{display:block;font-size:16px;font-weight:800;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .v3-pc-m{font-size:13.5px;margin-top:3px;display:flex;align-items:center;gap:4px} .v3-pc-m--sub{color:var(--sub)} .v3-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px} .v3-tag{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:600;background:var(--bg);padding:3px 9px;border-radius:var(--r-pill)} .v3-tag--hot{background:var(--brand-soft);color:var(--brand-strong)} /* Produkt-Rail */ .v3-prod{width:170px;text-decoration:none;display:flex;flex-direction:column;gap:3px} .v3-prod-img{aspect-ratio:1;border-radius:var(--r-lg);background:var(--bg);display:flex;align-items:center;justify-content:center;margin-bottom:6px} .v3-prod-img img{width:75%;height:75%;object-fit:contain} .v3-prod b{font-size:14px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} .v3-prod small{font-size:12px;color:var(--sub)} .v3-prod-p{font-weight:700;font-size:14px} /* So funktioniert's */ .v3-how-l{list-style:none;margin:0;padding:0 16px;display:grid;gap:12px} @media(min-width:760px){.v3-how-l{grid-template-columns:repeat(3,1fr)}} .v3-how-l li{background:var(--bg);border-radius:var(--r-lg);padding:20px} .v3-how-n{width:34px;height:34px;border-radius:50%;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;margin-bottom:10px} .v3-how-l b{font-size:16px} .v3-how-l p{margin:4px 0 0;color:var(--sub);font-size:14px} .v3-cities{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px} .v3-cities a{text-decoration:none;border:1px solid var(--line);border-radius:var(--r-pill);padding:8px 14px;font-weight:600;font-size:14px} .v3-cities a:hover{border-color:var(--ink)} .v3-cities small{color:var(--sub);font-weight:500;margin-left:2px} /* ── Ergebnisliste ── */ .v3-wrap{max-width:var(--max);margin:0 auto;padding:0 16px} .v3-subbar{border-bottom:1px solid var(--line);background:var(--surface)} .v3-subbar-in{max-width:var(--max);margin:0 auto;padding:12px 16px 4px;display:flex;flex-wrap:wrap;gap:10px;align-items:center} .v3-search{flex:1;min-width:220px;display:flex;align-items:center;gap:8px;background:var(--bg);border-radius:var(--r-pill);padding:0 16px;color:var(--sub)} .v3-search input{flex:1;border:0;outline:0;background:transparent;font-size:15px;font-family:inherit;padding:11px 0;color:var(--ink)} .v3-subbar .v3-rail{max-width:var(--max);margin:0 auto;padding-top:10px} .v3-results{display:grid;gap:24px;padding-top:20px;padding-bottom:30px} @media(min-width:960px){.v3-results{grid-template-columns:260px 1fr}} .v3-filters{display:none} .v3-filters-head{display:none} @media(min-width:960px){.v3-filters{display:block;position:sticky;top:84px;align-self:start}} .v3-fgroup{padding:4px 0 18px;border-bottom:1px solid var(--line);margin-bottom:16px} .v3-fgroup h3{font-size:16px;margin:0 0 10px} .v3-radio{display:flex;align-items:center;gap:10px;padding:7px 0;text-decoration:none;font-size:15px} .v3-radio i{width:20px;height:20px;border-radius:50%;border:2px solid #c3ccd3;flex:none} .v3-radio.on i{border:6px solid var(--ink)} .v3-radio.on{font-weight:700} .v3-switch{display:flex;align-items:center;justify-content:space-between;padding:7px 0;text-decoration:none} .v3-switch i{width:40px;height:24px;border-radius:12px;background:#cfd7dd;position:relative;transition:background .15s} .v3-switch i:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .15s} .v3-switch.on i{background:var(--ink)} .v3-switch.on i:after{left:19px} .v3-fnote p{margin:0 0 10px;color:var(--sub);font-size:14px} .v3-res-h{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-bottom:14px} .v3-res-h h1{font-size:24px;margin:0;font-weight:800;letter-spacing:-.01em} .v3-res-act{display:flex;gap:8px} .v3-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface);border-radius:var(--r-pill);padding:8px 14px;font-weight:700;font-size:13.5px;text-decoration:none;color:var(--ink)} .v3-chip.on{background:var(--ink);border-color:var(--ink);color:#fff} .v3-chip--filter{display:inline-flex} @media(min-width:960px){.v3-chip--filter{display:none}} .v3-active{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px} .v3-grid{display:grid;gap:22px 18px;grid-template-columns:1fr} @media(min-width:620px){.v3-grid{grid-template-columns:repeat(2,1fr)}} @media(min-width:1180px){.v3-grid{grid-template-columns:repeat(3,1fr)}} .v3-more{color:var(--sub);font-size:14px;margin:22px 0 0;text-align:center} .v3-map{height:420px;border-radius:var(--r-lg);overflow:hidden;margin-bottom:22px;background:var(--bg);z-index:1} @media(min-width:960px){.v3-map{height:520px}} .v3-pin{width:34px;height:34px;border-radius:50% 50% 50% 0;background:var(--brand);transform:rotate(-45deg);border:3px solid #fff;box-shadow:var(--sh-1)} .v3-pin-me{width:18px;height:18px;border-radius:50%;background:#1a73e8;border:3px solid #fff;box-shadow:0 0 0 6px rgba(26,115,232,.2)} .leaflet-popup-content{font-family:inherit;margin:12px 14px} .v3-pop b{display:block;font-size:14px}.v3-pop span{display:block;color:var(--sub);font-size:12.5px;margin:2px 0 8px} .v3-pop a{display:inline-block;background:var(--brand);color:#fff!important;text-decoration:none;font-weight:700;padding:7px 14px;border-radius:var(--r-pill);font-size:13px} .v3-pc.v3-hl{outline:3px solid var(--brand);outline-offset:4px} .v3-empty{text-align:center;padding:50px 16px;display:flex;flex-direction:column;align-items:center;gap:8px} .v3-empty-ic{width:76px;height:76px;border-radius:50%;background:var(--bg);display:flex;align-items:center;justify-content:center;color:var(--sub);margin-bottom:6px} .v3-empty b{font-size:18px}.v3-empty p{color:var(--sub);margin:0 0 10px;max-width:420px} /* Mobile Filter-Drawer */ .v3-fbg{display:none} @media(max-width:959px){ body.v3-fopen .v3-filters{display:block;position:fixed;left:0;right:0;bottom:0;z-index:90;background:#fff;border-radius:var(--r-xl) var(--r-xl) 0 0;padding:18px 20px 30px;max-height:80vh;overflow:auto;box-shadow:var(--sh-2)} body.v3-fopen .v3-filters-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:18px} .v3-filters-head button{border:0;background:var(--bg);width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center} body.v3-fopen .v3-fbg{display:block;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:80} } /* ── Apotheken-Seite (Speisekarte) ── */ .v3-banner{position:relative;height:180px;background:linear-gradient(135deg,var(--brand-light),var(--brand));overflow:hidden} @media(min-width:960px){.v3-banner{height:260px}} .v3-banner-imgs{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:2%} .v3-banner-imgs img{height:78%;width:auto;max-width:22%;object-fit:contain;filter:drop-shadow(0 14px 18px rgba(0,0,0,.25))} .v3-banner-imgs img:nth-child(odd){transform:translateY(8%) rotate(-6deg)} .v3-banner-imgs img:nth-child(even){transform:translateY(-6%) rotate(6deg)} .v3-banner-back{position:absolute;top:14px;left:14px;width:42px;height:42px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:var(--sh-1)} .v3-menu-wrap{display:grid;gap:28px;padding-bottom:40px} @media(min-width:960px){.v3-menu-wrap{grid-template-columns:1fr 360px}} .v3-menu-main{min-width:0} .v3-shop{position:relative;padding-top:42px;margin-top:-34px} .v3-shop-logo{position:absolute;top:-28px;left:0;width:84px;height:84px;border-radius:var(--r-md);background:#fff;box-shadow:var(--sh-2);display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:800;color:var(--brand-strong)} .v3-shop h1{font-size:clamp(24px,4vw,32px);margin:22px 0 6px;letter-spacing:-.01em;font-weight:800} .v3-shop-m{display:flex;flex-wrap:wrap;gap:4px 14px;color:var(--sub);font-size:14px} .v3-shop-m span{display:flex;align-items:center;gap:4px} .v3-shop-svc{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0 10px} .v3-shop-svc div{border:1px solid var(--line);border-radius:var(--r-md);padding:10px;display:flex;flex-direction:column;gap:2px;color:#a3adb5} .v3-shop-svc div.on{color:var(--ink)} .v3-shop-svc div.on svg{color:var(--brand)} .v3-shop-svc b{font-size:14px}.v3-shop-svc small{font-size:12px;color:var(--sub)} .v3-shop-sum{font-size:14px;color:var(--sub);margin-bottom:6px} .v3-shop-sum b{color:var(--ink)} .v3-tabs{position:sticky;top:64px;z-index:20;background:#fff;display:flex;align-items:center;gap:6px;border-bottom:1px solid var(--line);margin:12px -16px 0;padding:8px 16px} .v3-tabs-s{flex:none;width:38px;height:38px;border-radius:50%;border:0;background:var(--bg);display:flex;align-items:center;justify-content:center;color:var(--ink)} .v3-tabs-in{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none} .v3-tabs-in::-webkit-scrollbar{display:none} .v3-tabs-in a{flex:none;text-decoration:none;font-weight:700;font-size:14px;padding:9px 14px;border-radius:var(--r-pill);white-space:nowrap} .v3-tabs-in a small{color:var(--sub);font-weight:600} .v3-tabs-in a.on{background:var(--ink);color:#fff} .v3-tabs-in a.on small{color:rgba(255,255,255,.7)} .v3-msearch{display:flex;align-items:center;gap:8px;background:var(--bg);border-radius:var(--r-pill);padding:0 8px 0 16px;margin:12px 0 0;color:var(--sub)} .v3-msearch input{flex:1;border:0;outline:0;background:transparent;font-size:15px;padding:11px 0;font-family:inherit} .v3-msearch button{border:0;background:transparent;color:var(--sub);display:flex;padding:6px} .v3-msec{padding-top:26px;scroll-margin-top:124px} .v3-msec h2{font-size:22px;margin:0 0 12px;font-weight:800;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap} .v3-msec h2 small{font-size:13px;color:var(--sub);font-weight:500} .v3-rail--tips{margin:0 -16px} .v3-tip{width:160px;cursor:pointer} .v3-tip-img{position:relative;aspect-ratio:1;border-radius:var(--r-lg);background:var(--bg);display:flex;align-items:center;justify-content:center;margin-bottom:8px} .v3-tip-img img{width:72%;height:72%;object-fit:contain} .v3-tip b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;line-height:1.25} .v3-tip span{font-size:14px;font-weight:700} .v3-tip .v3-plus{position:absolute;right:8px;bottom:8px} .v3-items{display:grid;gap:12px} @media(min-width:1180px){.v3-items{grid-template-columns:1fr 1fr}} .v3-item{display:flex;gap:14px;justify-content:space-between;padding:14px;border:1px solid var(--line);border-radius:var(--r-lg);cursor:pointer;transition:box-shadow .15s} .v3-item:hover{box-shadow:var(--sh-2)} .v3-item-b{min-width:0;display:flex;flex-direction:column;gap:3px} .v3-item-b b{font-size:15.5px;line-height:1.3} .v3-item-b small{color:var(--sub);font-size:13px} .v3-item-b p{margin:0;color:var(--sub);font-size:13px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden} .v3-item-p{font-weight:700;margin-top:auto;padding-top:6px} .v3-item-img{position:relative;flex:none;width:104px;height:104px;border-radius:var(--r-md);background:var(--bg);display:flex;align-items:center;justify-content:center} .v3-item-img img{width:80%;height:80%;object-fit:contain} .v3-plus{position:absolute;right:-6px;bottom:-6px;width:36px;height:36px;border-radius:50%;border:0;background:#fff;color:var(--ink);box-shadow:var(--sh-1);display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s} .v3-item:hover .v3-plus,.v3-tip:hover .v3-plus{background:var(--brand);color:#fff} /* Warenkorb-Sidebar */ .v3-basket{display:none} @media(min-width:960px){.v3-basket{display:block}.v3-basket-in{position:sticky;top:88px;margin-top:24px;border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;box-shadow:var(--sh-1)}} .v3-basket h2{margin:0 0 14px;font-size:20px;font-weight:800} .v3-basket-empty{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;color:var(--sub);padding:18px 0;margin:0;font-size:14px} .v3-bi{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)} .v3-bi-n{flex:1;min-width:0;font-size:14px} .v3-bi-n b{display:block;font-weight:700;line-height:1.3} .v3-bi-q{display:flex;align-items:center;gap:6px;margin-top:6px} .v3-bi-q button{width:28px;height:28px;border-radius:50%;border:1px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:center;color:var(--ink)} .v3-bi-q span{font-weight:700;font-size:13px;min-width:38px;text-align:center} .v3-bi-p{font-weight:700;font-size:14px;white-space:nowrap} .v3-basket-sum{display:flex;justify-content:space-between;padding:14px 0;font-size:15px} .v3-basket-rx{display:flex;gap:6px;align-items:flex-start;font-size:12.5px;color:var(--sub);margin:12px 0 0} .v3-basket-rx svg{flex:none;margin-top:2px} .v3-basket-other{background:var(--brand-soft);border-radius:var(--r-md);padding:10px 12px;font-size:13px;margin-bottom:10px} .v3-cartbar{position:fixed;left:12px;right:12px;bottom:74px;z-index:60;display:flex;align-items:center;gap:12px;background:var(--brand);color:#fff;text-decoration:none;border-radius:var(--r-pill);padding:13px 20px;box-shadow:var(--sh-2);font-size:15px} .v3-cartbar b{flex:1;text-align:center} .v3-cartbar-n{background:rgba(0,0,0,.18);border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px} @media(min-width:960px){.v3-cartbar{display:none!important}} /* Bottom-Sheets (Standort, Produkt) */ .v3-sheet{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-end;justify-content:center} @media(min-width:760px){.v3-sheet{align-items:center}} .v3-sheet-bg{position:absolute;inset:0;background:rgba(0,0,0,.45)} .v3-sheet-card{position:relative;background:#fff;width:100%;max-width:520px;border-radius:var(--r-xl) var(--r-xl) 0 0;padding:20px;max-height:92vh;overflow:auto;animation:v3up .22s ease} @media(min-width:760px){.v3-sheet-card{border-radius:var(--r-xl)}} @keyframes v3up{from{transform:translateY(30px);opacity:0}to{transform:none;opacity:1}} .v3-sheet-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-size:20px} .v3-sheet-head button{border:0;background:var(--bg);width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center} .v3-geo{display:flex;align-items:center;gap:8px;border:0;background:transparent;color:var(--brand-strong);font-weight:700;font-size:15px;padding:14px 4px 4px} .v3-isheet{padding:0} .v3-isheet-x{position:absolute;top:12px;right:12px;z-index:2;border:0;background:#fff;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:var(--sh-1)} .v3-isheet-img{background:var(--bg);height:220px;display:flex;align-items:center;justify-content:center} .v3-isheet-img img{height:80%;width:auto;object-fit:contain} .v3-isheet-b{padding:18px 20px 22px} .v3-isheet h3{margin:0 0 4px;font-size:22px;font-weight:800} .v3-isheet small{color:var(--sub);font-size:14px} .v3-isheet-p{font-weight:700;font-size:17px;margin:10px 0 16px} .v3-isheet h4{margin:0 0 8px;font-size:15px} .v3-qty{display:flex;flex-wrap:wrap;gap:8px} .v3-qty button{border:1.5px solid var(--line);background:#fff;border-radius:var(--r-pill);padding:9px 16px;font-weight:700;font-size:14px;color:var(--ink)} .v3-qty button.on{border-color:var(--ink);background:var(--ink);color:#fff} .v3-isheet-note{font-size:12.5px;color:var(--sub);margin:10px 0 16px} .v3-isheet-err{background:#fdecee;color:var(--critical);border-radius:var(--r-md);padding:10px 12px;font-size:14px;margin-bottom:12px} .v3-isheet-err button{margin-top:8px} /* Toast */ .v3-toast{position:fixed;left:50%;bottom:140px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:12px 18px;border-radius:var(--r-pill);font-weight:600;font-size:14px;z-index:120;box-shadow:var(--sh-2);display:flex;align-items:center;gap:8px} @media(min-width:960px){.v3-toast{bottom:40px}} /* ── Footer + Bottom-Nav ── */ .v3f{background:var(--bg);margin-top:20px} .v3f-in{max-width:var(--max);margin:0 auto;padding:24px 16px 30px} .v3f-note{display:flex;gap:8px;font-size:13px;color:var(--sub);max-width:780px;margin-bottom:16px} .v3f-note svg{flex:none;margin-top:2px} .v3f-links{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13.5px} .v3f-links a{color:var(--ink);text-decoration:none;font-weight:600} .v3f-links a:hover{text-decoration:underline} .v3-nav{position:fixed;left:0;right:0;bottom:0;z-index:70;background:#fff;border-top:1px solid var(--line);display:flex;padding-bottom:env(safe-area-inset-bottom)} .v3-nav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 0 7px;text-decoration:none;color:var(--sub);font-size:11px;font-weight:600} .v3-nav a.on{color:var(--brand)} @media(min-width:960px){.v3-nav{display:none}body{padding-bottom:0}} /* Mobile-Fix: Hero-Grid darf nicht ueber den Viewport wachsen */ .v3-hero-in{grid-template-columns:minmax(0,1fr)} .v3-hero-txt{min-width:0} @media(min-width:960px){.v3-hero-in{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}} @media(max-width:480px){.v3-addr{padding-left:14px}.v3-addr .v3-btn{padding:12px 16px}.v3-addr-geo{width:40px;height:40px}.v3-addr input{font-size:15px}.v3-hero p{font-size:15px}} .v3-rail{scroll-padding-inline:16px} /* ── Beratung (Funnel A) ── */ .v3-ber-hero{background:var(--brand);color:#fff;padding:34px 0 40px} .v3-ber-hero h1{font-size:clamp(28px,5vw,44px);line-height:1.08;letter-spacing:-.02em;margin:10px 0 12px;font-weight:800;max-width:720px} .v3-ber-hero p{font-size:16.5px;max-width:640px;margin:0 0 22px;opacity:.95} .v3-ber-hero .v3-btn{background:#fff;color:var(--ink)} .v3-ber-hero .v3-btn:hover{background:var(--brand-soft)} .v3-eyebrow{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.18);border-radius:var(--r-pill);padding:6px 12px;font-weight:700;font-size:13px} .v3-crumb{display:inline-flex;align-items:center;gap:4px;text-decoration:none;font-weight:700;font-size:14px;margin:4px 0 14px} .v3-ber-hero .v3-crumb{color:#fff} .v3-ber-main{padding-bottom:30px} .v3-sec-t--flush{margin-left:0;margin-right:0} .v3-sec-h--flush{padding-right:0} .v3-rail--flush{margin:0 -16px} .v3-sub{color:var(--sub);font-size:13.5px;margin:-6px 0 12px} .v3-ind-grid{display:grid;gap:12px} @media(min-width:760px){.v3-ind-grid{grid-template-columns:1fr 1fr}} .v3-ind{display:flex;align-items:center;gap:14px;padding:16px;border:1px solid var(--line);border-radius:var(--r-lg);text-decoration:none;transition:box-shadow .15s} .v3-ind:hover{box-shadow:var(--sh-2)} .v3-ind>svg{color:var(--sub);flex:none} .v3-ind-ic{width:56px;height:56px;border-radius:50%;background:var(--brand-soft);color:var(--brand-strong);display:flex;align-items:center;justify-content:center;flex:none} .v3-ind-ic--lg{width:64px;height:64px;background:rgba(255,255,255,.2);color:#fff;margin-top:6px} .v3-ind-b{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0} .v3-ind-b b{font-size:16px} .v3-ind-b small{color:var(--sub);font-size:13.5px} .v3-ind-b em{font-style:normal;font-size:12.5px;font-weight:700;color:var(--positive);margin-top:3px} .v3-more-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px} .v3-more-grid a{display:flex;flex-direction:column;gap:2px;padding:14px;background:var(--bg);border-radius:var(--r-md);text-decoration:none} .v3-more-grid a:hover{background:var(--brand-soft)} .v3-more-grid b{font-size:14.5px}.v3-more-grid small{color:var(--sub);font-size:12.5px} .v3-how .v3-how-l{padding:0} .v3-ber-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;background:var(--brand-soft);border-radius:var(--r-lg);padding:20px;margin-top:20px} .v3-ber-cta b{display:block;font-size:17px}.v3-ber-cta span{color:var(--sub);font-size:14px} .v3-ind-cols{display:grid;gap:14px;padding-top:24px} @media(min-width:760px){.v3-ind-cols{grid-template-columns:1.2fr 1fr}} .v3-card{border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;background:#fff} .v3-card h2{margin:0 0 12px;font-size:18px;font-weight:800} .v3-card p{margin:0;color:var(--sub);font-size:14.5px} .v3-card--soft{background:var(--bg);border-color:var(--bg)} .v3-checks{list-style:none;margin:0;padding:0;display:grid;gap:10px} .v3-checks li{display:flex;gap:10px;align-items:flex-start;font-size:15px} .v3-checks svg{color:var(--positive);flex:none;margin-top:1px} .v3-stickycta{position:fixed;left:0;right:0;bottom:62px;padding:10px 12px;background:linear-gradient(transparent,#fff 30%);z-index:60} @media(min-width:960px){.v3-stickycta{display:none}} body.v3-ber .v3f{padding-bottom:70px} @media(min-width:960px){body.v3-ber .v3f{padding-bottom:0}} /* ── Warenkorb-Seite ── */ .v3-kasse-wrap{padding-top:18px;padding-bottom:40px} .v3-page-t{font-size:clamp(26px,4vw,34px);font-weight:800;letter-spacing:-.01em;margin:0 0 18px} .v3-kasse-grid{display:grid;gap:18px} @media(min-width:960px){.v3-kasse-grid{grid-template-columns:1fr 360px;align-items:start}.v3-kasse-sum{position:sticky;top:88px}} .v3-kasse-ph{display:flex;align-items:center;gap:14px;margin-bottom:14px} .v3-kasse-ph div{flex:1;display:flex;flex-direction:column} .v3-kasse-ph small{color:var(--sub);font-size:12.5px} .v3-kasse-ph b{font-size:16px} .v3-shop-logo--sm{position:static;width:52px;height:52px;font-size:17px;box-shadow:var(--sh-1)} .v3-link{font-weight:700;font-size:14px;color:var(--brand-strong)} .v3-ki{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line)} .v3-ki:last-child{border-bottom:0} .v3-ki-img{width:72px;height:72px;border-radius:var(--r-md);background:var(--bg);display:flex;align-items:center;justify-content:center;flex:none} .v3-ki-img img{width:80%;height:80%;object-fit:contain} .v3-ki-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px} .v3-ki-b b{font-size:15px;line-height:1.3} .v3-ki-b small{color:var(--sub);font-size:13px} .v3-ki-rm{border:0!important;width:auto!important;background:transparent!important;color:var(--sub)!important;font-size:13px;text-decoration:underline;margin-left:8px} .v3-kasse-sum h2{margin:0 0 6px} .v3-basket-rx{display:block}.v3-basket-rx svg{display:inline-block;vertical-align:-3px;margin-right:4px}.v3-kasse-sum .v3-sub{margin:0 0 14px} /* ═══ Runde 3 (03.10.): Discovery-Engine, Storefront, Produkt, Auswahl ═══ */ .v3-btn--ghost{background:#fff;color:var(--ink);border:1.5px solid var(--line)} .v3-btn--ghost:hover{background:var(--bg)} .v3-btn--sm{padding:8px 14px;font-size:13.5px} .v3-link{font-weight:700;font-size:14px;color:var(--brand-strong);text-decoration:underline;text-underline-offset:2px;background:none;border:0;padding:0;cursor:pointer} body.v3-locked{overflow:hidden} /* Hero (Location first) */ .v3-hero-recent{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px} .v3-hero-recent a{display:inline-flex;align-items:center;gap:4px;background:rgba(255,255,255,.18);color:#fff;text-decoration:none;font-weight:600;font-size:13px;padding:6px 12px;border-radius:var(--r-pill)} .v3-hero-login{margin:18px 0 0!important;font-size:14.5px!important} .v3-hero-login a{color:#fff;font-weight:700;display:inline-flex;align-items:center;gap:2px} .v3-hero-stat{position:absolute;left:12%;top:24%;background:#fff;color:var(--ink);border-radius:var(--r-lg);padding:18px 22px;box-shadow:var(--sh-2);display:flex;flex-direction:column} .v3-hero-stat b{font-size:34px;line-height:1;color:var(--brand-strong)} .v3-hero-stat span{font-size:14px;font-weight:600;color:var(--sub)} .v3-hero-stat--2{left:auto;right:8%;top:52%} /* Subbar: Erhalt + Suche + Karte, Views, Chips -- sticky mit progressiver Reduktion */ .v3-subbar{position:sticky;top:64px;z-index:40} .v3-iconbtn{display:inline-flex;align-items:center;gap:6px;text-decoration:none;font-weight:700;font-size:14px;border:1px solid var(--line);border-radius:var(--r-pill);padding:9px 14px;background:#fff} .v3-iconbtn span{display:none} @media(min-width:620px){.v3-iconbtn span{display:inline}} .v3-views{max-width:var(--max);margin:0 auto;display:flex;gap:4px;padding:8px 16px 0;overflow-x:auto} .v3-views a{text-decoration:none;font-weight:700;font-size:14.5px;padding:8px 14px;border-bottom:3px solid transparent;color:var(--sub);white-space:nowrap} .v3-views a small{font-weight:600;font-size:12px;margin-left:2px} .v3-views a.on{color:var(--ink);border-color:var(--brand)} .v3-chips{max-width:var(--max);margin:0 auto;display:flex;gap:8px;overflow-x:auto;padding:10px 16px 12px;scrollbar-width:none} .v3-chips::-webkit-scrollbar{display:none} .v3-chips .v3-chip{flex:none;cursor:pointer;font-family:inherit} body.v3-s1 .v3-views{display:none} body.v3-s2 .v3-subbar .v3-mode,body.v3-s2 .v3-chips .v3-chip:not(:first-child){display:none} body.v3-s2 .v3-chips{padding-top:0} @media(max-width:619px){.v3-subbar-in{gap:8px}.v3-subbar .v3-mode{order:2;width:100%}.v3-subbar .v3-mode a{flex:1;justify-content:center}.v3-search{order:1;min-width:0}.v3-iconbtn{order:1}body.v3-s1 .v3-subbar .v3-mode{display:none}} .v3-locprompt{display:flex;align-items:center;gap:12px;width:100%;margin:16px 0 0;border:1.5px dashed var(--brand);background:var(--brand-soft);border-radius:var(--r-lg);padding:14px 16px;text-align:left;font-family:inherit;color:var(--ink);cursor:pointer} .v3-locprompt>svg:first-child{color:var(--brand-strong);flex:none} .v3-locprompt span{flex:1;display:flex;flex-direction:column} .v3-locprompt small{color:var(--sub);font-size:13px} /* Discovery-Kacheln + Parameter */ .v3-tiles .v3-tile{width:132px;display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none} .v3-tile-ic{width:132px;height:100px;border-radius:var(--r-lg);background:var(--brand-soft);color:var(--brand-strong);display:flex;align-items:center;justify-content:center;overflow:hidden;transition:transform .15s} .v3-tile-ic img{width:70%;height:85%;object-fit:contain} .v3-tile:hover .v3-tile-ic{transform:translateY(-2px)} .v3-tile b{font-size:15px} .v3-params{padding-top:0} .v3-params .v3-chip{flex:none} /* Marken */ .v3-brand{width:150px;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;text-decoration:none;padding:14px 10px;border:1px solid var(--line);border-radius:var(--r-lg)} .v3-brand:hover{box-shadow:var(--sh-2)} .v3-brand-ic{width:54px;height:54px;border-radius:50%;background:var(--brand-soft);color:var(--brand-strong);font-weight:800;display:flex;align-items:center;justify-content:center;flex:none} .v3-brand b{font-size:14px;line-height:1.25} .v3-brand small{font-size:12px;color:var(--sub)} .v3-brand-grid{display:grid;gap:10px;grid-template-columns:1fr} @media(min-width:760px){.v3-brand-grid{grid-template-columns:1fr 1fr}} @media(min-width:1180px){.v3-brand-grid{grid-template-columns:repeat(3,1fr)}} .v3-brand--row{width:auto;flex-direction:row;text-align:left;padding:12px 14px;gap:12px} .v3-brand--row>span:nth-child(2){flex:1;display:flex;flex-direction:column;min-width:0} .v3-brand--row>svg{color:var(--sub);flex:none} .v3-brand--row.on{border-color:var(--brand);background:var(--brand-soft)} .v3-sec-t small{font-size:14px;color:var(--sub);font-weight:600;margin-left:6px} /* Ergebnisse */ .v3-results1{padding-top:18px;padding-bottom:30px} .v3-pgrid{display:grid;gap:22px 16px;grid-template-columns:repeat(2,1fr)} @media(min-width:760px){.v3-pgrid{grid-template-columns:repeat(3,1fr)}} @media(min-width:1100px){.v3-pgrid{grid-template-columns:repeat(5,1fr)}} .v3-prod--grid{width:auto} .v3-prod-av{display:flex;align-items:center;gap:4px;color:var(--positive)!important;font-weight:600} .v3-morebtn{text-align:center;margin-top:24px} .v3-grp{margin-bottom:26px} .v3-grp-t{font-size:19px;font-weight:800;margin:0 0 12px} .v3-grp-t small{font-size:14px;color:var(--sub);font-weight:600} .v3-sortctl{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:14px;color:var(--sub)} .v3-sortctl select{font-family:inherit;font-size:14px;font-weight:700;color:var(--ink);border:1px solid var(--line);border-radius:var(--r-pill);padding:7px 12px;background:#fff} .v3-howsort{font-size:13px;color:var(--sub);width:100%} .v3-howsort summary{cursor:pointer;text-decoration:underline;font-weight:600} .v3-howsort p{margin:6px 0 0;max-width:620px} .v3-active{align-items:center} .v3-empty-act{display:flex;flex-wrap:wrap;gap:10px;justify-content:center} /* Apotheken-Card (festes Info-Modell, ganze Karte klickbar, Herz separat) */ .v3-pc{position:relative} .v3-pc-link{position:absolute;inset:0;z-index:1;border-radius:var(--r-lg)} .v3-pc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px} .v3-fav{position:relative;z-index:2;border:0;background:transparent;color:var(--sub);cursor:pointer;padding:2px;display:flex;flex:none} .v3-fav.on{color:#e0245e} .v3-fav.on svg{fill:#e0245e} .v3-svc{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px;font-size:12.5px;font-weight:600;color:#a3adb5} .v3-svc span{display:inline-flex;align-items:center;gap:3px} .v3-svc span.on{color:var(--positive)} .v3-pc-badge{background:var(--ink)} /* Karte: Cluster, Pins, wischbare Bottom-Cards */ .v3-mapwrap{position:relative;margin-bottom:22px} .v3-mapwrap .v3-map{height:calc(100vh - 260px);min-height:380px;margin:0} .v3-cluster{width:44px;height:44px;border-radius:50%;background:var(--brand);color:#fff;font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;border:4px solid rgba(255,255,255,.85);box-shadow:var(--sh-1)} .v3-mpin{min-width:36px;height:26px;padding:0 8px;border-radius:var(--r-pill);background:#fff;color:var(--ink);font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;box-shadow:var(--sh-1);border:2px solid var(--brand);position:relative} .v3-mpin::after{content:"";position:absolute;bottom:-7px;left:50%;margin-left:-5px;border:5px solid transparent;border-top-color:var(--brand)} .v3-mpin.on{background:var(--brand);color:#fff;transform:scale(1.15)} .v3-mapsheet{position:absolute;left:0;right:0;bottom:12px;z-index:500;pointer-events:none} .v3-ms-track{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 12px;scrollbar-width:none;pointer-events:auto} .v3-ms-track::-webkit-scrollbar{display:none} .v3-ms-card{flex:none;width:min(320px,82vw);scroll-snap-align:center;display:flex;gap:12px;align-items:flex-start;background:#fff;border-radius:var(--r-lg);box-shadow:var(--sh-2);padding:14px;text-decoration:none;color:var(--ink)} .v3-ms-logo{width:48px;height:48px;border-radius:var(--r-md);background:var(--brand-soft);color:var(--brand-strong);font-weight:800;display:flex;align-items:center;justify-content:center;flex:none} .v3-ms-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:13px} .v3-ms-b b{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .v3-ms-b small{color:var(--sub)} .v3-ms-b strong{color:var(--ink)} .v3-ms-list{pointer-events:auto;position:absolute;left:50%;top:-56px;transform:translateX(-50%);background:var(--ink);color:#fff;text-decoration:none;font-weight:700;font-size:13.5px;padding:9px 16px;border-radius:var(--r-pill);box-shadow:var(--sh-2);white-space:nowrap} .v3-mapsheet[hidden]{display:block!important} .v3-mapsheet[hidden] .v3-ms-track{display:none} .v3-mapsheet[hidden] .v3-ms-list{top:auto;bottom:0} /* Filter-Sheet (volle Hoehe, Sticky-Button) */ .v3-fsheet{padding:0;display:flex;flex-direction:column;max-height:92vh;max-width:560px} .v3-fsheet .v3-sheet-head{padding:18px 20px 10px;margin:0;border-bottom:1px solid var(--line)} .v3-fsheet-body{overflow:auto;padding:4px 20px 10px;flex:1} .v3-fsheet fieldset{border:0;margin:0;padding:14px 0;border-bottom:1px solid var(--line);transition:background .3s} .v3-fsheet fieldset.v3-hl{background:var(--brand-soft)} .v3-fsheet legend{font-weight:800;font-size:16px;padding:0;margin-bottom:8px} .v3-opt{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:15px;cursor:pointer} .v3-opt input{width:20px;height:20px;accent-color:var(--ink);flex:none} .v3-opt span{flex:1} .v3-opt em{font-style:normal;color:var(--sub);font-size:13px;font-weight:600} .v3-opt.is-off{opacity:.4;cursor:default} .v3-optlist{max-height:260px;overflow:auto} .v3-seg{display:flex;gap:6px} .v3-seg--wrap{flex-wrap:wrap} .v3-seg label{cursor:pointer} .v3-seg input{position:absolute;opacity:0;pointer-events:none} .v3-seg span{display:inline-block;border:1.5px solid var(--line);border-radius:var(--r-pill);padding:8px 14px;font-weight:700;font-size:14px} .v3-seg input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff} .v3-select{width:100%;font-family:inherit;font-size:15px;padding:11px 12px;border:1.5px solid var(--line);border-radius:var(--r-md);background:#fff} .v3-fsheet-foot{display:flex;gap:10px;padding:14px 20px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff} .v3-fsheet-foot .v3-btn--lg{flex:1} /* Standort-Sheet: letzte Standorte + Warnung */ .v3-recent{margin-top:14px;border-top:1px solid var(--line);padding-top:12px} .v3-recent h4{margin:0 0 6px;font-size:14px;color:var(--sub)} .v3-recent-i{display:flex;align-items:center;gap:10px;padding:10px 4px;text-decoration:none;border-radius:var(--r-md)} .v3-recent-i:hover{background:var(--bg)} .v3-recent-i>svg{color:var(--sub);flex:none} .v3-recent-i span{flex:1;display:flex;flex-direction:column} .v3-recent-i small{color:var(--sub);font-size:12.5px} .v3-recent-i em{font-style:normal;color:var(--sub);font-size:13px} .v3-recent-i.on>svg{color:var(--brand)} .v3-warn{position:fixed;left:12px;right:12px;bottom:84px;z-index:95;max-width:440px;margin:0 auto;background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:16px;box-shadow:var(--sh-2);display:flex;flex-direction:column;gap:6px;font-size:14px} .v3-warn b{font-size:16px} .v3-warn div{display:flex;gap:8px;margin-top:6px} .v3-warn .v3-btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)} /* Storefront */ .v3-banner-fav{position:absolute;top:14px;right:14px;width:42px;height:42px;border-radius:50%;background:#fff!important;box-shadow:var(--sh-1);align-items:center;justify-content:center;color:var(--ink)} .v3-banner-status{position:absolute;left:14px;bottom:14px;background:var(--ink);color:#fff;font-weight:700;font-size:13px;padding:6px 12px;border-radius:var(--r-pill)} .v3-info-btn{border:0;background:transparent;color:var(--sub);cursor:pointer;vertical-align:middle;padding:2px} .v3-shop-svc--2{grid-template-columns:1fr 1fr} .v3-shop-svc div.sel.on{border-color:var(--brand);background:var(--brand-soft)} .v3-intercept{background:var(--brand-soft);border-radius:var(--r-md);padding:14px;display:flex;flex-direction:column;gap:4px;font-size:14px;margin-top:6px} .v3-intercept div{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:6px} .v3-storebar{position:sticky;top:64px;z-index:30;background:#fff;margin:14px -16px 0;padding:10px 16px 0;border-bottom:1px solid var(--line)} .v3-storebar-top{display:none;align-items:center;gap:10px;padding-bottom:8px} .v3-storebar-top b{flex:1;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .v3-storebar-top a{display:flex} body.v3-s1 .v3-storebar-top{display:flex} .v3-search--store{margin-bottom:8px;cursor:text} .v3-storebar .v3-tabs-in{padding-bottom:8px} .v3-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:16px;font-size:14px} .v3-crumbs a:first-child{color:var(--sub);font-weight:600} .v3-crumbs span{color:var(--sub);flex-basis:100%} .v3-msec{scroll-margin-top:190px} .v3-mbrand{margin-bottom:18px} .v3-mbrand h3{font-size:15px;font-weight:800;margin:6px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--line);display:flex;gap:6px;align-items:baseline} .v3-mbrand h3 small{color:var(--sub);font-weight:600;font-size:13px} .v3-tip{display:flex;flex-direction:column;gap:2px} .v3-tip-brand{color:var(--sub);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px} .v3-tip small:not(.v3-tip-brand){color:var(--sub);font-size:12px} .v3-plus{width:42px;height:42px;right:-6px;bottom:-6px} .v3-dl{margin:0 0 16px;display:grid;grid-template-columns:120px 1fr;gap:10px 14px;font-size:14.5px} .v3-dl dt{color:var(--sub);font-weight:600} .v3-dl dd{margin:0} .v3-sheet-acts{display:flex;flex-direction:column;gap:8px} .v3-isheet-av{color:var(--positive);font-size:14px;margin:8px 0} .v3-facts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0} .v3-facts div{background:var(--bg);border-radius:var(--r-md);padding:10px 12px} .v3-facts dt{font-size:12px;color:var(--sub);font-weight:600} .v3-facts dd{margin:2px 0 0;font-weight:700;font-size:14.5px} .v3-facts--sm{gap:6px;margin:8px 0} .v3-facts--sm div{padding:7px 10px} .v3-facts--sm dd{font-size:13.5px} .v3-isheet .v3-link{display:inline-block;margin:4px 0 6px;font-size:13.5px} /* Produktseite + Apothekenvergleich */ .v3-pd{padding-top:14px;padding-bottom:40px} .v3-pd-grid{display:grid;gap:22px} @media(min-width:860px){.v3-pd-grid{grid-template-columns:420px 1fr;align-items:start}} .v3-pd-img{background:var(--bg);border-radius:var(--r-xl);aspect-ratio:1;display:flex;align-items:center;justify-content:center} .v3-pd-img img{width:70%;height:70%;object-fit:contain} .v3-pd-brand{font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.4px;color:var(--brand-strong);text-decoration:none} .v3-pd-info h1{font-size:clamp(24px,4vw,34px);margin:4px 0 6px;letter-spacing:-.01em} .v3-pd-meta{color:var(--sub);margin:0 0 10px} .v3-pd-price{font-weight:800;font-size:20px;margin:0} .v3-pd-price small{font-weight:600;font-size:14px;color:var(--sub);margin-left:6px} .v3-avail{margin-top:30px} .v3-avail-h{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between} .v3-avail-h h2{font-size:24px;margin:0;font-weight:800} .v3-avail-sub{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 10px} .v3-avail-sub .v3-chip{cursor:pointer;font-family:inherit} .v3-avail-n{font-weight:700;margin:6px 0 12px} .v3-cmp{display:grid;gap:10px} .v3-cmp-r{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:var(--r-lg);padding:12px 14px} .v3-cmp-ph{flex:1;min-width:0;display:flex;align-items:center;gap:12px;text-decoration:none} .v3-cmp-ph>span:last-child{min-width:0;display:flex;flex-direction:column} .v3-cmp-ph b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .v3-cmp-ph small{color:var(--sub);font-size:13px} .v3-cmp-ph .v3-svc{margin-top:2px} .v3-cmp-p{text-align:right;display:flex;flex-direction:column} .v3-cmp-p b{font-size:16px} .v3-cmp-p small{color:var(--sub);font-size:12px} .v3-shop-logo--xs{position:static;width:42px;height:42px;font-size:14px;box-shadow:none;background:var(--brand-soft);flex:none} .v3-sub--rx{display:flex;gap:6px;align-items:flex-start;margin-top:16px} @media(max-width:560px){.v3-cmp-r{flex-wrap:wrap}.v3-cmp-ph{flex-basis:100%}.v3-cmp-p{text-align:left;flex-direction:row;gap:4px;align-items:baseline;flex:1}} /* Auswahl-Seite */ .v3-steps{list-style:none;margin:0 0 20px;padding:0;display:flex;gap:6px;overflow-x:auto;font-size:13px;font-weight:700;color:var(--sub)} .v3-steps li{flex:none;padding:6px 12px;border-radius:var(--r-pill);background:var(--bg)} .v3-steps li.on{background:var(--ink);color:#fff} .v3-card h2{font-size:17px} .v3-kasse-ph{display:block;margin:14px 0 0} .v3-kasse-phrow{display:flex;align-items:center;gap:12px;text-decoration:none;margin-bottom:18px} .v3-kasse-phrow>span:nth-child(2){flex:1;display:flex;flex-direction:column} .v3-kasse-phrow small{color:var(--sub);font-size:13px} .v3-kasse-phrow>svg{color:var(--sub)} .v3-erhalt{display:grid;grid-template-columns:1fr 1fr;gap:10px} .v3-erhalt label{cursor:pointer} .v3-erhalt input{position:absolute;opacity:0} .v3-erhalt span{display:flex;flex-direction:column;gap:2px;border:1.5px solid var(--line);border-radius:var(--r-md);padding:12px} .v3-erhalt span svg{color:var(--brand)} .v3-erhalt small{color:var(--sub);font-size:12.5px} .v3-erhalt input:checked+span{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)} .v3-erhalt input:disabled+span{opacity:.45;cursor:not-allowed} .v3-ki-q{display:flex;align-items:center;gap:6px;margin-top:6px} .v3-kasse-login{background:var(--brand-soft);border-radius:var(--r-md);padding:10px 12px;margin:12px 0 0!important;color:var(--ink)!important} body.v3-has-bar .v3f{padding-bottom:60px} .v3-cartbar span:last-child{display:flex;align-items:center;gap:2px;font-weight:700} /* Fixes nach E2E 03.10. */ html,body{overflow-x:clip} .v3-cmp-ph>span:last-child{overflow:hidden;flex:1} .v3-cmp-ph b,.v3-ms-b b,.v3-pc-n{max-width:100%} .v3-rail .v3-prod--grid{width:170px} .v3-seg{flex-wrap:wrap}.v3-seg span{white-space:nowrap} body.v3-locked #dvs,body.v3-locked #zlai-fab,body.v3-locked #zlai-teaser{display:none!important} .v3-sec-t small{white-space:nowrap} @media(max-width:959px){.v3-mapwrap .v3-map{height:calc(100svh - 380px);min-height:300px}} body.v3-view-karte .v3-cartbar{display:none!important} body.v3-has-bar .v3-menu-wrap,body.v3-has-bar .v3-pd{padding-bottom:90px} /* ═══ Runde 4 (03.10.): Medical, Review, Status, Konto, Auth, Suche, Info ═══ */ .v3-nav a{position:relative} .v3-nav-ic{position:relative;display:flex} .v3-nav-dot{position:absolute;top:-2px;right:-4px;width:9px;height:9px;border-radius:50%;background:var(--critical);border:2px solid #fff} .v3-alert{background:#fdecee;color:var(--critical);border-radius:var(--r-md);padding:12px 14px;font-size:14px;margin:0 0 14px} .v3-alert a{color:inherit;font-weight:700} .v3-alert--info{background:var(--brand-soft);color:var(--ink)} .v3-alert--ok{background:var(--positive-soft);color:var(--positive);display:flex;align-items:center;gap:8px;font-weight:600} .v3-empty-act--left{justify-content:flex-start} /* Formulare */ .v3-form{display:flex;flex-direction:column;gap:14px} .v3-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px} .v3-form-row--dob{grid-template-columns:80px 1fr 96px} .v3-field{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600} .v3-field>span{color:var(--ink)} .v3-field input,.v3-field select,.v3-field textarea,.v3-form-row select,.v3-istep textarea,.v3-istep input[type=text],.v3-istep input:not([type]){font-family:inherit;font-size:16px;font-weight:400;padding:12px 14px;border:1.5px solid var(--line);border-radius:var(--r-md);background:#fff;color:var(--ink);width:100%} .v3-field input:focus,.v3-field textarea:focus,.v3-istep textarea:focus,.v3-field select:focus{outline:none;border-color:var(--brand)} .v3-check{display:flex;gap:10px;align-items:flex-start;font-size:14px;cursor:pointer} .v3-check input{width:20px;height:20px;accent-color:var(--ink);flex:none;margin-top:1px} .v3-code{letter-spacing:8px;text-align:center;font-size:22px!important;font-weight:700!important} .is-bad{border-color:var(--critical)!important} /* Auth */ .v3-auth-wrap{padding-top:28px;padding-bottom:40px} .v3-auth-card{max-width:460px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:28px 24px;box-shadow:var(--sh-1)} .v3-auth-card h1{font-size:26px;margin:0 0 8px;font-weight:800} .v3-auth-ctx{display:flex;align-items:center;gap:6px;background:var(--brand-soft);border-radius:var(--r-md);padding:10px 12px;font-size:14px;font-weight:600;margin:0 0 14px} .v3-auth-forgot{align-self:flex-end;font-size:13px;margin-top:-6px} .v3-auth-alt{border-top:1px solid var(--line);margin-top:20px;padding-top:18px;display:flex;flex-direction:column;gap:10px;align-items:center;font-size:14px;color:var(--sub)} .v3-auth-note{display:flex;gap:6px;font-size:12.5px;color:var(--sub);margin:16px 0 0} .v3-auth-note svg{flex:none;margin-top:2px} .v3-auth-done{text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px} /* Registrierungs-Einfuehrung (Feature-Folien, 04.10.2026) */ .v3-onb-card{display:flex;flex-direction:column;align-items:center;text-align:center} .v3-onb-top{display:flex;justify-content:flex-end;width:100%;margin:0 0 4px} .v3-onb-folie{display:flex;flex-direction:column;align-items:center} .v3-onb-icon{width:76px;height:76px;border-radius:50%;background:var(--brand-soft);color:var(--brand); display:flex;align-items:center;justify-content:center;margin:10px 0 20px} .v3-onb-folie h1{font-size:22px;margin:0 0 8px} .v3-onb-folie .v3-sub{max-width:320px} .v3-onb-dots{display:flex;gap:7px;margin:22px 0 20px} .v3-onb-dot{width:7px;height:7px;border-radius:50%;background:var(--line);transition:background .2s,width .2s} .v3-onb-dot.on{background:var(--brand);width:20px;border-radius:4px} /* Medical Intake (Stepper) */ .v3-intake-wrap{padding-top:18px;padding-bottom:40px;max-width:760px} .v3-intake-card{padding:22px} .v3-intake-card h1{font-size:clamp(22px,4vw,28px);line-height:1.2;margin:14px 0 6px;font-weight:800} .v3-intake-card h3{font-size:15px;margin:18px 0 8px} .v3-intake-top{display:flex;align-items:center;gap:10px} .v3-intake-back{width:38px;height:38px;border-radius:50%;border:0;background:var(--bg);display:flex;align-items:center;justify-content:center;color:var(--ink)} .v3-intake-n{flex:1;font-size:13px;font-weight:700;color:var(--sub);text-transform:uppercase;letter-spacing:.4px} .v3-intake-save{font-size:12px;color:var(--positive);font-weight:600} .v3-progress{height:6px;background:var(--bg);border-radius:3px;margin:12px 0 4px;overflow:hidden} .v3-progress i{display:block;height:100%;background:var(--brand);border-radius:3px;transition:width .3s} .v3-istep{display:flex;flex-direction:column;gap:10px} .v3-istep textarea{min-height:120px;resize:vertical} .v3-istep-err{color:var(--critical);font-size:13.5px;font-weight:600} .v3-choices{display:grid;gap:8px} .v3-choices--row{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))} .v3-choice{cursor:pointer} .v3-choice input{position:absolute;opacity:0} .v3-choice span{display:block;border:1.5px solid var(--line);border-radius:var(--r-md);padding:12px 14px;font-weight:600;font-size:15px;text-align:left} .v3-choice input:checked+span{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink);background:var(--bg)} .v3-intake-foot{display:flex;justify-content:flex-end;margin-top:22px} .v3-intake-foot .v3-btn{min-width:200px} .v3-intake-two{display:grid;gap:10px;margin-top:16px} @media(min-width:620px){.v3-intake-two{grid-template-columns:1fr 1fr}} /* Review */ .v3-review{display:flex;flex-direction:column;gap:12px} .v3-rv{display:flex;gap:14px;border:1px solid var(--line);border-radius:var(--r-lg);padding:18px;background:#fff} .v3-rv-n{font-weight:800;font-size:14px;color:var(--brand-strong);background:var(--brand-soft);width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none} .v3-rv-b{flex:1;min-width:0} .v3-rv-b h2{font-size:17px;margin:4px 0 10px} .v3-rv-b p{margin:0 0 8px;font-size:14.5px} .v3-rv-b small{color:var(--sub)} .v3-rv-h3{font-size:15px;margin:16px 0 8px} .v3-rv-item{display:flex;gap:10px;align-items:center;margin-bottom:8px} .v3-rv-item img{width:48px;height:48px;object-fit:contain;background:var(--bg);border-radius:var(--r-sm)} .v3-rv-item span{display:flex;flex-direction:column;font-size:14px} .v3-rv .v3-field{margin-top:10px} .v3-ok{color:var(--positive);font-weight:700;display:flex;align-items:center;gap:6px} .v3-cost{margin:0;display:flex;flex-direction:column;gap:6px;font-size:14.5px} .v3-cost div{display:flex;justify-content:space-between} .v3-cost dd{margin:0;font-weight:600} .v3-cost-t{border-top:1px solid var(--line);padding-top:8px;font-weight:800;font-size:16px} .v3-coupon{margin-top:12px;font-size:14px} .v3-coupon summary{cursor:pointer;font-weight:600;color:var(--brand-strong)} .v3-coupon input{margin-top:8px;padding:10px 12px;border:1.5px solid var(--line);border-radius:var(--r-md);font-size:15px;width:100%;max-width:260px} .v3-coupon small{display:block;color:var(--sub);margin-top:4px} .v3-ki.is-off{opacity:.75} .v3-ki-warn{background:#fdecee;color:var(--critical);border-radius:var(--r-sm);padding:6px 8px;font-size:12.5px;margin-top:4px} .v3-ki-warn a{color:inherit;font-weight:700} /* Status */ .v3-tl{list-style:none;margin:0;padding:0} .v3-tl li{display:flex;gap:14px;position:relative;padding:0 0 22px} .v3-tl li:not(:last-child)::before{content:"";position:absolute;left:10px;top:24px;bottom:2px;width:2px;background:var(--line)} .v3-tl li.done:not(:last-child)::before{background:var(--positive)} .v3-tl i{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);background:#fff;flex:none;margin-top:1px;position:relative;z-index:1} .v3-tl li.done i{background:var(--positive);border-color:var(--positive)} .v3-tl li.done i::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)} .v3-tl li.cur i{border-color:var(--brand);box-shadow:0 0 0 5px var(--brand-soft);animation:v3pulse 1.6s infinite} @keyframes v3pulse{0%,100%{box-shadow:0 0 0 4px var(--brand-soft)}50%{box-shadow:0 0 0 8px var(--brand-soft)}} .v3-tl li div{display:flex;flex-direction:column;gap:2px} .v3-tl li:not(.done):not(.cur) b{color:var(--sub);font-weight:600} .v3-tl small{color:var(--sub);font-size:13px} .v3-ready{background:var(--positive-soft);border-radius:var(--r-xl);padding:26px 22px;margin-bottom:12px} .v3-ready-ic{width:64px;height:64px;border-radius:50%;background:var(--positive);color:#fff;display:flex;align-items:center;justify-content:center} .v3-ready h1{font-size:clamp(26px,5vw,36px);margin:14px 0 8px;font-weight:800} .v3-st-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden} .v3-st-row{display:flex;align-items:center;gap:12px;padding:14px 16px;text-decoration:none;border-bottom:1px solid var(--line);background:#fff} .v3-st-row:last-child{border-bottom:0} .v3-st-row:hover{background:var(--bg)} .v3-st-row>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column} .v3-st-row b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .v3-st-row small{color:var(--sub);font-size:13px} .v3-st-row>svg{color:var(--sub);flex:none} .v3-st-dot{width:12px;height:12px;border-radius:50%;background:var(--line);flex:none} .v3-st-dot.on{background:var(--brand);box-shadow:0 0 0 4px var(--brand-soft)} .v3-st-img{width:44px;height:44px;object-fit:contain;background:var(--bg);border-radius:var(--r-sm);flex:none} .v3-st-item{font-size:14px;margin:4px 0} /* Konto */ .v3-konto-box{margin-bottom:14px} .v3-konto-active{display:flex;align-items:center;gap:12px;text-decoration:none;margin-bottom:12px} .v3-konto-active>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column} .v3-konto-active small{color:var(--sub);font-size:12.5px} .v3-back{display:grid;gap:10px;padding-top:18px} @media(min-width:760px){.v3-back{grid-template-columns:1fr 1fr}} .v3-back .v3-konto-active{margin:0} .v3-menu-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;margin-bottom:14px} .v3-menu-list>a,.v3-menu-list>div{display:flex;align-items:center;gap:14px;padding:15px 16px;text-decoration:none;border-bottom:1px solid var(--line);font-weight:600;background:#fff} .v3-menu-list>*:last-child{border-bottom:0} .v3-menu-list>a:hover{background:var(--bg)} .v3-menu-list span{flex:1} .v3-menu-list>a>svg:first-child,.v3-menu-list>div>svg:first-child{color:var(--brand-strong)} .v3-menu-list>a>svg:last-child{color:var(--sub)} .v3-menu-list em{font-style:normal;color:var(--sub);font-weight:500} /* Suche */ .v3-search--big{padding:2px 18px} .v3-search--big input{font-size:16px;padding:13px 0} .v3-search{position:relative} .v3-sugg{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#fff;border-radius:var(--r-lg);box-shadow:var(--sh-2);z-index:60;max-height:70vh;overflow:auto;padding:8px 0;color:var(--ink)} .v3-sugg-g{padding:4px 0} .v3-sugg h5{margin:6px 16px 4px;font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--sub)} .v3-sugg a{display:flex;align-items:center;gap:10px;padding:8px 16px;text-decoration:none} .v3-sugg a:hover{background:var(--bg)} .v3-sugg img,.v3-sugg-ic{width:36px;height:36px;border-radius:var(--r-sm);object-fit:contain;background:var(--bg);flex:none} .v3-sugg span:not(.v3-sugg-ic){display:flex;flex-direction:column;min-width:0} .v3-sugg b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .v3-sugg small{font-size:12.5px;color:var(--sub)} .v3-sugg-all{font-weight:700;color:var(--brand-strong)!important;border-top:1px solid var(--line);margin-top:4px;padding-top:12px!important} .v3-sugg-empty{padding:12px 16px;color:var(--sub);font-size:14px} .v3-suche-ctx{margin:0 0 16px} /* Info / Rechtstexte */ .v3-info-wrap{padding-top:18px;padding-bottom:40px;max-width:820px} .v3-info-nav{display:flex;gap:6px;overflow-x:auto;margin-bottom:18px;scrollbar-width:none} .v3-info-nav a{flex:none;text-decoration:none;font-weight:700;font-size:14px;padding:8px 14px;border-radius:var(--r-pill);background:var(--bg)} .v3-info-nav a.on{background:var(--ink);color:#fff} .v3-prose{font-size:15px;line-height:1.7;color:#33414a} .v3-prose h2{font-size:19px;margin:28px 0 8px;color:var(--ink)} .v3-prose h3,.v3-prose h4{font-size:16px;margin:20px 0 6px;color:var(--ink)} .v3-prose a{color:var(--brand-strong)} .v3-prose ul{padding-left:20px} .v3-prose .v3-lead{font-size:17px;font-weight:600;color:var(--ink);line-height:1.5} .v3-info-legal{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:36px;padding-top:18px;border-top:1px solid var(--line)} .v3-info-legal a{font-size:13px;color:var(--lf-sub,#70777a);text-decoration:underline;text-underline-offset:2px} .v3-info-legal a.on{color:var(--ink);font-weight:700} .v3-faq{border:1px solid var(--line);border-radius:var(--r-md);margin:8px 0;background:#fff} .v3-faq summary{cursor:pointer;padding:14px 16px;font-weight:700;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:10px} .v3-faq summary::after{content:"+";font-size:20px;line-height:1;color:var(--sub)} .v3-faq[open] summary::after{content:"–"} .v3-faq div{padding:0 16px 14px} /* Skeleton Loading */ .v3-skel{background:linear-gradient(90deg,var(--bg) 25%,#e7ecf0 37%,var(--bg) 63%);background-size:400% 100%;animation:v3skel 1.3s ease infinite;border-radius:var(--r-md)} .v3-skel--h{height:22px;width:40%;margin-bottom:14px} .v3-skel--row{height:72px;margin-bottom:10px} @keyframes v3skel{0%{background-position:100% 50%}100%{background-position:0 50%}} .v3-map{background:linear-gradient(90deg,var(--bg) 25%,#e7ecf0 37%,var(--bg) 63%);background-size:400% 100%;animation:v3skel 1.3s ease infinite} .v3-map.leaflet-container{animation:none;background:#e9eef2} .v3-kasse-grid>*,.v3-review,.v3-rv,.v3-rv-b{min-width:0} .v3-rv{padding:14px} @media(max-width:480px){.v3-rv{gap:10px}.v3-rv-n{width:28px;height:28px;font-size:12px}.v3-erhalt{grid-template-columns:1fr}} body.v3-intake .v3-cartbar,body.v3-review .v3-cartbar,body.v3-auth .v3-cartbar{display:none!important} .v3-pay-secure{display:flex;gap:6px;align-items:center;color:var(--positive);font-weight:600;font-size:14px;margin:0 0 14px} .v3-konto-card{display:inline-block;margin-top:12px} .v3-konto-docs{margin-top:14px} .v3-upload{margin-top:16px;border-top:1px solid var(--line);padding-top:14px} .v3-mb{margin-bottom:22px} .v3-pd-h1{display:flex;align-items:flex-start;gap:8px;justify-content:space-between} .v3-area{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:600;background:#fff;border:0;border-radius:var(--r-pill);padding:9px 16px;font-weight:700;font-size:13.5px;box-shadow:var(--sh-2);cursor:pointer;font-family:inherit;color:var(--ink)} .v3-area[hidden]{display:none} /* ═══════════════════════════════════════════════════════════════════════════════════════════════ Lieferando-Skin (03.10.2026) — 1:1 nach den Screenshots in G:\Meine Ablage\claude\Lieferando, Farbe Blau statt Orange. Fehlende Bilder/Logos/Videos = graue Platzhalter-Boxen (.v3-phbox). ═══════════════════════════════════════════════════════════════════════════════════════════════ */ :root{--lf-bg:#f5f3f1;--lf-bg2:#faf9f8;--lf-ink:#242e30;--lf-grey:#6b7275;--lf-line:#e5e2de;--lf-ph:#e4e6ea;--lf-ph-t:#9aa1a9} body.v3-lf{background:var(--lf-bg2);color:var(--lf-ink);font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif} .v3-lf h1,.v3-lf h2,.v3-lf h3,.v3-lf b{letter-spacing:-.01em} /* Platzhalter-Box (wie WhatsApp-Vorschau "OG IMAGE · ...") */ .v3-phbox{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:var(--lf-ph);color:var(--lf-ph-t);font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;text-align:center;line-height:1.3;padding:4px;overflow:hidden} .v3-phbox span{display:block;max-width:100%} .v3-phbox[hidden]{display:none} /* ── Header (Marktplatz: < · Logo · Standort-Pille · Menue) ── */ .v3-lf .v3h{position:relative;background:#fff;border-bottom:0;box-shadow:0 1px 0 var(--lf-line)} .v3-lf .v3h-in{min-height:76px;gap:10px;padding:10px 16px} .v3h-back{display:flex;color:var(--brand);padding:6px;margin-left:-6px} .v3h-mark{display:flex;flex:none} .v3h-mark img{width:44px;height:44px;object-fit:contain;border-radius:10px} .v3-lf .v3h-loc{flex:1;max-width:none;justify-content:center;background:var(--lf-bg);padding:12px 18px;font-size:16px;font-weight:800;margin:0 4px} .v3-lf .v3h-loc svg{color:var(--brand)} .v3h-burger{position:relative;display:flex;color:var(--lf-ink);padding:6px;margin-right:-6px} .v3h-burger .v3h-badge{top:0;right:0} .v3-lf .v3h--brand{background:#fff} .v3-lf .v3h--brand .v3h-logo img{height:34px} .v3h-btn--txt{color:var(--lf-ink)!important;font-size:16px;font-weight:800;gap:8px} .v3-lf .v3h--brand .v3h-btn{color:var(--lf-ink)} .v3-lf .v3h--brand .v3h-btn span{display:inline} /* Adress-Warnung: dunkle Sprechblase unter der Standort-Pille */ .v3-lf .v3-warn{position:absolute;left:50%;top:calc(100% - 6px);transform:translateX(-50%);bottom:auto;right:auto;width:min(360px,calc(100vw - 32px));background:#2b2b2b;color:#fff;border-radius:12px;padding:16px 44px 16px 18px;box-shadow:var(--sh-2);font-size:16px;line-height:1.4;z-index:120;gap:2px} .v3-lf .v3-warn::before{content:"";position:absolute;top:-8px;left:50%;margin-left:-8px;border:8px solid transparent;border-top:0;border-bottom-color:#2b2b2b} .v3-lf .v3-warn b{font-size:17px} .v3-warn-x{position:absolute;top:12px;right:12px;border:0;background:transparent;color:#fff;display:flex;cursor:pointer} .v3-warn-a{color:#fff!important;margin-top:6px;align-self:flex-start} .v3-lf .v3-warn[hidden]{display:none} /* ── Landing (ohne Standort) ── */ .lf-hero{background:var(--lf-bg)} .lf-hero-in{max-width:760px;margin:0 auto;padding:42px 24px 54px} .lf-hero h1{font-size:clamp(34px,8vw,52px);line-height:1.08;font-weight:900;margin:0 0 18px} .lf-hero h2{font-size:clamp(24px,5.5vw,34px);line-height:1.15;font-weight:900;margin:0 0 26px} .lf-addr{display:flex;align-items:center;background:#fff;border:1.5px solid var(--lf-grey);border-radius:999px;padding:6px 6px 6px 22px;gap:6px} .lf-addr input{flex:1;min-width:0;border:0;outline:0;font-size:18px;padding:12px 0;background:transparent;font-family:inherit;color:var(--lf-ink)} .lf-addr-x{border:0;background:transparent;color:var(--lf-ink);display:flex;padding:6px;cursor:pointer} .lf-addr-x svg{border:2px solid currentColor;border-radius:50%;padding:2px;width:26px;height:26px} .lf-addr-go{border:0;background:var(--brand);color:#fff;font-weight:900;font-size:19px;padding:15px 28px;border-radius:999px;cursor:pointer;font-family:inherit} .lf-addr-go:hover{background:var(--brand-strong)} .lf-hero-geo{display:inline-flex;align-items:center;gap:8px;border:0;background:transparent;color:var(--lf-ink);font-weight:700;font-size:15px;margin:16px 0 0;padding:4px 0;cursor:pointer;text-decoration:underline;text-underline-offset:3px;font-family:inherit} .lf-hero-geo svg{color:var(--brand)} .lf-hero-stats{margin:14px 0 0;color:var(--lf-grey);font-size:15px} .lf-hero-stats b{color:var(--lf-ink)} .lf-band{background:var(--brand);clip-path:polygon(0 9%,100% 0,100% 100%,0 100%);margin-top:-1px;padding:60px 24px 44px} .lf-band-in{max-width:760px;margin:0 auto} .lf-band-media{aspect-ratio:16/9;border-radius:16px;background:rgba(255,255,255,.28);color:rgba(255,255,255,.85)} /* ── Kopfbereich Marktplatz: Segment · Suche · Icons ── */ .lf-top{position:sticky;top:0;z-index:60;background:#fff} .lf-top-in{max-width:var(--max);margin:0 auto;padding:14px 16px 6px} .lf-seg{display:flex;background:var(--lf-bg);border-radius:999px;padding:4px;margin-bottom:14px} .lf-seg a{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;padding:13px 10px;border-radius:999px;text-decoration:none;font-size:18px;color:var(--lf-ink);font-weight:500} .lf-seg a svg{color:var(--lf-ink)} .lf-seg a.on{background:#fff;font-weight:800;box-shadow:0 2px 6px rgba(0,0,0,.12)} .lf-seg a.on svg{color:var(--brand)} .lf-searchrow{display:flex;align-items:center;gap:8px;padding-bottom:8px} .lf-search{flex:1;display:flex;align-items:center;gap:14px;background:var(--lf-bg);border-radius:999px;padding:0 22px;height:58px;position:relative} .lf-search svg{color:var(--brand);flex:none} .lf-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:18px;font-family:inherit;color:var(--lf-ink)} .lf-search input::placeholder{color:var(--lf-grey)} .lf-ibtn{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;background:transparent;color:var(--lf-ink);cursor:pointer;text-decoration:none;padding:0} .lf-ibtn--filter{display:none} .lf-ibtn b{position:absolute;top:2px;right:0;background:var(--brand);color:#fff;font-size:11px;min-width:18px;height:18px;border-radius:9px;display:flex;align-items:center;justify-content:center} body.v3-s1 .lf-ibtn--filter{display:flex} body.v3-s1 .lf-top{box-shadow:0 2px 8px rgba(0,0,0,.08)} /* Kategorie-Rail (freigestellte Bilder -> graue Boxen, graue Labels) */ .lf-cats{display:flex;gap:16px;overflow-x:auto;padding:6px 16px 14px;background:#fff;scrollbar-width:none;max-width:100%} .lf-cats::-webkit-scrollbar{display:none} .lf-cat{flex:none;width:104px;display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none;color:var(--lf-grey);font-size:16px} .lf-cat .v3-phbox{width:104px;height:80px;border-radius:12px} .lf-cat.on{color:var(--lf-ink);font-weight:800} .lf-cat span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%} /* "Finde deine Sorte" (Find your flavour): Blob-Kacheln, gewaehlt = dunkler Haken */ .lf-flavour{background:var(--lf-bg2);padding:14px 0 18px} .lf-flavour-h{display:flex;justify-content:space-between;align-items:baseline;padding:0 16px 12px;max-width:var(--max);margin:0 auto} .lf-flavour-h h2{font-size:19px;font-weight:900;margin:0} .lf-flavour-h a{font-weight:700;font-size:17px;text-decoration:underline;text-underline-offset:3px;color:var(--lf-ink)} .lf-flavour-rail{display:flex;gap:16px;overflow-x:auto;padding:0 16px;scrollbar-width:none} .lf-flavour-rail::-webkit-scrollbar{display:none} .lf-fl{flex:none;width:118px;display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none;color:var(--lf-grey);font-size:16px;text-align:center} .lf-fl-img{position:relative;width:118px;height:88px} .lf-fl-img .v3-phbox{border-radius:30px} .lf-fl-check{position:absolute;right:-6px;bottom:-6px;width:36px;height:36px;border-radius:50%;background:var(--lf-ink);color:#fff;display:flex;align-items:center;justify-content:center;border:2px solid var(--lf-bg2)} .lf-fl.on{color:var(--lf-ink);font-weight:800} /* Filterleiste: rundes Regler-Icon + Chips + Herz, Scroll-Indikator */ .lf-filterrow{background:#fff;box-shadow:0 6px 10px -8px rgba(0,0,0,.18);padding:14px 0 10px;position:relative} .lf-filterrow-in{display:flex;gap:12px;overflow-x:auto;padding:0 16px;scrollbar-width:none;max-width:var(--max);margin:0 auto} .lf-filterrow-in::-webkit-scrollbar{display:none} .lf-fchip{flex:none;display:inline-flex;align-items:center;gap:8px;height:50px;padding:0 20px;border:1.5px solid var(--lf-line);border-radius:999px;background:#fff;color:var(--lf-ink);font-weight:800;font-size:17px;text-decoration:none;cursor:pointer;font-family:inherit;white-space:nowrap} .lf-fchip svg{color:var(--lf-ink)} .lf-fchip.on{background:var(--lf-ink);border-color:var(--lf-ink);color:#fff} .lf-fchip.on svg{color:#fff} .lf-fchip--ic{width:50px;padding:0;justify-content:center;border-radius:50%} .lf-fchip--heart{background:var(--lf-bg);border-color:var(--lf-bg);color:#a39e98} .lf-fchip--heart svg{color:#a39e98;fill:#a39e98} .lf-scrollbar{height:4px;margin:12px 16px 0;background:transparent;max-width:var(--max)} .lf-scrollbar i{display:block;width:120px;height:4px;border-radius:2px;background:#cfccc8} /* ── Ergebnisse ── */ .lf-main{max-width:var(--max);margin:0 auto;padding:6px 0 30px} .lf-sortline{display:flex;justify-content:flex-end;padding:18px 16px 4px} .lf-howsort summary{cursor:pointer;font-size:15px;text-decoration:underline;text-underline-offset:3px;list-style:none;color:var(--lf-ink)} .lf-howsort summary::-webkit-details-marker{display:none} .lf-howsort p{font-size:14px;color:var(--lf-grey);max-width:560px;margin:8px 0 0} .lf-reshead{padding:18px 16px 4px} .lf-reshead h1{font-size:clamp(26px,6vw,32px);font-weight:900;margin:0;line-height:1.2} .lf-reset{display:inline-block;margin-top:8px;font-size:19px;color:var(--lf-ink);text-decoration:underline;text-underline-offset:3px} .lf-sec{padding:26px 0 6px} .lf-sec-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:0 16px 14px} .lf-sec-h h2{font-size:clamp(22px,5vw,26px);font-weight:900;margin:0} .lf-sec-h a{font-weight:700;font-size:16px;color:var(--lf-ink);text-decoration:underline;text-underline-offset:3px;white-space:nowrap} .lf-big{font-size:clamp(26px,6vw,32px);font-weight:900;margin:0 16px 18px;line-height:1.2} .lf-rail{display:flex;gap:16px;overflow-x:auto;padding:4px 16px 14px;scroll-snap-type:x proximity;scrollbar-width:none;scroll-padding-inline:16px} .lf-rail::-webkit-scrollbar{display:none} .lf-rail>*{flex:none;scroll-snap-align:start} .lf-list{display:grid;gap:30px;padding:0 16px} @media(min-width:760px){.lf-list{grid-template-columns:1fr 1fr}} @media(min-width:1180px){.lf-list{grid-template-columns:1fr 1fr 1fr}} .lf-more{display:block;margin:26px 16px 0;text-align:center;border:1.5px solid var(--lf-line);background:#fff;border-radius:999px;padding:15px;font-weight:800;font-size:17px;text-decoration:none;color:var(--lf-ink)} /* Apotheken-Karte (Restaurant-Karte) */ .lf-card{position:relative;display:flex;flex-direction:column;color:var(--lf-ink)} .lf-card-link{position:absolute;inset:0;z-index:1} .lf-card-status{background:#ece9e5;border-radius:18px 18px 0 0;text-align:center;font-size:17px;padding:11px 12px 9px;color:var(--lf-ink)} .lf-card-img{position:relative;aspect-ratio:2/1;border-radius:18px;overflow:hidden} .lf-card-status+.lf-card-img{border-radius:0 0 18px 18px} .lf-card-img>.v3-phbox{border-radius:0} .lf-card-logo{position:absolute;left:14px;bottom:14px;width:76px;height:76px;border-radius:12px;background:#fff;padding:6px;box-shadow:0 1px 4px rgba(0,0,0,.12);z-index:2} .lf-card-logo .v3-phbox{border-radius:6px;font-size:10px} .lf-card-pill{position:absolute;right:12px;bottom:12px;display:flex;align-items:center;gap:5px;background:#ffe9a8;color:var(--lf-ink);font-weight:700;font-size:15px;padding:6px 12px;border-radius:999px;z-index:2} .lf-card-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px} .lf-card-top b{font-size:21px;font-weight:900;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .lf-card-top .v3-fav{color:var(--lf-ink)} .lf-card-meta{font-size:17px;color:var(--lf-ink);margin-top:5px;line-height:1.35} .lf-card-svc{display:flex;gap:14px;color:#a39e98;font-size:15px;font-weight:600} .lf-card-svc span{display:inline-flex;align-items:center;gap:5px} .lf-card-svc span.on{color:var(--lf-ink)} .lf-card-svc span.on svg{color:var(--brand)} .lf-card--rail{width:min(78vw,340px)} .lf-card--rail .lf-card-top b{font-size:19px} .lf-card--rail .lf-card-meta{font-size:15.5px} /* Produkt-Karte (wie "Beliebt"-Karte im Restaurant) */ .lf-pcard{position:relative;width:min(84vw,330px);display:flex;gap:14px;background:#fff;border-radius:18px;padding:16px;box-shadow:0 2px 10px rgba(0,0,0,.08);text-decoration:none;color:var(--lf-ink)} .lf-pcard-img{flex:none;width:96px;height:96px;border-radius:14px;overflow:hidden;background:var(--lf-ph)} .lf-pcard-img img{width:100%;height:100%;object-fit:cover} .lf-pcard-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;padding-right:34px} .lf-pcard-b small{font-size:13.5px;color:var(--lf-grey)} .lf-pcard-b b{font-size:17px;font-weight:900;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} .lf-pcard-p{font-size:17px;font-weight:700;margin-top:4px} .lf-pcard-av{color:var(--positive)!important;font-weight:600} .lf-plus{position:absolute;top:12px;right:12px;width:42px;height:42px;border-radius:50%;background:#fff;border:1px solid var(--lf-line);color:var(--brand);display:flex;align-items:center;justify-content:center;box-shadow:0 1px 4px rgba(0,0,0,.1);cursor:pointer;z-index:2} .lf-pgrid{display:grid;gap:14px;padding:0 16px;grid-template-columns:1fr} @media(min-width:700px){.lf-pgrid{grid-template-columns:1fr 1fr}} @media(min-width:1100px){.lf-pgrid{grid-template-columns:1fr 1fr 1fr}} .lf-pcard--grid{width:auto} /* Marken + Zeilen */ .lf-brand{width:150px;display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--lf-ink)} .lf-brand .v3-phbox{width:150px;height:110px;border-radius:16px} .lf-brand b{font-size:16px;font-weight:800} .lf-brand small{font-size:13px;color:var(--lf-grey)} .lf-list--rows{display:flex;flex-direction:column;gap:0;background:#fff;border-radius:18px;margin:0 16px;padding:0;overflow:hidden;border:1px solid var(--lf-line)} .lf-row{display:flex;align-items:center;gap:14px;padding:14px 16px;border-bottom:1px solid var(--lf-line);text-decoration:none;color:var(--lf-ink)} .lf-row:last-child{border-bottom:0} .lf-row-logo{flex:none;width:52px!important;height:52px!important;border-radius:10px} .lf-row>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column} .lf-row b{font-size:17px;font-weight:800} .lf-row small{color:var(--lf-grey);font-size:14px} .lf-row.on{background:var(--brand-soft)} /* Ablauf (erst unten) */ .lf-medex ol{list-style:none;margin:0 16px;padding:0;display:grid;gap:12px;counter-reset:s} @media(min-width:760px){.lf-medex ol{grid-template-columns:repeat(4,1fr)}} .lf-medex li{background:#fff;border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:4px;counter-increment:s} .lf-medex li::before{content:counter(s);width:34px;height:34px;border-radius:50%;background:var(--brand);color:#fff;font-weight:900;display:flex;align-items:center;justify-content:center;margin-bottom:6px} .lf-medex li b{font-size:18px;font-weight:900} .lf-medex li span{color:var(--lf-grey);font-size:15px} .lf-medex .v3-sub{margin:14px 16px 0} /* ── Karte: Vollflaeche, "Zurueck zur Uebersicht", weisse Cluster ── */ .lf-map{margin:0} .lf-map .v3-map{height:calc(100svh - 120px);min-height:460px;border-radius:0} .v3-view-karte .lf-main{max-width:none;padding:0} .v3-view-karte .lf-sortline,.v3-view-karte .lf-reshead{display:none} .lf-mapback{position:absolute;top:18px;left:50%;transform:translateX(-50%);z-index:600;background:var(--lf-ink);color:#fff;text-decoration:none;font-weight:800;font-size:17px;padding:12px 22px;border-radius:999px;box-shadow:var(--sh-2);white-space:nowrap} .v3-cluster{width:64px;height:64px;border-radius:50%;background:#fff;color:var(--brand);font-weight:900;font-size:24px;display:flex;align-items:center;justify-content:center;border:0;box-shadow:0 2px 12px rgba(0,0,0,.18)} .v3-mpin{background:#fff;border:0;color:var(--brand);font-weight:900;box-shadow:0 2px 10px rgba(0,0,0,.2)} .v3-mpin::after{border-top-color:#fff} .v3-mpin.on{background:var(--brand);color:#fff} .v3-mpin.on::after{border-top-color:var(--brand)} .lf-map .v3-mapsheet{bottom:16px} .lf-map .v3-ms-track{padding:0 16px;gap:12px} .lf-card--map{flex:none;width:min(86vw,380px);scroll-snap-align:center;background:#fff;border-radius:20px;box-shadow:var(--sh-2);padding:0 0 14px;text-decoration:none;overflow:hidden;display:flex;flex-direction:column} .lf-card--map .lf-card-status{border-radius:0} .lf-card--map .lf-card-img{border-radius:0;aspect-ratio:2.4/1} .lf-card--map .lf-card-top,.lf-card--map .lf-card-meta{padding:0 18px} .lf-card--map .lf-card-logo{width:64px;height:64px} /* ── Vollbild-Sheets (Filter, Standort, Kategorien, Info) ── */ .v3-sheet--full{align-items:stretch;justify-content:stretch} .v3-sheet--full .v3-sheet-card{max-width:none;width:100%;height:100%;max-height:none;border-radius:0;padding:24px 22px;animation:v3up .18s ease} @media(min-width:760px){.v3-sheet--full{align-items:center;justify-content:center}.v3-sheet--full .v3-sheet-card{max-width:560px;height:auto;max-height:92vh;border-radius:22px}} .v3-sheet--full .v3-sheet-head{margin-bottom:22px} .v3-sheet--full .v3-sheet-head b{font-size:30px;font-weight:900} .v3-sheet--full .v3-sheet-head button{background:transparent;width:44px;height:44px} .v3-sheet--full .v3-fsheet{padding:0;display:flex;flex-direction:column} .v3-sheet--full .v3-fsheet .v3-sheet-head{padding:24px 22px 10px;margin:0;border:0} .v3-sheet--full .v3-fsheet-body{padding:0 22px 20px} .lf-fl-legend{font-size:19px;font-weight:900;margin:0 0 12px;padding:0} .v3-fsheet fieldset{border:0;padding:16px 0 10px;margin:0;border-bottom:0} .lf-select{position:relative} .lf-select select{width:100%;appearance:none;-webkit-appearance:none;font-family:inherit;font-size:18px;color:var(--lf-ink);padding:16px 50px 16px 18px;border:1.5px solid #8f8a85;border-radius:14px;background:#fff} .lf-select svg{position:absolute;right:16px;top:50%;transform:translateY(-50%) rotate(90deg);pointer-events:none} .lf-tog{display:flex;justify-content:space-between;align-items:center;padding:16px 0;cursor:pointer} .lf-tog b{font-size:19px;font-weight:900} .lf-tog input{position:absolute;opacity:0} .lf-tog i{width:64px;height:38px;border-radius:19px;background:#8f8a85;position:relative;transition:background .15s;flex:none} .lf-tog i::after{content:"";position:absolute;top:4px;left:4px;width:30px;height:30px;border-radius:50%;background:#fff;transition:left .15s} .lf-tog input:checked+i{background:var(--brand)} .lf-tog input:checked+i::after{left:30px} .lf-cb{display:flex;align-items:center;gap:16px;padding:9px 0;font-size:18px;cursor:pointer} .lf-cb input{position:absolute;opacity:0} .lf-cb i{width:32px;height:32px;border:1.5px solid #6b6661;border-radius:6px;flex:none;position:relative;background:#fff} .lf-cb input:checked+i{background:var(--lf-ink);border-color:var(--lf-ink)} .lf-cb input:checked+i::after{content:"";position:absolute;left:10px;top:4px;width:8px;height:16px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)} .lf-cb.is-off{opacity:.4} .v3-sheet--full .v3-fsheet-foot{border-top:0;box-shadow:0 -6px 12px -10px rgba(0,0,0,.3);padding:16px 22px calc(16px + env(safe-area-inset-bottom))} .lf-resbtn{width:100%;border:1.5px solid var(--lf-line);background:#fff;color:var(--lf-ink);border-radius:999px;padding:18px;font-weight:900;font-size:22px;cursor:pointer;font-family:inherit} /* Standort-Sheet */ .v3-locform input{width:100%;font-size:19px;font-family:inherit;padding:18px 20px;border:1.5px solid #8f8a85;border-radius:16px;outline:none;color:var(--lf-ink)} .v3-locform input:focus{border-color:var(--brand)} .v3-locrow{display:flex;align-items:center;gap:20px;width:100%;border:0;background:transparent;text-align:left;padding:22px 4px;cursor:pointer;font-family:inherit;color:var(--lf-ink)} .v3-locrow span{display:flex;flex-direction:column;gap:4px} .v3-locrow b{font-size:19px;font-weight:500} .v3-locrow small{font-size:16px;color:var(--lf-grey)} .v3-lf .v3-recent,.v3-sheet--full .v3-recent{border-top:0;margin-top:14px;padding-top:0} .v3-recent-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px} .v3-recent-h h4{font-size:19px;font-weight:900;color:var(--lf-ink);margin:0} .v3-recent-edit{border:0;background:transparent;font-size:17px;color:var(--lf-ink);cursor:pointer;font-family:inherit} .v3-recent-i{display:flex;align-items:center} .v3-recent-i a{flex:1;display:flex;align-items:center;gap:20px;padding:18px 4px;text-decoration:none;color:var(--lf-ink)} .v3-recent-i a>svg{color:var(--lf-ink);flex:none} .v3-recent-i.on a>svg{color:var(--brand)} .v3-recent-i span{flex:1;display:flex;flex-direction:column;gap:4px} .v3-recent-i b{font-size:19px;font-weight:700} .v3-recent-i small{font-size:16px;color:var(--lf-grey)} .v3-recent-i em{font-style:normal;background:#ece9e5;border-radius:999px;padding:5px 12px;font-size:15px;color:var(--lf-ink)} .v3-recent-del{border:0;background:var(--lf-bg);width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer} /* ── Account (Mein Account) ── */ .v3-konto .lf-acc-head{display:flex;justify-content:space-between;align-items:center;margin:8px 0 22px} .lf-acc-head h1{font-size:32px;font-weight:900;margin:0} .lf-acc-x{display:flex;color:var(--lf-ink)} .lf-acc-box{position:relative;background:#d6defb;border-radius:22px;padding:24px;display:grid;grid-template-columns:1fr 92px;gap:10px;margin-bottom:22px} .lf-acc-box h2{font-size:26px;font-weight:900;line-height:1.2;margin:0 0 12px} .lf-acc-box ul{margin:0 0 6px;padding-left:22px;font-size:17px;line-height:1.7} .lf-acc-ill{width:92px!important;height:92px!important;border-radius:16px;background:rgba(255,255,255,.55)!important} .lf-acc-btn{grid-column:1/-1;display:block;text-align:center;background:var(--brand);color:#fff;font-weight:900;font-size:21px;padding:18px;border-radius:999px;text-decoration:none;margin-top:6px} .lf-acc-hi{font-size:20px;font-weight:800;margin:0 0 16px} .lf-acc-list{display:flex;flex-direction:column;margin-bottom:8px} .lf-acc-list>a,.lf-acc-list>div,.lf-acc-list>button{display:flex;align-items:center;gap:26px;padding:20px 4px;text-decoration:none;color:var(--lf-ink);font-size:19px;border:0;background:transparent;text-align:left;width:100%;font-family:inherit;cursor:pointer} .lf-acc-list span{flex:1} .lf-acc-list em{font-style:normal;color:var(--lf-grey);font-size:17px} .lf-acc-list--meta{border-top:1px solid var(--lf-line);padding-top:8px} /* ── Apotheke (Restaurant-Seite / Speisekarte) ── */ .lf-store{max-width:960px;margin:0 auto;padding:16px 0 40px} .lf-store-hero{position:relative;aspect-ratio:2.1/1;border-radius:20px;overflow:hidden;margin:0 16px} .lf-store-hero>.v3-phbox{border-radius:0} .lf-store-logo{position:absolute;left:16px;bottom:16px;width:120px;height:110px;background:#fff;border-radius:14px;padding:8px;box-shadow:0 1px 4px rgba(0,0,0,.12)} .lf-store-logo .v3-phbox{border-radius:8px} .lf-store-pill{position:absolute;right:16px;bottom:16px;display:flex;align-items:center;gap:8px;background:#fff;border-radius:999px;padding:10px 18px;font-weight:800;font-size:17px;box-shadow:0 1px 4px rgba(0,0,0,.12)} .lf-store-pill svg{color:var(--brand)} .lf-store-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:22px 16px 6px} .lf-store-head h1{font-size:clamp(30px,7vw,40px);font-weight:900;margin:0;line-height:1.1} .lf-store-acts{display:flex;gap:10px;flex:none} .lf-round{width:56px;height:56px;border-radius:50%;border:0;background:var(--lf-bg);display:flex;align-items:center;justify-content:center;color:var(--lf-ink);cursor:pointer} .lf-round--sm{width:52px;height:52px;flex:none} .lf-pillbtn{display:flex;align-items:center;gap:10px;border:0;background:var(--lf-bg);border-radius:999px;padding:0 20px;height:56px;font-weight:800;font-size:17px;color:var(--lf-ink);cursor:pointer;font-family:inherit} .lf-store-meta{padding:4px 16px 14px;display:flex;flex-direction:column;gap:8px;font-size:17px} .lf-store-meta div{display:flex;gap:10px;align-items:flex-start} .lf-store-meta svg{flex:none;margin-top:2px;color:var(--lf-grey)} .lf-seg--store{margin:6px 16px 18px} .lf-seg--store a{flex-direction:row;gap:14px;padding:12px} .lf-seg--store a span{display:flex;flex-direction:column;align-items:center;line-height:1.25} .lf-seg--store a b{font-size:18px} .lf-seg--store a small{font-size:15px;color:var(--lf-grey);font-weight:500} .lf-seg--store a.off{opacity:.55} .lf-storebar{position:sticky;top:0;z-index:40;background:#fff;padding:14px 16px 12px;box-shadow:0 6px 10px -8px rgba(0,0,0,.2)} .lf-ssearch{display:flex;align-items:center;gap:14px;border:1.5px solid #8f8a85;border-radius:999px;padding:0 22px;height:60px;background:#fff;cursor:text} .lf-ssearch svg{color:var(--brand);flex:none} .lf-ssearch input{flex:1;min-width:0;border:0;outline:0;font-size:18px;font-family:inherit;background:transparent} .lf-tabs{display:flex;align-items:center;gap:8px;margin-top:14px} .lf-tabs .v3-tabs-in{flex:1;padding:0} .lf-tabs .v3-tabs-in a{font-size:18px;font-weight:800;padding:12px 18px;color:var(--lf-ink)} .lf-tabs .v3-tabs-in a.on{background:var(--lf-ink);color:#fff} .lf-msec{padding:30px 0 0;scroll-margin-top:170px} .lf-msec>h2{font-size:clamp(28px,6vw,34px);font-weight:900;margin:0;padding:0 16px 18px;border-bottom:1px solid var(--lf-line)} .lf-msec .v3-mbrand h3{margin:22px 16px 0;padding:0 0 10px;font-size:15px;text-transform:uppercase;letter-spacing:.04em;color:var(--lf-grey);border-bottom:0} .lf-item{position:relative;display:flex;gap:14px;justify-content:space-between;padding:20px 16px;border-bottom:1px solid var(--lf-line);cursor:pointer;background:transparent;border-radius:0} .lf-item:hover{background:#fff} .lf-item-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px} .lf-item-t{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 14px} .lf-item-t b{font-size:19px;font-weight:900;line-height:1.25} .lf-item-t u,.lf-pop-b u{font-size:16px;color:var(--lf-ink);text-underline-offset:3px} .lf-item-p{font-size:18px;font-weight:700} .lf-item-b p{margin:0;color:var(--lf-grey);font-size:16px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} .lf-item-img{position:relative;flex:none;width:136px;height:116px;border-radius:12px;overflow:visible} .lf-item-img>img,.lf-item-img>.v3-phbox{width:100%;height:100%;border-radius:12px;object-fit:cover} .lf-item-img .lf-plus{top:-10px;right:-10px;width:48px;height:48px} .lf-rail--pop .lf-pop{position:relative;width:min(84vw,360px);display:flex;gap:16px;background:#fff;border-radius:18px;padding:22px 18px;box-shadow:0 2px 10px rgba(0,0,0,.08);cursor:pointer} .lf-pop-img{flex:none;width:110px;height:90px;border-radius:14px;overflow:hidden} .lf-pop-img img{width:100%;height:100%;object-fit:cover} .lf-pop-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px;padding-right:30px} .lf-pop-b small{font-size:15px;color:var(--lf-ink)} .lf-pop-b b{font-size:18px;font-weight:900;line-height:1.25} .lf-pop-b span{font-size:18px;font-weight:700;margin-top:4px} .lf-catlist{display:flex;flex-direction:column} .lf-catlist a{display:flex;justify-content:space-between;padding:18px 4px;border-bottom:1px solid var(--lf-line);font-size:19px;font-weight:800;text-decoration:none;color:var(--lf-ink)} .lf-catlist small{color:var(--lf-grey);font-weight:500} /* Geschlossen-/Intercept-Modal */ .lf-modal{align-items:center} .lf-modal .v3-sheet-card{max-width:420px;border-radius:22px;padding:30px 26px 22px;margin:0 16px} .lf-modal h3{font-size:26px;font-weight:900;margin:0 40px 14px 0;line-height:1.25} .lf-modal p{font-size:18px;color:var(--lf-ink);margin:0 0 22px;line-height:1.5} .lf-modal-x{position:absolute;top:18px;right:18px;width:48px;height:48px;border-radius:50%;border:2px solid var(--lf-ink);background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer} .lf-modal-alt{display:block;text-align:center;font-weight:900;font-size:20px;color:var(--lf-ink);text-decoration:none;margin-top:18px} /* Nach oben */ .lf-totop{position:fixed;right:16px;bottom:120px;z-index:65;width:62px;height:62px;border-radius:50%;border:0;background:#fff;box-shadow:0 2px 14px rgba(0,0,0,.18);color:var(--brand);display:flex;align-items:center;justify-content:center;cursor:pointer} .lf-totop svg{transform:rotate(90deg)} .lf-totop[hidden]{display:none} @media(min-width:960px){.lf-totop{bottom:70px}} /* Produkt-Sheet: Platzhalter */ .v3-isheet-img .v3-phbox{height:100%} .v3-isheet-img img[hidden]{display:none} .v3-pd-img .v3-phbox{border-radius:var(--r-xl)} .v3-lf .v3-pd-img{background:var(--lf-ph)} .lf-map .v3-area{top:76px} .lf-list>*,.lf-card,.lf-card-top{min-width:0} .lf-card-top b{min-width:0} .v3-fsheet .lf-fl-legend{font-size:19px;font-weight:900;margin:0 0 12px} .v3-locform input::-webkit-calendar-picker-indicator,.lf-addr input::-webkit-calendar-picker-indicator{display:none!important;opacity:0} .v3-lf .v3-pd>.v3-crumb{display:none} @media(min-width:960px){.v3-lf .v3h-loc{flex:0 1 520px;margin:0 auto}.lf-store-hero{aspect-ratio:3.2/1}.lf-card--rail{width:360px}} .lf-rating{font-weight:700;color:var(--lf-ink)}.lf-rating small{font-weight:500;color:var(--lf-grey)} .lf-card-svc .lf-open{color:var(--positive)!important}.lf-card-svc .lf-open svg{color:var(--positive)!important}.lf-card-svc .lf-closed{color:var(--critical)} .lf-store-meta .lf-open{color:var(--positive);font-weight:700}.lf-store-meta .lf-open svg{color:var(--positive)}.lf-store-meta .lf-closed{color:var(--critical);font-weight:700}.lf-store-meta .lf-closed svg{color:var(--critical)} .lf-store-rating{font-size:18px} .lf-hours{display:flex;flex-direction:column;gap:3px}.lf-hours span{display:flex;justify-content:space-between;gap:12px}.lf-hours b{font-weight:600}.lf-hours em{font-style:normal;text-align:right}.lf-hours small{margin-top:6px;font-weight:700}.lf-hours small.lf-open{color:var(--positive)}.lf-hours small.lf-closed{color:var(--critical)} /* ═══ Lieferando 1:1 Feinschliff (03.10.) ═══ */ body.v3-lf{font-family:"Nunito",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;padding-bottom:0} body.v3-lf input,body.v3-lf button,body.v3-lf select,body.v3-lf textarea{font-family:inherit} .v3-lf h1,.v3-lf h2,.lf-big,.lf-sec-h h2,.lf-card-top b{font-weight:900;letter-spacing:-.005em} .lf-card-meta{color:var(--lf-ink);font-size:17px} .lf-card-meta b{font-weight:800} .lf-star{color:var(--lf-ink)} .lf-card-meta--2{color:var(--lf-grey);font-size:16px;margin-top:2px} .v3h-dot{position:absolute;top:4px;right:2px;width:10px;height:10px;border-radius:50%;background:var(--brand);border:2px solid #fff} .lf-feedback{position:fixed;right:0;top:50%;z-index:58;transform:translateY(-50%) rotate(180deg);writing-mode:vertical-rl;background:#fff;border:1px solid var(--lf-line);border-right:0;border-radius:0 18px 18px 0;padding:18px 10px;font-weight:600;font-size:16px;color:var(--lf-ink);text-decoration:none;box-shadow:-2px 0 8px rgba(0,0,0,.06)} .lf-banner{display:grid;grid-template-columns:1fr 42%;gap:12px;align-items:stretch;background:#ffd166;border-radius:0;margin:14px 0 0;padding:22px 16px;text-decoration:none;color:var(--lf-ink);min-height:170px} .lf-banner-t{display:flex;flex-direction:column;gap:8px} .lf-banner-t b{font-size:26px;font-weight:900;font-style:italic;line-height:1.1} .lf-banner-t span{font-size:17px;line-height:1.35} .lf-banner-t em{align-self:flex-start;margin-top:6px;background:var(--lf-ink);color:#fff;font-style:normal;font-weight:800;padding:12px 20px;border-radius:999px;font-size:16px} .lf-banner-img{border-radius:14px;background:rgba(255,255,255,.45)!important;color:#8a6d1f!important} @media(min-width:960px){.lf-banner{margin:14px 16px 0;border-radius:20px}} .v3-cartbar{bottom:calc(16px + env(safe-area-inset-bottom))!important} .lf-totop{bottom:90px} body.v3-has-bar .lf-totop{bottom:150px} .v3-lf .v3f{padding-bottom:24px} body.v3-lf.v3-has-bar .v3f{padding-bottom:90px} /* ═══ 100 % Lieferando: Karte als Vollflaeche, Filter/Zeilen-Feinheiten ═══ */ .lf-seg--hide{display:none} body.v3-view-karte .lf-top{box-shadow:none} body.v3-view-karte .lf-top-in{padding-bottom:0} body.v3-view-karte .lf-searchrow{padding-bottom:12px} .lf-filterrow--map{box-shadow:none;padding-top:0;background:#fff} .lf-filterrow--map .lf-scrollbar{display:none} body.v3-view-karte .lf-map .v3-map{height:calc(100svh - 190px);min-height:480px} body.v3-view-karte .v3f,body.v3-view-karte .lf-feedback{display:none} /* Schalter-Zeilen enger/groesser wie im Filter-Screenshot */ .lf-tog{padding:15px 0} .lf-tog b{font-size:19px} /* Erhalt/Entfernung/Gruppen: Ueberschriften wie Lieferando (fett, 19px, mehr Abstand) */ .v3-fsheet fieldset{padding:20px 0 4px} .lf-fl-legend{font-size:20px;margin-bottom:14px} .lf-cb{padding:11px 0} .lf-cb span{font-size:18px} /* "+"-Kreis sitzt in der Bildecke der Artikelzeile (wie Restaurant-Screenshot) */ .lf-item-img .lf-plus{top:8px;right:8px;width:46px;height:46px} .lf-item-img{overflow:hidden;border-radius:14px} /* Account: Gruppen mit Trennstrich, Eintraege enger */ .lf-acc-list>a,.lf-acc-list>div,.lf-acc-list>button{padding:19px 4px} .lf-acc-list--meta{margin-top:6px} /* Karten-Card: untereinander, volle Breite (alte .v3-ms-card-Regel ueberschreiben) */ .lf-card--map.v3-ms-card{flex-direction:column!important;align-items:stretch!important;gap:0!important;padding:0 0 14px!important;width:min(86vw,380px)} .lf-card--map .lf-card-status{width:100%} .lf-card--map .lf-card-img{width:100%;flex:none} .lf-card--map .lf-card-top{margin-top:12px} .lf-card--map .lf-card-meta{white-space:normal} /* ═══ Adress-Vorschlaege, THC-Fokus, neue Reihen ═══ */ .lf-hero{position:relative;z-index:6}.lf-band{position:relative;z-index:1} .lf-addr-wrap{position:relative} .lf-sugg{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:80;background:#fff;border-radius:20px;box-shadow:0 8px 32px rgba(0,0,0,.22);padding:8px 0;max-height:min(70vh,520px);overflow:auto} .lf-sugg h4{margin:14px 22px 4px;font-size:19px;font-weight:900;color:var(--lf-ink)} .lf-sugg-i{display:flex;align-items:center;gap:18px;padding:14px 22px;cursor:pointer;color:var(--lf-ink)} .lf-sugg-i:hover,.lf-sugg-i.on{background:var(--lf-bg)} .lf-sugg-i>svg{flex:none;color:var(--lf-ink)} .lf-sugg-i>span{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px} .lf-sugg-i b{font-size:18px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .lf-sugg-i small{font-size:15.5px;color:var(--lf-grey);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .lf-sugg-i em{font-style:normal;background:#ece9e5;border-radius:999px;padding:4px 11px;font-size:14.5px;flex:none} .lf-sugg--sheet{position:static;box-shadow:none;border-radius:0;padding:0;max-height:none;margin-top:6px} .lf-sugg--sheet .lf-sugg-i{padding:16px 4px} .v3-sheet-card.is-typing .v3-locrow,.v3-sheet-card.is-typing .v3-recent{display:none} /* THC-Fokus / Kacheln mit Zahlen */ .lf-flavour--thc{padding-top:10px} .lf-fl small{font-size:13px;color:var(--lf-grey);font-weight:500;margin-top:-6px} .lf-fl--num .lf-fl-img{display:flex;align-items:center;justify-content:center;border-radius:30px;color:var(--lf-ink)} .lf-fl-big{display:flex;flex-direction:column;align-items:center;line-height:1} .lf-fl-big b{font-size:26px;font-weight:900;letter-spacing:-.02em} .lf-fl-big em{font-style:normal;font-size:13px;font-weight:700;margin-top:3px;opacity:.75} .lf-fl-big .lf-aroma{font-size:19px} .lf-t-t1{background:var(--brand-soft)}.lf-t-t2{background:#bfe5f5}.lf-t-t3{background:#8fd0ee}.lf-t-t4{background:#4cb4e0;color:#fff} .lf-t-t4 .lf-fl-big{color:#fff} .lf-t-cbd{background:#e5f4e8} .lf-t-a0{background:#fde7d6}.lf-t-a1{background:#e6e3fb}.lf-t-a2{background:#dff3e2}.lf-t-a3{background:#fff0c2}.lf-t-a4{background:#fbdcea} .lf-t-p1{background:#e6f4ea}.lf-t-p2{background:#d7edfa}.lf-t-p3{background:#e6e3fb}.lf-t-p4{background:#fde7d6} .lf-flavour-rail--pad{padding-bottom:6px} .lf-fl--num.on .lf-fl-img{box-shadow:0 0 0 3px var(--lf-ink)} .lf-thc{position:absolute;left:6px;bottom:6px;background:var(--lf-ink);color:#fff;font-style:normal;font-weight:900;font-size:12.5px;padding:3px 8px;border-radius:999px;letter-spacing:.01em} .lf-pcard-img{position:relative} /* THC-Schieber im Filter */ .lf-range-v b{font-size:22px;font-weight:900} .lf-range-t{position:relative;height:34px;margin-top:10px} .lf-range-t input[type=range]{position:absolute;left:0;right:0;width:100%;top:0;margin:0;background:transparent;pointer-events:none;-webkit-appearance:none;appearance:none;height:34px} .lf-range-t input[type=range]::-webkit-slider-runnable-track{height:6px;background:#d7d2cd;border-radius:3px} .lf-range-t input[type=range]+input[type=range]::-webkit-slider-runnable-track{background:transparent} .lf-range-t input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:30px;height:30px;border-radius:50%;background:#fff;border:3px solid var(--lf-ink);margin-top:-12px;cursor:pointer} .lf-range-t input[type=range]::-moz-range-track{height:6px;background:#d7d2cd;border-radius:3px} .lf-range-t input[type=range]::-moz-range-thumb{pointer-events:auto;width:24px;height:24px;border-radius:50%;background:#fff;border:3px solid var(--lf-ink)} /* ── Desktop-Layout wie Lieferando (>= 960 px): Filterspalte links, Kategorie-Band, Umschalter im Kopf ── */ .v3h-mid{display:contents} .v3h-mark-l,.v3h-seg,.lf-cats--d,.lf-side,.lf-sortsel{display:none} .lf-desk{display:block} @media(min-width:960px){ .v3-lf .v3h-in{max-width:1440px;padding:10px 28px} .v3h-mark{align-items:center;gap:10px} .v3h-mark-s{display:none!important} .v3h-mark-l{display:block!important;height:34px;width:auto;border-radius:0!important} .v3h-mid{display:flex;flex:1;align-items:center;justify-content:center;gap:14px} .v3-lf .v3h-mid .v3h-loc{flex:0 1 420px;margin:0} .v3h-seg{display:flex;background:var(--lf-bg);border-radius:var(--r-pill);padding:4px;gap:2px} .v3h-seg a{display:flex;align-items:center;gap:8px;padding:9px 18px;border-radius:var(--r-pill);text-decoration:none;color:var(--lf-ink);font-weight:800;font-size:15px} .v3h-seg a.on{background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.18);color:var(--brand)} .lf-cats--m{display:none!important} .lf-cats--d{display:flex;justify-content:center;gap:28px;max-width:1440px;margin:0 auto;padding:12px 28px 16px;border-bottom:1px solid var(--lf-line,#e8e8e8)} .lf-desk{display:grid;grid-template-columns:300px minmax(0,1fr);gap:28px;max-width:1440px;margin:0 auto;padding:0 28px;align-items:start} .lf-desk-main{min-width:0} .lf-desk .lf-top{position:static} .lf-desk .lf-top-in,.lf-desk .lf-filterrow-in,.lf-desk .lf-main{max-width:none;padding-left:0;padding-right:0} .lf-desk .lf-main{padding-bottom:40px} .lf-desk .lf-filterrow{display:none} .lf-side{display:block;position:sticky;top:12px;max-height:calc(100vh - 24px);overflow-y:auto;padding:22px 4px 40px 0;scrollbar-width:thin} .lf-side .v3-sheet{display:block!important;position:static;background:none;padding:0;z-index:auto} .lf-side .v3-sheet[hidden]{display:block!important} .lf-side .v3-sheet-bg,.lf-side .v3-sheet-head,.lf-side #f-sort,.lf-side #f-mode,.lf-side .v3-fsheet-foot{display:none!important} .lf-side .v3-sheet-card{max-width:none;width:auto;height:auto;max-height:none;border-radius:0;padding:0;box-shadow:none;background:none;animation:none} .lf-side .v3-fsheet-body{padding:0} .lf-side-h{display:block;font-size:30px;font-weight:900;line-height:1.1;margin:0 0 18px} .lf-side-h b{font-weight:900} .lf-sortsel{display:flex;align-items:center;gap:10px;flex:none;font-weight:800;font-size:14px;color:var(--lf-ink)} .lf-sortsel select{border:1px solid var(--lf-line,#ddd);background:#fff;border-radius:var(--r-pill);padding:10px 14px;font:inherit;font-weight:800} .lf-ibtn--filter{display:none} } .lf-side-h{display:none} @media(min-width:960px){.lf-side-h{display:block}} .v3-accm .v3-sheet-card{max-width:560px;width:92%;max-height:88vh;overflow-y:auto;border-radius:22px;padding:28px;position:relative} .v3-accm-x{position:absolute;top:10px;right:14px;border:0;background:none;font-size:34px;line-height:1;cursor:pointer;color:var(--lf-ink)} .v3-accm:not([hidden]){display:flex;align-items:center;justify-content:center} @media(min-width:960px){ .lf-desk .lf-top .lf-seg{display:none} .v3h-mark .v3h-mark-l{width:auto!important;height:34px!important;max-width:none} .v3-lf .v3h-mark img.v3h-mark-l{width:auto;height:34px} } .v3-accm-b .lf-acc-x{display:none}.v3-accm .v3-accm-x{top:22px;right:24px} .v3-embed{display:block;width:100%;border:0;min-height:360px;background:#fff;margin-top:8px} .v3-konto--embed{max-width:980px} /* ── Native Konto-Bereiche (Support, Arzt-Chat, Termin, Nochmals kaufen, Freunde, Einstellungen) ── */ .v3-btn--danger{background:#c62828;color:#fff} .lf-n-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:4px} .lf-n-head b{font-size:19px;font-weight:900} .lf-n-pill{display:inline-block;padding:5px 12px;border-radius:999px;background:var(--lf-bg,#f3f3f3);font-size:13px;font-weight:800;white-space:nowrap} .lf-n-pill--open{background:var(--brand-soft);color:var(--brand-strong)} .lf-n-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px} .lf-chat{display:flex;flex-direction:column;gap:10px;margin:16px 0} .lf-bub{max-width:86%;background:var(--lf-bg,#f3f3f3);border-radius:18px 18px 18px 4px;padding:10px 14px;align-self:flex-start} .lf-bub.me{align-self:flex-end;background:var(--brand-soft);border-radius:18px 18px 4px 18px} .lf-bub small{display:block;font-size:12px;color:#777;margin-bottom:2px} .lf-bub p{margin:0;font-size:16px;line-height:1.4;word-break:break-word} .lf-reply{display:flex;flex-direction:column;gap:10px} .lf-reply textarea,.v3-form textarea{width:100%;border:1.5px solid var(--lf-line,#e1e1e1);border-radius:16px;padding:13px 14px;font:inherit;font-size:16px;resize:vertical} .lf-slot{display:flex;justify-content:space-between;align-items:center;gap:10px} .lf-n-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} @media(min-width:760px){.lf-n-grid{grid-template-columns:repeat(4,minmax(0,1fr))}} .lf-n-prod{display:flex;flex-direction:column;gap:4px;text-decoration:none;color:inherit;padding:10px} .lf-n-prod img,.lf-n-prod .v3-ph{width:100%;aspect-ratio:1;object-fit:cover;border-radius:14px} .lf-n-prod b{font-size:16px;font-weight:900}.lf-n-prod small{color:#777}.lf-n-prod span{font-weight:800;color:var(--brand)} .lf-n-link{display:flex;justify-content:space-between;align-items:center;text-decoration:none;color:inherit} .lf-n-link small{display:block;color:#777} .lf-n-danger summary{cursor:pointer;font-weight:800;color:#c62828;padding:6px 0} .lf-slot small,.v3-st-row small{display:block} /* Kategorie-/Sorten-Bilder (freigestellte WebP aus assets/img/v3icons) */ /* Kategorie-/Sorten-Kacheln wie Lieferando: farbiges Squircle, freigestelltes Foto ragt ueber den Rand */ .lf-ci{position:relative;display:block;width:100%;height:100%;border-radius:32%;background:var(--tile,#e9eef2)} .lf-ci .lf-catimg{position:absolute;left:50%;top:50%;width:124%;height:124%;max-width:none;transform:translate(-50%,-53%);object-fit:contain;filter:drop-shadow(0 5px 6px rgba(0,0,0,.2));pointer-events:none} .lf-cat .lf-ci{width:96px;height:96px;margin:0 auto} .lf-cat{overflow:visible} .lf-fl-img:has(.lf-ci){width:96px;height:96px;margin:0 auto} .lf-fl--num .lf-fl-img:has(.lf-ci){background:none;box-shadow:none} .lf-fl--num.on .lf-fl-img:has(.lf-ci) .lf-ci{box-shadow:0 0 0 3px var(--lf-ink)} /* ── Marke wechseln (Vorschau) + App installieren ── */ .lf-brandsw{display:flex;align-items:center;gap:14px;padding:14px 0} .lf-brandsw span{font-weight:800;font-size:19px} .lf-brandsw em{margin-left:auto;font-style:normal;display:flex;gap:6px;background:var(--lf-bg);border-radius:999px;padding:4px} .lf-brandsw a{padding:8px 16px;border-radius:999px;font-weight:800;font-size:15px;color:var(--lf-ink);text-decoration:none} .lf-brandsw a.on{background:#fff;color:var(--brand);box-shadow:0 1px 4px rgba(0,0,0,.18)} .lf-app-head{display:flex;gap:14px;align-items:center;margin-bottom:12px} .lf-app-head img{border-radius:16px;box-shadow:0 1px 6px rgba(0,0,0,.18)} .lf-app-head b{display:block;font-size:20px;font-weight:900}.lf-app-head small{color:#777;display:block;line-height:1.35} .lf-app-steps{padding-left:20px;line-height:1.7;font-size:16px} /* Pop-out braucht Luft: horizontale Leisten schneiden sonst nach oben ab */ .lf-cats{padding-top:18px} .lf-flavour-rail{padding-top:14px} .lf-ci .lf-catimg{width:116%;height:116%} .lf-cats--d{padding-top:18px} .lf-ci--txt{display:flex;align-items:center;justify-content:center;text-align:center} .lf-ci--txt b{font-size:17px;font-weight:900;color:var(--lf-ink);line-height:1.1;padding:6px;word-break:break-word;letter-spacing:-.01em} .lf-fl-big:has(.lf-ci){display:block;width:100%;height:100%} /* Apotheken-Logos (gescrapt) */ .lf-plogo{display:block;width:100%;height:100%;object-fit:contain;border-radius:inherit;background:#fff} .lf-plogo--dark{background:#1d2a33} .v3-shop-logo .lf-plogo{padding:3px;border-radius:var(--r-md)} .lf-card-logo .lf-plogo,.lf-store-logo .lf-plogo{border-radius:8px} /* Hersteller-Logos (gescrapt) */ .lf-blogo{display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--lf-line);overflow:hidden} .lf-blogo img{max-width:82%;max-height:78%;object-fit:contain} .lf-blogo--dark{background:#1d2a33;border-color:#1d2a33} .lf-brand .lf-blogo{width:150px;height:110px;border-radius:16px} .lf-row .lf-blogo.lf-row-logo{flex:none;width:52px;height:52px;border-radius:10px} .lf-row .lf-blogo.lf-row-logo img{max-width:86%;max-height:80%} /* Heros, Banner, Illustrationen (Bildsatz 03.10.) */ .lf-hero-img,.lf-card-img>.lf-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block} .lf-store-hero>.lf-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover} img.lf-banner-img{width:100%;height:100%;min-height:150px;object-fit:cover;border-radius:14px;background:none!important} img.lf-band-media{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:16px} img.lf-acc-ill{width:92px!important;height:92px!important;object-fit:contain;border-radius:0;background:none!important} .lf-ci--txt b{font-size:14px;word-break:normal;overflow-wrap:normal;hyphens:none} .lf-pay{color:#17824a;font-weight:800} .lf-store-meta .lf-pay svg{color:#17824a} /* ══════════ Final UI Polish (03.10.2026) – Pixel-Konsistenz, Zustände, Responsive. Keine neuen Layouts. ══════════ */ :root{ --pad:16px; /* gemeinsamer horizontaler Seitenrand (mobil) */ --sec-top:26px; /* Abstand Abschnittsende -> nächste Überschrift */ --sec-head:14px; /* Abstand Überschrift -> Inhalt */ --lf-sub:#70777a; /* Sekundärtext (Marke, THC/CBD, Entfernung, Anzahl) */ --card-r:18px; --card-sh:0 2px 12px rgba(0,0,0,.07); --lf-top-h:0px; } /* 1) Abstände: eine Achse für alle linken Kanten, feste Abstände zwischen Abschnitten */ .lf-flavour{padding:var(--sec-top) 0 4px} .lf-flavour-h,.lf-sec-h{padding:0 var(--pad) var(--sec-head);align-items:baseline} .lf-flavour-rail,.lf-rail{padding-left:var(--pad);padding-right:var(--pad);scroll-padding-inline:var(--pad)} .lf-sec{padding-top:var(--sec-top)} .lf-pgrid{padding:0 var(--pad)} .lf-flavour-rail::after,.lf-rail::after{content:"";flex:none;width:1px} /* End-Padding: letztes Element sitzt nicht am Rand */ /* 2) Abschnittskopf: Überschrift stark, Link ruhiger, gleiche Grundlinie; alle Textlinks einheitlich */ .lf-flavour-h h2,.lf-sec-h h2{font-size:clamp(21px,5vw,25px);font-weight:900;line-height:1.15;letter-spacing:-.015em} .lf-flavour-h a,.lf-sec-h a,.lf-howsort summary,.lf-reshead a,.lf-reset{font-size:15px;font-weight:700;color:var(--lf-ink);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px;opacity:.82} .lf-flavour-h a:hover,.lf-sec-h a:hover,.lf-howsort summary:hover{opacity:1} /* 3) Typografie-Hierarchie: Name stark, Preis mittel, Metadaten leise */ .lf-pcard-b small,.lf-card-meta,.lf-card-meta--2,.lf-fl small,.lf-fl,.lf-pcard-b .lf-pcard-m{color:var(--lf-sub);font-weight:400} .lf-card-meta{font-size:15.5px;margin-top:4px} .lf-card-meta b{font-weight:700;color:var(--lf-ink)} .lf-pcard-b b{font-size:17px;font-weight:900;color:var(--lf-ink)} .lf-pcard-b small{font-size:13.5px;line-height:1.35} .lf-pcard-p{font-size:17px;font-weight:800;color:var(--lf-ink);margin-top:6px} .lf-fl.on,.lf-cat.on{color:var(--lf-ink);font-weight:800} .lf-pcard-av,.lf-pay{color:var(--positive);font-weight:700} /* Grün nur für Verfügbarkeit/Zahlung */ /* 4) Karten: ein Radius, ein Schatten, etwas mehr Luft, Bild ca. 8 % größer */ .lf-pcard,.lf-rail--pop .lf-pop{border-radius:var(--card-r);box-shadow:var(--card-sh)} .lf-pcard{padding:18px 16px;gap:16px} .lf-pcard-img{width:104px;height:104px;border-radius:14px} .lf-pcard-b{gap:3px} .lf-card-img,.lf-card-status+.lf-card-img{border-radius:var(--card-r)} .lf-card-status+.lf-card-img{border-radius:0 0 var(--card-r) var(--card-r)} .lf-pcard-img img{object-fit:cover} /* 5) Plus-Button: überall gleich, 44-px-Tippfläche */ .lf-plus{width:42px;height:42px;top:12px;right:12px;border:1px solid var(--lf-line);box-shadow:0 1px 4px rgba(0,0,0,.12);transition:transform .12s,box-shadow .12s,background .12s} .lf-plus::after{content:"";position:absolute;inset:-4px} .lf-plus:hover{background:var(--brand-soft);box-shadow:0 2px 8px rgba(0,0,0,.16)} .lf-plus:active{transform:scale(.94)} /* 6) Filter-Chips: ein Bauteil, keine sichtbare Scroll-Leiste */ .lf-fchip{height:48px;padding:0 18px;gap:8px;font-size:16px;font-weight:800;border-radius:999px;transition:background .12s,border-color .12s,transform .12s} .lf-fchip--ic{width:48px;padding:0} .lf-fchip:hover{border-color:var(--lf-ink)} .lf-fchip:active{transform:scale(.97)} .lf-scrollbar{display:none} .lf-filterrow{padding:14px 0 14px} /* 7) Zustände: Hover / gedrückt / Tastatur-Fokus für Karten, Kacheln, Schalter, Links */ .lf-pcard,.lf-card,.lf-fl,.lf-cat,.lf-brand,.lf-row,.lf-pop{transition:box-shadow .15s,transform .15s} .lf-pcard:hover,.lf-rail--pop .lf-pop:hover{box-shadow:0 6px 20px rgba(0,0,0,.12)} .lf-fl:hover .lf-ci,.lf-cat:hover .lf-ci{transform:translateY(-2px)} .lf-ci{transition:transform .15s} .lf-fl:active,.lf-cat:active,.lf-pcard:active,.lf-card:active{transform:scale(.985)} .lf-tog i{transition:background .15s} a:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--brand);outline-offset:2px;border-radius:12px} .lf-fl:focus-visible .lf-ci,.lf-cat:focus-visible .lf-ci{outline:3px solid var(--brand);outline-offset:2px} /* 8) Tippflächen mindestens 44 px (Sichtbares bleibt klein) */ .v3-fav,.lf-ibtn,.v3h-burger,.v3h-back{position:relative} .v3-fav::after,.lf-ibtn::after,.v3h-burger::after,.v3h-back::after{content:"";position:absolute;inset:-6px} .v3h-burger,.v3h-back{min-width:44px;min-height:44px;align-items:center;justify-content:center} /* 9) Feedback-Tab: schmal, nicht über Inhaltslinks; auf Mobil über den runden Bedienknöpfen */ .lf-feedback{padding:14px 8px;font-size:14px} @media(max-width:959px){.lf-feedback{top:auto;bottom:150px;transform:rotate(180deg)}} /* 10) Sticky-Leiste mobil: Suche + Filter bleiben beim Scrollen stehen, Schatten erst im Sticky-Zustand */ @media(max-width:959px){ .lf-filterrow{position:sticky;top:var(--lf-top-h);z-index:55;box-shadow:none} body.v3-s1 .lf-filterrow.is-stuck{box-shadow:0 6px 10px -8px rgba(0,0,0,.22)} } /* 11) Desktop: kompaktere Marktplatz-Fläche, feste Kartenhöhe, ruhige Toolbar */ @media(min-width:960px){ .lf-desk{max-width:1320px;gap:24px} .lf-cats--d{max-width:1320px} .lf-pgrid{align-items:stretch} .lf-pcard{height:100%} .lf-pcard-b{justify-content:flex-start} .lf-pcard-b b{min-height:2.5em} .lf-side .lf-tog{padding:14px 0} .lf-side .lf-fl-legend{margin-top:26px} } .lf-pcard-b b{-webkit-line-clamp:2} .lf-card-top b,.lf-pcard-p,.lf-pcard-av{white-space:nowrap} /* 12) Leerer Zustand und Skeleton-Platzhalter ohne Layout-Sprung */ .v3-empty{border-radius:var(--card-r);background:#fff;box-shadow:var(--card-sh)} .lf-pcard-img,.lf-card-img,.lf-ci,.lf-store-hero{background:linear-gradient(110deg,#eceae7 8%,#f6f4f2 18%,#eceae7 33%);background-size:200% 100%} @media(prefers-reduced-motion:no-preference){.lf-pcard-img,.lf-card-img{animation:lfsk 1.4s linear infinite}.lf-pcard-img:has(img[complete]),.lf-card-img:has(.lf-hero-img){animation:none}} @keyframes lfsk{to{background-position-x:-200%}} .lf-ci{background:var(--tile,#e9eef2)} /* Polish-Korrekturen aus der Breiten-QA */ .v3-cmp{grid-template-columns:minmax(0,1fr)} .v3-cmp-r{min-width:0} .lf-pgrid{grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr))} .lf-pcard--grid{min-width:0} .lf-pcard-p,.lf-pcard-av{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .lf-store-head h1{min-width:0;overflow-wrap:anywhere} .lf-store-acts{flex:none;display:flex;gap:8px} @media(max-width:420px){.lf-pillbtn{padding-left:12px;padding-right:12px}.lf-store-head h1{font-size:26px}} @media(max-width:959px){.lf-feedback{bottom:76px}} .lf-pcard-av{white-space:normal;overflow:visible;text-overflow:clip} /* ══ Marketplace-Details (03.10.2026) ══ */ .lf-card-status{font-weight:700} .lf-card-status--closed{background:#e4e1dd;color:#4a4f52} .lf-card-status--soon{background:#ffefd0;color:#8a5200} .lf-info-btn{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-left:6px;border-radius:50%;border:1.5px solid var(--lf-ink);background:#fff;color:var(--lf-ink);font:800 13px/1 var(--font,inherit);vertical-align:middle;cursor:pointer;position:relative} .lf-info-btn::after{content:"";position:absolute;inset:-12px} .lf-terp{list-style:none;margin:6px 0 10px;padding:0;display:grid;gap:2px} .lf-terp li{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--lf-line)} .lf-terp li b{font-weight:800}.lf-terp li span{color:var(--lf-sub);text-align:right} .v3-cmpsheet{max-height:86vh;overflow:auto} .v3-cmpbody{margin:6px 0 12px} .v3-cmpbody .v3-cmp-r{background:#fff} #v3CmpAll{display:inline-block;margin:4px 0 6px;font-weight:800} .lf-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:8px 0 14px} .v3-phbox--fb{background:var(--lf-ph);color:var(--lf-ph-t)} .v3-nav .lf-main{opacity:.55;transition:opacity .12s;pointer-events:none} @media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}} /* Mobil: die Filter-Seitenleiste ist nur der Behaelter des Filter-Fensters (Fenster liegt als Overlay darueber) */ @media(max-width:959px){.lf-side{display:contents!important}} .lf-abo .lf-n-row{margin:8px 0} .lf-cancel{margin:4px 0 10px} /* Finales easyda-Logo (ganzer Text) etwas groesser */ @media(min-width:960px){.v3h-mark .v3h-mark-l,.v3-lf .v3h-mark img.v3h-mark-l{height:42px!important}} .v3h-mark-s{border-radius:10px} /* Startseite: Kartenvorschau */ .lf-mp-box{height:300px;border-radius:20px;overflow:hidden;background:#e8eef5;cursor:pointer;position:relative;box-shadow:var(--sh-1,0 1px 4px rgba(0,0,0,.08))} .lf-mp-box::after{content:"Karte öffnen";position:absolute;right:12px;bottom:12px;z-index:500;background:var(--lf-ink,#0b1b2b);color:#fff;font-weight:800;font-size:14px;padding:9px 16px;border-radius:999px} @media(min-width:960px){.lf-mp-box{height:340px}} /* Startseite: Raster immer ganz auffuellen (1/2 Spalten: 4, 3 Spalten: 6 Karten) */ .lf-list--fill>:nth-child(n+5){display:none} @media(min-width:1180px){.lf-list--fill>:nth-child(n+5){display:block}.lf-list--fill>:nth-child(n+7){display:none}} /* Desktop: Konto-/Vorgangsseiten als zentrierte Spalte statt Vollbreite */ @media(min-width:960px){ body.v3-lf.v3-konto main.v3-wrap,body.v3-lf.v3-status main.v3-wrap{max-width:820px;margin-left:auto;margin-right:auto} body.v3-lf.v3-konto main.v3-wrap:has(.v3-grp-t){max-width:1100px} } @media(min-width:960px){body.v3-lf.v3-kasse main.v3-kasse-wrap{max-width:820px;margin-left:auto;margin-right:auto}} @media(min-width:760px){.v3-ind-grid>:last-child:nth-child(odd){grid-column:1/-1}} @media(min-width:960px){body.v3-lf .v3-more-grid{grid-template-columns:repeat(4,1fr)}} /* Konto: hervorgehobener Eintrag (z. B. Patientenakte freigegeben) */ .lf-acc-list a.lf-acc-hl{background:var(--brand-soft,#e8f4fc);border-radius:14px} .lf-acc-list a.lf-acc-hl em{margin-left:auto;font-style:normal;font-weight:800;font-size:13px;color:var(--brand)} /* ── Startseiten-Deals (Backend > Shop Banner > Startseiten-Deals), ab 2 sichtbar, ab 3 Slider ── */ .lf-deals{position:relative;max-width:var(--max,1240px);margin:18px auto 6px;padding:0 16px} .lf-deals-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch} .lf-deals-track::-webkit-scrollbar{display:none} .lf-deal{flex:0 0 calc(50% - 8px);scroll-snap-align:start;border-radius:18px;display:flex;justify-content:space-between;gap:10px;padding:22px 0 22px 24px;overflow:hidden;min-height:168px} .lf-deal-txt{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;max-width:58%} .lf-deal-txt h3{margin:0;font-size:24px;line-height:1.1;font-weight:900;letter-spacing:-.01em} .lf-deal-txt p{margin:0;font-size:15px;line-height:1.35;opacity:.92} .lf-deal-btn{display:inline-block;margin-top:6px;padding:10px 20px;border-radius:999px;font-weight:800;font-size:15px;text-decoration:none} .lf-deal-img{width:40%;max-height:200px;object-fit:contain;object-position:right center;align-self:center} .lf-deals-nav{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:0;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.28);font-size:24px;line-height:1;cursor:pointer;z-index:3} .lf-deals-prev{left:4px}.lf-deals-next{right:4px} @media(max-width:760px){.lf-deal{flex-basis:86%;min-height:150px}.lf-deal-txt h3{font-size:20px}.lf-deals-nav{display:none}} /* Apotheken-Karte: Zusatz-Badge, Sektions-Untertitel, Shop-Banner, nicht vorraetig */ .lf-card-badge{margin:2px 0 0;font-size:13px;font-weight:800;color:var(--brand,#0b7fc4)} .lf-sec-sub{margin:-6px 16px 10px;color:var(--lf-grey,#6b7280);font-size:14px} .lf-sbanners{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:0 16px;max-width:var(--max,1240px);margin-left:auto;margin-right:auto} .lf-sbanner{display:block;border-radius:18px;overflow:hidden;background:#eef2f6} .lf-sbanner .lf-sbanner-media,.lf-sbanner img,.lf-sbanner video{display:block;width:100%;height:auto;aspect-ratio:16/7;object-fit:cover} @media(max-width:760px){.lf-sbanners{grid-template-columns:1fr}} .lf-pcard-out{color:var(--lf-grey,#6b7280)!important;font-weight:700} /* ══════════ Mobil kompakt (04.10.2026) – Schriften/Elemente ca. 15-20 % kleiner, Vorbild Lieferando-Mobil ══════════ */ @media(max-width:600px){ :root{--pad:14px;--sec-top:18px;--sec-head:10px} body{font-size:14px} /* Header */ .v3-lf .v3h-in{min-height:56px;padding:6px 14px;gap:8px} .v3h-mark img,.v3-lf .v3h-mark img{width:38px;height:38px} .v3-lf .v3h-loc{padding:8px 14px;font-size:14px;margin:0 2px} .v3-lf .v3h-loc svg{width:16px;height:16px} .v3h-back svg,.v3h-burger svg{width:22px;height:22px} .v3h-btn--txt{font-size:14px} .v3-lf .v3h--brand .v3h-logo img{height:28px} .v3-lf .v3-warn{font-size:14px;padding:12px 38px 12px 14px} .v3-lf .v3-warn b{font-size:15px} /* Landing */ .lf-hero-in{padding:28px 16px 36px} .lf-hero h1{font-size:clamp(26px,7.4vw,34px)} .lf-hero h2{font-size:clamp(20px,5.4vw,24px);margin-bottom:18px} .lf-addr{padding:4px 4px 4px 16px} .lf-addr input{font-size:15px;padding:9px 0} .lf-addr-go{font-size:15px;padding:11px 18px} .lf-hero-geo,.lf-hero-stats{font-size:13.5px} /* Kopf Marktplatz: Segment, Suche */ .lf-top-in{padding:8px 14px 2px} .lf-seg{margin-bottom:8px;padding:3px} .lf-seg a{padding:9px 8px;font-size:15px;gap:8px} .lf-seg a svg{width:20px;height:20px} .lf-search{height:46px;padding:0 16px;gap:10px} .lf-search input{font-size:15px} .lf-search svg{width:20px;height:20px} .lf-ibtn{width:38px;height:38px} .lf-searchrow{padding-bottom:4px} /* Kategorien / Sorten */ .lf-cats{gap:12px;padding:4px 14px 10px} .lf-cat{width:84px;gap:6px;font-size:13.5px} .lf-cat .lf-ci,.lf-cat .v3-phbox{width:80px;height:80px} .lf-fl{width:92px;gap:6px;font-size:13.5px} .lf-fl-img:has(.lf-ci){width:80px;height:80px} .lf-fl-check{width:28px;height:28px} .lf-flavour-rail,.lf-rail{gap:12px} /* Abschnittsköpfe */ .lf-flavour-h h2,.lf-sec-h h2{font-size:clamp(17px,4.8vw,20px)} .lf-flavour-h a,.lf-sec-h a,.lf-howsort summary,.lf-reshead a,.lf-reset{font-size:13px} .lf-big{font-size:clamp(21px,5.6vw,25px);margin:0 14px 14px} .lf-reshead{padding:12px 14px 2px} .lf-reshead h1{font-size:clamp(21px,5.6vw,25px)} .lf-sortline{padding:10px 14px 2px} /* Filterleiste */ .lf-filterrow{padding:8px 0 10px} .lf-filterrow-in{gap:8px} .lf-fchip{height:38px;padding:0 14px;font-size:14px;gap:6px} .lf-fchip--ic{width:38px;padding:0} .lf-fchip svg{width:18px;height:18px} /* Karten */ .lf-list{gap:22px;padding:0 14px} .lf-card-status{font-size:14px;padding:8px 10px 6px} .lf-card-logo{width:56px;height:56px;left:10px;bottom:10px;padding:4px} .lf-card-pill{font-size:12.5px;padding:4px 10px;right:10px;bottom:10px} .lf-card-top{margin-top:8px} .lf-card-top b{font-size:17px} .lf-card-meta,.lf-card--rail .lf-card-meta{font-size:13.5px;margin-top:3px} .lf-card--rail .lf-card-top b{font-size:16px} .lf-card--rail{width:min(72vw,290px)} .lf-card-svc{font-size:13px;gap:10px} .lf-card-badge{font-size:12px} .lf-more{padding:12px;font-size:15px;margin:20px 14px 0} .lf-pcard{width:min(80vw,290px);padding:12px;gap:12px} .lf-pcard-img{width:78px;height:78px} .lf-pcard-b b{font-size:14.5px} .lf-pcard-b small{font-size:12px} .lf-pcard-p{font-size:14.5px;margin-top:3px} .lf-plus{width:36px;height:36px;top:8px;right:8px} .lf-pgrid{padding:0 14px;gap:12px} /* Deals */ .lf-deals{margin:12px auto 2px;padding:0 14px} .lf-deals-track{gap:12px} .lf-deal{padding:16px 0 16px 18px;min-height:128px;border-radius:16px} .lf-deal-txt{gap:6px} .lf-deal-txt h3{font-size:17px} .lf-deal-txt p{font-size:12.5px} .lf-deal-btn{padding:8px 16px;font-size:13px;margin-top:2px} .lf-sec-sub{font-size:12.5px;margin:-4px 14px 8px} .lf-sbanners{padding:0 14px;gap:12px} .lf-mp-box{height:220px;border-radius:16px} .lf-mp-box::after{font-size:12.5px;padding:7px 13px} /* Standort-Fenster (Vollbild) */ .v3-sheet--full .v3-sheet-card{padding:16px 16px} .v3-sheet--full .v3-sheet-head{margin-bottom:14px} .v3-sheet--full .v3-sheet-head b{font-size:21px} .v3-sheet--full .v3-sheet-head button{width:36px;height:36px} .v3-locrow{gap:14px;padding:14px 4px} .v3-locrow svg{width:20px;height:20px} .v3-locrow b{font-size:15px} .v3-locrow small{font-size:13px} .v3-sheet--full .v3-addr input,.v3-sheet--full input[name=wo]{font-size:15px} .v3-recent h4{font-size:15px} .v3-recent-i{font-size:14px} .v3-recent-i small,.v3-recent-i em{font-size:12px} .lf-sugg-i{font-size:14px} /* Filter-Fenster */ .v3-sheet--full .v3-fsheet .v3-sheet-head{padding:16px 16px 6px} .v3-sheet--full .v3-fsheet-body{padding:0 16px 14px} .v3-sheet--full .v3-fsheet-foot{padding:12px 16px calc(12px + env(safe-area-inset-bottom))} .v3-fsheet legend{font-size:15px} .v3-opt{font-size:14px;padding:6px 0} /* Unten-Navigation, Warenkorb-Leiste, Toast */ .v3-nav a{font-size:10.5px;padding:6px 0 5px} .v3-cartbar{padding:10px 16px;font-size:14px} .v3-toast{font-size:13px;padding:10px 14px} /* Buttons, Formulare, Seiten */ .v3-btn{padding:10px 18px;font-size:14px} .v3-btn--lg{padding:12px 18px;font-size:15px} .v3-page-t{font-size:clamp(21px,6vw,26px);margin-bottom:12px} .v3-card h2{font-size:15.5px} .v3-field{font-size:13px} .v3-prose{font-size:14px} .v3-pd-info h1{font-size:clamp(21px,6vw,26px)} .v3-pd-price{font-size:17px} .lf-store-head h1{font-size:22px} } @media(max-width:600px){ .v3-locform input{font-size:15px;padding:12px 16px;border-radius:14px} .lf-fl-legend{font-size:16px;margin-bottom:8px} .lf-select select{font-size:15px;padding:12px 42px 12px 14px;border-radius:12px} .lf-tog{padding:10px 0} .lf-tog b{font-size:15.5px} .lf-tog i{width:50px;height:30px;border-radius:15px} .lf-tog i::after{top:3px;left:3px;width:24px;height:24px} .lf-tog input:checked+i::after{left:23px} .lf-cb{font-size:15px;gap:12px;padding:6px 0} .lf-cb i{width:24px;height:24px} .lf-cb input:checked+i::after{left:7px;top:2px;width:7px;height:13px;border-width:0 2.5px 2.5px 0} .lf-resbtn{padding:13px;font-size:17px} } @media(max-width:600px){ .lf-thc{white-space:nowrap;font-size:11px;padding:2px 7px;left:4px;bottom:4px} .lf-pcard-b{padding-right:20px} } /* Karten: Leaflet-Ebenen (z-index bis 1000) bleiben in der Karte und liegen nie ueber Kopfzeile/Sticky-Leiste */ .leaflet-container,.lf-mp-box,.v3-map{isolation:isolate;z-index:0} /* Runde Bedienknoepfe unten rechts: Nach-oben ganz rechts, KI-Assistent links daneben, beide 30 px wie bisher das KI-Icon */ body.v3-lf .lf-totop{right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));width:30px;height:30px;box-shadow:0 2px 6px rgba(0,0,0,.18);border:1px solid rgba(0,0,0,.12);z-index:99997} body.v3-lf .lf-totop svg{width:14px;height:14px} body.v3-lf #zlai-fab{right:52px!important} @media(max-width:959px){body.v3-lf.v3-has-bar .lf-totop{bottom:calc(84px + env(safe-area-inset-bottom,0px))}} /* Filter-Ueberschriften: Abstand oben, kleiner Abstand darunter (Legend im Fieldset hat sonst das Padding UNTER sich) */ .v3-fsheet fieldset,.lf-side fieldset{padding:0;margin:0} .lf-fl-legend{float:left;width:100%;padding:22px 0 6px;margin:0} .lf-fl-legend+*{clear:both} @media(max-width:600px){.lf-fl-legend{padding:18px 0 4px;margin:0}} /* Lange Filterlisten: Suchfeld + Mehr anzeigen */ .lf-fmore label[hidden]{display:none} .lf-fsearch{display:block;width:100%;box-sizing:border-box;margin:4px 0 6px;font-family:inherit;font-size:15px;padding:9px 14px;border:1.5px solid #8f8a85;border-radius:999px;background:#fff;color:var(--lf-ink);outline:none;clear:both} .lf-fsearch:focus{border-color:var(--brand)} .lf-fmore-b{display:block;margin:2px 0 0;padding:8px 0;border:0;background:transparent;font-family:inherit;font-size:14.5px;font-weight:800;color:var(--lf-ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer} /* Endlos-Feed */ .lf-feed .lf-big[hidden]{display:none} .lf-feed .lf-list{margin-bottom:8px} .lf-feed .lf-pgrid{margin-bottom:8px} .lf-feed-s{height:1px} .lf-pcard.lf-pcard--grid{width:auto} /* ══ Shop (Produkte): Apotheken-Leiste, Kategorie-Kachel, Shop-Banner im Raster (nach 12 / 24 Produkten) ══ */ .lf-lock{display:flex;align-items:center;gap:12px;margin:12px 16px 2px;padding:10px 12px;background:#fff;border-radius:16px;box-shadow:var(--card-sh,0 2px 12px rgba(0,0,0,.07));border:1.5px solid var(--brand-soft,#dbeafe)} .lf-lock-l{flex:none;width:42px;height:42px;border-radius:10px;background:var(--lf-bg);overflow:hidden;display:flex;align-items:center;justify-content:center} .lf-lock-l img{width:100%;height:100%;object-fit:contain;padding:3px} .lf-lock-t{flex:1;min-width:0;display:flex;flex-direction:column} .lf-lock-t small{color:var(--lf-sub,#70777a);font-size:12px} .lf-lock-t b{font-size:15px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .lf-lock-b{flex:none;font-weight:800;font-size:13.5px;color:var(--lf-ink);text-decoration:underline;text-underline-offset:3px;white-space:nowrap} .lf-lock--warn{background:#fff7e0;border-color:#f0d58a} .lf-lock--warn .lf-lock-t b{white-space:normal;font-size:13.5px} .lf-ci--ic{display:flex!important;align-items:center;justify-content:center;color:var(--brand-strong,#0b6fb3)} .lf-pgrid .shop-banner-slot{grid-column:1/-1;display:block;width:100%;text-decoration:none} .shop-banner-media{position:relative;display:block;width:100%;aspect-ratio:16/9;min-height:160px;border-radius:18px;overflow:hidden;background:#eef2f6} .shop-banner-media>img,.shop-banner-media>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block} @media(min-width:960px){.shop-banner-media{aspect-ratio:21/6;min-height:0}} @media(max-width:640px){.shop-banner-media{aspect-ratio:1/1;min-height:140px;border-radius:14px}.shop-banner-media.zl-sb-mobil-169{aspect-ratio:16/9;min-height:0}.lf-lock{margin:10px 14px 0}} /* Desktop-Feinschliff: Produktkarten bekommen genug Textbreite (nichts mehr abgeschnitten), Werkzeugleiste passt bei 960-1200 px */ @media(min-width:960px){ .lf-pcard{padding:14px;gap:12px} .lf-pcard-img{width:88px;height:88px} .lf-pcard-b{padding-right:22px;min-width:0} .lf-pcard-p,.lf-pcard-av{white-space:normal;overflow:visible;text-overflow:clip} .lf-search{min-width:0} .lf-sortsel{flex:none} } @media(min-width:960px) and (max-width:1240px){.lf-sortsel>span{display:none}} @media(max-width:600px){ .lf-store-head{flex-wrap:wrap;padding:14px 14px 4px;gap:8px} .lf-store-head h1{flex:1 1 100%;font-size:22px} .lf-pillbtn{height:40px;font-size:14px;padding:0 14px;gap:8px} } @media(min-width:960px){ .lf-side .lf-tog b{font-size:16px} .lf-side .lf-tog i{width:50px;height:30px;border-radius:15px} .lf-side .lf-tog i::after{top:3px;left:3px;width:24px;height:24px} .lf-side .lf-tog input:checked+i::after{left:23px} .lf-side .lf-tog{padding:10px 0} .lf-side-h{font-size:24px;margin-bottom:10px} .lf-side .lf-fl-legend{font-size:17px} .lf-side .lf-cb{font-size:15px} } .lf-thc{white-space:nowrap} /* Produktseite: "Kaufen von"-Box, Apothekenliste als Popup (#v3PhSheet), Premium-Apotheken zuerst */ .v3-buy{margin:14px 0 18px;display:grid;gap:10px} .v3-buy-l{font-size:13px;font-weight:700;color:var(--sub);text-transform:uppercase;letter-spacing:.04em} .v3-buy-ph{display:flex;align-items:center;gap:12px;width:100%;text-align:left;font:inherit;color:inherit;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r-lg);padding:12px 14px;cursor:pointer;transition:border-color .15s} .v3-buy-ph:hover,.v3-buy-ph:focus-visible{border-color:var(--brand)} .v3-buy-t{flex:1;min-width:0;display:flex;flex-direction:column} .v3-buy-t b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .v3-buy-t small{color:var(--sub);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .v3-buy-p{display:flex;flex-direction:column;text-align:right;flex:none} .v3-buy-p small{color:var(--sub);font-size:12px} .v3-buy-more{justify-self:start;background:none;border:0;padding:0;font:inherit;font-size:14px;font-weight:600;color:var(--brand-strong);cursor:pointer;text-decoration:underline;text-underline-offset:3px} .v3-prem{font-style:normal;font-size:11px;font-weight:700;color:var(--brand-strong);background:var(--brand-soft);border-radius:var(--r-pill);padding:1px 7px;margin-right:2px} .v3-cmp-r--prem{border-color:var(--brand-soft2)} .v3-cmp-r.on{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand) inset} #v3PhSheet .v3-sheet-card{max-width:620px} #v3PhSheet .v3-avail{margin:0;padding:0} #v3PhSheet .v3-avail-h h2{font-size:17px} @media(max-width:560px){.v3-buy-ph{padding:10px 12px;gap:10px}} /* Banner: Startseite (ein Banner) und Beitrags-Seitenleiste */ .lf-sbanners--one{grid-template-columns:1fr} .lf-sbanner-slot{display:block;width:100%} .v3-info-wrap.has-side{max-width:1160px} .v3-info-side{margin-top:32px} @media(min-width:1000px){.v3-info-wrap.has-side .v3-info-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:start}.v3-info-side{position:sticky;top:90px;margin-top:0}} /* App-Banner: nur in der installierten App/PWA (html.is-app) */ .zl-app-bn{display:none} .is-app .zl-app-bn{display:block} .is-app .zl-app-bn.lf-sec{padding:0 16px;max-width:var(--max,1240px);margin-left:auto;margin-right:auto} .is-app .lf-pgrid .zl-app-bn{grid-column:1/-1} /* Newsletter-Anmeldung im Footer */ .v3f-nl{display:flex;flex-direction:column;gap:6px;margin:0 0 18px;max-width:460px} .v3f-nl b{font-size:15px}.v3f-nl span{font-size:13px;opacity:.75} .v3f-nl-row{display:flex;gap:8px;margin-top:4px} .v3f-nl-row input{flex:1;min-width:0;padding:11px 14px;border:1px solid rgba(0,0,0,.2);border-radius:999px;font-size:15px;background:#fff} .v3f-nl-row button{padding:11px 18px;border-radius:999px;border:0;background:#1a1a1a;color:#fff;font-weight:700;font-size:14px;cursor:pointer} .v3f-nl-msg{font-size:13px;min-height:16px}