/* ===========================================================
   AZN SHELL - Universal Language Switcher + AI Bubble
   Funktioniert auf index, auth, app
   =========================================================== */

/* === LANGUAGE SWITCHER (Header rechts) === */
.azn-lang{
  position:relative;display:inline-block;margin-left:8px
}
.azn-lang-btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 14px;border-radius:999px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1);
  color:rgba(245,245,247,.8);
  font-family:-apple-system,'Inter',sans-serif;
  font-size:13px;font-weight:500;
  cursor:pointer;transition:all .2s
}
.azn-lang-btn:hover{
  background:rgba(0,245,255,.08);
  border-color:rgba(0,245,255,.3);
  color:#00f5ff
}
.azn-lang-btn .flag{font-size:14px;line-height:1}
.azn-lang-btn .code{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.1em;font-weight:600}
.azn-lang-btn .chev{font-size:9px;opacity:.6;margin-left:2px}

.azn-lang-menu{
  position:absolute;top:calc(100% + 8px);right:0;
  width:280px;max-height:0;overflow:hidden;
  background:rgba(15,15,26,.96);
  backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);
  border:1px solid rgba(255,255,255,.1);
  border-radius:16px;
  box-shadow:0 24px 60px -20px rgba(0,0,0,.6);
  opacity:0;visibility:hidden;
  transition:all .25s cubic-bezier(.16,1,.3,1);
  z-index:9999
}
.azn-lang.open .azn-lang-menu{
  max-height:440px;
  opacity:1;visibility:visible
}
.azn-lang-search{
  padding:12px 14px 8px;
  border-bottom:1px solid rgba(255,255,255,.05)
}
.azn-lang-search input{
  width:100%;padding:9px 12px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:9px;color:#f5f5f7;
  font-family:-apple-system,'Inter',sans-serif;font-size:13px;
  outline:none
}
.azn-lang-search input:focus{
  border-color:rgba(0,245,255,.4);
  background:rgba(0,245,255,.04)
}
.azn-lang-list{
  max-height:340px;overflow-y:auto;
  padding:6px
}
.azn-lang-list::-webkit-scrollbar{width:4px}
.azn-lang-list::-webkit-scrollbar-thumb{background:rgba(0,245,255,.2);border-radius:2px}
.azn-lang-item{
  display:flex;align-items:center;gap:10px;
  padding:8px 10px;border-radius:8px;
  color:rgba(245,245,247,.75);
  font-family:-apple-system,'Inter',sans-serif;
  font-size:13px;cursor:pointer;
  transition:all .15s
}
.azn-lang-item:hover{
  background:rgba(0,245,255,.08);
  color:#fff
}
.azn-lang-item.active{
  background:linear-gradient(135deg,rgba(0,245,255,.18),rgba(139,92,246,.10));
  color:#00f5ff;font-weight:600
}
.azn-lang-item .flag{font-size:16px;line-height:1;width:22px;text-align:center}
.azn-lang-item .name{flex:1}
.azn-lang-item .code{
  font-family:'JetBrains Mono',monospace;
  font-size:10px;color:rgba(245,245,247,.4);
  letter-spacing:.1em;text-transform:uppercase
}
.azn-lang-item.active .code{color:#00f5ff}

/* Google Translate Widget verstecken (wir nutzen es nur intern) */
#google_translate_element{position:fixed;top:-9999px;left:-9999px;visibility:hidden}
.goog-te-banner-frame{display:none!important}
body{top:0!important}
.skiptranslate{display:none!important}
font[style]{background:transparent!important;box-shadow:none!important}

/* === AI BUBBLE (Floating Help) === */
.azn-bub-btn{
  position:fixed;bottom:24px;right:24px;z-index:9990;
  width:60px;height:60px;border-radius:50%;
  background:linear-gradient(135deg,#00f5ff,#8b5cf6,#ff006e);
  border:1px solid rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:#fff;font-size:26px;
  box-shadow:0 16px 40px -10px rgba(0,245,255,.5),0 8px 24px rgba(0,0,0,.4);
  transition:all .3s cubic-bezier(.16,1,.3,1);
  animation:bubFloat 4s ease-in-out infinite
}
@keyframes bubFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}
.azn-bub-btn:hover{
  transform:scale(1.08);
  box-shadow:0 24px 60px -10px rgba(0,245,255,.7),0 12px 30px rgba(0,0,0,.5)
}
.azn-bub-btn .ping{
  position:absolute;top:0;right:0;
  width:14px;height:14px;border-radius:50%;
  background:#aaff00;border:2px solid #070710;
  box-shadow:0 0 10px rgba(170,255,0,.8);
  animation:bubPing 2s infinite
}
@keyframes bubPing{0%,100%{opacity:1}50%{opacity:.5}}

.azn-bub-panel{
  position:fixed;bottom:100px;right:24px;z-index:9991;
  width:380px;max-width:calc(100vw - 32px);
  height:560px;max-height:calc(100vh - 140px);
  background:rgba(15,15,26,.96);
  backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);
  border:1px solid rgba(0,245,255,.25);
  border-radius:22px;
  box-shadow:0 32px 80px -20px rgba(0,0,0,.7),0 0 40px -10px rgba(0,245,255,.25);
  display:none;flex-direction:column;overflow:hidden;
  animation:bubPanelIn .35s cubic-bezier(.16,1,.3,1)
}
.azn-bub-panel.open{display:flex}
@keyframes bubPanelIn{
  from{opacity:0;transform:translateY(20px) scale(.95)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

.azn-bub-head{
  padding:16px 20px;
  border-bottom:1px solid rgba(255,255,255,.06);
  display:flex;align-items:center;gap:12px;
  background:linear-gradient(135deg,rgba(0,245,255,.06),rgba(255,0,110,.04))
}
.azn-bub-avatar{
  width:38px;height:38px;border-radius:50%;
  background:linear-gradient(135deg,#00f5ff,#8b5cf6);
  display:grid;place-items:center;
  font-size:18px;flex-shrink:0;
  box-shadow:0 6px 16px -4px rgba(0,245,255,.5)
}
.azn-bub-info{flex:1;min-width:0}
.azn-bub-name{
  font-family:-apple-system,'SF Pro Display','Inter',sans-serif;
  font-weight:700;font-size:15px;color:#fff;
  letter-spacing:-.01em;line-height:1.2
}
.azn-bub-status{
  font-family:'JetBrains Mono',monospace;
  font-size:10px;color:#aaff00;
  text-transform:uppercase;letter-spacing:.15em;
  display:flex;align-items:center;gap:5px;margin-top:3px
}
.azn-bub-status::before{
  content:"";width:6px;height:6px;border-radius:50%;
  background:#aaff00;box-shadow:0 0 8px rgba(170,255,0,.6)
}
.azn-bub-close{
  width:30px;height:30px;border-radius:50%;
  background:rgba(255,255,255,.05);
  border:none;color:rgba(245,245,247,.7);
  cursor:pointer;font-size:16px;
  display:grid;place-items:center;
  transition:all .2s
}
.azn-bub-close:hover{background:rgba(255,0,110,.15);color:#ff006e}

.azn-bub-body{
  flex:1;overflow-y:auto;padding:16px;
  display:flex;flex-direction:column;gap:10px
}
.azn-bub-body::-webkit-scrollbar{width:4px}
.azn-bub-body::-webkit-scrollbar-thumb{background:rgba(0,245,255,.2);border-radius:2px}

.azn-msg{max-width:85%;display:flex;flex-direction:column;gap:4px;animation:msgIn .3s cubic-bezier(.16,1,.3,1)}
@keyframes msgIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.azn-msg.them{align-self:flex-start}
.azn-msg.me{align-self:flex-end}
.azn-msg .bubble{
  padding:10px 14px;border-radius:14px;
  font-family:-apple-system,'Inter',sans-serif;
  font-size:13.5px;line-height:1.5;word-wrap:break-word
}
.azn-msg.them .bubble{
  background:rgba(255,255,255,.05);
  color:rgba(245,245,247,.92);
  border-bottom-left-radius:4px
}
.azn-msg.me .bubble{
  background:linear-gradient(135deg,#00f5ff,#8b5cf6);
  color:#070710;font-weight:500;
  border-bottom-right-radius:4px
}
.azn-msg .time{
  font-family:'JetBrains Mono',monospace;
  font-size:9px;color:rgba(245,245,247,.35);
  letter-spacing:.05em;padding:0 4px
}
.azn-msg.me .time{text-align:right}

.azn-bub-faqs{
  display:flex;flex-direction:column;gap:6px;margin-top:8px
}
.azn-bub-faq-title{
  font-family:'JetBrains Mono',monospace;
  font-size:10px;color:rgba(245,245,247,.4);
  text-transform:uppercase;letter-spacing:.2em;
  margin-bottom:4px
}
.azn-bub-faq{
  padding:9px 12px;border-radius:10px;
  background:rgba(0,245,255,.05);
  border:1px solid rgba(0,245,255,.15);
  color:rgba(245,245,247,.85);
  font-family:-apple-system,'Inter',sans-serif;
  font-size:12.5px;text-align:left;
  cursor:pointer;transition:all .2s;line-height:1.4
}
.azn-bub-faq:hover{
  background:rgba(0,245,255,.12);
  border-color:rgba(0,245,255,.35);
  color:#00f5ff;transform:translateX(3px)
}

.azn-bub-input{
  padding:12px 14px;
  border-top:1px solid rgba(255,255,255,.06);
  display:flex;gap:8px;align-items:center;
  background:rgba(7,7,16,.4)
}
.azn-bub-input input{
  flex:1;padding:10px 14px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;color:#f5f5f7;
  font-family:-apple-system,'Inter',sans-serif;font-size:13px;
  outline:none
}
.azn-bub-input input:focus{
  border-color:rgba(0,245,255,.4);
  background:rgba(0,245,255,.04)
}
.azn-bub-send{
  width:38px;height:38px;border-radius:50%;
  background:linear-gradient(135deg,#00f5ff,#8b5cf6);
  border:none;color:#070710;
  font-size:16px;cursor:pointer;
  display:grid;place-items:center;
  flex-shrink:0;transition:all .2s
}
.azn-bub-send:hover{transform:scale(1.05);box-shadow:0 6px 16px -4px rgba(0,245,255,.5)}

.azn-typing{
  display:flex;gap:4px;padding:10px 14px;
  background:rgba(255,255,255,.05);
  border-radius:14px;border-bottom-left-radius:4px;
  align-self:flex-start;max-width:60px
}
.azn-typing span{
  width:6px;height:6px;border-radius:50%;
  background:rgba(245,245,247,.5);
  animation:typing 1.4s infinite
}
.azn-typing span:nth-child(2){animation-delay:.2s}
.azn-typing span:nth-child(3){animation-delay:.4s}
@keyframes typing{
  0%,60%,100%{transform:translateY(0);opacity:.5}
  30%{transform:translateY(-4px);opacity:1}
}

@media (max-width:560px){
  .azn-bub-btn{width:54px;height:54px;font-size:22px;bottom:16px;right:16px}
  .azn-bub-panel{
    bottom:84px;right:16px;left:16px;width:auto;
    height:calc(100vh - 120px)
  }
}