/* 序列号：CSS叶-32 ｜ 坐标：商城⊂(0,4)⊂(0,3)⊂(0,2)⊂(0,1)⊂(0,0)⊂(1,32)
   地址：树库/CSS树库/商城/系0/枝干/叶子/电脑统一皮.css → 电脑统一皮
   大白话：TCSCDN 电脑宽屏的唯一现行皮肤。所有页面（含登录页）、商品详情、全屏看图、
           弹层和产品合成统一成同一套水墨底、透明墨块、细白线、直角、宋体按钮和暗金价格。
           只在 900px 以上生效，手机版和 tcsc 一点不受影响。
   角色：叶子
   什么时候用：由 商城样式.css 最后一条 @import 自动带入，不用业务代码喊。 */

@media (min-width: 900px) {
  :root {
    --电脑字: #F3F0E9;
    --电脑字弱: rgba(245, 243, 238, .62);
    --电脑字淡: rgba(245, 243, 238, .38);
    --电脑线: rgba(245, 243, 238, .38);
    --电脑线淡: rgba(245, 243, 238, .12);
    --电脑墨: rgba(10, 10, 12, .68);
    --电脑墨深: rgba(8, 8, 10, .92);
    --电脑金: #C9A96A;
    --电脑红: #C25B4E;
  }

  /* ---------- 水墨底：只由根页面一处负责；未登录纯黑，登录后才出图 ---------- */
  html { background: #08080A !important; }
  html:not(:has(#lBtn)):has(#app:not(:empty)),
  html:not(:has(#lBtn)):has(#mainBox:not(:empty)) {
    background-color: #08080A !important;
    background-image: url('/static/工作台背景.jpg') !important;
    background-position: center center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
  }
  body {
    background: transparent !important;
    color: var(--电脑字) !important;
  }
  #app,
  #mainBox {
    background: transparent !important;
    color: var(--电脑字);
  }
  body:has(#lBtn) #app { background: transparent !important; }

  /* ---------- 顶栏 ---------- */
  #app .顶栏 {
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
    color: var(--电脑字);
    padding: 20px 26px 0;
    min-height: 0;
  }
  #app .顶栏 .topbar-title { display: none; }

  /* ---------- 所有按钮：一套细线直角，英文类和中文类都收 ---------- */
  body :is(button, .bigbtn, .天蓝按钮, .白底按钮, .浅蓝按钮,
      .action-btn, .card-btn, .upload-btn, .ver-btn, .panel-ok, .panel-close,
      .avatar-btn, [class*="钮"]) {
    appearance: none;
    background: rgba(0, 0, 0, .16) !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
    font-weight: 400 !important;
    letter-spacing: .12em;
    text-indent: .12em;
    text-shadow: none !important;
    transition: background .2s, border-color .2s, color .2s;
  }
  body :is(button, .bigbtn, .天蓝按钮, .白底按钮, .浅蓝按钮,
      .action-btn, .card-btn, .upload-btn, .ver-btn, .panel-ok, .panel-close,
      .avatar-btn, [class*="钮"]):hover {
    background: rgba(245, 243, 238, .90) !important;
    border-color: transparent !important;
    color: #141414 !important;
  }
  body :is(button, .bigbtn, .天蓝按钮, .白底按钮, .浅蓝按钮,
      .action-btn, .card-btn, .upload-btn, .ver-btn, .panel-ok, .panel-close,
      .avatar-btn, [class*="钮"]):disabled,
  body :is(button, .bigbtn, .天蓝按钮, .白底按钮, .浅蓝按钮,
      .action-btn, .card-btn, .upload-btn, .ver-btn, .panel-ok, .panel-close,
      .avatar-btn, [class*="钮"])[aria-disabled="true"] {
    background: rgba(0, 0, 0, .10) !important;
    border-color: var(--电脑线淡) !important;
    color: var(--电脑字淡) !important;
    cursor: default;
  }
  body :is(button, .bigbtn, .天蓝按钮, .白底按钮, .浅蓝按钮,
      .action-btn, .card-btn, .upload-btn, .ver-btn, .panel-ok, .panel-close,
      .avatar-btn, [class*="钮"]):is(.active, .在, .片亮, .开),
  body [data-单片].片亮,
  body [data-找片].片亮 {
    background: rgba(245, 243, 238, .92) !important;
    border-color: transparent !important;
    color: #141414 !important;
  }
  body button svg { stroke: currentColor; }

  /* ---------- 所有输入：同一块透明墨 ---------- */
  body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  body textarea,
  body select {
    appearance: none;
    background: rgba(0, 0, 0, .24) !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
  }
  body input::placeholder,
  body textarea::placeholder { color: var(--电脑字淡) !important; }
  body input:focus,
  body textarea:focus,
  body select:focus {
    background: rgba(0, 0, 0, .48) !important;
    border-color: rgba(245, 243, 238, .78) !important;
    outline: none !important;
  }
  body input[type="checkbox"],
  body input[type="radio"],
  body input[type="range"] { accent-color: var(--电脑金); }

  /* ---------- 卡片、纸面、合成三栏 ---------- */
  body :is(.sheet, .价卡, .图库格, .店头, .我的店行, .批量人工, .批量张数,
      .批量缩图, .类目值, .类目芯, .编图, .详情纸, .图库顶区, .图库选行, .价卡列,
      .货格, .upload-card, .center-col, .side-panel, .裁剪台, .图库选行,
      .modal, #roomCard, #lampCard, #centerCol, #paramsPanel, #promptPanel) {
    background: var(--电脑墨) !important;
    border: 1px solid var(--电脑线淡) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--电脑字) !important;
  }
  body :is(.upload-card, #roomCard, #lampCard) { border-style: solid !important; }
  body .搜店行,
  body .货两列 { background: transparent !important; box-shadow: none !important; }
  body .货图框 { background: rgba(255, 255, 255, .05) !important; }

  /* ---------- 字色：统一亮字，价格保留暗金 ---------- */
  body :is(h1, h2, h3, h4, h5, h6) {
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
    font-weight: 400 !important;
    letter-spacing: .08em;
  }
  body :is(.货名, .空着, .面板说明, .面板小标题, .欢迎语, .货存, .翻页,
      .小字, .提示字, .类目说明, .店名, .详情说, .详情店, .详情编,
      .tip, .upload-title, .upload-hint, .help-title, .help-list,
      .传图说明, .格条话, .没图占位, .form label, .form .tip) {
    color: var(--电脑字弱) !important;
  }
  body :is(.货存, .空着, .翻页, .没图字, .图没出来) {
    color: var(--电脑字淡) !important;
  }
  body .货价,
  body .详情价 { color: var(--电脑金) !important; }
  body .小字入口 { color: var(--电脑红) !important; }
  body .err,
  body .form .err { color: var(--电脑红) !important; }
  /* ---------- 登录页：外壳收成手机宽度，里面仍用最新电脑皮肤 ---------- */
  body:has(#lBtn) #app .顶栏 {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px 16px 4px;
  }
  body:has(#lBtn) #app .顶栏 .topbar-title {
    display: block;
    color: var(--电脑字);
    font-family: "SimSun", "宋体", serif;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: .34em;
    text-indent: .34em;
  }
  body:has(#lBtn) #app .form {
    width: 100%;
    max-width: none;
    padding: 22px 16px 56px;
  }
  body:has(#lBtn) #app .form h2 {
    margin: 26px 0 18px;
    color: var(--电脑字) !important;
    font-size: 22px;
    text-align: center;
    letter-spacing: .16em;
  }
  body:has(#lBtn) #app .form label { margin-top: 14px; }
  body:has(#lBtn) #tabLogin.天蓝按钮,
  body:has(#lBtn) #tabReg.天蓝按钮 {
    background: rgba(245, 243, 238, .92) !important;
    border-color: transparent !important;
    color: #141414 !important;
  }
  body:has(#lBtn) #app .form > .天蓝按钮,
  body:has(#lBtn) #app .form > .白底按钮 { margin-bottom: 10px; }
  /* ---------- 底部浮条、提示和页脚 ---------- */
  body .留言条 {
    background: linear-gradient(to top, rgba(8, 8, 10, .98) 55%, rgba(8, 8, 10, 0)) !important;
  }
  body #toast {
    background: rgba(10, 10, 12, .94) !important;
    border: 1px solid var(--电脑线) !important;
    border-radius: 0 !important;
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
  }
  body .站底 {
    max-width: none;
    background: #08080A;
    color: var(--电脑字淡);
  }
  body .站底 a { color: var(--电脑字弱); }
  body:has(#lBtn) .站底 {
    max-width: 480px;
    background: transparent;
  }

  /* ---------- 产品合成：三栏和右侧面板也吃同一套 ---------- */
  #mainBox :is(.upload-title, .help-title, .section-title) {
    color: var(--电脑字) !important;
    font-family: "SimSun", "宋体", serif !important;
    font-weight: 400 !important;
  }
  #mainBox :is(.upload-label, .字色-深蓝) { color: var(--电脑字) !important; }
  #mainBox .sub { color: var(--电脑字弱) !important; }
  #mainBox :is(.upload-hint, .help-list, .help-list li, .tip, .muted) {
    color: var(--电脑字弱) !important;
  }
  #mainBox .upload-card,
  #mainBox .center-col,
  #mainBox .side-panel { background: var(--电脑墨) !important; }
  #mainBox .upload-card { border: 1px solid var(--电脑线淡) !important; }

  /* ---------- 滚动条 ---------- */
  body ::-webkit-scrollbar { width: 10px; height: 10px; }
  body ::-webkit-scrollbar-track { background: #0B0B0C; }
  body ::-webkit-scrollbar-thumb {
    background: rgba(245, 243, 238, .38);
    border: 2px solid #0B0B0C;
    border-radius: 0;
  }
  body ::-webkit-scrollbar-thumb:hover { background: rgba(245, 243, 238, .62); }
  body ::-webkit-scrollbar-corner { background: #0B0B0C; }
  body ::-webkit-scrollbar-button { display: none; }
}