/* Upload RFQ page, photo banner layout (approved concept A, 2026-10-28). Loaded after rfq-simple.css.
   The banner holds the title and one line of instructions; the upload card rises over its lower edge
   and switches between "上传文件" and "粘贴文字". Review and contact steps below are unchanged. */
body.tool-rfq-page{--rb-ink:#231d18;--rb-text:#5c544c;--rb-muted:#8a8076;--rb-gold:#a57a45;--rb-line:#ddd4c7;--rb-card:#fbf8f2;--rb-paper:#f6f2ea;--rb-brown:#3a2c22;--rb-serif:"Songti SC","STSong","Noto Serif CJK SC","Source Han Serif SC",Georgia,serif;background:var(--rb-paper)}

/* Banner */
.rfq-simple-hero.rfq-banner{display:grid;align-items:center;min-height:400px;padding-block:72px 150px;border:0;text-align:center;color:#f6f2ea;
  background:linear-gradient(rgba(35,29,24,.58),rgba(35,29,24,.66)),url(/assets/web-v3/r14-homepage-sections/assistant-rfq.webp) center 40%/cover}
/* site-typography.css forces one family on everything with !important; the banner title and group names keep the serif. */
html body .rfq-banner h1{color:#f6f2ea;font-family:var(--rb-serif)!important;font-size:clamp(32px,3.4vw,46px)!important;letter-spacing:.08em!important}
.rfq-banner p{margin:14px auto 0;max-width:34em;color:rgba(246,242,234,.86)}
html body .rfq-banner p b{color:#f6f2ea;font-weight:600!important}
.rfq-simple-hero.rfq-banner .rfq-breadcrumb{justify-content:center;margin-bottom:18px;color:rgba(246,242,234,.7);font-size:13px}
.rfq-simple-hero.rfq-banner .rfq-breadcrumb [aria-current]{color:#f6f2ea}

/* The form rises over the banner; the upload card is the narrow centred column. */
.rfq-simple-form{position:relative;margin-top:-110px;padding-top:0}
.rfq-simple-form > .rfq-entry{justify-self:center;width:min(680px,100%);display:grid;gap:16px;padding:28px;background:var(--rb-paper);border:1px solid var(--rb-line);box-shadow:0 24px 50px -30px rgba(35,29,24,.5)}

/* Tabs: a dark pill slides under the selected label (position set by rfq-import.js), labels fade
   between colours, and the incoming panel rises in. */
.rfq-tabs{position:relative;isolation:isolate;justify-self:center;display:flex;gap:4px;padding:4px;max-width:100%;border:1px solid var(--rb-line);border-radius:999px;background:var(--rb-card);box-shadow:inset 0 1px 2px rgba(58,44,34,.06)}
.rfq-tabs::before{content:"";position:absolute;z-index:-1;top:4px;bottom:4px;left:0;width:var(--rfq-pill-w,0);transform:translateX(var(--rfq-pill-x,0));border-radius:999px;background:linear-gradient(180deg,#4a392d,var(--rb-brown));box-shadow:0 6px 14px -6px rgba(35,29,24,.55),inset 0 1px 0 rgba(255,255,255,.08)}
.rfq-tabs.is-ready::before{transition:transform .5s cubic-bezier(.65,0,.25,1),width .5s cubic-bezier(.65,0,.25,1)}
.rfq-tab{appearance:none;border:0;border-radius:999px;background:transparent;padding:8px 24px;color:var(--rb-muted);font:inherit;font-size:14px;font-weight:500;letter-spacing:.04em;cursor:pointer;transition:color .35s ease,transform .15s ease}
.rfq-tab:hover{color:var(--rb-ink)}
.rfq-tab[aria-selected="true"],.rfq-tab[aria-selected="true"]:hover{color:#f6f2ea}
.rfq-tab:active{transform:scale(.97)}
.rfq-tab:focus-visible{outline:2px solid var(--rb-gold);outline-offset:2px}
.rfq-tab-panel{display:grid;gap:14px}
.rfq-tab-panel:not([hidden]){animation:rfq-panel-in .45s cubic-bezier(.22,.61,.36,1)}
@keyframes rfq-panel-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.rfq-tabs.is-ready::before,.rfq-tab{transition:none}.rfq-tab-panel:not([hidden]){animation:none}}

/* Upload and paste areas share one size so switching does not move the page. */
.rfq-simple-form .rfq-entry .rfq-reference-dropzone,.rfq-entry .rfq-paste-box textarea{height:220px;min-height:0;border:1px solid var(--rb-line);border-radius:0;background:var(--rb-card)}
.rfq-simple-form .rfq-entry .rfq-reference-dropzone{padding:20px}
.rfq-simple-form .rfq-entry .rfq-reference-dropzone:hover,.rfq-simple-form .rfq-entry .rfq-reference-dropzone:focus-visible,.rfq-simple-form .rfq-entry .rfq-reference-dropzone.is-dragging{border-color:var(--rb-gold);background:#fffcf6;box-shadow:none}
.rfq-entry .rfq-upload-icon{width:auto;height:auto;margin:0 auto 8px;background:none;color:var(--rb-gold)}
.rfq-entry .rfq-upload-icon svg{width:36px;height:36px;stroke-width:1.5}
.rfq-entry .rfq-reference-dropzone strong{font-size:16px;font-weight:500;color:var(--rb-ink)}
.rfq-entry .rfq-reference-dropzone strong span{margin-left:4px;color:var(--rb-gold);border-bottom:1px solid var(--rb-gold)}
.rfq-entry .rfq-select-file-button{display:none}
.rfq-simple-form .rfq-entry .rfq-reference-dropzone small{margin-top:8px;font-size:12.5px;color:var(--rb-muted)}
.rfq-entry .rfq-paste-box{margin:0;padding:0;border:0;background:none}
.rfq-entry .rfq-paste-box textarea{width:100%;resize:none;padding:18px 20px;color:var(--rb-ink);font:inherit;font-size:14px;line-height:1.9}
.rfq-entry .rfq-paste-box textarea::placeholder{color:#a99e91}
.rfq-entry .rfq-paste-box textarea:focus{outline:0;border-color:var(--rb-gold)}
/* The 识别清单 button sits inside the text box, so both panels are exactly the box height and
   switching tabs never changes the page length. */
.rfq-entry .rfq-paste-box{position:relative}
.rfq-entry .rfq-paste-box textarea{padding-bottom:64px}
.rfq-entry .rfq-paste-run{position:absolute;right:14px;bottom:14px;margin:0;padding:9px 24px;border:1px solid var(--rb-brown);border-radius:0;background:var(--rb-brown);color:#f6f2ea;font:inherit;font-size:14px;cursor:pointer;transition:background .2s}
.rfq-entry .rfq-paste-run:hover{background:#4a392d}

.rfq-entry-links{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 14px;margin:0;color:var(--rb-muted);font-size:13px}
.rfq-entry-links a{color:var(--rb-gold);text-decoration:none;border-bottom:1px solid currentColor}
.rfq-entry-links a:hover{color:var(--rb-brown)}
.rfq-entry .rfq-file-feedback:empty{display:none}
.rfq-entry .rfq-file-list{margin-top:0}

@media(max-width:820px){
  .rfq-simple-hero.rfq-banner{min-height:320px;padding-block:48px 120px}
  .rfq-simple-form{margin-top:-90px}
  .rfq-simple-form > .rfq-entry{padding:18px 16px}
  .rfq-simple-form .rfq-entry .rfq-reference-dropzone,.rfq-entry .rfq-paste-box textarea{height:200px}
}

/* Embedded in the quote tool: no banner, so nothing to rise over. */
.rfq-embed .rfq-simple-form{margin-top:0;padding-top:16px}
.rfq-embed .rfq-simple-form > .rfq-entry{box-shadow:none}

/* Second layer: supported formats, two columns plus three short tips. */
html:has(body.tool-rfq-page){scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html:has(body.tool-rfq-page){scroll-behavior:auto}}
.rfq-formats-layer{scroll-margin-top:calc(var(--site-nav-height,74px) + 16px);padding-block:24px 104px}
.rfq-formats-head{text-align:center;margin-bottom:40px}
html body .rfq-formats-head h2{margin:0;color:var(--rb-ink);font-family:var(--rb-serif)!important;font-size:clamp(26px,2.4vw,34px)!important;line-height:1.3!important;letter-spacing:.08em!important}
.rfq-formats-head h2::after{content:"";display:block;width:48px;height:1px;margin:18px auto 0;background:var(--rb-gold)}
.rfq-formats-head p{margin:16px 0 0;color:var(--rb-text)}
.rfq-format-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.rfq-format-col{display:grid;align-content:start;gap:14px;padding:28px 30px;background:var(--rb-card);border:1px solid var(--rb-line)}
.rfq-format-tag{justify-self:start;padding:2px 12px;border-radius:999px;font-size:12px;letter-spacing:.04em}
.rfq-format-tag.is-auto{background:#e6ead9;color:#4b5632}
.rfq-format-tag.is-keep{background:#efe6d6;color:#7a5a2f}
html body .rfq-format-col h3{margin:0;color:var(--rb-ink);font-family:var(--rb-serif)!important;font-size:21px!important;line-height:1.4!important;letter-spacing:.06em!important}
.rfq-format-list{margin:0;padding:0;list-style:none;border-top:1px solid var(--rb-line)}
.rfq-format-list li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:12px 0;border-bottom:1px solid var(--rb-line)}
.rfq-format-list strong{color:var(--rb-ink);font-weight:500}
.rfq-format-list span{color:var(--rb-muted);font-size:13px;text-align:right;font-variant-numeric:tabular-nums}
.rfq-format-col > p{margin:0;color:var(--rb-text);font-size:13.5px}
.rfq-format-tips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 40px;margin-top:48px}
.rfq-format-tips > div{padding-top:16px;border-top:1px solid var(--rb-gold)}
html body .rfq-format-tips h3{margin:0 0 6px;color:var(--rb-ink);font-family:var(--rb-serif)!important;font-size:17px!important;line-height:1.5!important;letter-spacing:.04em!important}
.rfq-format-tips p{margin:0;color:var(--rb-text);font-size:13.5px}
.rfq-format-tips a{color:var(--rb-gold);text-decoration:none;border-bottom:1px solid currentColor}
@media(max-width:820px){
  .rfq-formats-layer{padding-block:16px 72px}
  .rfq-format-cols,.rfq-format-tips{grid-template-columns:1fr}
  .rfq-format-col{padding:22px 18px}
  .rfq-format-tips{gap:20px;margin-top:32px}
}
.rfq-embed .rfq-formats-layer{display:none}

/* Short pages on tall screens: let the content grow so the footer always meets the bottom of the window. */
body.tool-rfq-page{min-height:100vh;display:flex;flex-direction:column}
body.tool-rfq-page > main{flex:1 0 auto}

/* 最近的询价: saved drafts and created inquiries, kept in this browser (rfq-import.js). Same width as the upload card. */
.rfq-simple-form > .rfq-history{justify-self:center;width:min(680px,100%)}
.rfq-history-box{background:var(--rb-card);border:1px solid var(--rb-line)}
.rfq-history-box > summary{display:flex;align-items:center;gap:10px;padding:14px 20px;cursor:pointer;list-style:none}
.rfq-history-box > summary::-webkit-details-marker{display:none}
.rfq-history-box > summary::after{content:"";width:8px;height:8px;margin-left:auto;border-right:1px solid var(--rb-muted);border-bottom:1px solid var(--rb-muted);transform:rotate(45deg) translateY(-2px);transition:transform .25s}
.rfq-history-box[open] > summary::after{transform:rotate(-135deg) translateY(-2px)}
html body .rfq-history-title{color:var(--rb-ink);font-family:var(--rb-serif)!important;font-size:16px!important;letter-spacing:.06em!important}
.rfq-history-count{min-width:22px;padding:0 7px;border-radius:999px;background:#efe6d6;color:#7a5a2f;font-size:12px;text-align:center}
.rfq-history-list{margin:0;padding:0 20px;list-style:none;border-top:1px solid var(--rb-line)}
.rfq-history-item{display:flex;align-items:center;justify-content:space-between;gap:12px 20px;padding:14px 0;border-bottom:1px solid var(--rb-line)}
.rfq-history-item:last-child{border-bottom:0}
.rfq-history-main{display:flex;align-items:center;gap:12px;min-width:0}
.rfq-history-tag{flex:none;padding:1px 10px;border-radius:999px;font-size:12px}
.rfq-history-tag.is-draft{background:#efe6d6;color:#7a5a2f}
.rfq-history-tag.is-doc{background:#e6ead9;color:#4b5632}
.rfq-history-text{display:grid;min-width:0}
.rfq-history-text strong{overflow:hidden;color:var(--rb-ink);font-weight:500;text-overflow:ellipsis;white-space:nowrap}
.rfq-history-text span{color:var(--rb-muted);font-size:12.5px}
.rfq-history-actions{display:flex;flex:none;align-items:center;gap:14px}
.rfq-history-go{appearance:none;padding:6px 18px;border:1px solid var(--rb-brown);background:transparent;color:var(--rb-brown);font:inherit;font-size:13px;cursor:pointer;transition:background .2s,color .2s}
.rfq-history-go:hover{background:var(--rb-brown);color:#f6f2ea}
.rfq-history-del{appearance:none;padding:4px 0;border:0;background:none;color:var(--rb-muted);font:inherit;font-size:13px;cursor:pointer}
.rfq-history-del:hover{color:#9b4936}
.rfq-history-go:focus-visible,.rfq-history-del:focus-visible,.rfq-history-box > summary:focus-visible{outline:2px solid var(--rb-gold);outline-offset:2px}
.rfq-history-note{margin:0;padding:10px 20px 14px;border-top:1px solid var(--rb-line);color:var(--rb-muted);font-size:12px}
@media(max-width:820px){
  .rfq-history-box > summary,.rfq-history-note{padding-inline:16px}
  .rfq-history-list{padding-inline:16px}
  .rfq-history-item{flex-wrap:wrap}
  .rfq-history-actions{width:100%;justify-content:flex-end}
}
.rfq-embed .rfq-history{display:none}

/* 发送原文件 is a link to WhatsApp; it keeps the look of the other small actions in the source bar. */
body.tool-rfq-page .rfq-source-bar a.rfq-import-link{color:#8a5e22;font-size:12px;text-decoration:underline;text-underline-offset:4px}
body.tool-rfq-page .rfq-source-bar a.rfq-import-link:hover{color:#5f3f12}

/* Inside the quote tool the check and contact steps are skipped: lines go straight to pricing. */
.rfq-embed .rfq-convert,.rfq-embed .rfq-finish{display:none!important}
.rfq-embed-status{margin:0;color:var(--rb-text);font-size:13.5px;text-align:center}
.rfq-embed-status.is-error{color:#9b4936}

/* Inside the quote tool's dialog: no page frame around the upload box, and the page is only as tall as its content. */
.rfq-embed body.tool-rfq-page{min-height:0;display:block;background:#fff}
.rfq-embed .rfq-simple-shell{width:calc(100% - 40px)}
.rfq-embed .rfq-simple-form{padding:20px 0}
.rfq-embed .rfq-simple-form > .rfq-entry{width:100%;padding:0;border:0;background:none;box-shadow:none}

/* Second way in: customers without a list pick products in the product center. */
.rfq-catalog-hint{justify-self:center;width:min(680px,100%);margin:-4px 0 0;color:var(--rb-text);font-size:13.5px;line-height:1.8;text-align:center;text-wrap:balance}
.rfq-catalog-hint a{margin:0 .3em;color:var(--rb-gold);font-weight:500;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px;transition:text-decoration-color .25s}
.rfq-catalog-hint a:is(:hover,:focus-visible){text-decoration-color:currentColor}
.rfq-catalog-hint-rest{display:block;color:var(--rb-muted);font-size:12.5px}
.rfq-embed .rfq-catalog-hint{display:none}