/* Giving Form Kalender – Material-Stil (angelehnt an die Google-Kalender-App)
   ausgelegt für iPhone 13 mini (375×812, Notch + Home-Leiste) und Galaxy Z Flip 6 (≈412×1000) */
.kal{--p:#2f6b57;--p-d:#215442;--pc:#d3ebe0;--opc:#0f3a2b;--sf:#fff;--sf2:#f2f5f3;--sf3:#e8eeea;--tx:#1f1f1f;--tx2:#5f6368;--ln:#e3e6e4;--rot:#d93025;
  --kh:calc(3.5rem + env(safe-area-inset-top));
  background:var(--sf);color:var(--tx);font:0.875rem/1.4 Roboto,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  overscroll-behavior-y:none;-webkit-tap-highlight-color:transparent;padding-bottom:env(safe-area-inset-bottom)}
.kal button{font:inherit;font-weight:500;background:none;border:0;border-radius:0;padding:0;color:inherit;cursor:pointer}
.kal input,.kal select,.kal textarea{font:inherit;font-size:1rem;color:var(--tx)}
.ic{width:1.5rem;height:1.5rem;fill:currentColor;flex:none;display:block}
.spacer{flex:1}

/* Kopfleiste */
.kkopf{position:sticky;top:0;z-index:20;height:var(--kh);padding:env(safe-area-inset-top) 0.25rem 0;display:flex;align-items:center;background:var(--sf)}
.kkopf.schatten{box-shadow:0 1px 0 var(--ln)}
.ib{width:3rem;height:3rem;border-radius:50%!important;display:grid;place-items:center;color:var(--tx2)!important}
.kkopf .ib{width:2.6rem;height:2.75rem}
.ib:active{background:var(--sf3)!important}
.titel{display:flex;align-items:center;gap:2px;font-size:1.2rem!important;font-weight:400!important;padding:0.375rem 0.25rem 0.375rem 0.375rem!important;border-radius:1.25rem!important;white-space:nowrap;min-width:0}
.titel:active{background:var(--sf3)!important}
#titel{overflow:hidden;text-overflow:ellipsis}
#pfeil .ic{transition:transform .2s;color:var(--tx2)}
.miniAuf #pfeil .ic{transform:rotate(180deg)}
.heuteKnopf svg text{font:700 0.5313rem Roboto,sans-serif;fill:currentColor}
.avatar{width:2rem;height:2rem;flex:none;border-radius:50%!important;background:var(--p)!important;color:#fff!important;font-size:0.9375rem!important;margin:0 0.5rem 0 0.25rem}

/* Mini-Monat (Klapp-Kalender unter dem Titel) */
.mini{position:sticky;top:var(--kh);z-index:19;background:var(--sf);overflow:hidden;max-height:0;transition:max-height .25s ease;box-shadow:0 1px 0 var(--ln)}
.mini.an{max-height:21.25rem}
.mini .mk{display:flex;align-items:center;padding:0.25rem 0.5rem 0 1.25rem;font-weight:500}
.mini .mg{display:grid;grid-template-columns:repeat(7,1fr);padding:0 0.625rem 0.625rem;text-align:center}
.mini .mw{font-size:0.6875rem;color:var(--tx2);padding:0.375rem 0 2px}
.mini .md{height:2.5rem;display:grid;place-items:center;position:relative;font-size:0.8125rem}
.mini .md span{width:2rem;height:2rem;line-height:2rem;border-radius:50%}
.mini .md.aus{color:#b0b4b1}
.mini .md.heute span{color:var(--p);font-weight:700}
.mini .md.sel span{background:var(--p);color:#fff;font-weight:700}
.mini .md i{position:absolute;bottom:0.1875rem;width:0.25rem;height:0.25rem;border-radius:50%;background:var(--tx2)}
.mini .md.sel i{display:none}

#inhalt{min-height:calc(100dvh - var(--kh))}

/* Terminübersicht (wie „Terminübersicht“ bei Google) */
.pmonat{margin:0.5rem 0.75rem 0.25rem;height:5.25rem;border-radius:1rem;display:flex;align-items:flex-end;padding:0 1.125rem 0.75rem;color:#fff;font-size:1.25rem;font-weight:500;
  background:linear-gradient(135deg,var(--m1),var(--m2));position:relative;overflow:hidden}
.pmonat::after{content:"";position:absolute;right:-1.875rem;top:-2.5rem;width:9.375rem;height:9.375rem;border-radius:50%;background:rgba(255,255,255,.12)}
.pwoche{padding:0.875rem 0 0.25rem 4.5rem;font-size:0.75rem;color:var(--tx2)}
.ptag{display:flex;padding:0.25rem 0.75rem 0.25rem 0;scroll-margin-top:calc(var(--kh) + 0.5rem)}
.pdat{width:4.5rem;flex:none;text-align:center;padding-top:2px}
.pdat small{display:block;font-size:0.6875rem;color:var(--tx2);font-weight:500}
.pdat b{display:inline-block;font-size:1.25rem;font-weight:400;width:2.25rem;height:2.25rem;line-height:2.25rem;border-radius:50%}
.ptag.heute .pdat small{color:var(--p)}
.ptag.heute .pdat b{background:var(--p);color:#fff;font-weight:500}
.pevs{flex:1;min-width:0;display:flex;flex-direction:column;gap:0.25rem;padding-top:2px}
.chip{background:var(--c);color:var(--t);border-radius:0.5rem;padding:0.5rem 0.75rem;min-height:2.375rem;line-height:1.3}
.chip:active{filter:brightness(.92)}
.chip b{display:block;font-weight:500;font-size:0.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chip span{display:block;font-size:0.75rem;opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chip.ganz{min-height:0;padding:0.375rem 0.75rem}
.chip.vorbei{opacity:.6}
.pjetzt{position:relative;height:2px;background:var(--rot);margin:0.1875rem 0}
.pjetzt::before{content:"";position:absolute;left:-0.3125rem;top:-0.25rem;width:0.625rem;height:0.625rem;border-radius:50%;background:var(--rot)}
.pleer{color:var(--tx2);padding:0.5625rem 2px;font-size:0.8125rem}
.pende{padding:1.875rem;text-align:center;color:var(--tx2);font-size:0.8125rem}

/* Tag / 3 Tage / Woche */
.tkopf{display:grid;position:sticky;top:var(--kh);background:var(--sf);z-index:10}
.tkopf>div{text-align:center;padding:2px 0 0.375rem}
.tkopf small{display:block;font-size:0.6875rem;color:var(--tx2);font-weight:500;text-transform:uppercase}
.tkopf b{display:inline-block;font-size:1.25rem;font-weight:400;width:2.25rem;height:2.25rem;line-height:2.25rem;border-radius:50%}
.tkopf .heute small{color:var(--p)}.tkopf .heute b{background:var(--p);color:#fff}
.tkopf .kw{font-size:0.6875rem;color:var(--tx2);align-self:end;padding-bottom:0.625rem}
.tganz{display:grid;border-bottom:1px solid var(--ln);position:sticky;top:calc(var(--kh) + 3.625rem);background:var(--sf);z-index:9}
.tganz>div{padding:0 1px 0.25rem;min-width:0}
.gz{background:var(--c);color:var(--t);border-radius:0.25rem;padding:2px 0.375rem;margin-bottom:2px;font-size:0.75rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.traster{display:grid;position:relative}
.tstd{font-size:0.625rem;color:var(--tx2);text-align:right;padding-right:0.375rem;transform:translateY(-0.4375rem)}
.tspalte{position:relative;border-left:1px solid var(--ln)}
.tlinie{border-top:1px solid var(--ln)}
.tev{position:absolute;border-radius:0.375rem;padding:0.1875rem 0.3125rem;font-size:0.75rem;overflow:hidden;background:var(--c);color:var(--t);line-height:1.25;border:1px solid var(--sf)}
.tev.vorbei{opacity:.62}
.tev b{display:block;font-weight:500;overflow:hidden;text-overflow:ellipsis}
.tev span{font-size:0.6875rem;opacity:.9}
.woche .tev{padding:2px 0.1875rem;font-size:0.6563rem}.woche .tev b{white-space:normal;hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word;line-height:1.15}.woche .tev span{display:none}
.woche .tkopf b{font-size:1rem;width:1.875rem;height:1.875rem;line-height:1.875rem}
.woche .gz{font-size:0.625rem;padding:1px 0.1875rem}
.tjetzt{position:absolute;left:0;right:0;height:2px;background:var(--rot);z-index:3}
.tjetzt::before{content:"";position:absolute;left:-0.375rem;top:-0.3125rem;width:0.75rem;height:0.75rem;border-radius:50%;background:var(--rot)}

/* Monat */
.mkopf{display:grid;grid-template-columns:repeat(7,1fr);position:sticky;top:var(--kh);background:var(--sf);z-index:5}
.mkopf div{text-align:center;font-size:0.6875rem;color:var(--tx2);font-weight:500;padding:0.25rem 0}
.mgrid{display:grid;grid-template-columns:repeat(7,1fr)}
.mtag{border-top:1px solid var(--ln);border-left:1px solid var(--ln);padding:2px 1px;overflow:hidden;text-align:center;min-width:0}
.mtag:nth-child(7n+1){border-left:0}
.mn{display:inline-block;font-size:0.75rem;width:1.375rem;height:1.375rem;line-height:1.375rem;border-radius:50%;margin-bottom:1px}
.mtag.aus .mn{color:#b0b4b1}
.mtag.heute .mn{background:var(--p);color:#fff;font-weight:500}
.mev{text-align:left;white-space:nowrap;overflow:hidden;text-overflow:clip;border-radius:0.1875rem;padding:0 0.1875rem;margin:0 0 2px;font-size:0.625rem;line-height:0.9375rem;background:var(--c);color:var(--t)}
.mev.zeit{background:none;color:var(--tx);padding-left:2px}
.mev.zeit::before{content:"";display:inline-block;width:0.3125rem;height:0.3125rem;border-radius:50%;background:var(--c);margin-right:2px;vertical-align:1px}
.mmehr{font-size:0.625rem;color:var(--tx2);text-align:left;padding-left:0.1875rem}

/* Schwebeknopf */
.fab{position:fixed;right:1rem;bottom:calc(1rem + env(safe-area-inset-bottom));width:3.5rem;height:3.5rem;border-radius:1rem!important;background:var(--pc)!important;color:var(--opc)!important;
  display:grid;place-items:center;box-shadow:0 0.1875rem 0.3125rem rgba(0,0,0,.18),0 0.375rem 1rem rgba(0,0,0,.12);z-index:15}
.fab .ic{width:1.75rem;height:1.75rem}
.fab:active{filter:brightness(.95)}

/* Seitenmenü */
.lade-hg{position:fixed;inset:0;background:rgba(0,0,0,.32);opacity:0;pointer-events:none;transition:opacity .2s;z-index:40}
.lade-hg.an{opacity:1;pointer-events:auto}
.lade{position:fixed;top:0;bottom:0;left:0;width:min(20rem,84vw);background:var(--sf);z-index:41;transform:translateX(-102%);transition:transform .22s ease;overflow-y:auto;
  border-radius:0 1rem 1rem 0;padding:calc(0.75rem + env(safe-area-inset-top)) 0.75rem calc(1rem + env(safe-area-inset-bottom))}
.lade.an{transform:none}
.lkopf{display:flex;align-items:center;gap:0.75rem;padding:0.5rem 0.75rem 0.875rem;font-size:1.25rem}
.lkopf img{width:2rem;height:2rem;border-radius:0.5rem}
.lkopf b{font-weight:400}.lkopf small{color:var(--tx2);font-size:0.8125rem}
.lp{display:flex;align-items:center;gap:1rem;width:100%;height:3rem;padding:0 1rem!important;border-radius:1.5rem!important;font-size:0.875rem!important;text-align:left;color:var(--tx)!important}
.lp .ic{color:var(--tx2)}
.lp.an{background:var(--pc)!important;color:var(--opc)!important;font-weight:600!important}.lp.an .ic{color:var(--opc)}
.lp:active{background:var(--sf3)!important}
.lade hr{border:0;border-top:1px solid var(--ln);margin:0.5rem 0.75rem}
.lgruppe{font-size:0.8125rem;font-weight:500;color:var(--tx2);padding:0.75rem 1rem 0.25rem}
.lkal{display:flex;align-items:center;gap:0.875rem;width:100%;min-height:2.75rem;padding:0 1rem!important;border-radius:1.375rem!important;text-align:left}
.lkal:active{background:var(--sf3)!important}
.lkal .cb{width:1.125rem;height:1.125rem;border-radius:0.1875rem;border:2px solid var(--c);display:grid;place-items:center;flex:none}
.lkal .cb .ic{width:1rem;height:1rem;color:#fff;display:none}
.lkal.an .cb{background:var(--c)}.lkal.an .cb .ic{display:block}
.lkal span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Vollbild-Seiten (Termin, Bearbeiten, Suche, Einstellungen) */
.seite{position:fixed;inset:0;background:var(--sf);z-index:50;overflow-y:auto;transform:translateY(1.5rem);opacity:0;transition:transform .2s ease,opacity .2s ease;padding-bottom:calc(1.875rem + env(safe-area-inset-bottom))}
.seite.an{transform:none;opacity:1}
.sbar{position:sticky;top:0;z-index:2;background:var(--sf);height:var(--kh);padding:env(safe-area-inset-top) 0.25rem 0;display:flex;align-items:center;gap:2px}
.sbar input{flex:1;border:0;outline:0;font-size:1.125rem!important;padding:0.5rem 0.25rem;background:none;min-width:0}
.speichern{background:var(--p)!important;color:#fff!important;border-radius:1.25rem!important;padding:0.5625rem 1.375rem!important;margin-right:0.5rem;font-weight:600!important}
.speichern:disabled{opacity:.5}
.zeile2{display:flex;gap:1.25rem;padding:0.75rem 1.25rem;align-items:flex-start;min-height:3rem}
.zeile2>.ic{color:var(--tx2);margin-top:1px}
.zeile2>div{flex:1;min-width:0}
.zeile2 small{display:block;color:var(--tx2);font-size:0.8125rem}
.trenn{border-top:1px solid var(--ln);margin:0.25rem 0}
/* Termin-Ansicht */
.dtitel{display:flex;gap:1.25rem;padding:0.25rem 1.25rem 0.875rem}
.quadrat{width:1.125rem;height:1.125rem;border-radius:0.3125rem;flex:none;margin-top:0.4375rem}
.dtitel h1{font-size:1.375rem;font-weight:400;margin:0 0 0.25rem;line-height:1.3;word-break:break-word}
.dtitel div{color:var(--tx2)}
.meet{display:flex;align-items:center;gap:0.75rem;margin:0.375rem 1.25rem 0.625rem 3.625rem;background:var(--p);color:#fff;border-radius:1.25rem;padding:0.625rem 1.125rem;text-decoration:none;font-weight:600;width:fit-content;max-width:calc(100% - 4.875rem)}
.meet small{display:block;font-weight:400;opacity:.85;font-size:0.75rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dlink{color:var(--p);text-decoration:none}
.tn{display:flex;align-items:center;gap:0.625rem;padding:0.25rem 0}
.tn i{width:1.75rem;height:1.75rem;border-radius:50%;background:var(--sf3);display:grid;place-items:center;font-style:normal;font-size:0.75rem;font-weight:600;color:var(--tx2);position:relative;flex:none}
.tn i em{position:absolute;right:-0.1875rem;bottom:-0.1875rem;width:0.875rem;height:0.875rem;border-radius:50%;font-size:0.5625rem;line-height:0.875rem;text-align:center;font-style:normal;color:#fff;border:1.5px solid #fff}
.tn div{min-width:0}.tn div small{display:block}
.notiz{white-space:pre-wrap;word-break:break-word}
/* Menü (⋮) */
.pop-hg{position:fixed;inset:0;z-index:60}
.pop{position:fixed;z-index:61;background:var(--sf);border-radius:0.5rem;box-shadow:0 0.25rem 1.125rem rgba(0,0,0,.2);padding:0.375rem 0;min-width:13.125rem}
.pop button{display:block;width:100%;text-align:left;padding:0.8125rem 1.125rem!important;font-weight:400!important;font-size:0.9375rem!important}
.pop button:active{background:var(--sf3)!important}
.pop button.rot{color:var(--rot)!important}
/* Bearbeiten */
.etitel{width:100%;border:0!important;outline:0;font-size:1.5rem!important;padding:0.5rem 1.25rem 0.875rem 3.625rem!important;background:none;border-radius:0!important}
.efeld{border:0!important;outline:0;background:none!important;padding:0!important;width:100%;font-size:0.9375rem!important;min-height:1.5rem;border-radius:0!important}
textarea.efeld{resize:none;min-height:5rem}
select.efeld{-webkit-appearance:none;appearance:none}
.ereihe{display:flex;align-items:center;justify-content:space-between;gap:0.625rem;min-height:2.25rem}
.ereihe input{width:auto!important;font-size:0.9375rem!important;border:0!important;background:none!important;padding:0.25rem 0!important;text-align:left;min-width:0}
.ereihe input[type=time]{text-align:right}
.schalt{position:relative;width:3.25rem;height:2rem;flex:none}
.schalt input{opacity:0;width:0;height:0;position:absolute}
.schalt span{position:absolute;inset:0;border-radius:1rem;background:var(--sf3);border:2px solid #79747e;transition:.2s}
.schalt span::before{content:"";position:absolute;width:1rem;height:1rem;left:0.375rem;top:0.375rem;border-radius:50%;background:#79747e;transition:.2s}
.schalt input:checked+span{background:var(--p);border-color:var(--p)}
.schalt input:checked+span::before{background:#fff;width:1.5rem;height:1.5rem;left:1.375rem;top:2px}
.punkt2{width:0.875rem;height:0.875rem;border-radius:50%;display:inline-block;vertical-align:-2px;margin-right:0.375rem}
/* Einstellungen */
.ekarte{margin:0.5rem 1rem 0.875rem;border:1px solid var(--ln);border-radius:1rem;padding:0.875rem 1rem}
.ekarte h2{font-size:1rem;font-weight:500;margin:0 0 0.5rem}
.ekarte p{font-size:0.8125rem;color:var(--tx2);margin:0 0 0.625rem}
.ekarte input[type=text],.ekarte input[type=password],.ekarte input:not([type]){width:100%;border:1px solid #c7ccc9;border-radius:0.5rem;padding:0.6875rem 0.75rem;margin-bottom:0.5rem;background:var(--sf)}
.ekarte .pri{width:100%;background:var(--p)!important;color:#fff!important;border-radius:1.25rem!important;padding:0.6875rem!important;font-weight:600!important;margin-top:0.25rem}
.ekarte a{color:var(--p)}
.kzeile{display:flex;align-items:center;gap:0.625rem;padding:0.375rem 0}
.kzeile input[type=color]{width:2rem;height:2rem;padding:0;border:0;background:none;flex:none}
.kzeile input[type=text]{flex:1;margin:0!important;padding:0.5rem 0.625rem!important}
.kzeile input[type=checkbox]{width:1.25rem;height:1.25rem;flex:none;accent-color:var(--p)}
.link2{color:var(--p)!important;font-weight:500!important;padding:0.375rem 0!important}
.fehl{background:#fce8e6;color:#a50e0e;border-radius:0.5rem;padding:0.5rem 0.625rem;font-size:0.8125rem;margin:0.375rem 0}
.seg{display:flex;gap:0.375rem}
.seg button{flex:1;border:1px solid var(--ln)!important;border-radius:0.75rem!important;padding:0.5rem 0!important;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-height:4rem}
.seg button span{line-height:1.1}
.seg button small{font-size:0.75rem;color:var(--tx2);margin-top:0.25rem}
.seg button.an{background:var(--pc)!important;border-color:var(--p)!important;color:var(--opc)!important}
/* Suche */
.serg{padding-bottom:1.25rem}
.sleer{padding:2.5rem 1.5rem;text-align:center;color:var(--tx2)}
.smonat{padding:1rem 1.25rem 0.25rem;font-weight:500;color:var(--tx2);font-size:0.8125rem}

#toast{position:fixed;left:50%;bottom:calc(5.5rem + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:90;display:flex;flex-direction:column;gap:0.375rem;align-items:center;pointer-events:none;width:max-content;max-width:92vw}
#toast div{background:#313033;color:#f4eff4;padding:0.75rem 1rem;border-radius:0.375rem;font-size:0.875rem;box-shadow:0 0.1875rem 0.5rem rgba(0,0,0,.2)}
#toast div.err{background:#8c1d18}

/* sehr schmale Displays (Flip-Außendisplay o. ä.) */
@media (max-width:340px){.titel{font-size:1.125rem!important}.avatar{display:none}.pdat{width:3.5rem}.pwoche{padding-left:3.5rem}}
/* breite Bildschirme (Tablet / Laptop) */
@media (min-width:760px){#inhalt{max-width:56.25rem;margin:0 auto}.seite>*{max-width:45rem;margin-left:auto;margin-right:auto}}