/* LL AI v65.94 — ChatGPT-like temporary chat visual polish.
   Pure presentation: no changes to chat, voice, memory, image, or persistence logic. */

/* Top bar: lighter, calmer, and visually closer to ChatGPT. */
.topbar{
  min-height:64px!important;
  height:64px!important;
  padding:8px 16px!important;
  border-bottom:1px solid color-mix(in srgb,var(--theme-line) 62%,transparent)!important;
  background:color-mix(in srgb,var(--theme-bg) 94%,transparent)!important;
  -webkit-backdrop-filter:blur(22px) saturate(1.08)!important;
  backdrop-filter:blur(22px) saturate(1.08)!important;
  box-shadow:none!important;
}
.topbar .topActions{gap:10px!important}

/* Search + temporary chat use the same quiet circular control language. */
.topbar #topCommands.commandTopBtn,
#tempChatBtn.llTempChatBtn{
  width:50px!important;
  min-width:50px!important;
  height:50px!important;
  flex:0 0 50px!important;
  padding:0!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.115)!important;
  background:rgba(255,255,255,.085)!important;
  color:rgba(255,255,255,.96)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 1px 2px rgba(0,0,0,.12)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  transition:background .16s ease,border-color .16s ease,transform .12s ease,box-shadow .16s ease,color .16s ease!important;
}
.topbar #topCommands.commandTopBtn:hover,
#tempChatBtn.llTempChatBtn:hover{
  background:rgba(255,255,255,.13)!important;
  border-color:rgba(255,255,255,.16)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 2px 8px rgba(0,0,0,.16)!important;
}
.topbar #topCommands.commandTopBtn:active,
#tempChatBtn.llTempChatBtn:active{transform:scale(.965)!important}
.topbar #topCommands.commandTopBtn svg{width:21px!important;height:21px!important;stroke-width:1.9!important}

/* ChatGPT-like temporary-chat glyph: segmented chat ring + check mark. */
#tempChatBtn .llTempChatIcon{
  width:23px!important;
  height:23px!important;
  overflow:visible;
  filter:none!important;
}
#tempChatBtn .llTempCheck{stroke-width:2.15!important}
#tempChatBtn[aria-pressed="true"]{
  color:#fff!important;
  background:rgba(255,255,255,.115)!important;
  border-color:rgba(255,255,255,.18)!important;
  box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.08),0 1px 2px rgba(0,0,0,.12)!important;
}

/* Search becomes a proper compact bar after a chat starts, without looking like a stretched button. */
body.llChatStarted .topbar #topCommands.commandTopBtn.llSearchExpanded{
  width:124px!important;
  min-width:124px!important;
  height:46px!important;
  flex-basis:124px!important;
  padding:0 14px!important;
  border-radius:23px!important;
  justify-content:flex-start!important;
  gap:9px!important;
  background:rgba(255,255,255,.07)!important;
  border-color:rgba(255,255,255,.10)!important;
}
body.llChatStarted .topbar #topCommands.commandTopBtn.llSearchExpanded:hover{
  background:rgba(255,255,255,.105)!important;
}
body.llChatStarted .topbar #topCommands.commandTopBtn.llSearchExpanded .llTopSearchLabel{
  max-width:70px!important;
  font-size:13.5px!important;
  font-weight:560!important;
  letter-spacing:0!important;
  color:rgba(255,255,255,.88)!important;
}

/* Temporary chat empty state mirrors ChatGPT's quiet center treatment. */
.llTemporaryWelcome{
  width:min(100%,620px)!important;
  max-width:620px!important;
  margin:auto!important;
  padding:28px 24px 110px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
}
.llTemporaryWelcome .llTemporaryMark{display:none!important}
.llTemporaryWelcome h1{
  margin:0!important;
  font-size:21px!important;
  line-height:1.25!important;
  font-weight:650!important;
  letter-spacing:-.018em!important;
  color:rgba(255,255,255,.90)!important;
}
.llTemporaryWelcome>p{
  margin:9px auto 0!important;
  max-width:460px!important;
  font-size:15.5px!important;
  line-height:1.45!important;
  font-weight:400!important;
  color:rgba(255,255,255,.56)!important;
}
.llTemporaryMode{
  appearance:none!important;
  -webkit-appearance:none!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  margin-top:36px!important;
  padding:8px 7px!important;
  border:0!important;
  border-radius:8px!important;
  background:transparent!important;
  box-shadow:none!important;
  color:rgba(255,255,255,.64)!important;
  font:500 14px/1.2 inherit!important;
  cursor:default!important;
}
.llTemporaryMode:hover{background:rgba(255,255,255,.045)!important;color:rgba(255,255,255,.78)!important}
.llTemporaryMode>span{width:auto!important;height:auto!important;background:none!important;box-shadow:none!important;border-radius:0!important}
.llTemporaryMode svg{opacity:.78}

/* Light appearance keeps the same hierarchy instead of hard-coded dark colors. */
html[data-theme="light"] .topbar #topCommands.commandTopBtn,
html[data-theme="light"] #tempChatBtn.llTempChatBtn{
  background:rgba(0,0,0,.055)!important;
  border-color:rgba(0,0,0,.10)!important;
  color:rgba(0,0,0,.88)!important;
}
html[data-theme="light"] .llTemporaryWelcome h1{color:rgba(0,0,0,.88)!important}
html[data-theme="light"] .llTemporaryWelcome>p{color:rgba(0,0,0,.52)!important}
html[data-theme="light"] .llTemporaryMode{color:rgba(0,0,0,.60)!important}

@media(max-width:640px){
  .topbar{height:58px!important;min-height:58px!important;padding:6px 10px!important}
  .topbar #topCommands.commandTopBtn,
  #tempChatBtn.llTempChatBtn{
    width:44px!important;min-width:44px!important;height:44px!important;flex-basis:44px!important;
  }
  #tempChatBtn .llTempChatIcon{width:21px!important;height:21px!important}
  body.llChatStarted .topbar #topCommands.commandTopBtn.llSearchExpanded{
    width:44px!important;min-width:44px!important;height:44px!important;flex-basis:44px!important;padding:0!important;border-radius:50%!important;justify-content:center!important;
  }
  body.llChatStarted .topbar #topCommands.commandTopBtn.llSearchExpanded .llTopSearchLabel{display:none!important}
  .llTemporaryWelcome{padding:24px 18px 92px!important}
  .llTemporaryWelcome h1{font-size:20px!important}
  .llTemporaryWelcome>p{font-size:14.5px!important}
  .llTemporaryMode{margin-top:28px!important}
}

@media(max-height:620px){
  .llTemporaryWelcome{padding-bottom:72px!important}
  .llTemporaryMode{margin-top:22px!important}
}
