/* 玄元堂主查询区美化：只改视觉，不动功能 */

/* 主卡片：更轻、更干净 */
.main-card{
  background:rgba(255,252,247,.86) !important;
  border:1px solid rgba(86,64,40,.12) !important;
  border-radius:24px !important;
  box-shadow:0 16px 42px rgba(54,38,22,.08) !important;
  overflow:hidden !important;
}

/* 顶部命例操作区：增加一点呼吸感 */
.toolbar{
  padding:18px 20px 12px !important;
  gap:12px !important;
}

/* 下拉框：弱化粗重感 */
.case-select{
  height:52px !important;
  border-radius:17px !important;
  border:1px solid rgba(70,50,30,.14) !important;
  background:rgba(255,255,255,.68) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9) !important;
  color:#1f1b18 !important;
  font-size:16px !important;
  font-weight:400 !important;
  letter-spacing:.01em !important;
  padding:0 16px !important;
}

.case-select,
.case-select option{
  font-weight:400 !important;
}

/* 新增按钮：次级动作，别抢主按钮 */
.toolbar .add-btn{
  height:52px !important;
  border-radius:17px !important;
  background:rgba(255,255,255,.54) !important;
  border:1px solid rgba(98,72,47,.14) !important;
  color:#7d2b2d !important;
  box-shadow:none !important;
  font-size:16px !important;
  font-weight:650 !important;
}

/* 开始查询：页面唯一主动作 */
.toolbar .start-btn{
  height:56px !important;
  border-radius:20px !important;
  background:linear-gradient(180deg,#c41f28 0%,#ad141d 100%) !important;
  border:none !important;
  color:#fff !important;
  box-shadow:0 12px 26px rgba(183,25,32,.20) !important;
  font-size:18px !important;
  font-weight:760 !important;
  letter-spacing:.16em !important;
}

/* 状态提示：像轻提示，不要像警告框 */
.status-line{
  margin:0 20px 12px !important;
  padding:11px 14px !important;
  border-radius:15px !important;
  background:rgba(255,255,255,.40) !important;
  border:1px dashed rgba(91,70,48,.22) !important;
  color:#7d746b !important;
  font-size:14px !important;
  line-height:1.6 !important;
}

/* 聊天框：更像笔记纸面 */
.chat-wrap{
  padding:0 20px 20px !important;
}

.chat-box{
  background:rgba(255,253,249,.46) !important;
  border:1px solid rgba(86,65,43,.10) !important;
  border-radius:22px !important;
  padding:18px !important;
}

/* 空状态：插画保留，文字更清楚 */
.empty-state .icon{
  width:68px !important;
  height:68px !important;
  border-radius:22px !important;
  box-shadow:0 10px 28px rgba(70,48,30,.10) !important;
}

.empty-state h3{
  margin-top:20px !important;
  font-size:25px !important;
  font-weight:720 !important;
  letter-spacing:.02em !important;
  color:#5a554f !important;
}

.empty-state p{
  max-width:620px !important;
  margin:12px auto 0 !important;
  font-size:16px !important;
  line-height:1.85 !important;
  font-weight:400 !important;
  color:#766e66 !important;
}

/* 输入区 */
.composer{
  gap:12px !important;
}

.composer textarea{
  background:rgba(255,255,255,.64) !important;
  border:1px solid rgba(74,55,38,.12) !important;
  border-radius:18px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85) !important;
  color:#1f1b18 !important;
  font-size:15px !important;
  font-weight:400 !important;
}

.composer textarea::placeholder{
  color:#b9b0a7 !important;
}

.composer .btn{
  border-radius:20px !important;
  background:linear-gradient(180deg,#dc8b91,#d57980) !important;
  border:none !important;
  color:#fff !important;
  box-shadow:0 9px 22px rgba(196,93,102,.20) !important;
  font-size:16px !important;
  font-weight:720 !important;
}

/* 聊天气泡微调 */
.bubble{
  border-radius:19px !important;
  line-height:1.78 !important;
  font-size:15.5px !important;
  letter-spacing:.01em !important;
}

.bubble.ai,
.bubble.bot{
  background:rgba(255,255,255,.72) !important;
  border:1px solid rgba(79,59,39,.10) !important;
}

.bubble.user{
  background:#eaf3ff !important;
  color:#1d1d1f !important;
}

/* 手机端只微调，不重排顶部 */
@media (max-width:768px){
  .main-card{
    border-radius:22px !important;
  }

  .toolbar{
    padding:14px !important;
    gap:10px !important;
  }

  .case-select,
  .toolbar .add-btn{
    height:50px !important;
    border-radius:16px !important;
    font-size:15px !important;
  }

  .toolbar .start-btn{
    height:54px !important;
    border-radius:18px !important;
    font-size:18px !important;
  }

  .status-line{
    margin:0 14px 12px !important;
    font-size:13px !important;
  }

  .chat-wrap{
    padding:0 14px 14px !important;
  }

  .chat-box{
    padding:16px !important;
    border-radius:20px !important;
  }

  .empty-state h3{
    font-size:22px !important;
  }

  .empty-state p{
    font-size:15px !important;
    line-height:1.85 !important;
  }

  .composer textarea{
    height:54px !important;
    min-height:54px !important;
    font-size:14px !important;
  }

  .composer .btn{
    height:54px !important;
    font-size:15px !important;
  }
}


/* xyt-toolbar-width-fix-start */
/* 命例选择区：下拉框不要为了撑满而过长 */
.toolbar{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
}

/* 下拉框按内容区适度宽，不再占满整行 */
.case-select{
  flex:0 1 360px !important;
  width:auto !important;
  max-width:420px !important;
  min-width:260px !important;
}

/* 新增按钮固定为次级操作 */
.toolbar .add-btn{
  flex:0 0 92px !important;
}

/* 开始查询仍然保持整行主按钮 */
.toolbar .start-btn{
  flex:1 0 100% !important;
  width:100% !important;
}

/* 手机端：保证不挤、不溢出 */
@media (max-width:768px){
  .case-select{
    flex:1 1 calc(100% - 98px) !important;
    min-width:0 !important;
    max-width:none !important;
  }

  .toolbar .add-btn{
    flex:0 0 86px !important;
  }
}

@media (max-width:390px){
  .case-select{
    flex:1 1 calc(100% - 90px) !important;
  }

  .toolbar .add-btn{
    flex:0 0 80px !important;
  }
}
/* xyt-toolbar-width-fix-end */


/* xyt-select-final-width-fix-start */
/* 命例选择区：下拉框按内容适度显示，不再硬撑满 */
.toolbar{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
}

.case-select{
  flex:0 0 auto !important;
  width:300px !important;
  max-width:calc(100% - 100px) !important;
  min-width:240px !important;
}

.toolbar .add-btn{
  flex:0 0 86px !important;
  width:86px !important;
}

.toolbar .start-btn{
  flex:0 0 100% !important;
  width:100% !important;
}

@media (max-width:768px){
  .case-select{
    width:300px !important;
    max-width:calc(100% - 96px) !important;
    min-width:220px !important;
  }

  .toolbar .add-btn{
    flex:0 0 86px !important;
    width:86px !important;
  }
}

@media (max-width:390px){
  .case-select{
    width:270px !important;
    max-width:calc(100% - 90px) !important;
    min-width:200px !important;
  }

  .toolbar .add-btn{
    flex:0 0 80px !important;
    width:80px !important;
  }
}
/* xyt-select-final-width-fix-end */

/* xyt-toolbar-final-layout-start */
/* 命例选择、新增、开始查询形成一个紧凑操作组 */
.toolbar{
  display:grid !important;
  grid-template-columns:300px 86px 1fr !important;
  grid-template-rows:auto auto !important;
  column-gap:10px !important;
  row-gap:12px !important;
  justify-content:start !important;
  align-items:center !important;
}

/* 下拉框不再撑满 */
.case-select{
  grid-column:1 !important;
  grid-row:1 !important;
  width:300px !important;
  min-width:0 !important;
  max-width:300px !important;
  flex:none !important;
}

/* 新增按钮紧贴下拉框 */
.toolbar .add-btn{
  grid-column:2 !important;
  grid-row:1 !important;
  width:86px !important;
  min-width:86px !important;
  max-width:86px !important;
  flex:none !important;
}

/* 开始查询不要整行铺满，和上方操作组同宽 */
.toolbar .start-btn{
  grid-column:1 / 3 !important;
  grid-row:2 !important;
  width:396px !important;
  max-width:396px !important;
  min-width:0 !important;
  flex:none !important;
  justify-self:start !important;
}

/* 手机端按屏幕宽度自适应，但仍然紧凑 */
@media (max-width:768px){
  .toolbar{
    grid-template-columns:minmax(0, 1fr) 86px !important;
    column-gap:10px !important;
  }

  .case-select{
    width:100% !important;
    max-width:none !important;
  }

  .toolbar .add-btn{
    width:86px !important;
    min-width:86px !important;
    max-width:86px !important;
  }

  .toolbar .start-btn{
    grid-column:1 / 3 !important;
    width:100% !important;
    max-width:100% !important;
  }
}

@media (min-width:769px){
  .toolbar .start-btn{
    width:396px !important;
  }
}
/* xyt-toolbar-final-layout-end */

/* xyt-start-btn-width-fix-start */
/* 开始查询不要铺满整行，和上方命例选择区形成一个视觉组 */
@media (min-width:769px){
  .toolbar{
    display:grid !important;
    grid-template-columns:300px 86px 1fr !important;
    column-gap:10px !important;
    row-gap:12px !important;
    justify-content:start !important;
  }

  .case-select{
    grid-column:1 !important;
    width:300px !important;
    max-width:300px !important;
  }

  .toolbar .add-btn{
    grid-column:2 !important;
    width:86px !important;
    max-width:86px !important;
  }

  .toolbar .start-btn{
    grid-column:1 / 3 !important;
    width:396px !important;
    max-width:396px !important;
    justify-self:start !important;
  }
}

/* 手机端仍然保留满宽，避免太窄不好点 */
@media (max-width:768px){
  .toolbar{
    display:grid !important;
    grid-template-columns:1fr 86px !important;
    column-gap:10px !important;
    row-gap:12px !important;
  }

  .toolbar .start-btn{
    grid-column:1 / 3 !important;
    width:100% !important;
    max-width:100% !important;
  }
}
/* xyt-start-btn-width-fix-end */

/* 音乐开关按钮：上移，避免和发送/分析按钮重叠 */
.music-btn,
.music-toggle,
.bgm-btn,
.bgm-toggle,
.audio-btn,
.audio-toggle,
.sound-btn,
.sound-toggle,
#musicBtn,
#musicToggle,
#bgmBtn,
#bgmToggle{
  position: fixed !important;
  right: 18px !important;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 132px) !important;
  z-index: 30 !important;
}

@media (max-width: 640px){
  .music-btn,
  .music-toggle,
  .bgm-btn,
  .bgm-toggle,
  .audio-btn,
  .audio-toggle,
  .sound-btn,
  .sound-toggle,
  #musicBtn,
  #musicToggle,
  #bgmBtn,
  #bgmToggle{
    right: 18px !important;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 142px) !important;
  }
}
