@import url("qc-theme.css");
/* 一期前台 · 1号暗金旗舰。颜色只来自 qc-theme.css，这里只覆盖气质，不改表单逻辑。 */

html {
  background: var(--qc-night);
}

body {
  background:
    radial-gradient(900px 420px at 12% -8%, rgba(201, 161, 91, 0.16), transparent 58%),
    radial-gradient(720px 380px at 92% 8%, rgba(201, 161, 91, 0.08), transparent 60%),
    var(--qc-night) !important;
  color: var(--qc-ink) !important;
}

body:is(.qc-p-home, .qc-p-diy, .qc-p-recycle, .qc-p-repair, .qc-p-track, .qc-p-chat, .qc-p-member) .qc-nav {
  background: var(--qc-nav-bg) !important;
  border-bottom: 1px solid var(--qc-line) !important;
}

body:is(.qc-p-home, .qc-p-diy, .qc-p-recycle, .qc-p-repair, .qc-p-track, .qc-p-chat, .qc-p-member) .qc-nav a:not(.btn) {
  color: var(--qc-nav-text) !important;
}

body:is(.qc-p-home, .qc-p-diy, .qc-p-recycle, .qc-p-repair, .qc-p-track, .qc-p-chat, .qc-p-member) .qc-nav a:not(.btn):hover,
body.qc-p-home .qc-nav a[href="/marketing/index.html"]:not(.btn),
body.qc-p-diy .qc-nav a[href="/diy.html"]:not(.btn),
body.qc-p-recycle .qc-nav a[href="/recycle.html"]:not(.btn),
body.qc-p-repair .qc-nav a[href="/repair.html"]:not(.btn),
body.qc-p-track .qc-nav a[href="/repair-track.html"]:not(.btn),
body.qc-p-chat .qc-nav a[href="/customer-chat.html"]:not(.btn),
body.qc-p-member .qc-nav a[href="/member.html"]:not(.btn) {
  color: var(--qc-nav-on) !important;
  border-bottom-color: var(--qc-gold) !important;
}

body:is(.qc-p-home, .qc-p-diy, .qc-p-recycle, .qc-p-repair, .qc-p-track, .qc-p-chat, .qc-p-member) .qc-nav .qc-logo,
body:is(.qc-p-home, .qc-p-diy, .qc-p-recycle, .qc-p-repair, .qc-p-track, .qc-p-chat, .qc-p-member) .qc-nav a.qc-logo,
body:is(.qc-p-home, .qc-p-diy, .qc-p-recycle, .qc-p-repair, .qc-p-track, .qc-p-chat, .qc-p-member) .qc-nav a.qc-logo:hover {
  color: var(--qc-nav-on) !important;
  border-bottom-color: transparent !important;
}

.qc-nav .qc-logo b {
  color: var(--qc-gold);
}

.bar,
.top {
  background: rgba(16, 18, 24, 0.92) !important;
  border-bottom: 1px solid var(--qc-line) !important;
  color: var(--qc-ink) !important;
}

.top .wrap {
  border-left-color: var(--qc-gold) !important;
}

.bar h1,
.top h1 {
  color: #f6e7c3;
  letter-spacing: 0.04em;
  font-weight: 600;
}

.bar .sub,
.top p,
.bar .summary,
.store-line,
.tip {
  color: #9a917f !important;
}

.bar .summary b {
  color: var(--qc-gold-2) !important;
}

.card,
.right {
  background: #101218 !important;
  border: 1px solid var(--qc-line) !important;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35) !important;
  color: var(--qc-ink) !important;
}

.step {
  color: var(--qc-gold) !important;
  letter-spacing: 0.12em;
  font-weight: 600 !important;
}

label {
  color: #d8ceb6 !important;
}

.row-label {
  color: #9a917f !important;
}

.trigger,
.form-box input,
input,
select,
textarea {
  background: #0b0d12 !important;
  border-color: var(--qc-line) !important;
  color: #f3ead6 !important;
}

.trigger .ph,
.trigger .arrow,
.opt .o-spec,
.opt .o-jd {
  color: #7d7464 !important;
}

.trigger:hover,
.trigger.done,
input:focus,
select:focus,
textarea:focus,
.form-box input:focus {
  border-color: var(--qc-gold) !important;
  box-shadow: 0 0 0 3px rgba(201, 161, 91, 0.16) !important;
  background: #12141b !important;
}

.trigger .sel-model {
  color: #f6e7c3;
}

.trigger .sel-price,
.r-total,
.sel-tbl td.p,
.opt .o-price,
.opt .o-cpt,
.bar .summary b {
  color: var(--qc-gold-2) !important;
}

.dropdown {
  background: #101218 !important;
  border-color: var(--qc-line) !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5) !important;
  color: #efe7d6 !important;
}

.dropdown .dd-head {
  border-bottom-color: var(--qc-line) !important;
}

.dropdown input {
  background: #0b0d12 !important;
  color: #efe7d6 !important;
  border-bottom-color: var(--qc-line) !important;
}

.opt {
  border-bottom-color: rgba(201, 161, 91, 0.1) !important;
}

.opt:hover,
.opt.sel {
  background: rgba(201, 161, 91, 0.1) !important;
  box-shadow: inset 3px 0 0 var(--qc-gold);
}

.sel-tbl td {
  border-bottom-color: rgba(201, 161, 91, 0.12) !important;
}

.sel-tbl td.c,
.sel-tbl td.m.empty {
  color: #7d7464 !important;
}

.chk-box.ok {
  background: rgba(201, 161, 91, 0.1) !important;
  color: #e8d09a !important;
}

.chk-box.bad {
  background: rgba(140, 40, 40, 0.2) !important;
}

.btn,
.btn-main {
  background: linear-gradient(135deg, #d4b36a, #9a7433) !important;
  color: #1a1408 !important;
  box-shadow: 0 10px 28px rgba(201, 161, 91, 0.28) !important;
  letter-spacing: 0.06em;
}

.cond-opts button,
.fault-opts button {
  background: #0b0d12 !important;
  border-color: var(--qc-line) !important;
  color: #d8ceb6 !important;
}

.cond-opts button:hover,
.fault-opts button:hover,
.cond-opts button.on,
.fault-opts button.on {
  background: var(--qc-gold) !important;
  border-color: var(--qc-gold) !important;
  color: #1a1408 !important;
}

.ok-msg,
.success,
.rec {
  background: rgba(201, 161, 91, 0.08) !important;
  border-color: var(--qc-line) !important;
  color: #e8d09a !important;
}

.success h2 {
  color: #f6e7c3;
}

::placeholder {
  color: #6f6758 !important;
}

.qc-fc-ball {
  background: linear-gradient(135deg, #d4b36a, #9a7433) !important;
  color: #1a1408 !important;
  box-shadow: 0 10px 28px rgba(201, 161, 91, 0.4) !important;
}

.qc-fc-ball:hover {
  box-shadow: 0 12px 32px rgba(201, 161, 91, 0.55) !important;
}

.qc-fc-panel {
  background: #12141a !important;
  border-color: var(--qc-line) !important;
}

.qc-fc-head {
  background: #0d0e12 !important;
  color: #f6e7c3 !important;
}

.qc-fc-head .qc-fc-logo {
  background: linear-gradient(135deg, #d4b36a, #9a7433) !important;
  color: #1a1408 !important;
}

.qc-fc-msgs {
  background: #0b0c10 !important;
}

.qc-fc-msg.user {
  background: #c9a15b !important;
  color: #1a1408 !important;
}

.qc-fc-msg.bot {
  background: #16181f !important;
  border-color: var(--qc-line) !important;
  color: #efe7d6 !important;
}

.qc-fc-quick,
.qc-fc-input {
  background: #12141a !important;
  border-color: var(--qc-line) !important;
}

.qc-fc-quick button {
  background: transparent !important;
  border-color: var(--qc-line) !important;
  color: #d8ceb6 !important;
}

.qc-fc-input button {
  background: #c9a15b !important;
  color: #1a1408 !important;
}

/* 排版收口：字距收紧、顶栏一条线、表单对齐。不改色，首页不挂此文件。 */
.qc-nav {
  position: sticky;
  top: 0;
  z-index: 40;
  min-height: 64px;
  padding: 0 40px !important;
  gap: 0 !important;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  overflow-x: auto;
  font-size: 13px;
}
.qc-nav .qc-logo {
  margin-right: 32px !important;
  flex-shrink: 0;
}
.qc-nav a {
  letter-spacing: 0.02em;
  padding: 22px 16px 20px;
  margin: 0;
  flex-shrink: 0;
}
.bar {
  padding: 28px 40px 24px !important;
  align-items: flex-end;
}
.bar h1,
.top h1 {
  font-size: 28px;
  letter-spacing: 0.02em !important;
  font-weight: 500;
}
.bar .sub {
  display: block;
  margin: 10px 0 0 !important;
  font-size: 13px;
  letter-spacing: 0.02em;
  line-height: 1.7;
  max-width: 36em;
}
.bar .summary {
  font-size: 14px;
  letter-spacing: 0;
  padding-bottom: 6px;
}
.bar .summary b {
  font-size: 22px;
}
.top {
  padding: 36px 0 8px !important;
}
.top .wrap {
  max-width: 840px;
  padding: 0 40px !important;
}
.top p {
  margin-top: 12px !important;
  line-height: 1.75;
  letter-spacing: 0.02em;
  max-width: 38em;
}
.card {
  max-width: 840px;
  padding: 36px 40px 40px !important;
  margin: 24px auto 28px !important;
  border-radius: 18px;
}
.step {
  margin: 28px 0 12px !important;
  letter-spacing: 0.06em !important;
  font-size: 12px;
}
.card > .step:first-child {
  margin-top: 0 !important;
}
label {
  margin: 16px 0 8px !important;
  letter-spacing: 0.02em;
}
.row {
  margin-bottom: 16px;
  gap: 16px;
}
.row-label {
  width: 56px;
  letter-spacing: 0.04em;
}
.trigger {
  min-height: 52px;
  padding: 14px 18px;
  border-radius: 12px;
}
.qc-p-diy .wrap {
  max-width: 1180px;
  gap: 32px;
  padding: 32px 40px 64px;
}
.qc-p-diy .right {
  width: 400px;
  padding: 28px 28px 32px !important;
  border-radius: 18px;
}
.r-title {
  font-size: 15px;
  letter-spacing: 0.04em;
  margin-bottom: 10px;
}
.r-total {
  font-size: 28px;
}
.form-box {
  margin-top: 20px;
}
.form-box input,
input,
select {
  min-height: 48px;
  padding: 12px 16px;
  border-radius: 10px;
}
textarea {
  min-height: 120px;
  padding: 14px 16px;
  border-radius: 10px;
}
.btn,
.btn-main {
  min-height: 52px;
  border-radius: 12px;
  font-size: 15px;
}
.btn-main {
  margin-top: 28px;
}
.cond-opts,
.fault-opts {
  gap: 10px;
}
.cond-opts button,
.fault-opts button {
  min-height: 40px;
  padding: 8px 16px;
  border-radius: 10px;
}
.store-line {
  max-width: 840px;
  padding: 0 40px 48px;
}
.tip {
  margin-top: 14px !important;
  line-height: 1.75;
}
@media (max-width: 860px) {
  .qc-nav {
    padding: 0 16px !important;
  }
  .qc-nav a {
    padding: 16px 10px;
  }
  .bar {
    padding: 20px 16px !important;
    flex-wrap: wrap;
    gap: 12px;
  }
  .qc-p-diy .wrap {
    padding: 16px 16px 40px;
    gap: 20px;
  }
  .qc-p-diy .right {
    width: 100%;
  }
  .top .wrap {
    padding: 0 16px !important;
  }
  .card {
    margin: 16px 16px 20px !important;
    padding: 24px 18px 28px !important;
  }
  .store-line {
    padding: 0 16px 36px;
  }
}

/* 客服整页、租赁方案、企业说明：同一套暗金，不另起皮 */
header {
  background: #0d0e12 !important;
  color: #f6e7c3 !important;
  box-shadow: none !important;
  border-bottom: 1px solid var(--qc-line) !important;
}
.user {
  background: #c9a15b !important;
  color: #1a1408 !important;
}
.bot,
.typing {
  background: #16181f !important;
  border-color: var(--qc-line) !important;
  color: #efe7d6 !important;
}
.quick,
.inputbar {
  background: #12141a !important;
  border-color: var(--qc-line) !important;
}
.quick button {
  background: transparent !important;
  border-color: var(--qc-line) !important;
  color: #d8ceb6 !important;
}
#input {
  background: #0b0d12 !important;
  border-color: var(--qc-line) !important;
  color: #f3ead6 !important;
}
#send {
  background: #c9a15b !important;
  color: #1a1408 !important;
}
.welcome {
  color: #9a917f !important;
}
.tabs button,
.plan {
  background: #0b0d12 !important;
  border-color: var(--qc-line) !important;
  color: #d8ceb6 !important;
}
.tabs button.on,
.plan.on {
  background: rgba(201, 161, 91, 0.12) !important;
  border-color: var(--qc-gold) !important;
  color: #f6e7c3 !important;
}
.plan h3,
.ok h2,
.price b,
.glass h2,
.code {
  color: #f6e7c3 !important;
}
.ok,
.block,
.glass {
  background: #101218 !important;
  border-color: var(--qc-line) !important;
  color: #efe7d6 !important;
}
.entries a {
  border-color: var(--qc-line) !important;
  color: #efe7d6 !important;
}
.entries a.main {
  background: linear-gradient(135deg, #d4b36a, #9a7433) !important;
  color: #1a1408 !important;
  border-color: transparent !important;
}

/* 客服页只排版：滚动区、快捷按钮、输入栏，手机不挡输入 */
body.qc-p-chat {
  height: 100vh;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.qc-p-chat .qc-nav,
.qc-p-chat header {
  flex-shrink: 0;
}
.qc-p-chat header {
  padding: 12px 16px !important;
}
.qc-p-chat #chat {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 16px 16px 12px;
}
.qc-p-chat .quick {
  flex-shrink: 0;
  gap: 8px;
  padding: 10px 16px;
}
.qc-p-chat .quick button {
  min-height: 36px;
}
.qc-p-chat .inputbar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
}
.qc-p-chat #input {
  min-height: 44px !important;
  border-radius: 22px;
}
.qc-p-chat #send {
  min-height: 44px;
  min-width: 72px;
  flex-shrink: 0;
}
.qc-p-chat #leadMask > div {
  background: #101218 !important;
  color: #efe7d6 !important;
  border: 1px solid var(--qc-line);
}
.qc-p-chat #leadMask button[onclick="submitLead()"] {
  background: #c9a15b !important;
  color: #1a1408 !important;
}
.qc-p-chat #leadMask button[onclick="hideLead()"] {
  background: #16181f !important;
  color: #d8ceb6 !important;
}
@media (max-width: 640px) {
  .qc-p-chat .quick {
    padding: 8px 12px;
  }
  .qc-p-chat .inputbar {
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
  }
}
