/* AuroraChat modern layer – lädt nach app.css. Zum Zurücksetzen: <link>/<script> in views/app.php entfernen. */
:root{
  --accent:hsl(var(--accent-h,235) 85% 62%);
  --accent-soft:hsl(var(--accent-h,235) 85% 62% / .14);
  --ease:cubic-bezier(.2,.8,.2,1);
  --radius:14px;--radius-sm:9px;--radius-lg:22px;
}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{font-feature-settings:"cv11","ss01";letter-spacing:-.003em}
*{scrollbar-width:thin;scrollbar-color:var(--border) transparent}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:10px;border:3px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:var(--text-muted);background-clip:content-box;border:3px solid transparent}
::selection{background:var(--accent-soft)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}

.modal-bg{backdrop-filter:blur(10px) saturate(1.2);-webkit-backdrop-filter:blur(10px) saturate(1.2);background:rgba(8,8,14,.5)}
.modal-bg.show .modal{animation:mdPop .22s var(--ease)}
.modal{border-radius:var(--radius-lg);box-shadow:0 30px 80px rgba(0,0,0,.35);border:1px solid var(--border)}
@keyframes mdPop{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}

.chat-head{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);background:color-mix(in srgb,var(--panel) 82%,transparent);border-bottom:1px solid var(--border);box-shadow:0 1px 0 rgba(255,255,255,.02)}
.head-btn{border-radius:10px;transition:background .15s,transform .15s var(--ease)}
.head-btn:hover{background:var(--surface2);transform:translateY(-1px)}

button,.btn,.room-item,.input-dark{transition:background .15s,border-color .15s,box-shadow .15s,transform .15s var(--ease)}
.btn:active{transform:scale(.98)}
.input-dark{border-radius:12px}
.input-dark:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.room-item{border-radius:12px;margin:2px 6px}
.room-item:hover{background:var(--surface2)}
.room-item.active{background:var(--accent-soft)}
.room-unread{background:var(--accent);color:#fff;border-radius:999px;box-shadow:0 2px 8px var(--accent-soft)}
.messages{scroll-behavior:smooth}
.msg-row,.msg{animation:mdIn .18s var(--ease)}
@keyframes mdIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.avatar{box-shadow:0 0 0 1px rgba(255,255,255,.04)}
#toast-container .toast{border-radius:14px;backdrop-filter:blur(12px);box-shadow:var(--shadow-lg)}

/* Quick Switcher */
#qs-bg{position:fixed;inset:0;z-index:99999;display:none;align-items:flex-start;justify-content:center;padding:12vh 16px 0;background:rgba(8,8,14,.55);backdrop-filter:blur(8px)}
#qs-bg.show{display:flex}
#qs{width:min(560px,100%);background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.45);overflow:hidden;animation:mdPop .18s var(--ease)}
#qs input{width:100%;box-sizing:border-box;padding:18px 20px;font:inherit;font-size:16px;background:transparent;color:inherit;border:0;border-bottom:1px solid var(--border);outline:0}
#qs-list{max-height:min(50vh,380px);overflow:auto;padding:6px}
.qs-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;cursor:pointer;font-size:14px}
.qs-item.sel,.qs-item:hover{background:var(--accent-soft)}
.qs-item small{margin-left:auto;color:var(--text2);font-size:11px}
.qs-badge{background:var(--accent);color:#fff;border-radius:999px;font-size:10px;padding:1px 7px;font-weight:700}
#qs-hint{padding:8px 14px;font-size:11px;color:var(--text2);border-top:1px solid var(--border);display:flex;gap:14px}
kbd{background:var(--surface2);border:1px solid var(--border);border-bottom-width:2px;border-radius:5px;padding:0 5px;font:11px monospace}

/* Jump-to-bottom */
#jump-bottom{position:absolute;right:22px;bottom:96px;z-index:30;width:42px;height:42px;border-radius:50%;border:1px solid var(--border);background:var(--panel);color:var(--text);box-shadow:var(--shadow-lg);cursor:pointer;display:none;align-items:center;justify-content:center;font-size:18px}
#jump-bottom.show{display:flex;animation:mdPop .18s var(--ease)}
#jump-bottom b{position:absolute;top:-6px;right:-6px;background:var(--accent);color:#fff;border-radius:999px;font-size:10px;padding:1px 6px;display:none}
#jump-bottom.has-new b{display:block}

/* Drop-Zone */
#drop-veil{position:fixed;inset:0;z-index:99998;display:none;align-items:center;justify-content:center;background:rgba(8,8,14,.6);backdrop-filter:blur(6px);color:#fff;font-size:22px;font-weight:700;border:3px dashed var(--accent);margin:12px;border-radius:24px;pointer-events:none}
#drop-veil.show{display:flex}

/* Slash-Menü */
#slash-menu{position:absolute;left:12px;bottom:78px;z-index:40;background:var(--panel);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-lg);padding:6px;min-width:260px;display:none}
#slash-menu.show{display:block}
#slash-menu div{padding:8px 10px;border-radius:9px;cursor:pointer;font-size:13px;display:flex;gap:10px}
#slash-menu div.sel,#slash-menu div:hover{background:var(--accent-soft)}
#slash-menu span{color:var(--text2);margin-left:auto;font-size:11px}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}