/* ================= NOTIZEN (openDesk Notes) im Dashboard — Kap. 444 =================
   Haus-Standard wie Git/To Do: Ribbon oben, Sidebar links, Liste in der Mitte,
   Detail rechts. EIN kräftiger Akzent (über --mod, hier --todo), Farbe nur als
   Signal, 1px-Kanten.

   Das Ribbon hat KEINE eigenen Regeln: `.no-ribbonbar` ist in den Sammelregeln von
   ui-2026.css mitgeführt (Lehre aus Kap. 227/228 — fehlt die Klasse dort, bleibt
   der Ribbon 11px hoch und die Knöpfe sind unsichtbar), ebenso
   `body[data-mod="notes"] {--mod:var(--todo)}`.

   Der ERSTE Anlauf hatte hier eine freie Kartenliste (.no-wrap/.no-grid) mit
   eigenem .app-toolbar — das war NICHT das Haus-Muster: zwei Kopfzeilen, kein
   Ribbon, keine Liste/Detail-Teilung. Ersetzt durch das Muster unten. */

.no-ribbonbar.rb-collapsed .mrb-panels{display:none}

.no-app{display:grid;grid-template-columns:minmax(190px,255px) minmax(240px,340px) minmax(0,1fr);
        background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);
        box-shadow:var(--shadow);overflow:hidden;height:var(--app-h,calc(100vh - 175px));min-height:420px;
        margin-top:10px;position:relative}
.no-side{display:flex;flex-direction:column;min-height:0;overflow-y:auto;
         background:color-mix(in srgb,var(--mod) 3%,var(--card))}
.no-list-col{display:flex;flex-direction:column;min-height:0;min-width:0}
.no-detail{display:flex;flex-direction:column;min-height:0;overflow-y:auto;background:var(--card);
           border-left:1px solid var(--border)}

/* ---- Sidebar ---- */
.no-search{display:flex;align-items:center;gap:6px;margin:10px 10px 6px;padding:6px 8px;
           border:1px solid var(--border);border-radius:var(--radius);background:var(--bg2)}
.no-search input{border:0;background:none;outline:none;width:100%;font:inherit;font-size:12.5px;color:var(--text)}
.no-side-h{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--text2);
           font-weight:700;padding:10px 12px 4px}
.no-side-h::before{content:"";display:inline-block;width:3px;height:10px;margin-right:6px;
                   vertical-align:-1px;background:var(--mod);border-radius:2px}
.no-neu-feld{margin:2px 10px 6px;border:1px solid var(--border);border-radius:var(--radius);
             background:var(--bg2);color:var(--text);font:inherit;font-size:12.5px;padding:7px 9px;width:calc(100% - 20px)}
.no-neu-feld:focus{outline:none;border-color:var(--mod)}
.no-neu-knopf{display:flex;align-items:center;justify-content:center;gap:6px;margin:0 10px;
              padding:7px 9px;border:1px solid color-mix(in srgb,var(--mod) 45%,var(--border));
              border-radius:var(--radius);background:color-mix(in srgb,var(--mod) 12%,transparent);
              color:var(--text);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.no-neu-knopf:hover{background:color-mix(in srgb,var(--mod) 20%,transparent)}
.no-msg{font-size:11.5px;color:var(--text2);margin:6px 12px 0;line-height:1.4;min-height:14px}
.no-hinweis{margin-top:auto;border-top:1px solid var(--border);padding:10px 12px;font-size:11.5px;
            color:var(--text2);line-height:1.45}

/* ---- Liste ---- */
.no-listbar{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--border);
            flex-wrap:wrap}
.no-lb-titel{font-weight:600;font-size:13.5px;flex:1;min-width:120px;overflow:hidden;
             text-overflow:ellipsis;white-space:nowrap}
.no-list{overflow-y:auto;flex:1;min-height:0}
.no-zeile{display:flex;flex-direction:column;gap:3px;width:100%;padding:10px 12px;cursor:pointer;
          border:0;border-bottom:1px solid color-mix(in srgb,var(--border) 55%,transparent);
          background:none;color:var(--text);font:inherit;text-align:left}
.no-zeile:hover{background:color-mix(in srgb,var(--mod) 5%,transparent)}
.no-zeile.on{background:color-mix(in srgb,var(--mod) 11%,transparent);
             box-shadow:inset 3px 0 0 var(--mod)}
.no-zeile-titel{font-size:13px;line-height:1.35;font-weight:500;overflow-wrap:anywhere}
.no-zeile-meta{font-size:11.5px;color:var(--text2);display:flex;align-items:center;gap:5px}

/* ---- Detail ---- */
.no-detail-kopf{padding:14px 16px 12px;border-bottom:1px solid var(--border);border-top:3px solid var(--mod);
                background:color-mix(in srgb,var(--mod) 4%,var(--card));
                font-size:15.5px;font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.no-detail-meta{padding:8px 16px;font-size:12px;color:var(--text2);border-bottom:1px solid var(--border)}
.no-detail-text{padding:13px 16px;flex:1;min-height:0;overflow-y:auto}
.no-text{margin:0;font-family:inherit;font-size:13px;line-height:1.55;white-space:pre-wrap;
         overflow-wrap:anywhere;color:var(--text)}
/* ---- Bearbeiten: EIN Textfeld, mehrzeilig (kein Modal) ---- */
.no-edit{width:100%;min-height:340px;border:1px solid var(--border);border-radius:var(--radius);
         background:var(--bg2);color:var(--text);font:inherit;font-size:13px;line-height:1.6;
         padding:11px 12px;resize:vertical;white-space:pre-wrap}
.no-edit:focus{outline:none;border-color:var(--mod)}
.no-edit-hilfe{margin-top:7px;font-size:11.5px;color:var(--text2);line-height:1.5}
.no-edit-hilfe b{font-family:ui-monospace,Menlo,Consolas,monospace;font-weight:600}

/* ---- Formatierung (Issue #207): Werkzeugleiste, Vorschau, Slash-Menü ---- */
.no-wz-leiste{display:flex;align-items:center;gap:2px;flex-wrap:wrap;padding:6px 8px;
              border:1px solid var(--border);border-bottom:0;border-radius:var(--radius) var(--radius) 0 0;
              background:var(--bg2)}
.no-wz{display:inline-flex;align-items:center;justify-content:center;width:28px;height:26px;
       border:1px solid transparent;border-radius:6px;background:transparent;color:var(--text2);
       cursor:pointer;transition:var(--tr)}
.no-wz:hover{background:var(--hover);color:var(--text);border-color:var(--border)}
.no-wz svg{width:15px;height:15px}
.no-wz-trenner{width:1px;height:18px;background:var(--border);margin:0 5px}
.no-wz-hinweis{margin-left:auto;font-size:11px;color:var(--text2);white-space:nowrap}
.no-wz-hinweis b{font-family:ui-monospace,Menlo,Consolas,monospace;
                 background:var(--hover);padding:1px 5px;border-radius:4px}

.no-edit-paar{display:flex;gap:10px;align-items:stretch}
.no-edit-paar .no-edit{border-radius:0 0 var(--radius) var(--radius);flex:1 1 50%;min-width:0}
.no-edit-vorschau{flex:1 1 50%;min-width:0;overflow-y:auto;border:1px solid var(--border);
                  border-radius:0 0 var(--radius) var(--radius);background:var(--card);
                  padding:11px 13px;max-height:420px}
.no-edit-vorschau[hidden]{display:none}
@media (max-width: 1100px){
  /* Schmal: untereinander statt nebeneinander — nebeneinander waere unlesbar. */
  .no-edit-paar{flex-direction:column}
  .no-edit-vorschau{max-height:220px}
}
.no-edit-fuss{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:7px}
#noEditZahl{font-size:11.5px;color:var(--text2);white-space:nowrap}

/* Das Slash-Menü liegt direkt unter dem Feld (kein Modal, Haus-Regel). */
.no-slash{position:relative;z-index:var(--z-editor-pop, 999);margin-top:-2px;
          border:1px solid var(--border);border-radius:var(--radius);background:var(--card);
          box-shadow:var(--shadow-sm);padding:4px;display:flex;flex-direction:column;gap:1px;
          max-height:260px;overflow-y:auto}
.no-slash[hidden]{display:none}
.no-slash-z{display:flex;align-items:center;gap:9px;width:100%;padding:7px 9px;border:0;
            border-radius:6px;background:transparent;color:var(--text);font:inherit;
            font-size:13px;text-align:left;cursor:pointer}
.no-slash-z:hover{background:var(--hover)}
.no-slash-z.on{background:var(--accent-light);color:var(--accent)}
.no-slash-z svg{width:15px;height:15px;flex:none;opacity:.85}

/* ---- Gerenderte Notizansicht (statt Rohtext in <pre>) ---- */
.no-render{font-size:13.5px;line-height:1.62;color:var(--text);overflow-wrap:anywhere}
.no-render h1,.no-render h2,.no-render h3{margin:.7em 0 .35em;line-height:1.28;font-weight:650}
.no-render h1{font-size:19px}
.no-render h2{font-size:16.5px}
.no-render h3{font-size:14.5px}
.no-render p{margin:.55em 0}
.no-render ul,.no-render ol{margin:.5em 0;padding-left:1.5em}
.no-render li{margin:.2em 0}
.no-render blockquote{margin:.6em 0;padding:.35em 0 .35em 12px;border-left:3px solid var(--accent-light);
                      color:var(--text2)}
.no-render pre{margin:.6em 0;padding:9px 11px;border-radius:8px;background:var(--bg2);
               border:1px solid var(--border);overflow-x:auto}
.no-render code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px}
.no-render :not(pre) > code{background:var(--hover);padding:1px 5px;border-radius:4px}
.no-render a{color:var(--accent);text-decoration:underline}
.no-render hr{border:0;border-top:1px solid var(--border);margin:.9em 0}
.no-render del{opacity:.7}
.no-pre-escape{white-space:pre-wrap;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px}

/* ---- Papierkorb ---- */
.no-zeile-korb{cursor:default;align-items:center}
.no-zeile-korb .no-zeile-titel{opacity:.75}
.no-zeile-korb .mc-btn{margin-left:auto;flex:0 0 auto}
.no-korb-bald .no-zeile-meta{color:var(--warn-strong);font-weight:600}

.no-detail-fuss{padding:12px 16px;border-top:1px solid var(--border);display:flex;flex-wrap:wrap;gap:8px}