/* ===== deinfest.ch – Design Tokens ===== */
:root{
  --navy:#0F243E; --navy-deep:#0A1A2E; --navy-soft:#33465C;
  --yellow:#FBBF24; --yellow-deep:#E8A712; --yellow-soft:#FDF1D6;
  --teal:#2BA99C; --teal-soft:#DCF1EE;
  --coral:#F26D5C; --coral-soft:#FDE3DE;
  --cream:#F7F3EA; --cream2:#EFE9DC; --card:#FFFFFF;
  --ink:#0F243E; --muted:#6B7C90; --line:#E2DCCE;
  --radius:14px;
}
*,*::before,*::after{box-sizing:border-box;min-width:0}
html,body{margin:0;padding:0;width:100%;max-width:100%;overflow-x:hidden}
img,svg{max-width:100%;height:auto}
/* Kein Element darf breiter sein als der Bildschirm */
.lg,.wrap,.fs,.block,.card,.cal,.modal{max-width:100%}
input,select,textarea{max-width:100%}
button{font-family:inherit;cursor:pointer}
[hidden]{display:none !important}
a{color:var(--teal)}

.lg{font-family:'Rubik',system-ui,-apple-system,sans-serif;color:var(--ink);background:var(--cream);min-height:100vh;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column}
#app{flex:1 0 auto}
.footer{margin-top:auto}
h1,h2,h3,.disp{font-family:'Rubik',sans-serif;font-weight:800;letter-spacing:-.02em;margin:0}
.mono{font-family:'JetBrains Mono',monospace;font-variant-numeric:tabular-nums}
.wrap{width:100%;max-width:1120px;margin:0 auto;padding:0 calc(16px + env(safe-area-inset-right)) 0 calc(16px + env(safe-area-inset-left))}

/* ===== Header ===== */
.header{position:sticky;top:0;z-index:40;background:var(--cream);border-bottom:1px solid var(--line)}
.headin{display:flex;align-items:center;gap:10px;height:58px;min-width:0}
.brand{display:flex;align-items:center;gap:8px;background:none;border:0;padding:0;min-width:0}
.brand svg{width:28px;height:28px;flex:0 0 auto}
.wordmark{font-weight:800;font-size:20px;letter-spacing:-.02em;color:var(--navy);line-height:1;white-space:nowrap}
.wordmark .f{color:var(--yellow)}
.wordmark .ch{font-size:.62em;font-weight:600}
.nav{display:flex;gap:4px;margin-left:auto;align-items:center;min-width:0}
.navlink{display:none;background:none;border:0;padding:9px 12px;border-radius:9px;font-weight:600;font-size:14.5px;color:var(--ink)}
.navlink:hover{background:var(--cream2)}
.navlink.on{color:var(--navy);background:var(--cream2)}
.who{display:none;font-size:13px;color:var(--muted)}
.bunting{height:14px;background-color:var(--cream);background-repeat:repeat-x;background-position:left top;background-size:24px 14px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='14' viewBox='0 0 24 14'%3E%3Cpolygon points='0,0 12,0 6,14' fill='%23FBBF24'/%3E%3Cpolygon points='12,0 24,0 18,14' fill='%23FBBF24'/%3E%3C/svg%3E")}

/* ===== Buttons ===== */
.btn{border:1px solid transparent;border-radius:11px;padding:11px 16px;font-weight:600;font-size:14.5px;line-height:1.2;transition:background .15s,transform .06s}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--yellow);color:var(--navy)}
.btn-primary:hover{background:var(--yellow-deep)}
.btn-dark{background:var(--navy);color:#fff}
.btn-dark:hover{background:var(--navy-deep)}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{background:var(--cream2)}
.btn-sm{padding:8px 12px;font-size:13px;border-radius:9px}
.btn-block{display:block;width:100%;text-align:center}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* ===== Hero ===== */
.hero{padding:26px 0 14px}
.eyebrow{font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);font-weight:600}
.hero h1{font-size:32px;line-height:1.08;margin:12px 0 0}
.hero h1 em{font-style:normal;color:var(--yellow-deep)}
.hero p{font-size:15.5px;color:var(--muted);max-width:52ch;margin:12px 0 0;line-height:1.5}
.searchbar{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}
.searchbar .inp{flex:1 1 200px;min-width:0}
.searchbar .btn{display:none}
.cats{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:16px 0 0;padding-bottom:2px}
.cats::-webkit-scrollbar{display:none}
.cat{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--card);border-radius:999px;padding:9px 14px;font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap}
.cat.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.filterrow{display:flex;align-items:center;gap:16px;margin-top:14px;flex-wrap:wrap}
.check{display:inline-flex;align-items:center;gap:8px;font-size:14px;cursor:pointer;user-select:none}
.check input{accent-color:var(--navy);width:16px;height:16px}

/* KI-Banner */
.planbanner{display:flex;align-items:center;gap:12px;width:100%;text-align:left;margin-top:16px;padding:14px;border:1px solid #B9E3DD;background:var(--teal-soft);border-radius:var(--radius);color:var(--ink)}
.planbanner:hover{border-color:var(--teal)}
.planbanner .pb-ic{font-size:22px;flex:0 0 auto}
.planbanner .pb-txt{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.planbanner .pb-txt b{font-size:14.5px}
.planbanner .pb-txt small{color:var(--muted);font-size:12.5px;line-height:1.35}
.planbanner .pb-arrow{color:var(--teal);flex:0 0 auto}

/* Ablauf */
.steps{padding:6px 0 20px}
.stepsh{font-size:19px;margin-bottom:16px}
.stepgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.step{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;min-width:0}
.stepic{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px}
.step b{font-size:14.5px;font-weight:700}
.step small{color:var(--muted);font-size:12.5px;line-height:1.4}

/* ===== Formularelemente ===== */
.inp,.ta,.sel{display:block;width:100%;max-width:100%;border:1px solid var(--line);background:var(--card);border-radius:11px;padding:12px 13px;font-size:16px;font-family:inherit;color:var(--ink)}
.ta{min-height:104px;resize:vertical;line-height:1.5}
.inp:focus,.ta:focus,.sel:focus{outline:2px solid var(--navy);outline-offset:1px;border-color:var(--navy)}
.lbl{display:block;font-size:13px;font-weight:600;margin:0 0 6px}
.hint{font-size:12.5px;color:var(--muted);margin:6px 0 0;line-height:1.45}
.field{margin-bottom:14px}
.two{display:grid;grid-template-columns:1fr;gap:14px}
.two>*{min-width:0}

/* ===== Listen & Karten ===== */
.sectionhead{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:8px 0 16px}
.sectionhead h2{font-size:21px}
.count{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--muted)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-bottom:24px}
.card{display:flex;flex-direction:column;min-width:0;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;text-align:left;padding:0;cursor:pointer}
.media{width:100%;aspect-ratio:1;object-fit:cover;display:block;background:var(--cream2)}
.ph{width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:40px;background:linear-gradient(135deg,var(--cream2),#E6DFD0)}
.cardbody{display:flex;flex-direction:column;gap:8px;flex:1;padding:12px 13px 14px;min-width:0}
.cardtitle{font-weight:700;font-size:15px;line-height:1.25;overflow-wrap:anywhere}
.place{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.tag{align-self:flex-start;margin-top:auto;font-family:'JetBrains Mono',monospace;font-weight:600;font-size:13px;background:var(--navy);color:#fff;padding:5px 9px;border-radius:8px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{font-size:11.5px;font-weight:600;border:1px solid var(--line);border-radius:7px;padding:3px 8px;color:var(--muted);background:var(--cream)}
.chip.deliv{color:var(--teal);border-color:#B9E3DD;background:var(--teal-soft)}
.reason{font-size:12.5px;line-height:1.4;color:var(--navy);background:var(--teal-soft);border-radius:8px;padding:6px 8px;overflow-wrap:anywhere}
.empty{border:1.5px dashed var(--line);border-radius:16px;padding:40px 20px;text-align:center;background:var(--card)}
.empty h3{font-size:19px;margin-bottom:6px}
.empty p{color:var(--muted);margin:0 0 16px}

/* ===== Detail ===== */
.detail{padding:16px 0 40px}
.back{background:none;border:0;color:var(--muted);font-weight:600;font-size:14px;padding:6px 0;margin-bottom:10px}
.back:hover{color:var(--ink)}
.dcols{display:grid;grid-template-columns:1fr;gap:20px;align-items:start}
.dcols>*{min-width:0}
.gallery .main{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);border:1px solid var(--line);background:var(--cream2)}
.gallery .mainph{width:100%;aspect-ratio:4/3;border-radius:var(--radius);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:64px;background:linear-gradient(135deg,var(--cream2),#E6DFD0)}
.thumbs{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.thumb{width:60px;height:60px;border-radius:9px;object-fit:cover;border:1px solid var(--line);cursor:pointer;opacity:.7}
.thumb.on{opacity:1;outline:2px solid var(--navy);outline-offset:1px}
.dtitle{font-size:24px;line-height:1.15;margin:8px 0 6px;overflow-wrap:anywhere}
.dprice{font-family:'JetBrains Mono',monospace;font-weight:600;font-size:20px;color:var(--navy);margin:12px 0 4px}
.dprice small{font-size:13px;color:var(--muted);font-weight:500}
.desc{white-space:pre-wrap;line-height:1.6;font-size:15px;color:var(--navy-soft);margin-top:14px;overflow-wrap:anywhere}
.block{border:1px solid var(--line);background:var(--card);border-radius:var(--radius);padding:14px;margin-top:14px;min-width:0}
.block h4{font-size:14px;margin-bottom:8px;font-weight:700}
.krow{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:14px;padding:6px 0;border-top:1px dashed var(--line);min-width:0}
.krow:first-of-type{border-top:0}
.krow .k{color:var(--muted);min-width:0;overflow-wrap:anywhere}
.krow .v{font-family:'JetBrains Mono',monospace;font-weight:500;text-align:right;white-space:nowrap}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;margin-bottom:4px;clear:both;position:relative;z-index:1}
.actions .btn{flex:1 1 140px}
/* Verfügbarkeits-Block: Kalender bekommt Luft nach unten */
.availblock{margin-bottom:18px}

/* ===== Kalender (kompakt, nie breiter als der Bildschirm) ===== */
.cal{width:100%;max-width:360px;margin:0 auto;border:1px solid var(--line);background:var(--card);
     border-radius:var(--radius);padding:10px;overflow:hidden;contain:layout}
.calhead{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:8px}
.calhead .m{font-weight:700;font-size:14px;text-align:center;flex:1;min-width:0}
.calnav{background:var(--cream2);border:0;width:30px;height:30px;border-radius:8px;font-size:15px;
        color:var(--ink);flex:0 0 auto;display:flex;align-items:center;justify-content:center}
.calnav:hover{background:var(--line)}
.dow{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;margin-bottom:3px}
.dow span{text-align:center;font-size:10px;font-weight:700;color:var(--muted);font-family:'JetBrains Mono',monospace}
.calgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.day{aspect-ratio:1;border:1px solid transparent;border-radius:7px;font-family:'JetBrains Mono',monospace;
     font-size:12px;display:flex;align-items:center;justify-content:center;
     background:var(--teal-soft);color:var(--navy);padding:0}
.day.blocked{background:var(--coral-soft);color:var(--coral);text-decoration:line-through}
.day.past{background:var(--cream2);color:#B9C4D0;text-decoration:none}
.day.empty{background:transparent;border:0}
.day.edit{cursor:pointer}
.day.edit:hover{border-color:var(--navy)}
/* Legende: eigene Zeile, klar unter dem Raster */
.legend{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:10px;padding-top:8px;
        border-top:1px solid var(--line);font-size:11.5px;color:var(--muted);clear:both}
.legend span{display:inline-flex;align-items:center;white-space:nowrap}
.legend b{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px;flex:0 0 auto}

/* ===== Formular-Seiten ===== */
.form{max-width:720px;margin:0 auto;padding:8px 0 40px}
.form h2{font-size:23px;margin-bottom:4px}
.form .lead{color:var(--muted);margin:0 0 20px;font-size:14.5px}
.fs{border:1px solid var(--line);background:var(--card);border-radius:var(--radius);padding:16px;margin-bottom:14px;min-width:0}
.fslbl{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--yellow-deep);font-weight:600;margin:0 0 12px}
.seg{display:flex;border:1px solid var(--line);border-radius:11px;overflow:hidden;background:var(--cream2)}
.seg button{flex:1;background:none;border:0;padding:11px 10px;font-weight:600;font-size:13.5px;color:var(--muted);white-space:nowrap}
.seg button.on{background:var(--navy);color:#fff}
.toggles{display:flex;flex-direction:column;gap:10px}
.tog{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:500;cursor:pointer;user-select:none;min-width:0}
.tog input{width:18px;height:18px;accent-color:var(--navy);flex:0 0 auto}
.tog span{min-width:0;overflow-wrap:anywhere}
.formfoot{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.formfoot .btn{flex:1 1 auto}
.err{background:var(--coral-soft);color:#B23A28;border:1px solid #F6C3BB;border-radius:10px;padding:10px 12px;font-size:13.5px;margin-bottom:12px}

/* Angebotsart */
.kindpick{display:grid;grid-template-columns:1fr;gap:10px}
.kindpick button{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;padding:13px;border:1px solid var(--line);background:var(--cream);border-radius:12px;color:var(--ink);min-width:0}
.kindpick button b{font-size:14.5px}
.kindpick button small{color:var(--muted);font-size:12.5px;line-height:1.35}
.kindpick button.on{border-color:var(--navy);background:var(--teal-soft);box-shadow:inset 0 0 0 1px var(--navy)}

/* Fotos */
.uploads{display:flex;gap:10px;flex-wrap:wrap}
.upshot{position:relative;width:86px;height:86px;border-radius:11px;overflow:hidden;border:1px solid var(--line)}
.upshot img{width:100%;height:100%;object-fit:cover}
.upshot .x{position:absolute;top:3px;right:3px;width:22px;height:22px;border-radius:50%;background:rgba(15,36,62,.75);color:#fff;border:0;font-size:13px;display:flex;align-items:center;justify-content:center}
.upadd{width:86px;height:86px;border-radius:11px;border:1.5px dashed var(--line);background:var(--cream);color:var(--muted);font-size:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.upadd:hover{border-color:var(--navy);color:var(--navy)}

/* Ausstattung / Inventar */
.amen{display:grid;grid-template-columns:1fr;gap:8px}
.amenbox{display:flex;align-items:center;gap:8px;font-size:13.5px;padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:var(--cream);cursor:pointer;min-width:0}
.amenbox input{accent-color:var(--navy);width:16px;height:16px;flex:0 0 auto}
.invrow{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line);flex-wrap:wrap;min-width:0}
.invrow:first-child{border-top:0}
.invqty{width:76px;flex:0 0 auto}

/* Admin */
.ordrow{border-top:1px solid var(--line);padding:12px 0}
.ordrow:first-of-type{border-top:0}
.ordhead{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap}
.ordhead .sel{width:auto;min-width:132px;flex:0 0 auto;padding:8px 10px;font-size:13px}
.orddet{margin-top:8px}
.orddet summary{font-size:13px;color:var(--teal);cursor:pointer;font-weight:600}
.orddet[open] summary{margin-bottom:4px}

/* Optionen – Editor */
.optrow{border-top:1px solid var(--line);padding:12px 0}
.optrow:first-child{border-top:0}
.optmain{display:flex;flex-direction:column;gap:8px}
.optnums{display:flex;gap:8px}
.optnums .inp{flex:1 1 90px;min-width:0}
.optnums .sel{flex:1 1 120px;min-width:0}
.optflags{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:10px}
.optflags .tog{font-size:13.5px;gap:6px}
.optflags .btn{margin-left:auto}

/* Optionen – Auswahl beim Buchen */
.optpick{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px dashed var(--line);cursor:pointer}
.optpick:first-of-type{border-top:0}
.optpick.fixed{cursor:default;opacity:.9}
.optpick input{width:18px;height:18px;accent-color:var(--navy);flex:0 0 auto}
.optlbl{flex:1;min-width:0;font-size:14px;display:flex;flex-direction:column;gap:1px}
.optlbl small{font-size:11.5px}
.badge{display:inline-block;font-size:10.5px;font-weight:700;border-radius:6px;padding:2px 6px;margin-left:6px;vertical-align:1px}
.badge.must{background:var(--coral-soft);color:#B23A28}
.badge.opt{background:var(--teal-soft);color:#1F7A70}

/* Warenkorb */
.cartfab{position:fixed;right:14px;bottom:84px;z-index:58;display:none;align-items:center;gap:8px;background:var(--navy);color:#fff;border:0;border-radius:999px;padding:12px 17px;font-weight:600;font-size:14px;box-shadow:0 10px 24px -10px rgba(15,36,62,.6)}
.cartfab b{background:var(--yellow);color:var(--navy);border-radius:999px;padding:1px 8px;font-size:13px}
.cartrow{display:flex;align-items:center;gap:10px;padding:12px 0;border-top:1px solid var(--line);flex-wrap:wrap;min-width:0}
.cartrow:first-child{border-top:0}
.cartrow-main{flex:1 1 160px;min-width:0}
.cartrow-title{font-weight:700;font-size:14.5px;overflow-wrap:anywhere}

/* Modal */
.overlay{position:fixed;inset:0;background:rgba(15,36,62,.45);z-index:60;display:flex;align-items:flex-end;justify-content:center}
.modal{width:100%;max-width:440px;max-height:92vh;overflow-y:auto;background:var(--cream);border-radius:20px 20px 0 0;padding:20px 18px calc(22px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px rgba(0,0,0,.25)}
.modal h3{font-size:21px;margin-bottom:2px}
.modal .sub{color:var(--muted);font-size:14px;margin:0 0 16px}
.tabs{display:flex;background:var(--cream2);border-radius:11px;padding:4px;margin-bottom:16px}
.tabs button{flex:1;background:none;border:0;padding:10px;border-radius:8px;font-weight:600;font-size:14px;color:var(--muted)}
.tabs button.on{background:var(--card);color:var(--ink)}

/* Tabbar */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:55;display:flex;background:var(--card);border-top:1px solid var(--line);padding:6px calc(6px + env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) calc(6px + env(safe-area-inset-left))}
.tabbar button{flex:1;background:none;border:0;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 2px;font-size:11px;font-weight:600;color:var(--muted);border-radius:10px;min-height:52px}
.tabbar button .ic{font-size:20px;line-height:1}
.tabbar button.plus .ic{width:34px;height:34px;border-radius:11px;background:var(--yellow);color:var(--navy);display:flex;align-items:center;justify-content:center;font-size:21px;font-weight:700}
.tabbar button.on{color:var(--navy)}
.tabspacer{height:74px}

/* Footer & Toast */
.footer{background:var(--navy-deep);color:#A9BCD1;padding:26px 0;font-size:13px}
.footer .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center}
.footer .fb{font-weight:800;color:#fff;font-size:17px}
.footer .build{font-family:'JetBrains Mono',monospace;font-size:11px;opacity:.6}
.selsm{width:auto;min-width:110px;flex:0 0 auto;padding:8px 10px;font-size:13px}
.toast{position:fixed;left:50%;bottom:84px;transform:translateX(-50%);background:var(--navy);color:#fff;padding:12px 18px;border-radius:12px;font-size:14px;font-weight:600;z-index:80;max-width:calc(100% - 32px);text-align:center;box-shadow:0 12px 28px -12px rgba(0,0,0,.5)}

/* ===== Ab Tablet ===== */
@media(min-width:560px){
  .two{grid-template-columns:1fr 1fr}
  .amen{grid-template-columns:1fr 1fr}
  .kindpick{grid-template-columns:1fr 1fr}
}
@media(min-width:900px){
  .headin{height:66px;gap:18px}
  .brand svg{width:32px;height:32px}
  .wordmark{font-size:23px}
  .navlink{display:inline-block}
  .who{display:inline}
  .hero{padding:48px 0 26px}
  .hero h1{font-size:52px;margin-top:14px}
  .hero p{font-size:17px}
  .searchbar{margin-top:24px}
  .searchbar .btn{display:inline-block}
  .cats{flex-wrap:wrap;overflow:visible}
  .stepgrid{grid-template-columns:repeat(4,1fr);gap:22px}
  .stepsh{font-size:23px;margin-bottom:20px}
  .steps{padding:14px 0 32px}
  .grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
  .media,.ph{aspect-ratio:4/3}
  .cardtitle{font-size:16px}
  .sectionhead h2{font-size:24px}
  .dcols{grid-template-columns:1.1fr .9fr;gap:34px}
  .dtitle{font-size:29px}
  .fs{padding:20px}
  .form h2{font-size:27px}
  .card:hover{box-shadow:0 10px 24px -16px rgba(15,36,62,.5)}
  .formfoot .btn{flex:0 0 auto}
  .overlay{align-items:center;padding:20px}
  .modal{border-radius:20px}
  .tabbar,.tabspacer{display:none}
  .toast,.cartfab{bottom:24px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* ===== Profil-Icon-Menü (Header) ===== */
.acctwrap{position:relative;display:inline-block}
.accticon{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--cream2);
  font-size:16px;font-weight:700;color:var(--navy);cursor:pointer;display:flex;align-items:center;justify-content:center}
.accticon.loggedin{background:var(--navy);color:#fff;border-color:var(--navy)}
.acctmenu{position:absolute;right:0;top:46px;min-width:200px;background:#fff;border:1px solid var(--line);
  border-radius:14px;box-shadow:0 12px 40px rgba(0,0,0,.14);padding:6px;z-index:60}
.acctname{padding:8px 12px 6px;font-weight:700;color:var(--navy);font-size:14px;border-bottom:1px solid var(--line);margin-bottom:4px}
.acctitem{display:block;width:100%;text-align:left;background:none;border:0;padding:10px 12px;border-radius:9px;
  font-size:14px;color:var(--ink);cursor:pointer}
.acctitem:hover{background:var(--cream2)}
.acctitem.danger{color:var(--coral)}

/* ===== Auszahlungsleiste ===== */
.payout{background:linear-gradient(135deg,var(--navy),#1c3a5e);color:#fff;border-radius:16px;padding:16px 18px;margin-bottom:18px}
.payout-main{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.payout-lbl{font-size:13px;opacity:.85}
.payout-amt{font-size:24px;font-weight:800;color:var(--gold)}
.payout-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:6px;font-size:13px;opacity:.9;flex-wrap:wrap}
.payout-link{background:none;border:0;color:var(--gold);font-weight:700;cursor:pointer;font-size:13px}

/* ===== Buchungskarten ===== */
.bkcard{border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:12px;background:#fff}
.bkcard-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.bkcard-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap}
.statusdot{font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:20px;white-space:nowrap}
.s-booked{background:var(--teal-soft);color:#1F7A70}
.s-confirmed{background:#DCEAFB;color:#2563EB}
.s-paid,.s-completed{background:#DFF3E4;color:#2E7D46}
.s-cancelled{background:var(--coral-soft);color:#B23A28}

/* ===== Hinweis-Box (Mehrnutzung etc.) ===== */
.notice{border-radius:14px;padding:14px;margin-bottom:14px;border:1px solid var(--line);background:#fff}
.notice-warn{background:#FEF6E7;border-color:#F5D98B}
.notice b{color:var(--navy)}

/* ===== Übergabe-Status ===== */
.handover{margin:8px 0;padding:8px 10px;border-radius:9px;font-size:13px}
.handover.ok{background:var(--teal-soft);color:#1F7A70}
.handover.wait{background:#FEF6E7;color:#8A6D1A}

/* ===== Chat ===== */
.chatbox{max-height:340px;overflow-y:auto;padding:8px 2px;margin-bottom:10px;display:flex;flex-direction:column;gap:8px}
.chatmsg{max-width:80%;align-self:flex-start;background:var(--cream2);border-radius:12px;padding:8px 11px}
.chatmsg.mine{align-self:flex-end;background:var(--navy);color:#fff}
.chatmeta{font-size:10.5px;opacity:.7;margin-bottom:2px}
.chattext{font-size:14px;white-space:pre-wrap;word-break:break-word}
.chatinput{display:flex;gap:8px}
.chatinput .inp{flex:1}

/* ===== Beleg (druckbar) ===== */
.doc{border:1px solid var(--line);border-radius:12px;padding:16px}
@media print{
  body * { visibility:hidden }
  .overlay, .overlay *, .modal, .modal * { visibility:visible }
  .overlay{position:absolute;inset:0;background:#fff}
  .modal{box-shadow:none;max-width:100%}
  .actions, .btn{display:none !important}
}

/* ===== Sammelverrechnung ===== */
.billrow{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line)}
.billrow:first-child{border-top:0}
.billrow input{width:18px;height:18px;accent-color:var(--navy);flex:0 0 auto}
.billmain{flex:1;min-width:0;font-size:14px}

/* ===== Kalender-Zeitraumauswahl ===== */
.day.pick{cursor:pointer}
.day.pick:hover{outline:2px solid var(--navy);outline-offset:-2px}
.day.selend{background:var(--navy) !important;color:#fff !important;font-weight:700}
.day.selmid{background:#DCEAFB !important;color:var(--navy) !important}
.pickrange{display:flex;gap:10px}
.pickfield{flex:1;border:1px solid var(--line);border-radius:10px;padding:8px 12px;background:#fff}
.pickfield .lbl{display:block;font-size:11px;color:var(--muted);margin-bottom:2px}
.pickfield b{font-family:'JetBrains Mono',monospace;font-size:15px;color:var(--navy)}

/* Link-artiger Button */
.linklike{background:none;border:0;color:var(--teal);font-weight:600;font-size:13.5px;cursor:pointer;text-decoration:underline;width:100%;text-align:center}

/* Modal-Schliesskreuz */
.modalx{position:absolute;top:12px;right:14px;background:none;border:0;font-size:24px;line-height:1;color:var(--muted);cursor:pointer;z-index:2}
.modalx:hover{color:var(--ink)}
.modal{position:relative}

/* ===== Dokumentation Übergabe/Rücknahme ===== */
.docprev{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.docprev-item{font-size:11px;background:var(--cream2);padding:3px 8px;border-radius:6px;color:var(--muted)}
.sigpad{border:1px dashed var(--line);border-radius:10px;width:100%;height:150px;touch-action:none;background:#fff;display:block}
.sigrow{display:flex;gap:8px;margin-top:8px;align-items:center}
.sigrow .inp{flex:1}
.sigimg{max-width:200px;border:1px solid var(--line);border-radius:8px;background:#fff}
.pinbox{background:var(--gold-soft,#FEF3D6);border:1px solid #F5D98B;border-radius:10px;padding:8px 12px;margin:8px 0;font-size:14px}
.pinbox b{font-size:18px;letter-spacing:3px;color:var(--navy)}
.docphotos{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.docphotos img{width:120px;height:120px;object-fit:cover;border-radius:10px;border:1px solid var(--line)}

/* ===== Rechnung Header/Footer/Tabelle (deinfest CI) ===== */
.invoice{background:#fff;padding:6px;font-family:'Rubik',system-ui,sans-serif;color:var(--navy)}
.inv-brand{display:flex;justify-content:space-between;align-items:center;border-bottom:3px solid var(--navy);padding-bottom:12px;margin-bottom:18px}
.inv-logo{font-size:22px;font-weight:800;color:var(--navy);letter-spacing:-.02em}
.inv-logo b{color:var(--yellow,#FBBF24)}
.inv-tag{font-size:12px;color:var(--muted);font-weight:600}
.inv-head{display:flex;justify-content:space-between;gap:16px;margin-bottom:16px;font-size:13.5px;line-height:1.5}
.inv-head .place,.inv-to .place{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700}
.inv-to{margin-bottom:18px;font-size:13.5px;line-height:1.5;padding:10px 12px;background:var(--cream);border-radius:10px}
.inv-table{width:100%;border-collapse:collapse;margin:16px 0}
.inv-table th{text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);border-bottom:2px solid var(--navy);padding:8px 0}
.inv-table td{padding:9px 0;border-bottom:1px solid var(--line);font-size:14px;vertical-align:top}
.inv-table .inv-sub td{border-bottom:none;padding:3px 0;color:var(--navy-soft)}
.inv-table .inv-total td{border-top:2px solid var(--navy);border-bottom:none;padding-top:10px;font-size:16px;color:var(--navy)}
.inv-note{font-size:12px;color:var(--navy-soft);margin:16px 0;padding:12px 14px;background:var(--teal-soft);border-radius:10px;line-height:1.5}
.qrbill{display:flex;border-top:2px dashed var(--navy);margin-top:20px;background:#fff}
.qrbill-receipt{width:38%;padding:12px 12px 12px 0;border-right:2px dashed var(--navy);font-size:9px;line-height:1.35}
.qrbill-pay{flex:1;padding:12px 0 12px 14px;font-size:10px;line-height:1.35}
.qrbill b{font-size:11px;display:block;margin-bottom:8px;color:var(--navy)}
.qrb-sec{margin-bottom:8px}
.qrb-sec small{color:var(--muted);font-weight:700}
.qrb-amt,.qrb-row{display:flex;gap:16px;margin-top:8px}
.qrb-amt2{display:flex;gap:14px;flex-direction:column}
@media print{
  .invoice{padding:0}
}

/* ===== Rechnung Header/Footer/Tabelle ===== */
.inv-brand{display:flex;justify-content:space-between;align-items:baseline;border-bottom:3px solid var(--navy,#0F243E);padding-bottom:10px;margin-bottom:16px}
.inv-logo{font-size:20px;font-weight:800;color:var(--navy,#0F243E)}
.inv-logo b{color:#FBBF24}
.inv-tag{font-size:12px;color:#888}
.inv-table{width:100%;border-collapse:collapse;margin:14px 0}
.inv-table th{text-align:left;font-size:11px;text-transform:uppercase;color:#888;border-bottom:1px solid #ccc;padding:6px 0}
.inv-table td{padding:8px 0;border-bottom:1px solid #eee;font-size:14px;vertical-align:top}
.inv-table .inv-sub td{border-bottom:none;padding:3px 0;color:#555}
.inv-table .inv-total td{border-top:2px solid #000;border-bottom:none;padding-top:8px;font-size:15px}
.inv-note{font-size:12px;color:#555;margin:14px 0;padding:10px;background:var(--cream2,#f5f0e8);border-radius:8px}

/* ===== Benachrichtigungs-Punkt ===== */
.notifdot{position:absolute;top:-2px;right:-2px;width:11px;height:11px;border-radius:50%;background:var(--coral,#F26D5C);border:2px solid var(--cream,#F7F3EA);display:block}
.acctbtn,#acctBtn{position:relative}
.acctitem{position:relative}
.acctitem .notifdot{position:static;display:inline-block;margin-left:6px;top:0;right:0;border:none;width:9px;height:9px;vertical-align:middle}
.navlink{position:relative}

/* ===== Foto-Aufnahme-Button (mobil-optimiert) ===== */
.photobtn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:100%;padding:22px 16px;border:2px dashed var(--teal,#2BA99C);border-radius:14px;background:var(--teal-soft,#DCF1EE);color:var(--navy,#0F243E);cursor:pointer;transition:.15s}
.photobtn:active{transform:scale(.98)}
.photobtn-icon{font-size:34px;line-height:1}
.photobtn-text{font-weight:700;font-size:16px}
.photobtn-sub{font-size:12px;color:var(--muted,#6B7C90)}
.docprev{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.docthumb{position:relative;width:80px;height:80px}
.docthumb img{width:80px;height:80px;object-fit:cover;border-radius:10px;border:1px solid var(--line,#E2DCCE)}
.docthumb-x{position:absolute;top:-6px;right:-6px;width:22px;height:22px;border-radius:50%;background:var(--coral,#F26D5C);color:#fff;border:2px solid #fff;font-size:14px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}

/* ===== Zeitraum-Änderung Banner ===== */
.dcbanner{border-radius:10px;padding:10px 12px;margin:8px 0;font-size:13px}
.dcbanner.wait{background:var(--gold-soft,#FEF3D6);border:1px solid #F5D98B;color:var(--navy)}
.dcbanner.act{background:var(--teal-soft,#DCF1EE);border:1px solid var(--teal,#2BA99C);color:var(--navy)}

/* Logo in Rechnung + Header-Zeltlogo-Grösse */
.inv-logo{display:flex;align-items:center;gap:8px}
.inv-logo-img{height:34px;width:auto}
.tentlogo{height:38px;width:auto}

/* ===== Teilen ===== */
.sharebtn{display:inline-flex;align-items:center;gap:6px;margin:10px 0;padding:8px 16px;border:1.5px solid var(--navy,#12345A);border-radius:999px;background:#fff;color:var(--navy,#12345A);font-weight:700;font-size:14px;cursor:pointer;transition:.15s}
.sharebtn:active{transform:scale(.97)}
.sharebtn:hover{background:var(--navy,#12345A);color:#fff}
.shareic{font-size:16px}
.sharegrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}
.sharetile{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px;border-radius:12px;text-decoration:none;color:var(--navy,#12345A);font-weight:600;font-size:13px;background:var(--cream2,#F5F0E6);transition:.15s}
.sharetile:active{transform:scale(.97)}
.sharetile span{font-size:26px}
.sharetile.wa:hover{background:#DCF8C6}
.sharetile.tg:hover{background:#D6ECFA}
.sharetile.fb:hover{background:#DBE7F6}
.sharetile.mail:hover{background:#F3E6D6}
.copyrow{display:flex;gap:8px;align-items:center;margin-top:6px}
.copyrow .inp{flex:1;font-size:12px}

/* ===== Wie funktioniert's ===== */
.how{max-width:760px}
.howbanner{background:var(--gold-soft,#FEF3D6);border:1px solid #F5D98B;border-radius:14px;padding:16px 18px;margin-top:16px;font-size:15px;line-height:1.5}
.howsteps{display:flex;flex-direction:column;gap:14px;margin-top:14px}
.howstep{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line,#E2DCCE);border-radius:14px;padding:16px}
.howstep .hn{flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:var(--navy,#12345A);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center}
.howstep b{display:block;margin-bottom:2px}
.howstep p{margin:0;color:var(--muted,#6B7C90);font-size:14px}
.howgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.howcard{background:#fff;border:1px solid var(--line,#E2DCCE);border-radius:14px;padding:16px;text-align:center}
.howcard span{font-size:30px;display:block;margin-bottom:6px}
.howcard b{display:block;margin-bottom:4px}
.howcard p{margin:0;color:var(--muted,#6B7C90);font-size:13px}
.howcta{text-align:center;background:var(--teal-soft,#DCF1EE);border-radius:16px;padding:24px;margin-top:24px}
.howcta h3{margin-bottom:12px}
@media(max-width:520px){.howgrid{grid-template-columns:1fr}}

/* Pull-to-Refresh (PWA) */
.ptr-indicator{position:fixed;top:-40px;left:50%;transform:translateX(-50%);width:36px;height:36px;border-radius:50%;background:var(--navy,#12345A);color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;opacity:0;z-index:9999;transition:opacity .2s;box-shadow:0 2px 8px rgba(0,0,0,.2)}
.ptr-indicator.spin{animation:ptrspin .6s linear infinite}
@keyframes ptrspin{to{transform:translateX(-50%) translateY(50px) rotate(360deg)}}

/* Teilen-Vorschaukarte */
.sharepreview{display:flex;gap:12px;align-items:center;background:#fff;border:1px solid var(--line,#E2DCCE);border-radius:12px;padding:10px;margin:6px 0 14px}
.sharepreview-img{width:64px;height:64px;object-fit:cover;border-radius:9px;flex:0 0 auto}
.sharepreview-ph{width:64px;height:64px;border-radius:9px;background:var(--cream2,#F5F0E6);display:flex;align-items:center;justify-content:center;font-size:30px;flex:0 0 auto}
.sharepreview-body{display:flex;flex-direction:column;gap:3px;min-width:0}
.sharepreview-body b{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sharepreview-body span{font-size:13px;color:var(--muted,#6B7C90)}

/* Schadenspositionen Rücknahme */
.dmgrow{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--line,#E2DCCE)}
.dmgrow-lbl{display:flex;flex-direction:column;font-size:14px;font-weight:600}
.dmgrow-lbl small{font-weight:400;color:var(--muted,#6B7C90);font-size:12px}
.dmgrow-qty{display:flex;align-items:center;gap:12px}
.qtybtn{width:32px;height:32px;border-radius:8px;border:1px solid var(--navy,#12345A);background:#fff;color:var(--navy,#12345A);font-size:18px;font-weight:700;cursor:pointer;line-height:1}
.qtybtn:active{transform:scale(.94)}
.qtyval{min-width:20px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}
.dmgtotal{margin-top:10px;padding:10px 12px;background:var(--gold-soft,#FEF3D6);border:1px solid #F5D98B;border-radius:10px;font-size:14px;text-align:center}
.docdmg{margin-top:8px;padding:10px;background:var(--cream2,#F5F0E6);border-radius:10px}
.docdmg-h{font-weight:700;font-size:13px;margin-bottom:6px}

/* Sprachumschalter im Menü */
.langswitch{display:flex;gap:4px;padding:8px 10px;border-top:1px solid var(--line,#E2DCCE);margin-top:4px}
.langswitch button{flex:1;padding:6px 0;border:1px solid var(--line,#E2DCCE);background:#fff;border-radius:7px;font-size:12px;font-weight:700;color:var(--muted,#6B7C90);cursor:pointer}
.langswitch button.on{background:var(--navy,#12345A);color:#fff;border-color:var(--navy,#12345A)}

/* ===== Serverseitige SEO-Seiten (Progressive Enhancement) ===== */
.seo-detail{padding:20px 0 60px}
.crumbs{font-size:13px;color:var(--muted,#6B7C90);margin-bottom:16px}
.crumbs a{color:var(--navy,#12345A);text-decoration:none}
.crumbs span{margin:0 4px}
.seo-listing{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.seo-main{width:100%;height:auto;border-radius:14px;object-fit:cover;background:var(--cream2,#F5F0E6)}
.seo-noimg{display:flex;align-items:center;justify-content:center;font-size:64px;aspect-ratio:4/3}
.seo-thumbs{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.seo-thumbs img{width:80px;height:60px;object-fit:cover;border-radius:8px}
.seo-info h1{font-size:26px;margin:0 0 8px}
.seo-place{color:var(--muted,#6B7C90);margin:0 0 12px}
.seo-price{font-size:22px;margin:0 0 16px}
.seo-desc{line-height:1.6;margin-bottom:20px;white-space:pre-line}
.seo-cta{margin:16px 0}
.seo-hint{font-size:13px;color:var(--muted,#6B7C90)}
.footlinks{display:flex;gap:16px}
.footlinks a{color:inherit;text-decoration:none;opacity:.85}
.footlinks a:hover{opacity:1;text-decoration:underline}
@media(max-width:720px){.seo-listing{grid-template-columns:1fr}}

/* ===== SEO-Kategorieseiten ===== */
.seo-cat{padding:20px 0 60px}
.seo-cat-head h1{font-size:28px;margin:0 0 6px}
.seo-cat-sub{color:var(--muted,#6B7C90);margin:0 0 20px}
.seo-ortnav{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:24px;font-size:14px}
.seo-ortnav span{color:var(--muted,#6B7C90)}
.seo-ortnav a{padding:5px 12px;background:var(--cream2,#F5F0E6);border-radius:999px;text-decoration:none;color:var(--navy,#12345A);font-weight:600}
.seo-ortnav a:hover{background:var(--gold-soft,#FEF3D6)}
.seo-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}
.seo-card{background:var(--card,#fff);border:1px solid var(--line,#E2DCCE);border-radius:14px;overflow:hidden;transition:.15s}
.seo-card:hover{box-shadow:0 6px 20px rgba(0,0,0,.08);transform:translateY(-2px)}
.seo-card a{text-decoration:none;color:inherit;display:block}
.seo-card img{width:100%;height:170px;object-fit:cover;display:block}
.seo-card-noimg{width:100%;height:170px;display:flex;align-items:center;justify-content:center;font-size:48px;background:var(--cream2,#F5F0E6)}
.seo-card-body{padding:14px}
.seo-card-body h2{font-size:17px;margin:0 0 6px;line-height:1.3}
.seo-card-place{color:var(--muted,#6B7C90);font-size:13px;margin:0 0 6px}
.seo-card-price{margin:0;font-size:15px}
.seo-empty{padding:40px 0;color:var(--muted,#6B7C90);text-align:center}
.seo-empty a{color:var(--navy,#12345A)}

/* ===== SEO-Statikseiten (FAQ, Howto, Über uns) ===== */
.seo-static{max-width:760px;padding:20px 0 60px}
.seo-static h1{font-size:30px;margin:12px 0 16px}
.seo-static h2{font-size:20px;margin:28px 0 12px}
.seo-static p{line-height:1.65;margin:0 0 14px}
.seo-lead{font-size:18px;color:var(--muted,#4a5a6a)}
.seo-steps{padding-left:20px;line-height:1.7}
.seo-steps li{margin-bottom:10px}
.seo-benefits{list-style:none;padding:0}
.seo-benefits li{padding:10px 0;border-bottom:1px solid var(--line,#E2DCCE)}
.seo-faq{margin:20px 0}
.seo-faq-item{border:1px solid var(--line,#E2DCCE);border-radius:12px;padding:4px 16px;margin-bottom:10px;background:var(--card,#fff)}
.seo-faq-item summary{font-weight:700;cursor:pointer;padding:12px 0;list-style:none}
.seo-faq-item summary::-webkit-details-marker{display:none}
.seo-faq-item summary::before{content:"＋";margin-right:10px;color:var(--gold,#F4B430);font-weight:800}
.seo-faq-item[open] summary::before{content:"－"}
.seo-faq-item p{padding:0 0 14px;color:var(--muted,#4a5a6a)}
.seo-static-cta{margin-top:28px}

/* ===== SEO-Startseite ===== */
.seo-home{padding:20px 0 60px}
.seo-hero{text-align:center;padding:30px 0 24px}
.seo-hero h1{font-size:34px;margin:0 0 12px}
.seo-hero h1 em{color:var(--gold,#F4B430);font-style:normal}
.seo-hero p{font-size:17px;color:var(--muted,#4a5a6a);max-width:560px;margin:0 auto}
.seo-cats{list-style:none;padding:0;margin:16px 0 36px;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.seo-cats a{display:flex;flex-direction:column;align-items:center;gap:8px;padding:20px;background:var(--card,#fff);border:1px solid var(--line,#E2DCCE);border-radius:14px;text-decoration:none;color:var(--navy,#12345A);font-weight:600;text-align:center;transition:.15s}
.seo-cats a:hover{background:var(--gold-soft,#FEF3D6);transform:translateY(-2px)}
.seo-cat-emoji{font-size:32px}
.seo-home-info{max-width:680px;margin:0 auto;text-align:center}
.seo-home-info p{line-height:1.65;color:var(--muted,#4a5a6a)}

/* Mietvertrag: Häkchen + Modal */
.contractcheck{display:flex;gap:10px;align-items:flex-start;margin:14px 0;font-size:13px;line-height:1.5;cursor:pointer}
.contractcheck input{margin-top:2px;flex-shrink:0;width:18px;height:18px}
.contractcheck a{color:var(--navy,#12345A);font-weight:600;text-decoration:underline}
.contractmodal h3{margin:0 0 6px}
.contracttext{max-height:50vh;overflow-y:auto;background:var(--cream2,#F5F0E6);border:1px solid var(--line,#E2DCCE);border-radius:10px;padding:16px;margin:12px 0;font-size:13px;line-height:1.6;white-space:normal}

/* Dynamischer Mietvertrag */
.contract-doc h4{margin:0 0 12px;font-size:16px}
.contract-meta{width:100%;border-collapse:collapse;margin-bottom:16px;font-size:13px}
.contract-meta td{padding:6px 8px;border-bottom:1px solid var(--line,#E2DCCE);vertical-align:top}
.contract-meta td:first-child{color:var(--muted,#6B7C90);width:38%;font-weight:600}
.contract-clauses{font-size:13px;line-height:1.6;margin-bottom:12px}

/* Bewertungen */
.stars{color:var(--gold,#F4B430);letter-spacing:1px}
.ratemodal h3{margin:0 0 6px}
.ratestars{display:flex;gap:8px;justify-content:center;margin:20px 0}
.ratestar{font-size:38px;line-height:1;background:none;border:none;cursor:pointer;color:var(--gold,#F4B430);padding:0}
.ratestar.on{transform:scale(1.05)}
.rated-badge{font-size:13px;color:var(--gold,#F4B430);font-weight:600;align-self:center}

/* Verifikations-Badges */
.vbadge{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap}
.vbadge.silver{background:#E8EAED;color:#5A6472;border:1px solid #C8CDD4}
.vbadge.gold{background:#FEF3D6;color:#9A7B1A;border:1px solid #F0D488}
.vbadge.none{background:#F3F1EC;color:#8A8578;border:1px solid #E2DCCE}
.verifystatus{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0;padding:12px;background:var(--cream2,#F5F0E6);border-radius:10px;font-size:13px}
.verifystatus small{color:var(--muted,#6B7C90)}

/* Rechtstexte */
.legal-draft-note{background:#FEF3D6;border:1px solid #F0D488;border-radius:10px;padding:12px 16px;margin:0 0 20px;font-size:13px;color:#9A7B1A}
.legal-draft-note + h2{margin-top:0}

/* Warenkorb: Zeitraum pro Position */
.cartrow-period{display:flex;align-items:center;gap:10px;margin-top:6px;flex-wrap:wrap}
.periodinfo{font-size:13px;color:var(--navy,#12345A);font-weight:600}
.periodinfo.muted{color:var(--muted,#6B7C90);font-weight:400}
.btn-xs{padding:2px 10px;font-size:12px}
.calselinfo{text-align:center;font-weight:600;color:var(--navy,#12345A);margin:10px 0;min-height:20px}
.periodmodal h3{margin:0 0 6px}

/* PLZ-/Ort-Vorschläge */
.plzsug{position:absolute;left:0;right:0;top:100%;z-index:50;background:#fff;border:1px solid var(--line,#E2DCCE);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12);margin-top:4px;max-height:240px;overflow-y:auto}
.plzsug-item{display:block;width:100%;text-align:left;padding:10px 14px;background:none;border:none;border-bottom:1px solid var(--cream2,#F5F0E6);cursor:pointer;font-size:14px}
.plzsug-item:last-child{border-bottom:none}
.plzsug-item:hover{background:var(--cream2,#F5F0E6)}
.plzsug-item b{color:var(--navy,#12345A);margin-right:6px}

/* Kaution im Inserat */
.ddeposit{font-size:14px;color:var(--muted,#6B7C90);margin:2px 0 8px;font-weight:600}
.ddeposit small{font-weight:400}

/* Standort-Filter in der Suche */
.locrow{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-top:10px}
.locfield{position:relative;flex:1;min-width:200px}
.radiusfield{display:flex;flex-direction:column;gap:4px;min-width:180px}
.radiuslbl{font-size:13px;color:var(--muted,#6B7C90)}
.radiusfield input[type=range]{width:100%;accent-color:var(--yellow,#FBBF24)}
.chip.dist.near{background:#E3F3E8;color:#2C7A4B;border:1px solid #B8E0C6}
.chip.dist.far{background:#F3E3E3;color:#9A4A4A;border:1px solid #E0B8B8}
.card-unreachable{opacity:.5;filter:grayscale(.4)}
.card-unreachable:hover{opacity:.75}
.unreach-note{font-size:11px;color:#9A4A4A;margin:4px 0;line-height:1.3}

/* Link vom Buchungstitel zum Inserat */
.bklink{color:var(--navy,#12345A);text-decoration:none;border-bottom:1px dotted currentColor}
.bklink:hover{border-bottom-style:solid}

/* Vermieter: offene Buchung bestätigen */
.pendbox{background:#FFF8E6;border:1px solid #F0DCA8;border-radius:12px;padding:12px;margin:10px 0}
.pendtitle{font-weight:700;font-size:14px;margin-bottom:4px}
.pendhint{font-size:12.5px;color:var(--muted,#6B7C90);margin:0 0 10px;line-height:1.4}
.chip.expresschip{background:#FDE9D0;color:#9A5B12;border:1px solid #F0C58A;font-weight:600}
.expressnote{background:#FDF3E3;border:1px solid #F0DCA8;border-radius:10px;padding:10px;color:#7A4E12}
.statusdot.s-pending{background:#FFF3D6;color:#8A6410;border:1px solid #F0DCA8}

/* Hinweis unter dem Preis (Servicegebühr inbegriffen) */
.pricenote{font-size:12px;color:var(--muted,#6B7C90);margin-top:2px;line-height:1.35}
.seo-pricenote{font-size:12px;color:#6B7C90;margin:2px 0 0;line-height:1.35}

/* Kautionshinweis in der Kostenübersicht */
.depnote{margin-top:10px;font-size:12.5px;line-height:1.45;color:#7A4E12;background:#FDF3E3;border:1px solid #F0DCA8;border-radius:10px;padding:10px}

/* Obligatorische Zuschläge im Preis */
.reqadd{display:block;font-weight:500;font-size:11.5px;color:#7A4E12;margin-top:2px}
.reqflat{font-size:13.5px;color:#7A4E12;margin-top:2px}
.seo-reqflat{font-size:13px;color:#7A4E12;margin:2px 0 0}