/* SummitGO Diktat — Stilblatt nach Gestaltungsvorgabe Entwurf 6 (02.08.2026). */
:root{
  --marine:#1F2C3D; --marine-tief:#16202E; --marine-hell:#2A3B52;
  --gold:#C2A15C; --gold-hell:#D9BE85;
  --stahlblau:#5B7A9D;
  --flaeche:#F2F4F7; --karte:#FFFFFF; --creme:#F7F4EC;
  --linie:#DFE4EA; --text:#1F2C3D; --text-leise:#6B7686;
  --gruen:#2E8B57; --gruen-tief:#256F46; --rot:#B0413E;
}
*{margin:0;padding:0;box-sizing:border-box;}
body{
  font-family:"Avenir Next","Segoe UI",system-ui,-apple-system,sans-serif;
  background:var(--flaeche);color:var(--text);display:flex;min-width:1280px;height:100vh;font-size:14px;
}
::selection{background:var(--gold-hell);}
button{font-family:inherit;font-size:13px;border:none;border-radius:8px;cursor:pointer;padding:9px 15px;}
button:focus-visible,a:focus-visible,[contenteditable]:focus-visible{outline:2px solid var(--gold);outline-offset:2px;}
input,textarea,select{font-family:inherit;}

/* ---------- Seitenleiste ---------- */
aside{
  width:252px;min-width:252px;
  background:linear-gradient(180deg,var(--marine) 0%,var(--marine-tief) 100%);
  color:#E8ECF1;display:flex;flex-direction:column;padding-top:24px;
}
.marke{padding:0 16px 18px;border-bottom:1px solid rgba(255,255,255,.08);}
.logo-kachel{background:#fff;border-radius:12px;padding:14px 16px 12px;text-align:center;}
.logo-kachel img{width:100%;display:block;}
.logo-kachel .produktzeile{letter-spacing:.5em;font-size:12px;color:var(--gold);font-weight:600;margin-top:8px;text-indent:5px;}
.sl-rollen{flex:1;overflow:auto;padding:14px 12px 6px;display:flex;flex-direction:column;gap:20px;}
.bf-titel{font-size:10px;letter-spacing:.14em;color:#7C8899;font-weight:600;margin:0 0 5px 12px;}
.vorlage{
  width:100%;text-align:left;background:transparent;border:none;border-radius:8px;
  padding:9px 12px;display:flex;align-items:center;gap:10px;font-size:13.5px;color:#C6CFDA;
  border-left:3px solid transparent;
}
.vorlage::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);opacity:.65;flex:none;}
.vorlage:hover{background:rgba(255,255,255,.05);color:#fff;}
.vorlage.aktiv{background:var(--marine-hell);color:#fff;border-left-color:var(--gold);font-weight:600;}
.vorlage.aktiv::before{opacity:1;}
.bf-link{display:block;color:#C6CFDA;text-decoration:none;font-size:12.5px;padding:6px 12px;border-radius:6px;}
.bf-link:hover{background:rgba(255,255,255,.05);color:#fff;}
.fruehere .eintrag{padding:7px 12px;border-radius:6px;cursor:pointer;}
.fruehere .eintrag:hover{background:rgba(255,255,255,.05);}
.fruehere .eintrag b{display:block;font-size:12px;color:#E8ECF1;font-weight:600;}
.fruehere .eintrag span{font-size:10.5px;color:#8D99A9;}
.leiste-fuss{margin-top:auto;border-top:1px solid rgba(255,255,255,.08);padding:13px 16px 15px;font-size:12px;}
.nutzer{display:flex;align-items:center;gap:9px;margin-bottom:10px;}
.nutzer-kreis{width:30px;height:30px;border-radius:50%;background:var(--gold);color:var(--marine);
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11px;flex:none;}
.mandant{background:rgba(201,154,46,.14);border:1px solid rgba(201,154,46,.45);color:#EBD9AE;
  font-size:10.5px;border-radius:7px;padding:6px 9px;margin-bottom:9px;}
.mandant select{width:100%;background:transparent;border:none;color:#EBD9AE;font-size:10.5px;margin-top:3px;}
.mandant select option{color:var(--text);}
.abmelden{color:#9AA6B5;text-decoration:none;background:none;border:none;padding:0;font-size:12px;cursor:pointer;}
.abmelden:hover{color:#fff;}

/* Patientensuche in der Seitenleiste */
.p-suche{margin:0 12px 8px;position:relative;}
.p-suche input{
  width:100%;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  border-radius:8px;color:#E8ECF1;padding:8px 11px;font-size:12.5px;
}
.p-suche input::placeholder{color:#7C8899;}
.p-suche input:focus{outline:2px solid var(--gold);outline-offset:1px;}
.p-treffer{margin:2px 4px 0;}
.p-treffer .eintrag{padding:7px 12px;border-radius:6px;cursor:pointer;}
.p-treffer .eintrag:hover{background:rgba(255,255,255,.05);}
.p-treffer .eintrag b{display:block;font-size:12.5px;color:#E8ECF1;font-weight:600;}
.p-treffer .eintrag span{font-size:10.5px;color:#8D99A9;}
.p-leer{padding:4px 12px;font-size:11px;color:#7C8899;}

/* ---------- Hauptbereich ---------- */
main{flex:1;display:flex;flex-direction:column;min-width:0;}

.patientenleiste{
  background:var(--stahlblau);color:#fff;padding:10px 24px;
  display:flex;gap:34px;align-items:center;font-size:12.5px;
}
.patientenleiste .p-feld span{display:block;font-size:10px;opacity:.75;letter-spacing:.06em;}
.patientenleiste .p-feld b{font-weight:600;font-size:13px;min-width:40px;display:inline-block;}

.inhalt{flex:1;display:flex;min-height:0;}
.flaeche{flex:1;display:flex;flex-direction:column;min-width:0;}

.werkzeugleiste{
  background:var(--karte);border-bottom:1px solid var(--linie);
  padding:10px 24px;display:flex;align-items:center;gap:12px;
}
.umschalter{display:flex;background:#E7EBF0;border-radius:9px;padding:3px;}
.umschalter button{background:transparent;color:var(--text-leise);padding:7px 16px;border-radius:7px;font-weight:600;}
.umschalter button.aktiv{background:#fff;color:var(--marine);box-shadow:0 1px 3px rgba(31,44,61,.15);}
.punkt{width:9px;height:9px;border-radius:50%;background:#B8C0CB;}
.punkt.laeuft{background:var(--rot);animation:blinken 1.1s ease-in-out infinite;}
@keyframes blinken{50%{opacity:.25;}}
.kn-start{background:var(--marine);color:#fff;display:flex;align-items:center;gap:8px;}
.kn-start:hover{background:var(--marine-hell);}
.kn-stopp{background:#EDF0F4;color:var(--text);border:1px solid var(--linie);}
.kn-stopp:disabled{opacity:.45;cursor:default;}
.kn-still{background:transparent;color:var(--marine);border:1px solid var(--linie);}
.kn-still:hover{background:#EDF0F4;}
.kn-gruen{background:var(--gruen);color:#fff;font-weight:600;}
.kn-gruen:hover{background:var(--gruen-tief);}
.status{font-size:11.5px;border-radius:6px;padding:4px 10px;font-weight:600;
  background:#F6EEDC;color:#8A6D2B;border:1px solid #E5D3A6;}
.status.frei{background:#E4F2E9;color:var(--gruen-tief);border-color:#BCDCC8;}
.rechts{margin-left:auto;display:flex;gap:8px;align-items:center;}
.wartet{font-size:11.5px;color:var(--text-leise);}

.rollbereich{flex:1;overflow:auto;padding:26px 30px;background:#F7F8FA;}

/* --- SummitGO-Standard-Meldekarte: tippen, diktieren, einfügen, hochladen --- */
.meldekarte{
  background:#fff;border:1.5px solid var(--gold);border-radius:14px;
  padding:12px 16px 14px;margin:0 0 18px;box-shadow:0 2px 10px rgba(31,44,61,.06);
}
.meldekarte .mk-kopf{display:flex;align-items:baseline;gap:10px;margin-bottom:9px;}
.meldekarte .mk-kopf b{font-size:13.5px;color:var(--text);}
.meldekarte .mk-kopf span{margin-left:auto;font-size:10.5px;color:var(--text-leise);text-align:right;}
.meldekarte .mk-zeile{display:flex;gap:8px;align-items:center;}
.meldekarte .mk-knopf{
  width:42px;height:42px;flex:none;border-radius:9px;background:#fff;
  border:1px solid var(--linie);display:flex;align-items:center;justify-content:center;
  color:var(--marine);padding:0;
}
.meldekarte .mk-knopf:hover{background:#EDF0F4;}
.meldekarte .mk-knopf.laeuft{background:var(--rot);border-color:var(--rot);color:#fff;animation:blinken 1.1s ease-in-out infinite;}
.meldekarte input[type=text]{
  flex:1;border:1px solid var(--linie);border-radius:9px;padding:11px 13px;font-size:13.5px;
}
.meldekarte input[type=text]:focus{outline:2px solid var(--gold);outline-offset:1px;}
.meldekarte .mk-senden{background:var(--marine);color:#fff;font-weight:600;padding:11px 20px;}
.meldekarte .mk-senden:hover{background:var(--marine-hell);}

/* --- Material: ein ruhiges Blatt, fortlaufender Text --- */
.material{max-width:820px;margin:0 auto;}
.blatt{
  background:#fff;border:1px solid var(--linie);border-radius:4px;
  box-shadow:0 2px 10px rgba(31,44,61,.07);
  padding:38px 46px 30px;min-height:70vh;
  font-size:14.5px;line-height:1.75;
}
.absatz{position:relative;margin-bottom:14px;padding-left:2px;}
.absatz[contenteditable]:focus{outline:2px solid var(--gold-hell);border-radius:5px;}
.absatz .zeit{
  position:absolute;left:-72px;top:3px;width:58px;text-align:right;
  font-size:10px;color:#B9C2CE;opacity:0;
}
.absatz:hover .zeit{opacity:1;}
.zwischen{color:var(--text-leise);font-style:italic;}

.marke-bild{
  display:flex;gap:14px;align-items:flex-start;margin:18px 0;
  border-left:2px solid var(--gold);padding-left:14px;
}
.marke-bild .mini{
  width:64px;height:48px;border-radius:5px;flex:none;position:relative;overflow:hidden;
  background:linear-gradient(135deg,#2E3E55,#556A8A);cursor:pointer;
  background-size:cover;background-position:center;
}
.marke-bild .mini::after{content:"";position:absolute;inset:7px 8px;border:1px solid rgba(255,255,255,.5);border-radius:2px;}
.marke-bild .mini.mit-bild::after{content:none;}
.marke-bild .mini:hover{outline:2px solid var(--gold);}
.marke-bild .gelesen{font-size:13.5px;line-height:1.65;}
.marke-bild .gelesen i{font-style:normal;font-size:10.5px;color:var(--text-leise);display:block;margin-bottom:2px;}
.marke-bild .gelesen [contenteditable]:focus{outline:2px solid var(--gold-hell);border-radius:5px;}

.einfuegen{
  margin-top:28px;border:2px dashed #C8B27A;border-radius:14px;background:#FCFAF4;
  padding:26px 20px;text-align:center;cursor:pointer;transition:.15s;
}
.einfuegen:hover,.einfuegen.zieht{background:#F8F3E4;border-color:var(--gold);}
.einfuegen .symbol{
  width:46px;height:46px;border-radius:50%;background:var(--gold);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;margin-bottom:10px;
}
.einfuegen b{display:block;font-size:14.5px;color:var(--marine);margin-bottom:3px;}
.einfuegen span{font-size:12px;color:var(--text-leise);}
.unter-blatt{font-size:10.5px;color:#A6AFBC;text-align:center;margin-top:12px;line-height:1.5;}

/* --- Dokument-Ansicht --- */
.dok{max-width:820px;margin:0 auto;display:none;}
.dok.sichtbar{display:block;}
.material.verborgen{display:none;}
.dok .blatt{font-size:13.4px;line-height:1.65;min-height:0;}
.briefkopf{display:flex;justify-content:space-between;border-bottom:2px solid var(--marine);
  padding-bottom:13px;margin-bottom:16px;}
.praxis-name{font-family:Georgia,serif;font-style:italic;font-size:17px;color:var(--marine);}
.praxis-adresse{font-size:10.5px;color:var(--text-leise);margin-top:3px;line-height:1.5;}
.briefkopf img{height:34px;}
.patient-block{font-size:11.5px;color:var(--text-leise);margin-bottom:16px;line-height:1.6;}
.patient-block b{color:var(--text);}
.dok-abschnitt{margin-bottom:13px;position:relative;padding-right:30px;}
.dok-abschnitt h3{font-size:12.5px;letter-spacing:.05em;color:var(--marine);margin-bottom:3px;}
.kopieren{position:absolute;right:0;top:0;opacity:0;background:none;border:1px solid var(--linie);
  border-radius:7px;padding:3px 8px;font-size:11px;color:var(--marine);}
.dok-abschnitt:hover .kopieren{opacity:1;}
.kopieren:hover{background:#EDF0F4;}
.dok-abschnitt [contenteditable]:focus{outline:2px solid var(--gold-hell);border-radius:5px;}
.gruss{margin-top:18px;}
.unterschrift{margin-top:26px;font-family:Georgia,serif;font-style:italic;font-size:15px;}
.dok-knoepfe{display:flex;gap:8px;justify-content:center;margin-top:14px;}

footer{background:var(--karte);border-top:1px solid var(--linie);padding:8px 24px;
  font-size:11px;color:var(--text-leise);display:flex;gap:18px;align-items:center;}
footer b{color:var(--text);font-weight:600;}
footer a{color:var(--marine);}

.denken{position:fixed;inset:0;background:rgba(31,44,61,.55);backdrop-filter:blur(2px);
  display:none;align-items:center;justify-content:center;flex-direction:column;gap:18px;z-index:60;}
.denken.sichtbar{display:flex;}
.schleife{width:76px;height:76px;}
.schleife circle.ring{fill:none;stroke:url(#verlaufHell);stroke-width:5;stroke-linecap:round;
  stroke-dasharray:96 34;transform-origin:50% 50%;animation:drehen 1.15s linear infinite;}
@keyframes drehen{to{transform:rotate(360deg);}}
.denken p{color:#fff;font-size:15px;}
.meldung{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(16px);
  background:var(--marine);color:#fff;border-radius:9px;padding:11px 18px;font-size:13px;
  opacity:0;transition:.25s;pointer-events:none;z-index:70;box-shadow:0 6px 18px rgba(0,0,0,.25);}
.meldung.sichtbar{opacity:1;transform:translateX(-50%) translateY(0);}

/* Großansicht eines abgelegten Screenshots (nur im Browser-Speicher, nie auf dem Server) */
.gross{position:fixed;inset:0;background:rgba(31,44,61,.72);display:none;
  align-items:center;justify-content:center;flex-direction:column;gap:14px;z-index:65;cursor:zoom-out;}
.gross.sichtbar{display:flex;}
.gross img{max-width:76vw;max-height:70vh;border-radius:10px;box-shadow:0 14px 44px rgba(0,0,0,.45);}
.gross p{color:#fff;font-size:13.5px;}
.gross .schliessen{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.4);}

/* ---------- Anmeldung ---------- */
.anmelde-seite{margin:auto;width:360px;background:#fff;border:1px solid var(--linie);
  border-radius:14px;padding:34px 34px 28px;box-shadow:0 10px 30px rgba(31,44,61,.12);}
.anmelde-seite img{width:210px;display:block;margin:0 auto;}
.anmelde-seite .produktzeile{letter-spacing:.45em;padding-left:.45em;font-size:13.5px;
  color:var(--gold);font-weight:600;text-align:center;margin:10px 0 6px;}
.anmelde-seite .produktlinie{width:210px;height:1px;background:var(--linie);margin:16px auto 20px;}
.anmelde-seite label{display:block;font-size:12px;color:var(--text-leise);margin:12px 0 4px;}
.anmelde-seite input{width:100%;border:1px solid var(--linie);border-radius:8px;padding:10px 12px;font-size:14px;}
.anmelde-seite button{width:100%;margin-top:18px;background:var(--marine);color:#fff;padding:11px;}
.anmelde-seite button:hover{background:var(--marine-hell);}
.anmelde-fehler{background:#F8E8E7;border:1px solid #E3B7B5;color:var(--rot);
  border-radius:8px;padding:9px 12px;font-size:12.5px;margin-bottom:6px;}
.anmelde-meldung{background:#E4F2E9;border:1px solid #BCDCC8;color:var(--gruen-tief);
  border-radius:8px;padding:9px 12px;font-size:12.5px;margin-bottom:6px;}
.anmelde-erklaerung{font-size:13px;color:var(--text-leise);line-height:1.6;margin-bottom:4px;}
.anmelde-nochmal{margin-top:10px;text-align:center;}
.anmelde-nochmal .leise{width:auto;background:none;color:var(--text-leise);
  border:none;font-size:12px;text-decoration:underline;padding:4px 8px;margin-top:0;}
.anmelde-nochmal .leise:hover{color:var(--marine);background:none;}
.anmelde-uebergang{margin-top:18px;border-top:1px solid var(--linie);padding-top:12px;}
.anmelde-uebergang summary{font-size:12px;color:var(--text-leise);cursor:pointer;}
.anmelde-fuss{text-align:center;font-size:11px;color:var(--text-leise);margin-top:16px;}

/* ---------- Einstellungen / Status ---------- */
.seite{max-width:820px;margin:0 auto;}
.karte-block{background:#fff;border:1px solid var(--linie);border-radius:10px;
  padding:20px 24px;margin-bottom:18px;}
.karte-block h2{font-size:15px;color:var(--marine);margin-bottom:12px;}
.karte-block label{display:block;font-size:12px;color:var(--text-leise);margin:10px 0 4px;}
.karte-block input,.karte-block textarea,.karte-block select{
  width:100%;border:1px solid var(--linie);border-radius:8px;padding:9px 11px;font-size:13.5px;}
.karte-block textarea{min-height:140px;font-family:ui-monospace,Menlo,monospace;font-size:12.5px;}
.karte-block .zeile{display:flex;gap:12px;}
.karte-block .zeile>*{flex:1;}
.karte-block button{margin-top:12px;background:var(--marine);color:#fff;}
.karte-block button:hover{background:var(--marine-hell);}
.karte-block button.rot{background:var(--rot);}
.karte-block table{width:100%;border-collapse:collapse;font-size:12.5px;}
.karte-block th,.karte-block td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--linie);}
.karte-block th{color:var(--text-leise);font-weight:600;font-size:11px;letter-spacing:.05em;}
.gruen-meldung{background:#E4F2E9;border:1px solid #BCDCC8;color:var(--gruen-tief);
  border-radius:8px;padding:9px 12px;font-size:12.5px;margin-bottom:14px;}

@media (prefers-reduced-motion: reduce){.schleife circle.ring,.punkt.laeuft{animation:none;}}

/* ---------- Druck: nur das Dokument ---------- */
@media print{
  body{display:block;min-width:0;height:auto;background:#fff;}
  aside,.patientenleiste,.werkzeugleiste,footer,.meldung,.denken,.gross,.dok-knoepfe,
  .material,.kopieren{display:none !important;}
  .inhalt,.flaeche,.rollbereich{display:block;overflow:visible;padding:0;background:#fff;}
  .dok{display:none;max-width:none;}
  .dok.sichtbar{display:block;}
  .dok .blatt{border:none;box-shadow:none;padding:0;}
}