/* 序列号：CSS叶-33 ｜ 坐标：商城⊂(0,4)⊂(0,3)⊂(0,2)⊂(0,1)⊂(0,0)⊂(1,33)
   地址：树库/CSS树库/商城/系0/枝干/叶子/电脑深件皮.css → 电脑深件皮
   大白话：电脑统一皮的深层部分：我的货/橱窗底栏和选中框、所有 body 弹层、
           商品详情、全屏看图、念儿对话卡、头像和账号菜单。
           从 电脑统一皮.css 拆出来，避免一份叶子超过 500 行。
   角色：叶子
   什么时候用：由 index.html 在 电脑统一皮.css 之后自动加载，不用业务代码喊。 */

@media (min-width: 900px) {
  /* ---------- 我的货/橱窗：底栏、选中框、看图页和改资料弹层 ---------- */
  body .货格底条 {
    background: linear-gradient(to top, rgba(8, 8, 10, .98) 60%, rgba(8, 8, 10, 0)) !important;
  }
  body .格选 {
    background: rgba(0, 0, 0, .34) !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    color: var(--电脑字) !important;
  }
  body .我的图格.选中 .格选 {
    background: rgba(245, 243, 238, .92) !important;
    border-color: transparent !important;
    color: #141414 !important;
  }
  body .我的图格.选中 .货图框 {
    box-shadow: 0 0 0 2px rgba(245, 243, 238, .72) !important;
  }
  body .没图占位 { background: transparent !important; }
  body .编页,
  body .编图,
  body .改页 {
    background: transparent !important;
    color: var(--电脑字) !important;
  }
  body .改号 {
    color: var(--电脑金) !important;
    font-family: "SimSun", "宋体", serif !important;
    font-weight: 400 !important;
    letter-spacing: .08em;
  }
  body .图库签 {
    background: rgba(0, 0, 0, .16) !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
  }
  body .图库签.选中 {
    background: rgba(245, 243, 238, .92) !important;
    border-color: transparent !important;
    color: #141414 !important;
  }
  body .图库选 {
    background: rgba(0, 0, 0, .38) !important;
    border: 1px solid var(--电脑线) !important;
    color: var(--电脑字) !important;
  }
  body .图库格.选中 { box-shadow: 0 0 0 2px rgba(245, 243, 238, .72) !important; }
  body .图库格.选中 .图库选 {
    background: rgba(245, 243, 238, .92) !important;
    color: #141414 !important;
  }

  /* ---------- 所有弹层：不论在 #app 里还是挂在 body 上 ---------- */
  body :is(.mask, .面板遮罩, .详情遮) {
    background: rgba(0, 0, 0, .74) !important;
  }
  /* 2026-10-27 老板定：高端定制点开的那张图，后面要全屏纯黑、不透光 —— 看得见后面的月亮太抢镜。 */
  body .详情遮.高端黑 {
    background: #000 !important;
  }
  /* 2026-10-27 老板定：高端定制点开的那张图要占满整屏；底下「选中这款」别横贯整屏，缩到屏宽 1/5、居中。 */
  body .详情遮.高端黑 .详情纸 {
    width: 100% !important;
    max-width: none !important;
  }
  body .详情遮.高端黑 .详情脚 #详情选中 {
    width: 20vw !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  body .mask .sheet,
  body .面板遮罩 .sheet {
    background: var(--电脑墨深) !important;
    border: 1px solid var(--电脑线淡) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--电脑字);
  }
  body .mask .sheet .h,
  body .面板遮罩 .sheet .h {
    background: transparent !important;
    border-bottom: 1px solid var(--电脑线淡) !important;
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
  }
  body .mask .h span,
  body .面板遮罩 .h span { color: var(--电脑字) !important; }
  body .mask .关闭钮,
  body .mask .关上钮 { color: var(--电脑字) !important; }
  body .modal-mask { background: rgba(0, 0, 0, .74) !important; }
  body .modal { color: var(--电脑字) !important; }
  body .modal .panel-title {
    background: transparent !important;
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
    font-weight: 400 !important;
  }
  body .modal .panel-hint { color: var(--电脑字弱) !important; }
  body .modal .qr-box { color: var(--电脑字) !important; }
  body .modal .qr-row img { border: 1px solid var(--电脑线) !important; }
  body .mask input,
  body .mask textarea,
  body .mask select,
  body .面板遮罩 input,
  body .面板遮罩 textarea,
  body .面板遮罩 select {
    background: rgba(0, 0, 0, .28) !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    color: var(--电脑字) !important;
  }

  /* ---------- 商品详情：它是 body 上的独立纸，不再依赖 #app 的皮肤名 ---------- */
  body .详情纸 {
    background: var(--电脑墨深) !important;
    border: 1px solid var(--电脑线淡) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--电脑字) !important;
  }
  body .详情纸 .大图框 { background: #050506 !important; }
  body .详情纸 .详情文,
  body .详情纸 .详情脚 { background: transparent !important; }
  body .详情纸 .详情名 { color: var(--电脑字) !important; }
  body .详情纸 .详情价 { color: var(--电脑金) !important; }
  body .详情纸 .详情说,
  body .详情纸 .详情店,
  body .详情纸 .详情编 { color: var(--电脑字弱) !important; }
  body .详情纸 .选中钮2 {
    background: rgba(0, 0, 0, .18) !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
  }
  body .详情纸 .选中钮2.在 {
    background: rgba(245, 243, 238, .92) !important;
    color: #141414 !important;
  }
  body .详情纸 .图箭 {
    background: rgba(0, 0, 0, .42) !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    color: var(--电脑字) !important;
  }
  body .详情纸 .图点 {
    background: rgba(245, 243, 238, .24) !important;
    border-radius: 0 !important;
  }
  body .详情纸 .图点.亮 { background: var(--电脑字) !important; }

  /* ---------- 全屏看图 ---------- */
  body .全屏遮 { background: #030304 !important; }
  body .全屏关闭钮 {
    background: rgba(0, 0, 0, .34) !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
  }
  body .全屏关闭钮:hover {
    background: rgba(245, 243, 238, .90) !important;
    color: #141414 !important;
  }
  body .全屏放大层 .放大提示 {
    color: var(--电脑字弱) !important;
    font-family: "SimSun", "宋体", serif !important;
    letter-spacing: .08em;
  }

  /* ---------- 念儿：头像、对话卡和输入行 ---------- */
  body .ai悬浮球 {
    width: 50px !important;
    height: 50px !important;
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, .85) !important;
    border-radius: 50% !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .45), 0 8px 18px rgba(0, 0, 0, .45) !important;
    padding: 0 !important;
  }
  body .ai球图 { border-radius: 50% !important; }
  body .ai说话卡 {
    background: rgba(10, 10, 12, .94) !important;
    border: 1px solid var(--电脑线淡) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--电脑字) !important;
  }
  body .ai拖条 {
    margin: 0 0 2px;
    padding: 4px 0 8px;
    gap: 6px;
    border-bottom: 1px solid var(--电脑线淡) !important;
  }
  body .ai标题 {
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
    font-weight: 400 !important;
    letter-spacing: .12em;
  }
  body .ai头像,
  body .ai对话头像 {
    width: 20px !important;
    height: 20px !important;
    border: 1px solid rgba(255, 255, 255, .65) !important;
    border-radius: 50% !important;
    background: transparent !important;
  }
  body .ai听状态 { color: var(--电脑金) !important; }
  body .ai输入提示,
  body .ai语音行 { display: none !important; }
  body .ai对话行.用户 .ai气泡 {
    background: rgba(201, 169, 106, .18) !important;
    border: 1px solid rgba(201, 169, 106, .38) !important;
    border-radius: 0 !important;
    color: var(--电脑字) !important;
  }
  body .ai对话行.助手 .ai气泡 {
    background: rgba(255, 255, 255, .06) !important;
    border: 1px solid var(--电脑线淡) !important;
    border-radius: 0 !important;
    color: var(--电脑字) !important;
  }
  body .ai气泡 { font-size: 13px; box-shadow: none !important; }
  body .ai输入行 { display: flex; align-items: center; gap: 6px; }
  body .ai文字 {
    flex: 1 1 auto;
    width: auto !important;
    min-width: 0 !important;
    min-height: 34px !important;
    height: 34px !important;
    max-height: 88px;
    font-size: 13px !important;
  }
  body .ai图标钮 {
    flex: 0 0 34px;
    width: 34px !important;
    height: 34px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
  }
  body .ai图标钮 svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
  }

  /* ---------- 头像和账号菜单：透明墨底，不留灰蒙蒙的“像禁用”字 ---------- */
  body .user-bar .avatar-btn {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, .78) !important;
    border-radius: 50% !important;
    box-shadow: none !important;
  }
  body .user-menu {
    background: rgba(10, 10, 12, .82) !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--电脑字) !important;
  }
  body .user-menu .user-info {
    color: var(--电脑金) !important;
    border-bottom: 1px solid rgba(201, 169, 106, .34) !important;
    font-size: 12px;
  }
  body .user-menu button {
    background: transparent !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    color: var(--电脑字) !important;
    opacity: 1 !important;
    font-family: "SimSun", "宋体", serif !important;
    font-size: 12px;
    font-weight: 400 !important;
    text-shadow: none !important;
  }
  body .user-menu button:hover {
    background: rgba(245, 243, 238, .92) !important;
    border-color: transparent !important;
    color: #141414 !important;
  }
  body .user-menu .user-menu-close {
    background: transparent !important;
    color: var(--电脑字) !important;
  }

  /* ---------- 商品详情的视频窗、资料钮和右侧资料面板 ---------- */
  body .详情遮 .详情纸 {
    max-width: 1080px !important;
  }
  body .详情纸 .详情资料钮 {
    background: transparent !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
  }
  body .详情纸 .详情资料钮:hover {
    background: rgba(245, 243, 238, .92) !important;
    border-color: transparent !important;
    color: #141414 !important;
  }
  body .详情纸 .详情资料遮 {
    background: rgba(0, 0, 0, .62) !important;
  }
  body .详情纸 .详情资料纸 {
    background: var(--电脑墨深) !important;
    border-left: 1px solid var(--电脑线淡) !important;
    color: var(--电脑字) !important;
  }
  body .详情纸 .详情资料头 {
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
    font-weight: 400 !important;
    letter-spacing: .12em;
  }
  body .详情纸 .详情资料正文 {
    color: var(--电脑字弱) !important;
  }
  body .详情纸 .详情资料关 {
    background: transparent !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    color: var(--电脑字) !important;
  }
  body .详情纸 .详情资料关:hover {
    background: rgba(245, 243, 238, .92) !important;
    color: #141414 !important;
  }
  body .详情纸 .详情资料遮.开 {
    align-items: stretch;
    justify-content: flex-end;
  }
  body .详情纸 .详情资料纸 {
    width: min(450px, 44%);
    max-height: none;
    height: 100%;
    padding: 58px 26px 28px;
  }
  body .详情纸 .视频标 {
    background: rgba(0, 0, 0, .72) !important;
    border: 1px solid var(--电脑线淡) !important;
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
  }
}
