/* gd-aimark.css — KI-Kennzeichnung, Punkt im linken Außenrand (Ee, Jens 260705 v3)
   Token-basiert, alle 6 Styles, 0 Hardcodierung im Content.
   KEINE Text-Ränder mehr. Unterscheidung gen/mod/original nur über Punkt+Menü.
   Punkt sitzt im linken Weißraum, auf Höhe der LETZTEN Zeile (unten-links außerhalb).
   Klassen: .ai-gen (KI-generiert) · .ai-mod (KI-verändert) · .ai-orig (Original/Mensch) */

.ai-gen, .ai-mod, .ai-orig{ position:relative; }
:where(:has(> .ai-op)){ position:relative; }  /* BB-Fix 260711: verankert JEDEN Host (auch nackte .callout/.card/.lead), Spezifitaet 0 -> explizite Host-position gewinnt weiter */
/* KEINE Ränder/Striche mehr — bewusst leer (Optik/Lesefluss). */

/* ============ Options-Punkt im LINKEN AUSSENRAND ============ */
/* sitzt links NEBEN der Textspalte (im Margin), unten = letzte Zeile.
   Auf schmal (Handy) rutscht er unter den Absatz nach links (siehe media query). */
.ai-op{
  position:absolute; bottom:2px; right:var(--ai-op-left,-34px); left:auto; z-index:5;
  width:16px; height:16px; border-radius:50%;
  background:var(--ci-orange,#ef6a23);
  border:2px solid var(--gf-panel,#f4efe6);
  box-shadow:0 2px 6px rgba(0,0,0,.28);
  cursor:pointer; opacity:.66;
  display:flex; align-items:center; justify-content:center;
  transition:opacity .18s ease, transform .18s ease;
}
.ai-op:hover, .ai-op:focus{ opacity:1; transform:scale(1.08); outline:none; }
/* gen/mod/original nur über Punkt-Anmutung unterscheiden (kein Text-Rand) */

/* Drei Orange-Abstufungen (Jens 260705), reine Kreise, nichts drin:
   Original = hellstes/ganz orange · AI-mod = etwas dunkler · AI-gen = am dunkelsten. */
.ai-orig > .ai-op{ background:var(--ci-orange,#ef6a23); opacity:.9; }          /* Original = ganz orange */
.ai-mod  > .ai-op{ background:color-mix(in srgb, var(--ci-orange-rim,#c85618) 78%, #000); opacity:.95; } /* verändert = deutlich dunkler */
.ai-gen  > .ai-op{ background:color-mix(in srgb, var(--ci-orange-rim,#c85618) 52%, #000); opacity:1; } /* generiert = am dunkelsten */

/* ============ Petal-Menü öffnet nach RECHTS über/neben den Text ============ */
.ai-petals{
  position:absolute; right:-30px; left:auto; bottom:26px; z-index:24;
  display:flex; flex-direction:column; gap:6px;
  opacity:0; visibility:hidden; transform:translateY(6px);
  transition:opacity .16s ease, transform .16s ease, visibility .16s;
}
.ai-op.open ~ .ai-petals{ opacity:1; visibility:visible; transform:translateY(0); }
/* FIX 260809 (Ra): Gegenstueck zu positionPetals() in gd-aimark.js -- wenn oben zu wenig Platz
   ist, kippt das Menue nach unten statt ueber den Viewport-Rand zu ragen. */
.ai-op.petals-down ~ .ai-petals{ bottom:auto; top:26px; transform:translateY(-6px); }
.ai-op.petals-down.open ~ .ai-petals{ transform:translateY(0); }
.ai-petal{
  display:flex; align-items:center; gap:9px;
  background:var(--gf-panel,#f4efe6); color:var(--gf-ink,#1f1b17);
  border:1px solid var(--gf-rule,rgba(0,0,0,.18)); border-radius:22px;
  padding:6px 12px 6px 8px; cursor:pointer; white-space:nowrap;
  box-shadow:0 4px 14px rgba(0,0,0,.22);
  font:400 13px/1.2 'Inter Tight',system-ui,sans-serif;
  transition:background .14s ease, transform .12s ease;
}
.ai-petal:hover{ background:var(--ci-orange,#ef6a23); transform:translateX(2px); }
.ai-petal:hover .pd b, .ai-petal:hover .pd small{ color:#fff; }
.ai-petal:hover .pi{ background:#fff; }
.ai-petal:hover .pi::before{ background:var(--ci-orange,#ef6a23); }
.ai-petal .pi{ width:20px; height:20px; flex:0 0 20px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--ci-orange,#ef6a23); }
.ai-petal .pi::before{ content:''; width:12px; height:12px; background:var(--gf-panel,#f4efe6); -webkit-mask:var(--pi-ico) center/contain no-repeat; mask:var(--pi-ico) center/contain no-repeat; }
.ai-petal .pd{ display:flex; flex-direction:column; }
.ai-petal .pd b{ font:600 13px/1.2 'Inter Tight',sans-serif; }
.ai-petal .pd small{ color:var(--gf-ink-soft,#574f44); font-size:11px; }

/* ---- Info-Box ---- */
.aim-info{
  position:absolute; right:-30px; left:auto; bottom:26px; z-index:26;
  min-width:230px; max-width:320px;
  background:var(--gf-panel,#f4efe6); color:var(--gf-ink,#1f1b17);
  border:1px solid var(--gf-rule,rgba(0,0,0,.18)); border-radius:10px;
  box-shadow:0 8px 24px rgba(0,0,0,.30); padding:11px 13px;
  font:400 13px/1.5 'Inter Tight',sans-serif;
  opacity:0; visibility:hidden; transform:translateY(4px);
  transition:opacity .16s ease, transform .16s ease, visibility .16s;
}
.aim-info.show{ opacity:1; visibility:visible; transform:translateY(0); }
.aim-info h5{ margin:0 0 5px; font:700 12px/1.3 'Oswald',sans-serif; letter-spacing:.4px; text-transform:uppercase; color:var(--ci-orange,#ef6a23); }
.aim-info .aim-k{ color:var(--gf-ink-soft,#574f44); }
.aim-info .aim-row{ margin:2px 0; }

/* ---- Edit-Modus ---- */
.ai-gen[contenteditable="true"], .ai-mod[contenteditable="true"], .ai-orig[contenteditable="true"]{
  outline:2px solid var(--ci-orange,#ef6a23); outline-offset:3px; border-radius:6px;
}
.aim-save{ position:absolute; right:-30px; left:auto; bottom:26px; z-index:26; background:var(--ci-orange,#ef6a23); color:var(--gf-panel,#f4efe6); border:none; border-radius:20px; padding:6px 16px; cursor:pointer; font:600 13px/1.2 'Inter Tight',sans-serif; box-shadow:0 4px 14px rgba(0,0,0,.25); }

/* ============ VARIANTE B: Meta-Zeile unter dem Abschnitt (Demo 2) ============ */
.aiv-meta .ai-op{ position:static; margin-top:8px; opacity:.7; }
.aiv-meta .ai-gen, .aiv-meta .ai-mod, .aiv-meta .ai-orig{ display:flow-root; }
.aiv-meta .ai-petals, .aiv-meta .aim-info, .aiv-meta .aim-save{ left:0; bottom:auto; top:100%; }

/* ============ VARIANTE C: Punkt erscheint nur bei Hover über den Abschnitt (Demo 3) ============ */
.aiv-hover .ai-op{ opacity:.5; transition:opacity .2s ease; }
.aiv-hover .ai-gen:hover .ai-op, .aiv-hover .ai-mod:hover .ai-op, .aiv-hover .ai-orig:hover .ai-op,
.aiv-hover .ai-op.open, .aiv-hover .ai-op:focus{ opacity:.85; }

/* ============ AI-BILDER: Overlay-Platzhalter (echte Einbrennung macht Ra) ============ */
.ai-img{ position:relative; display:block; }
.ai-img > .ai-op{ right:-34px; left:auto; bottom:2px; }
.ai-img .ai-corner{ position:absolute; right:0; left:auto; bottom:0; pointer-events:none; }

/* ============ Handy/schmal: Punkt rutscht unter den Absatz nach links ============ */
@media (max-width:720px){
  .ai-op{ right:0; left:auto; bottom:-30px; }
  .ai-petals, .aim-info, .aim-save{ right:0; left:auto; bottom:auto; top:calc(100% + 4px); }
  .ai-img > .ai-op{ right:0; left:auto; bottom:-30px; }
}

/* ~10px Hotzone um den Punkt: leichter zu treffen, ohne sichtbare Groesse zu aendern (BB-Fix 260711: position:relative HIER ENTFERNT -- ueberschrieb sonst .ai-op{position:absolute} oben mit gleicher Spezifitaet -> Punkt verlor Verankerung am Host) */
.ai-op::after{ content:''; position:absolute; inset:-12px; border-radius:50%; }

/* Hover-Bruecke: schliesst die Luecke zwischen Punkt (bottom:2px) und Petals (bottom:26px),
   damit obere Optionen ohne Schliessen erreichbar sind */
.ai-petals::before{ content:''; position:absolute; left:0; right:0; bottom:-26px; height:26px; }

/* --- Sichtbarkeits-Absicherung (MoAI 260705): auf Seiten mit gerahmtem/engem Content
   (z.B. .wrap mit border-radius + padding) wuerde der Punkt bei left:-34px hinter dem
   Rahmen verschwinden. Diese Seiten setzen --ai-op-left:6px (Punkt sichtbar am linken
   Innenrand). Zentrale Regel, greift ueberall wo .wrap den Content rahmt. --- */
.wrap .ai-gen, .wrap .ai-mod, .wrap .ai-orig{ --ai-op-left:6px; }
.wrap .ai-gen > .ai-op, .wrap .ai-mod > .ai-op, .wrap .ai-orig > .ai-op{ right:var(--ai-op-left,6px); left:auto; }
.wrap .ai-petals, .wrap .aim-info, .wrap .aim-save{ right:6px; left:auto; }

.ai-mix > .ai-op{ background:var(--ci-orange,#ef6a23); opacity:.95; }

/* MoAI 260713next1: Page-/Headline-AIinfo darf nicht nach oben aus dem sichtbaren Bereich laufen. */
.page-ai-head > .ai-petals,
.page-ai-head > .aim-info,
.page-ai-head > .aim-save{
  bottom:auto;
  top:calc(100% + 8px);
  right:-30px; left:auto;
}
.page-ai-head > .ai-petals::before{ top:-10px; bottom:auto; height:10px; }


/* ---- Inhalt ergänzen (MoAI 260717): DE/EN im Markup, tokenbasiert ---- */
.aim-add{
  position:absolute; right:-30px; left:auto; bottom:26px; z-index:27;
  width:min(360px, calc(100vw - 28px));
  background:var(--gf-panel,#f4efe6); color:var(--gf-ink,#1f1b17);
  border:1px solid var(--gf-rule,rgba(0,0,0,.18)); border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,.28); padding:12px;
  font:400 13px/1.4 'Inter Tight',system-ui,sans-serif;
  opacity:0; visibility:hidden; transform:translateY(4px);
  transition:opacity .16s ease, transform .16s ease, visibility .16s;
}
.aim-add.show{ opacity:1; visibility:visible; transform:translateY(0); }
.aim-add-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;}
.aim-add-head b{font:700 13px/1.2 'Oswald',sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--ci-orange,#ef6a23);}
.aim-add-head button{border:0;background:transparent;color:var(--gf-ink,#1f1b17);font-size:18px;cursor:pointer;}
.aim-add-row{display:flex;flex-wrap:wrap;gap:6px;margin:7px 0;}
.aim-add-row button,.aim-add-actions button,.aim-file span{
  border:1px solid var(--gf-rule,rgba(0,0,0,.18)); border-radius:999px;
  background:var(--gf-panel,#f4efe6); color:var(--gf-ink,#1f1b17);
  padding:6px 10px; cursor:pointer; font:600 12px/1.2 'Inter Tight',system-ui,sans-serif;
}
.aim-add-row button.on,.aim-add-actions button:first-child{background:var(--ci-orange,#ef6a23);color:var(--gf-panel,#f4efe6);border-color:var(--ci-orange,#ef6a23);}
.aim-add textarea{width:100%;resize:vertical;min-height:78px;border:1px solid var(--gf-rule,rgba(0,0,0,.18));border-radius:8px;background:var(--gf-panel,#f4efe6);color:var(--gf-ink,#1f1b17);padding:8px;font:400 13px/1.45 'Inter Tight',system-ui,sans-serif;}
.aim-file{display:inline-flex;margin-top:7px;cursor:pointer;}
.aim-file input{display:none;}
.aim-add-note{margin:7px 0 0;color:var(--gf-ink-soft,#574f44);font-size:11px;}
.aim-add-actions{display:flex;gap:8px;margin-top:9px;}
.aim-add-status{margin-top:7px;color:var(--gf-ink-soft,#574f44);font-size:12px;min-height:16px;}
.aim-added-content{margin:.9em 0;padding:.85em 1em;border-left:3px solid var(--ci-orange,#ef6a23);background:color-mix(in srgb,var(--gf-panel,#f4efe6) 88%,var(--ci-orange,#ef6a23));border-radius:8px;}
.aim-added-media img,.aim-added-media video{max-width:100%;height:auto;display:block;border-radius:3px;}
.aim-added-media figcaption{font-size:12px;color:var(--gf-ink-soft,#574f44);margin-top:4px;}
.aim-added-file a{font-weight:700;text-decoration:underline;color:var(--ci-orange,#ef6a23);}
@media (max-width:720px){.aim-add{left:0;bottom:auto;top:calc(100% + 4px);}}
.wrap .aim-add{ left:6px; }


/* MoAI 260717 r7 — AIinfo Freigabe panel */
.aim-release .aim-rel-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;max-height:180px;overflow:auto;}
.aim-release .aim-rel-list button{border:1px solid hsl(var(--t-border));border-radius:999px;background:hsl(var(--t-card));color:hsl(var(--t-card-foreground));padding:7px 10px;font:inherit;font-size:12px;cursor:pointer;}
.aim-release .aim-rel-list button.on,.aim-release .aim-rel-list button:hover{background:hsl(var(--t-accent));color:hsl(var(--t-background));border-color:hsl(var(--t-accent));}
.aim-add-types small,.aim-add-head small{font-weight:500;opacity:.72;}

/* MoAI 260718: AIinfo Add-content smart placement preview; Vorschau, nicht Persistenz. */
.aim-smart-ghost{opacity:.72;outline:2px dashed var(--ci-orange,#ef6a23);outline-offset:4px;}
.aim-smart-label{font:700 11px/1.3 'Oswald',sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--ci-orange,#ef6a23);margin-bottom:6px;}
.aim-add-status{display:flex;align-items:center;gap:7px;flex-wrap:wrap;}
.aim-smart-preview{display:flex;flex-direction:column;gap:2px;}
.aim-smart-preview small{font-size:11px;color:var(--gf-ink-soft,#574f44);}
.aim-add-status button{border:1px solid var(--gf-rule,rgba(0,0,0,.18));border-radius:999px;background:var(--gf-panel,#f4efe6);color:var(--gf-ink,#1f1b17);font:700 11px/1 'Inter Tight',sans-serif;padding:6px 9px;cursor:pointer;}
.aim-add-status button:first-of-type{background:var(--ci-orange,#ef6a23);color:var(--gf-panel,#f4efe6);border-color:var(--ci-orange,#ef6a23);}


/* MoAI 260719 — AIinfo Formatbar / Rich-Ergänzen. Tokenbasiert, keine freien Farben. */
.aim-formatbar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0;padding:8px;border:1px solid hsl(var(--t-line,35 18% 75%));border-radius:12px;background:hsl(var(--t-card,38 45% 95%));color:hsl(var(--t-ink,24 22% 14%));box-shadow:0 8px 24px hsl(var(--t-ink,24 22% 14%) / .08);}
.aim-format-groups{display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.aim-formatbar button{border:1px solid hsl(var(--t-line,35 18% 75%));border-radius:999px;background:hsl(var(--t-bg,38 45% 92%));color:hsl(var(--t-ink,24 22% 14%));font:700 11px/1.1 Inter Tight,system-ui,sans-serif;padding:7px 9px;cursor:pointer;}
.aim-formatbar button:hover,.aim-formatbar button:focus-visible{background:hsl(var(--t-accent,24 100% 50%));color:hsl(var(--t-accent-ink,0 0% 100%));outline:none;}
.aim-editor{min-height:180px;max-height:min(48vh,520px);overflow:auto;border:2px solid hsl(var(--t-accent,24 100% 50%));border-radius:14px;background:hsl(var(--t-card,38 45% 96%));color:hsl(var(--t-ink,24 22% 14%));padding:14px;font:500 16px/1.55 Inter Tight,system-ui,sans-serif;}
.aim-editor:empty:before{content:attr(data-placeholder);color:hsl(var(--t-muted,26 14% 38%));}
.aim-editor:focus{outline:3px solid hsl(var(--t-accent,24 100% 50%) / .22);outline-offset:2px;}
.aim-add{width:min(720px,calc(100vw - 28px));max-width:720px;}
.aim-add .aim-file{margin-top:10px;}
.aim-add .aim-add-note{margin-top:8px;}
.aim-editbar{position:sticky;top:calc(var(--gf-overnav-h,64px) + 12px);z-index:60;}
.gd-subhead{font-size:1.12em;font-weight:800;letter-spacing:.01em;margin:.85em 0 .35em;}
mark.gd-highlight,.gd-highlight{background:hsl(var(--t-accent,24 100% 50%) / .18);color:inherit;border-radius:.25em;padding:.05em .2em;}
.gd-text-accent{color:hsl(var(--t-accent,24 100% 50%));font-weight:700;}
.gd-text-muted{color:hsl(var(--t-muted,26 14% 38%));}
.aim-add figcaption,.aim-editor figcaption{font-size:.9em;color:hsl(var(--t-muted,26 14% 38%));margin-top:.4em;}
.aim-add blockquote,.aim-editor blockquote{border-left:3px solid hsl(var(--t-accent,24 100% 50%));margin:1em 0;padding:.35em 0 .35em 1em;color:inherit;background:transparent;}
@media (max-width:640px){.aim-add{left:10px;width:calc(100vw - 20px);max-width:none}.aim-editor{min-height:220px;font-size:16px}.aim-formatbar{gap:5px}.aim-formatbar button{padding:8px 9px}}

/* MoAI 260719: Ergänzen-Gastmodus — Vorschau klar als nicht gespeichert markieren */
.aim-unsaved{outline:2px dashed var(--ci-orange,var(--gdti-orange));outline-offset:4px;}
.aim-unsaved-note{font:700 12px/1.35 'Inter Tight',system-ui,sans-serif;margin:0 0 8px;padding:6px 8px;border-radius:8px;background:hsl(var(--t-card) / .92);color:hsl(var(--t-foreground));border-left:4px solid var(--ci-orange,var(--gdti-orange));}

/* MoAI 260719: Edit-Toolbar/Save unter fester Shell klickbar halten */
[data-aim-edit-host] > .aim-save{position:sticky;top:calc(var(--gf-overnav-h,64px) + 56px);left:auto;bottom:auto;z-index:61;display:inline-flex;margin:0 0 8px;background:var(--ci-orange,var(--gdti-orange));color:hsl(var(--t-primary-foreground,0 0% 100%));}

/* MoAI 260719: lokale, refresh-sichere Vorschau + Move-Controls */
.aim-local{outline:2px dashed var(--ci-orange,var(--gdti-orange));outline-offset:4px;}
.aim-movebar{display:inline-flex;gap:4px;align-items:center;margin:0 0 6px;padding:3px;border:1px solid hsl(var(--t-line,35 18% 75%));border-radius:999px;background:hsl(var(--t-card,38 45% 95%) / .94);color:hsl(var(--t-ink,24 22% 14%));box-shadow:0 4px 14px hsl(var(--t-ink,24 22% 14%) / .10);}
.aim-movebar button{width:24px;height:24px;border-radius:999px;border:1px solid hsl(var(--t-line,35 18% 75%));background:hsl(var(--t-bg,38 45% 92%));color:hsl(var(--t-ink,24 22% 14%));font:800 14px/1 system-ui,sans-serif;cursor:pointer;}
.aim-movebar button:hover,.aim-movebar button:focus-visible{background:var(--ci-orange,var(--gdti-orange));color:hsl(var(--t-primary-foreground,0 0% 100%));outline:none;}

/* MoAI 260719: klare hum-one Owner-Session-Aktion bei serverseitigem auth_required */
.aim-login-link{display:inline-flex;align-items:center;margin-left:8px;padding:5px 9px;border-radius:999px;background:var(--ci-orange,var(--gdti-orange));color:hsl(var(--t-primary-foreground,0 0% 100%));font:800 12px/1.1 'Inter Tight',system-ui,sans-serif;text-decoration:none;}
.aim-login-link:hover,.aim-login-link:focus-visible{filter:brightness(1.05);outline:2px solid hsl(var(--t-foreground) / .35);outline-offset:2px;}

/* ===== AII Sitewide-Button + Kopf-Markierung (Jens+Ee 260801-0312) ===== */
.gd-aii-wrap{ position:relative; display:flex; align-items:center; }
.gd-aii-btn{
  width:30px; height:30px; border-radius:50%; border:2px solid var(--gf-panel,#f4efe6);
  background:var(--ci-orange,#ef6a23); color:#fff; font:800 11px/1 'Inter Tight',system-ui,sans-serif;
  cursor:pointer; opacity:.85; box-shadow:0 2px 6px rgba(0,0,0,.28);
  transition:opacity .15s,transform .15s; display:flex;align-items:center;justify-content:center;
}
.gd-aii-btn:hover,.gd-aii-btn:focus{ opacity:1; transform:scale(1.08); outline:none; }
.gd-aii-panel{
  position:absolute; top:38px; left:50%; transform:translateX(-50%); z-index:60;
  background:var(--gf-panel,#f4efe6); color:var(--gf-ink,#1f1b17);
  border:1px solid var(--gf-rule,rgba(0,0,0,.18)); border-radius:14px;
  padding:12px 14px; min-width:230px; box-shadow:0 8px 24px rgba(0,0,0,.28);
  font:400 13px/1.4 'Inter Tight',system-ui,sans-serif;
}
.gd-aii-stats{ margin-bottom:8px; }
.gd-aii-toggle{ display:flex; align-items:center; gap:8px; margin-bottom:8px; cursor:pointer; }
.gd-aii-link{ color:hsl(var(--t-accent)); text-decoration:underline; }
html.gd-aii-highlight .ai-op{ box-shadow:0 0 0 4px rgba(239,106,35,.45),0 2px 6px rgba(0,0,0,.28) !important; transform:scale(1.25); opacity:1 !important; }
.ai-op-inline{ position:static !important; display:inline-flex !important; margin-left:8px; vertical-align:middle; right:auto !important; bottom:auto !important; }