/* ============================================================
   KI Zentrale – AI Chat Orb
   ============================================================ */

/* ── Wrapper ────────────────────────────────────────────────── */
.kiz-orb-wrap {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 14px;
}

/* ── Orb Button ─────────────────────────────────────────────── */
.kiz-orb {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: none;
    padding: 0;
    cursor: pointer;
    outline: none;
    background: transparent;
    position: relative;
    flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
}

.kiz-orb canvas {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: block;
}

/* Outer glow – subtle, dark toned */
.kiz-orb__glow {
    position: absolute;
    inset: -8px;
    border-radius: 50%;
    background: transparent;
    box-shadow: 0 0 14px 3px rgba(60, 80, 200, .18);
    animation: kiz-glow-idle 3s ease-in-out infinite;
    pointer-events: none;
    z-index: -1;
}
@keyframes kiz-glow-idle {
    0%, 100% { opacity: .5; }
    50%       { opacity: 1; }
}
.kiz-orb--active .kiz-orb__glow {
    box-shadow: 0 0 20px 5px rgba(40, 100, 255, .25);
    animation-duration: 1.4s;
}
.kiz-orb--recording .kiz-orb__glow {
    box-shadow: 0 0 18px 4px rgba(220, 40, 40, .3);
    animation-duration: .8s;
}

/* Wobble on click */
@keyframes kiz-wobble {
    0%   { transform: scale(1) rotate(0deg); }
    20%  { transform: scale(.88) rotate(-6deg); }
    50%  { transform: scale(1.12) rotate(5deg); }
    75%  { transform: scale(.96) rotate(-2deg); }
    100% { transform: scale(1) rotate(0deg); }
}
.kiz-orb--wobble {
    animation: kiz-wobble .48s cubic-bezier(.36,.07,.19,.97);
}

/* Badge */
.kiz-orb__badge {
    position: absolute;
    top: -2px;
    right: -2px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #ff3cac;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    display: none;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
    font-family: -apple-system, sans-serif;
    z-index: 2;
}
.kiz-orb__badge--visible { display: flex; }

/* ── Chat Window ────────────────────────────────────────────── */
.kiz-chat-win {
    width: 360px;
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    display: flex;
    flex-direction: column;
    opacity: 0;
    pointer-events: none;
    transform: translateY(20px) scale(.93);
    transform-origin: bottom right;
    transition:
        opacity .28s cubic-bezier(.34,1.2,.64,1),
        transform .28s cubic-bezier(.34,1.2,.64,1);
    box-shadow: none;
    max-height: calc(100svh - 80px);
    border: 1px solid rgba(0,0,0,.07);
    /* Reset */
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: #1e2533;
    box-sizing: border-box;
}
.kiz-chat-win *, .kiz-chat-win *::before, .kiz-chat-win *::after {
    box-sizing: border-box;
}
.kiz-chat-win a { text-decoration: none !important; color: inherit !important; }
.kiz-chat-win p, .kiz-chat-win h1, .kiz-chat-win h2, .kiz-chat-win h3 { margin: 0; }

.kiz-chat-win--open {
    opacity: 1;
    pointer-events: all;
    transform: translateY(0) scale(1);
}

/* Header */
.kiz-chat-win__head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px 16px;
    background: #fff;
    border-bottom: 1px solid var(--mb-primary, #102c1d);
    flex-shrink: 0;
}
.kiz-chat-win__mini-orb {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    flex-shrink: 0;
}
.kiz-chat-win__mini-orb canvas {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: block;
}
.kiz-chat-win__info { flex: 1; min-width: 0; }
.kiz-chat-win__title {
    font-size: 13px;
    font-weight: 700;
    color: #1e2533;
    line-height: 1.2;
}
.kiz-chat-win__sub {
    font-size: 11px;
    color: #7a8599;
    margin-top: 1px;
}
.kiz-chat-win__restart-btn {
    background: none;
    border: none;
    color: #7a8599;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color .15s, transform .3s;
    flex-shrink: 0;
    margin-right: 2px;
}
.kiz-chat-win__restart-btn:hover {
    color: var(--mb-primary, #102c1d);
    transform: rotate(-180deg);
}
.kiz-chat-win__close-btn {
    background: #f0f2f5;
    border: none;
    color: #7a8599;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .15s, color .15s;
    flex-shrink: 0;
}
.kiz-chat-win__close-btn:hover {
    background: var(--mb-secondary, #a78559);
    color: #fff;
}

/* Messages */
.kiz-chat-win__msgs {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-height: 200px;
    max-height: 510px;
    scroll-behavior: smooth;
    background: #f7f8fb;
}
.kiz-chat-win__msgs::-webkit-scrollbar { width: 3px; }
.kiz-chat-win__msgs::-webkit-scrollbar-thumb { background: #dde0e8; border-radius: 3px; }

.kiz-msg {
    display: flex;
    flex-direction: column;
    max-width: 82%;
}
.kiz-msg--user { align-self: flex-end; align-items: flex-end; }
.kiz-msg--ai   { align-self: flex-start; align-items: flex-start; }

.kiz-msg__text {
    padding: 9px 13px;
    border-radius: 16px;
    font-size: 13px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    line-height: 1.55;
    white-space: pre-wrap;
    word-break: break-word;
    margin: 0;
}
.kiz-msg--user .kiz-msg__text {
    background: var(--mb-primary, #102c1d);
    color: #fff;
    border-bottom-right-radius: 4px;
}
.kiz-msg--ai .kiz-msg__text {
    background: #fff;
    color: #1e2533;
    border: 1px solid #eaecf0;
    border-bottom-left-radius: 4px;
}

/* Datei-Chip (anhängige Datei im Fußbereich) */
.kiz-file-chip {
    display: none;
    align-items: center;
    gap: 5px;
    padding: 4px 8px 4px 9px;
    margin-bottom: 6px;
    background: color-mix(in srgb, var(--mb-primary, #102c1d) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--mb-primary, #102c1d) 20%, transparent);
    border-radius: 20px;
    font-size: 11.5px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--mb-primary, #102c1d);
    font-weight: 500;
    max-width: 100%;
    overflow: hidden;
}
#kiz-file-chip-name {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.kiz-file-chip__remove {
    background: none;
    border: none;
    cursor: pointer;
    padding: 1px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--mb-primary, #102c1d);
    opacity: .6;
    border-radius: 50%;
    flex-shrink: 0;
    transition: opacity .15s;
}
.kiz-file-chip__remove:hover { opacity: 1; }

/* Aktionen unter AI-Nachrichten (Copy + Download) */
.kiz-msg__actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 5px;
}

/* Copy-Button (Writer-Modus) */
.kiz-msg__copy-btn {
    align-self: flex-start;
    margin-top: 5px;
    padding: 4px 10px;
    font-size: 11px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-weight: 600;
    color: var(--mb-primary, #102c1d);
    background: transparent;
    border: 1.5px solid color-mix(in srgb, var(--mb-primary, #102c1d) 30%, transparent);
    border-radius: 20px;
    cursor: pointer;
    transition: background .15s, color .15s;
    line-height: 1.4;
}
.kiz-msg__copy-btn:hover {
    background: var(--mb-primary, #102c1d);
    color: #fff;
}

/* Download-Button */
.kiz-msg__download-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    font-size: 11px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-weight: 600;
    color: var(--mb-secondary, #a78559);
    background: transparent;
    border: 1.5px solid color-mix(in srgb, var(--mb-secondary, #a78559) 40%, transparent);
    border-radius: 20px;
    cursor: pointer;
    transition: background .15s, color .15s;
    line-height: 1.4;
}
.kiz-msg__download-btn:hover {
    background: var(--mb-secondary, #a78559);
    color: #fff;
}

/* Typing dots */
.kiz-typing .kiz-msg__text {
    display: flex;
    gap: 4px;
    align-items: center;
    padding: 13px 16px;
}
.kiz-dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: #b8bec8;
    animation: kiz-bounce .9s ease-in-out infinite;
}
.kiz-dot:nth-child(2) { animation-delay: .15s; }
.kiz-dot:nth-child(3) { animation-delay: .30s; }
@keyframes kiz-bounce {
    0%, 60%, 100% { transform: translateY(0); }
    30%            { transform: translateY(-6px); }
}

/* Whisper bar */
.kiz-whisper-bar {
    padding: 7px 16px;
    font-size: 11px;
    color: var(--mb-primary, #102c1d);
    background: var(--mb-bg-alt, #f7f8fa);
    border-top: 1px solid var(--mb-border, #e3e7ed);
    display: none;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}
.kiz-whisper-bar--on { display: flex; }

/* ── Ja/Nein-Rückfrage ───────────────────────────────────── */
.kiz-choice-question {
    font-size: 13px;
    color: #1e2533;
    margin-bottom: 10px;
    line-height: 1.4;
}
.kiz-choice-buttons {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.kiz-choice-btn {
    border: 1.5px solid var(--mb-primary, #102c1d);
    background: transparent;
    color: var(--mb-primary, #102c1d);
    border-radius: 20px;
    padding: 6px 16px;
    font-size: 12px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: background .15s, color .15s;
}
.kiz-choice-btn:hover {
    background: var(--mb-primary, #102c1d);
    color: #fff;
}

/* ── Chat-Formulare (Adress-Identifikation) ──────────────── */
.kiz-chat-form {
    background: #f7f8fa;
    border: 1px solid #e3e7ed;
    border-radius: 12px;
    padding: 14px;
    margin-top: 4px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 13px;
}
.kiz-chat-form label {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: #7a8599;
    margin-bottom: 2px;
    text-transform: uppercase;
    letter-spacing: .4px;
}
.kiz-chat-form input[type="text"],
.kiz-chat-form input[type="email"],
.kiz-chat-form input[type="tel"],
.kiz-chat-form select {
    width: 100%;
    padding: 7px 10px;
    border: 1px solid #e3e7ed;
    border-radius: 8px;
    font-size: 13px;
    font-family: inherit;
    background: #fff;
    color: #1e2533;
    box-sizing: border-box;
    outline: none;
}
.kiz-chat-form input:focus,
.kiz-chat-form select:focus {
    border-color: var(--mb-primary, #102c1d);
}
.kiz-chat-form__row {
    display: flex;
    gap: 8px;
}
.kiz-chat-form__row > div { flex: 1; }
.kiz-chat-form__dsgvo {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 11px;
    color: #7a8599;
    line-height: 1.4;
    margin-top: 2px;
}
.kiz-chat-form__dsgvo input[type="checkbox"] {
    margin-top: 2px;
    flex-shrink: 0;
    accent-color: var(--mb-primary, #102c1d);
}
.kiz-chat-form__dsgvo a { color: var(--mb-primary, #102c1d); }
.kiz-chat-form__info {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: #7a8599;
    cursor: pointer;
    margin-top: 2px;
    border: none;
    background: none;
    padding: 0;
    font-family: inherit;
    text-align: left;
}
.kiz-chat-form__info svg { flex-shrink: 0; }
.kiz-chat-form__info-text {
    display: none;
    background: #fff;
    border: 1px solid #e3e7ed;
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 11px;
    color: #555;
    line-height: 1.55;
    margin-top: 4px;
}
.kiz-chat-form__info-text--visible { display: block; }
.kiz-chat-form__submit {
    background: var(--mb-primary, #102c1d);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 9px 14px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    margin-top: 4px;
    transition: opacity .15s;
}
.kiz-chat-form__submit:hover { opacity: .88; }
.kiz-chat-form__submit:disabled { opacity: .5; cursor: default; }
.kiz-chat-form__error {
    color: #d94f4f;
    font-size: 11px;
    display: none;
}

/* Input */
.kiz-chat-win__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 6px;
    padding: 10px 12px;
    border-top: 1px solid #f0f2f5;
    background: #fff;
    flex-shrink: 0;
}
.kiz-file-chip { width: 100%; }

/* ── Module-Bubbles ──────────────────────────────────── */
.kiz-module-bubbles {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
    transition: opacity .22s ease, transform .22s ease;
}
.kiz-module-bubbles--visible {
    opacity: 1;
    pointer-events: all;
    transform: translateY(0);
}
.kiz-mod-bubble {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #fff;
    border: 1.5px solid #e3e7ed;
    box-shadow: 0 2px 8px rgba(0,0,0,.10);
    cursor: pointer;
    text-decoration: none;
    flex-shrink: 0;
    transition: transform .15s ease, box-shadow .15s ease;
}
.kiz-mod-bubble:hover {
    transform: scale(1.12);
    box-shadow: 0 4px 14px rgba(0,0,0,.16);
}
.kiz-mod-bubble svg {
    width: 16px;
    height: 16px;
    stroke: var(--mb-primary, #102c1d);
    display: block;
}

/* ── Drag & Drop ─────────────────────────────────────── */
.kiz-drop-overlay {
    display: none;
    position: absolute;
    inset: 0;
    background: rgba(16, 44, 29, 0.08);
    border: 2px dashed var(--mb-primary, #102c1d);
    border-radius: 20px;
    z-index: 100;
    pointer-events: none;
    align-items: center;
    justify-content: center;
}
.kiz-drop-overlay span {
    background: var(--mb-primary, #102c1d);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    padding: 8px 18px;
    border-radius: 8px;
}
.kiz-drag-over .kiz-drop-overlay {
    display: flex;
}
.kiz-chat-win__ta { order: 0; }
.kiz-icon-btn--attach,
.kiz-icon-btn--writer,
.kiz-icon-btn--mic,
.kiz-icon-btn--send { order: 1; }
.kiz-chat-win__ta {
    flex: 1;
    border: 1px solid #e5e8ed;
    border-radius: 13px;
    padding: 9px 12px;
    font-size: 13px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    resize: none;
    outline: none;
    min-height: 38px;
    max-height: 110px;
    overflow-y: auto;
    line-height: 1.45;
    color: #1e2533;
    background: #f5f6f8;
    transition: border-color .15s, background .15s;
    display: block;
}
.kiz-chat-win__ta:focus { border-color: var(--mb-primary, #102c1d); background: #fff; }
.kiz-chat-win__ta::placeholder { color: #b0b8c8; }

.kiz-icon-btn {
    width: 36px; height: 36px;
    border-radius: 50%; border: none; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; outline: none;
    transition: background .15s, transform .1s;
    background: #eef0f4; color: #7a8599;
}
.kiz-icon-btn:active { transform: scale(.88); }
.kiz-icon-btn--send { background: var(--mb-primary, #102c1d); color: #fff; }
.kiz-icon-btn--send:disabled { opacity: .3; cursor: default; }
.kiz-icon-btn--mic.kiz-rec { background: #fff0f0; color: #e03030; }
.kiz-icon-btn--writer { background: #eef0f4; color: #7a8599; }
.kiz-icon-btn--attach { background: #eef0f4; color: #7a8599; }
.kiz-icon-btn--writer-on {
    background: var(--mb-primary, #102c1d);
    color: #fff;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--mb-primary, #102c1d) 25%, transparent);
}
/* Mode-Label im Writer-Modus einfärben */
.kiz-chat-win__sub { transition: color .2s; }

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 480px) {
    .kiz-orb-wrap { bottom: 20px; right: 14px; }
    .kiz-chat-win { width: calc(100vw - 20px); }
}
