/* 必填标记 */
em {
    color: #ff1414;
    font-style: normal;
    margin-left: 2px;
}

option {
    line-height: 20px !important;
}

/* Breadcrumb */
.breadcrumb-nav {
    display: flex;
    align-items: center;
    padding: 0 0 20px 0;
    margin-bottom: 0;
    font-size: 16px;
    color: #838383;
    width: 100%;
    justify-content: flex-start;
    border-bottom: none;
}
.breadcrumb-item {
    color: #838383;
    text-decoration: none;
    transition: color 0.2s ease;
}
.breadcrumb-item:hover {
    color: var(--color);
}
.breadcrumb-item.breadcrumb-current {
    font-weight: 400;
    cursor: default;
    pointer-events: none;
    color: #000000;
}
.breadcrumb-separator {
    margin: 0 8px;
    color: #838383;
}
.postDemandBreadcrumb {
    margin-top: 0;
}

/* Page layout */
.postDemandLayout {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.postDemandSidebar {
    width: 250px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.postDemandMain {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/* Header 样式 */
.headerTopLog {
    width: 96%;
    max-width: 1440px;
    min-width: 1200px;
    margin: 0 auto;
    height: 60px;
    padding: 0;
}

.displayFlex {
    display: flex;
    align-items: center;
}

.displayFlex .titleName {
    line-height: 25px;
    font-size: 18px;
    font-weight: 600;
    color: #1e293b;
    margin-left: 20px;
    padding-left: 20px;
    border-left: 3px solid var(--color);
}

/* 主内容区域 */
body {
    background-color: #f8f8f8;
}
.releaseSuccess,
.mainContent {
    width: 96%;
    max-width: 1440px;
    min-width: 1200px;
    margin: 20px auto;
}

/* Left sidebar process card */
.rfqProcessCard,
.tipsCard {
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 8px 22px rgba(15, 23, 41, 0.07);
    padding: 20px;
}

.sidebarCardTitle,
.tipsCardHeader h3 {
    margin: 0 0 12px 0;
    padding-bottom: 12px;
    border-bottom: 1px solid #e0e8f2;
    font-size: 17px;
    font-weight: 700;
    color: #000000;
    line-height: 1.28;
}

/* Vertical step indicator */
.mainContent .stepTop--vertical {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.mainContent .stepTop--vertical .stepTopItem {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    position: relative;
    padding-bottom: 22px;
}

.mainContent .stepTop--vertical .stepTopItem:last-child {
    padding-bottom: 0;
}

.mainContent .stepTop--vertical .stepTopItem:not(:last-child)::after {
    content: '';
    position: absolute;
    left: 11px;
    top: 28px;
    width: 1px;
    height: calc(100% - 8px);
    background: #e0e8f2;
}

.mainContent .stepTop--vertical .stepTopMarker {
    flex-shrink: 0;
}

.mainContent .stepTop--vertical .stepTopMarker i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #e0e8f2;
    color: #000000;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
}

.mainContent .stepTop--vertical .stepTopItem--active .stepTopMarker i {
    background: var(--color);
    color: #ffffff;
}

.mainContent .stepTop--vertical .stepTopText {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    padding-top: 2px;
}

.mainContent .stepTop--vertical .stepTopText strong {
    font-size: 14px;
    font-weight: 500;
    color: #000000;
    line-height: 1.28;
}

.mainContent .stepTop--vertical .stepTopText span {
    font-size: 12px;
    color: #636e82;
    line-height: 1.28;
}

/* Legacy horizontal stepTop (unused) */
.mainContent .stepTop:not(.stepTop--vertical) {
    display: none;
}

/* Choose RFQ Mode */
.rfqEntrySection {
    margin: 0;
    padding: 20px 25px 25px;
    background: #ffffff;
    border: none;
    border-radius: 10px;
    box-shadow: 0 8px 22px rgba(15, 23, 41, 0.07);
}

.rfqEntryTitle {
    margin: 0 0 16px 0;
    font-size: 20px;
    font-weight: 700;
    color: #000000;
    line-height: 1.28;
}

.rfqModeSwitcher {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 0;
}

.rfqModeSwitcher--locked {
    opacity: 0.85;
}

.rfqModeBtn {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    width: 100%;
    min-height: 165px;
    padding: 20px 18px;
    border-radius: 10px;
    border: 1px solid #e5e5e5;
    background: #ffffff;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.rfqModeBtnIcon {
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    border-radius: 12px;
    background: #f2f5fb;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rfqModeBtnIcon .iconfont {
    font-size: 24px;
    color: #344058;
}

.rfqModeBtnBody {
    flex: 1;
    min-width: 0;
}

.rfqModeBtnTitle {
    display: block;
    margin-bottom: 8px;
    font-size: 15px;
    font-weight: 600;
    color: #000000;
    line-height: 1.4;
}

.rfqModeBtnLead {
    display: block;
    margin-bottom: 10px;
    font-size: 12px;
    color: #344058;
    line-height: 1.5;
}

.rfqModeBtnList {
    margin: 0;
    padding-left: 0;
    list-style: none;
}

.rfqModeBtnList li {
    position: relative;
    padding-left: 14px;
    margin-bottom: 6px;
    font-size: 12px;
    color: #26344d;
    line-height: 1.45;
}

.rfqModeBtnList li::before {
    content: '•';
    position: absolute;
    left: 0;
    top: 0;
    color: #26344d;
}

.rfqModeBtn:hover:not(:disabled) {
    border-color: #ffd1c2;
}

.rfqModeBtn.now,
.rfqModeBtn.now:hover:not(:disabled),
.rfqModeBtn.now:focus-visible {
    border-color: #ff6029;
    background: #fff8f4;
    box-shadow: none;
}

.rfqModeBtn.now .rfqModeBtnIcon {
    background: #ffe9df;
}

.rfqModeBtn.now .rfqModeBtnIcon .iconfont {
    color: #ff6029;
}

.rfqModeBtn:disabled {
    cursor: not-allowed;
}

.rfqModeHint {
    display: none !important;
}

.rfqModeHint {
    font-size: 14px;
    color: #334155;
    line-height: 1.55;
}

.rfqModeHintTitle {
    font-weight: 700;
    margin: 0 0 8px 0;
    color: #0f172a;
}

.rfqModeHintLead {
    margin: 0 0 10px 0;
    color: #475569;
}

.rfqModeHintList {
    margin: 0;
    padding-left: 1.25rem;
}

.rfqModeHintList li {
    margin-bottom: 6px;
}

/* Sourcing: attachment hints */
.fieldHint,
.attachCountHint {
    display: block;
    color: #64748b;
    font-size: 12px;
    margin-top: 4px;
    line-height: 1.45;
}

.tenderUploadBlock .attachCountHint {
    margin-top: 8px;
}

.quickLinkedGoodsRow {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.quickLinkedGoodsSummary {
    flex: 1;
    min-width: 200px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.quickLinkedGoodsThumb {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 8px;
    overflow: hidden;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
}

.quickLinkedGoodsImg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.quickLinkedGoodsName {
    flex: 1;
    min-width: 0;
    line-height: 1.45;
    word-break: break-word;
}

.quickLinkedGoodsName.muted {
    color: #94a3b8;
}

.quickLinkedGoodsPickBtn,
.quickLinkedGoodsClearBtn {
    padding: 8px 16px;
    border-radius: 8px;
    border: 1px solid var(--color);
    background: #fff;
    color: var(--color);
    font-weight: 600;
    cursor: pointer;
}

.quickLinkedGoodsPickBtn {
    background: var(--color);
    color: #fff;
}

/* Quick goods picker modal */
.quickGoodsModal {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.quickGoodsModal.hide {
    display: none !important;
}

.quickGoodsModal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
}

.quickGoodsModal__dialog {
    position: relative;
    width: 100%;
    max-width: 520px;
    max-height: 80vh;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.quickGoodsModal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid #e2e8f0;
}

.quickGoodsModal__header h3 {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    color: #0f172a;
}

.quickGoodsModal__close {
    border: none;
    background: none;
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    color: #64748b;
}

.quickGoodsModal__search {
    display: flex;
    gap: 10px;
    padding: 14px 20px;
    border-bottom: 1px solid #f1f5f9;
}

.quickGoodsModal__kw {
    flex: 1;
    height: 40px;
    padding: 0 12px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

.quickGoodsModal__searchBtn {
    padding: 0 18px;
    border-radius: 8px;
    border: none;
    background: var(--color);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
}

.quickGoodsModal__list {
    list-style: none;
    margin: 0;
    padding: 8px 0;
    overflow-y: auto;
    max-height: 360px;
}

.quickGoodsModal__item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 20px;
    cursor: pointer;
    border-bottom: 1px solid #f1f5f9;
    font-size: 14px;
    color: #1e293b;
}

.quickGoodsModal__item:hover {
    background: #f8fafc;
}

.quickGoodsModal__thumb {
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    border-radius: 8px;
    overflow: hidden;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
}

.quickGoodsModal__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    vertical-align: middle;
}

.quickGoodsModal__thumb--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 12px;
}

.quickGoodsModal__thumbPh {
    line-height: 1;
}

.quickGoodsModal__title {
    flex: 1;
    min-width: 0;
    line-height: 1.45;
    word-break: break-word;
}

.quickGoodsModal__empty {
    padding: 24px;
    text-align: center;
    color: #94a3b8;
    font-size: 14px;
}

.quickGoodsModal__footer {
    padding: 12px 20px;
    border-top: 1px solid #e2e8f0;
    display: flex;
    justify-content: flex-end;
}

.quickGoodsModal__cancel {
    padding: 8px 18px;
    border-radius: 8px;
    border: 1px solid #cbd5e1;
    background: #fff;
    cursor: pointer;
    font-weight: 600;
}

/* Demand Data Wrapper */
.demandDataWrapper {
    display: block;
    margin: 0;
}

.mainContent .demandData {
    margin: 0;
    padding: 20px 25px 25px;
    width: 100%;
    background: #ffffff;
    border: none;
    border-radius: 10px;
    box-shadow: 0 8px 22px rgba(15, 23, 41, 0.07);
    box-sizing: border-box;
}

/* Keep goodsData styles for backward compatibility */
.mainContent .goodsData {
    margin: 0 0 24px 0;
    padding: 24px;
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.mainContent .goodsData > p,
.mainContent .demandData > p {
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 20px 0;
    padding-bottom: 12px;
    border-bottom: 2px solid #f1f5f9;
}

.mainContent .demandData .demandUl {
    margin-top: 0;
    margin-bottom: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 48px;
    grid-template-areas:
        "category name"
        "qty unit"
        "budget trade"
        "dest destAddr"
        "port delivery"
        "freq deadline"
        "attach remark";
}

.mainContent .demandData .demandUl li.goodsClassIfy { grid-area: category; }
.mainContent .demandData .demandUl li.goodsName { grid-area: name; }
.mainContent .demandData .demandUl li.goodsNum { grid-area: qty; }
.mainContent .demandData .demandUl li.goodsUnit { grid-area: unit; }
.mainContent .demandData .demandUl li.demandPrice { grid-area: budget; }
.mainContent .demandData .demandUl li.tradeTermsPreference { grid-area: trade; }
.mainContent .demandData .demandUl li.demandSite { grid-area: dest; }
.mainContent .demandData .demandUl li.destinationDetail { grid-area: destAddr; }
.mainContent .demandData .demandUl li.demandPort { grid-area: port; }
.mainContent .demandData .demandUl li.demandDeliveryTime { grid-area: delivery; }
.mainContent .demandData .demandUl li.goodsPurchasing { grid-area: freq; }
.mainContent .demandData .demandUl li.goodsTime { grid-area: deadline; }
.mainContent .demandData .demandUl li.tenderTemplate { grid-area: attach; }
.mainContent .demandData .demandUl li.demandRemark { grid-area: remark; }

.mainContent .goodsData .goodsDataUl li,
.mainContent .demandData .demandUl li {
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
}

.mainContent .demandData .demandUl > li.hide {
    display: none;
}

.mainContent .goodsData .goodsDataUl li > div,
.mainContent .demandData .demandUl li > div {
    width: 100%;
    min-width: 0;
}

.mainContent .goodsData .goodsDataUl li p,
.mainContent .demandData .demandUl li p {
    width: 100%;
    min-width: 0;
    line-height: 18px;
    font-weight: 500;
    font-size: 14px;
    margin: 0;
    text-align: left;
    color: #000000;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0;
    white-space: nowrap;
    flex-shrink: 0;
}

.mainContent .goodsData .goodsDataUl li p span,
.mainContent .demandData .demandUl li p span {
    color: #000000;
}

/* Form inputs */
.mainContent .demandData .goodsClassIfy select,
.mainContent .demandData .goodsName input,
.mainContent .demandData .goodsNum input,
.mainContent .demandData .goodsPurchasing select,
.mainContent .demandData .goodsUnit input,
.mainContent .demandData .goodsRegion select,
.mainContent .demandData .goodsTime .timeSelect,
.mainContent .goodsDataUl .goodsClassIfy select,
.mainContent .goodsDataUl .goodsName input,
.mainContent .goodsDataUl .goodsNum input,
.mainContent .goodsDataUl .goodsPurchasing select,
.mainContent .goodsDataUl .goodsUnit input,
.mainContent .goodsDataUl .goodsRegion select,
.mainContent .goodsDataUl .goodsTime .timeSelect,
.mainContent .demandData .demandPrice .liInput input,
.mainContent .demandData .demandPrice .liInput select,
.mainContent .demandData .demandSite .liSelect select,
.mainContent .demandData .demandPort .liInput input,
.mainContent .demandData .destinationDetail .liInput input,
.mainContent .demandData .demandPrice .budgetCurrencySelect,
.mainContent .demandData .tradeTermsPreference .liSelect select,
.mainContent .demandData .demandDeliveryTime .goodsSelect input,
.mainContent .demandData .bidSecurityDeposit .liPriceInp input,
.mainContent .demandData .biddingFee .liPriceInp input,
.mainContent .demandData .demandRemark .liInput textarea,
.mainContent .demandData .demandPhone .liInput input,
.mainContent .demandData .demandCode .liInput input {
    font-size: 14px;
    padding: 0 11px;
    outline-style: none;
    background: #ffffff;
    resize: none;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    color: #000000;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;
}

.mainContent .demandData .goodsClassIfy select:focus,
.mainContent .demandData .goodsName input:focus,
.mainContent .demandData .goodsNum input:focus,
.mainContent .demandData .goodsPurchasing select:focus,
.mainContent .demandData .goodsUnit input:focus,
.mainContent .demandData .goodsRegion select:focus,
.mainContent .demandData .goodsTime .timeSelect:focus,
.mainContent .goodsDataUl .goodsClassIfy select:focus,
.mainContent .goodsDataUl .goodsName input:focus,
.mainContent .goodsDataUl .goodsNum input:focus,
.mainContent .goodsDataUl .goodsPurchasing select:focus,
.mainContent .goodsDataUl .goodsUnit input:focus,
.mainContent .goodsDataUl .goodsRegion select:focus,
.mainContent .goodsDataUl .goodsTime .timeSelect:focus,
.mainContent .demandData .demandPrice .liInput input:focus,
.mainContent .demandData .demandPrice .liInput select:focus,
.mainContent .demandData .demandSite .liSelect select:focus,
.mainContent .demandData .demandPort .liInput input:focus,
.mainContent .demandData .destinationDetail .liInput input:focus,
.mainContent .demandData .demandPrice .budgetCurrencySelect:focus,
.mainContent .demandData .tradeTermsPreference .liSelect select:focus,
.mainContent .demandData .demandDeliveryTime .goodsSelect input:focus,
.mainContent .demandData .bidSecurityDeposit .liPriceInp input:focus,
.mainContent .demandData .biddingFee .liPriceInp input:focus,
.mainContent .demandData .demandRemark .liInput textarea:focus,
.mainContent .demandData .demandPhone .liInput input:focus,
.mainContent .demandData .demandCode .liInput input:focus {
    border-color: var(--color);
    box-shadow: 0 0 0 2px rgba(255, 96, 41, 0.12);
}

.mainContent .demandData .goodsClassIfy select:hover,
.mainContent .demandData .goodsName input:hover,
.mainContent .demandData .goodsNum input:hover,
.mainContent .demandData .goodsPurchasing select:hover,
.mainContent .demandData .goodsUnit input:hover,
.mainContent .demandData .goodsRegion select:hover,
.mainContent .demandData .goodsTime .timeSelect:hover,
.mainContent .goodsDataUl .goodsClassIfy select:hover,
.mainContent .goodsDataUl .goodsName input:hover,
.mainContent .goodsDataUl .goodsNum input:hover,
.mainContent .goodsDataUl .goodsPurchasing select:hover,
.mainContent .goodsDataUl .goodsUnit input:hover,
.mainContent .goodsDataUl .goodsRegion select:hover,
.mainContent .goodsDataUl .goodsTime .timeSelect:hover,
.mainContent .demandData .demandPrice .liInput input:hover,
.mainContent .demandData .demandPrice .liInput select:hover,
.mainContent .demandData .demandSite .liSelect select:hover,
.mainContent .demandData .demandPort .liInput input:hover,
.mainContent .demandData .demandDeliveryTime .goodsSelect input:hover,
.mainContent .demandData .bidSecurityDeposit .liPriceInp input:hover,
.mainContent .demandData .biddingFee .liPriceInp input:hover,
.mainContent .demandData .demandRemark .liInput textarea:hover,
.mainContent .demandData .demandPhone .liInput input:hover,
.mainContent .demandData .demandCode .liInput input:hover {
    border-color: #cbd5e1;
}

.mainContent .demandData .goodsClassIfy .selectContent,
.mainContent .goodsDataUl .goodsClassIfy .selectContent {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.mainContent .demandData .goodsClassIfy select,
.mainContent .goodsDataUl .goodsClassIfy select {
    width: auto;
    min-width: 0;
    flex: 1;
    height: 40px;
}

.mainContent .demandData .goodsName input,
.mainContent .demandData .goodsNum input,
.mainContent .demandData .goodsPurchasing select,
.mainContent .demandData .goodsUnit input,
.mainContent .demandData .goodsTime .timeSelect,
.mainContent .goodsDataUl .goodsName input,
.mainContent .goodsDataUl .goodsNum input,
.mainContent .goodsDataUl .goodsPurchasing select,
.mainContent .goodsDataUl .goodsUnit input,
.mainContent .demandData .bidSecurityDeposit .liPriceInp input,
.mainContent .demandData .biddingFee .liPriceInp input,
.mainContent .goodsDataUl .goodsTime .timeSelect {
    width: 100%;
    height: 40px;
    position: relative;
}

.mainContent .demandData .goodsTime .timeSelect::-webkit-calendar-picker-indicator,
.mainContent .goodsDataUl .goodsTime .timeSelect::-webkit-calendar-picker-indicator,
.mainContent .demandData .demandDeliveryTime .deliveryTimeSelect::-webkit-calendar-picker-indicator {
    position: absolute;
    right: 10px;
    cursor: pointer;
}

.mainContent .demandData .demandRemark .liInput {
    width: 100%;
}

.mainContent .demandData .demandRemark .demandRemarkTitleRow {
    flex-wrap: wrap;
}

.mainContent .demandData .demandRemark .rfqAiDraftBtn {
    margin-left: auto;
    height: 28px;
    padding: 0 12px;
    border: 1px solid var(--color, #2563eb);
    border-radius: 6px;
    background: #fff;
    color: var(--color, #2563eb);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease;
    white-space: nowrap;
}

.mainContent .demandData .demandUl li.demandRemark .rfqAiDraftBtn,
.mainContent .demandData .demandUl li.demandRemark .rfqAiDraftBtn .rfqAiDraftBtnText {
    color: var(--color, #2563eb);
}

.mainContent .demandData .demandRemark .rfqAiDraftBtn:hover:not(:disabled) {
    background: var(--color, #2563eb);
    color: #fff;
}

.mainContent .demandData .demandUl li.demandRemark .rfqAiDraftBtn:hover:not(:disabled),
.mainContent .demandData .demandUl li.demandRemark .rfqAiDraftBtn:hover:not(:disabled) .rfqAiDraftBtnText {
    color: #fff;
}

.mainContent .demandData .demandRemark .rfqAiDraftBtn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.mainContent .demandData .demandRemark .rfqAiDraftBtn.is-loading {
    pointer-events: none;
}

/* RFQ AI draft modal */
.rfqDraftModal {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.rfqDraftModal.hide {
    display: none !important;
}

.rfqDraftModal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
}

.rfqDraftModal__dialog {
    position: relative;
    width: 100%;
    max-width: 640px;
    max-height: 85vh;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.rfqDraftModal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid #e2e8f0;
}

.rfqDraftModal__header h3 {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    color: #0f172a;
}

.rfqDraftModal__close {
    border: none;
    background: none;
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    color: #64748b;
}

.rfqDraftModal__verify {
    margin: 12px 20px 0;
    padding: 10px 12px;
    border-radius: 6px;
    background: #fef9c3;
    border: 1px solid #fde047;
    color: #854d0e;
    font-size: 13px;
    line-height: 1.5;
}

.rfqDraftModal__body {
    flex: 1;
    overflow-y: auto;
    padding: 16px 20px;
}

.rfqDraftModal__option {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 12px 14px;
    margin-bottom: 10px;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.rfqDraftModal__option:last-child {
    margin-bottom: 0;
}

.rfqDraftModal__option:hover {
    border-color: #cbd5e1;
}

.rfqDraftModal__option.is-selected {
    border-color: var(--color, #2563eb);
    box-shadow: 0 0 0 1px var(--color, #2563eb);
}

.rfqDraftModal__optionTone {
    display: inline-block;
    margin-bottom: 8px;
    padding: 2px 8px;
    border-radius: 4px;
    background: #f1f5f9;
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    text-transform: capitalize;
}

.rfqDraftModal__optionText {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: #334155;
    white-space: pre-wrap;
    word-break: break-word;
}

.rfqDraftModal__footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 14px 20px;
    border-top: 1px solid #e2e8f0;
}

.rfqDraftModal__cancel,
.rfqDraftModal__apply {
    height: 36px;
    padding: 0 18px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

.rfqDraftModal__cancel {
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #475569;
}

.rfqDraftModal__apply {
    border: none;
    background: var(--color, #2563eb);
    color: #fff;
}

.rfqDraftModal__apply:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.mainContent .demandData .demandRemark .liInput textarea {
    width: 100%;
    min-height: 110px;
    padding: 10px 11px;
    line-height: 1.5;
    resize: vertical;
    font-family: inherit;
    display: block;
}

.mainContent .demandData .goodsRegion .goodsSelect,
.mainContent .demandData .demandSite .liSelect,
.mainContent .goodsDataUl .goodsRegion .goodsSelect {
    width: 100%;
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}

.mainContent .demandData .goodsRegion select,
.mainContent .demandData .demandSite .liSelect select,
.mainContent .goodsDataUl .goodsRegion select {
    width: auto;
    min-width: 160px;
    flex: 1;
    height: 40px;
}

.mainContent .demandData .goodsTime .goodsSelect,
.mainContent .demandData .goodsRegion .goodsSelect,
.mainContent .demandData .demandDeliveryTime .goodsSelect,
.mainContent .goodsDataUl .goodsTime .goodsSelect,
.mainContent .goodsDataUl .goodsRegion .goodsSelect {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
}

.mainContent .demandData .goodsTime .quoteDeadlineControl {
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.mainContent .demandData .goodsTime .quoteDeadlineOptions {
    display: flex;
    gap: 10px;
    flex-wrap: nowrap;
    align-items: center;
    flex-shrink: 0;
}

.mainContent .demandData .goodsTime .quoteDeadlineDate {
    flex: 1 1 160px;
    min-width: 160px;
    max-width: 220px;
}

.mainContent .demandData .goodsTime .quoteDeadlineDate.hide {
    display: none;
}

.mainContent .demandData .goodsTime .quoteDeadlineDate .timeSelect {
    width: 100%;
    height: 40px;
}

.mainContent .demandData .demandPort .liInput {
    width: 100%;
}

.mainContent .demandData .demandPort .liInput input {
    width: 100%;
    height: 40px;
}

.mainContent .demandData .demandDeliveryTime .goodsSelect input {
    width: 100%;
    height: 40px;
    position: relative;
}

.mainContent .demandData .goodsTime label,
.mainContent .demandData .goodsRegion label,
.mainContent .goodsDataUl .goodsTime label,
.mainContent .goodsDataUl .goodsRegion label {
    font-weight: 400;
    font-size: 12px;
    color: #000000;
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    padding: 10px 12px;
    border-radius: 6px;
    border: 1px solid #e5e5e5;
    background: #ffffff;
    transition: border-color 0.2s ease, background-color 0.2s ease;
    white-space: nowrap;
}

.mainContent .demandData .goodsTime label:hover,
.mainContent .demandData .goodsRegion label:hover,
.mainContent .goodsDataUl .goodsTime label:hover,
.mainContent .goodsDataUl .goodsRegion label:hover {
    border-color: #ffd1c2;
}

.mainContent .demandData .goodsTime label:has(input:checked),
.mainContent .goodsDataUl .goodsTime label:has(input:checked) {
    background: #fff6f0;
    border-color: #ffd1c2;
}

.mainContent .demandData .goodsTime label input,
.mainContent .demandData .goodsRegion label input,
.mainContent .goodsDataUl .goodsTime label input,
.mainContent .goodsDataUl .goodsRegion label input {
    margin: 0;
    cursor: pointer;
    width: 13px;
    height: 13px;
    accent-color: #ff6029;
}

/* 解决方案选择 */
.mainContent .demandData .liScelect {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
}

.mainContent .demandData .liScelect div {
    min-width: 140px;
    height: 44px;
    line-height: 44px;
    text-align: center;
    background: #FFFFFF;
    border-radius: 8px;
    border: 2px solid #e2e8f0;
    font-size: 14px;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    transition: all 0.2s ease;
}

.mainContent .demandData .liScelect div:hover {
    border-color: var(--color);
    color: var(--color);
    background: #f8fafc;
}

.mainContent .demandData .liScelect .now {
    border-color: var(--color);
    color: var(--color);
    background: rgba(65, 158, 255, 0.05);
    font-weight: 600;
}

.mainContent .demandData .demandPrice .liInput {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.mainContent .demandData .demandPrice .budgetInputRow {
    display: flex;
    align-items: stretch;
    gap: 6px;
    flex-wrap: nowrap;
    width: 100%;
}

.mainContent .demandData .demandPrice .budgetCurrencySelect,
.mainContent .demandData .demandPrice .budgetCurrencyFixed {
    flex: 0 0 179px;
    width: 179px;
    min-width: 120px;
    height: 40px;
    line-height: 40px;
    color: #000000;
    font-size: 14px;
}

.mainContent .demandData .demandPrice .budgetCurrencyFixed {
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    box-sizing: border-box;
    border: 1px solid #dcdfe6;
    border-radius: 4px;
    background: #f5f7fa;
}

.mainContent .demandData .demandPrice .budgetPriceInput,
.mainContent .demandData .demandPrice .budgetPriceSelect {
    flex: 1 1 auto;
    min-width: 0;
    height: 40px;
}

.mainContent .demandData .demandPrice .budgetPriceInput::placeholder {
    color: rgba(10, 10, 10, 0.5);
}

.mainContent .demandData .demandCode .liInput span {
    color: var(--color);
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 16px;
    border-radius: 6px;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.mainContent .demandData .demandCode .liInput {
    display: flex;
    gap: 12px;
    align-items: center;
}

.mainContent .demandData .demandCode .liInput {
    width: 100%;
}

.mainContent .demandData .demandCode .liInput input {
    flex: 1;
    min-width: 0;
}

.mainContent .demandData .demandCode .liInput .getCode {
    padding: 10px 20px;
    background: #ff6b2c;
    color: #ffffff;
    border-radius: 100px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    white-space: nowrap;
    border: none;
}

.mainContent .demandData .demandCode .liInput .getCode:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 107, 44, 0.3);
}

.mainContent .demandData .demandCode .liInput .getCode:active {
    transform: translateY(0);
}

/* Attachments upload (Figma 2499:177) */
.mainContent .demandData .attachUploadField {
    gap: 8px;
}

.mainContent .demandData .attachUploadTrigger {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 40px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    background: #ffffff;
    cursor: pointer;
    box-sizing: border-box;
    overflow: hidden;
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.mainContent .demandData .attachUploadTrigger:hover {
    border-color: #ffd1c2;
    background: #fff8f4;
}

.mainContent .demandData .attachUploadTrigger input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    opacity: 0;
    cursor: pointer;
    border: none;
    background: transparent;
}

.mainContent .demandData .attachUploadIcon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    color: rgba(10, 10, 10, 0.45);
}

.mainContent .demandData .attachUploadText {
    font-size: 14px;
    line-height: normal;
    color: rgba(10, 10, 10, 0.5);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mainContent .demandData .attachUploadField .fileList {
    margin-top: 0;
}

/* 文件上传 */
.mainContent .demandData .liInputFile {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.mainContent .demandData .liInputFile:not(.attachUploadField) input[type="file"] {
    padding: 10px 11px;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    background: #ffffff;
    cursor: pointer;
    transition: border-color 0.2s ease, background-color 0.2s ease;
    height: 40px;
    box-sizing: border-box;
}

.mainContent .demandData .liInputFile:not(.attachUploadField) input[type="file"]:hover {
    border-color: #ffd1c2;
    background: #fff8f4;
}

.fileList {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fileList li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 12px;
    background: #f8fafc;
    border-radius: 6px;
    margin: 0 !important;
}

.fileList li a {
    color: var(--color);
    text-decoration: none;
    font-size: 14px;
    transition: color 0.2s ease;
}

.fileList li a:hover {
    text-decoration: underline;
}

.fileList li span {
    color: #ef4444;
    cursor: pointer;
    font-size: 14px;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.fileList li span:hover {
    background: rgba(239, 68, 68, 0.1);
}

/* 提示文本 */
.mainContent .demandData .destinationDetail .liInput,
.mainContent .demandData .tradeTermsPreference .liSelect {
    width: 100%;
}

.mainContent .demandData .destinationDetail .liInput input,
.mainContent .demandData .tradeTermsPreference .liSelect select {
    width: 100%;
    height: 40px;
}

.mainContent .demandData .goodsNum > div > span,
.mainContent .goodsDataUl .goodsNum > div > span {
    display: block;
    color: rgba(10, 10, 10, 0.5);
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.4;
}

/* Submit button */
.operationBtnWrapper {
    display: flex;
    justify-content: center;
}

.mainContent .operationBtn {
    width: 100%;
    max-width: 630px;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 45px auto 35px;
}

.mainContent .operationBtn button {
    min-width: 160px;
    height: 48px;
    border-radius: 100px;
    border: none;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    padding: 0 32px;
    width: 100%;
}

.mainContent .operationBtn .releaseBtn {
    background: #ff6b2c;
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(255, 107, 44, 0.25);
}

.mainContent .operationBtn .releaseBtn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(255, 107, 44, 0.35);
}

.mainContent .operationBtn .releaseBtn:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(255, 107, 44, 0.25);
}


/* Responsive */
@media (max-width: 768px) {
    .mainContent {
        width: 100%;
        padding: 16px;
        margin: 10px auto;
        min-width: 0;
    }

    .postDemandLayout {
        flex-direction: column;
    }

    .postDemandSidebar,
    .rfqTipsSidebar {
        width: 100% !important;
    }

    .rfqModeSwitcher {
        grid-template-columns: 1fr;
    }

    .mainContent .demandData .demandUl {
        grid-template-columns: 1fr;
        grid-template-areas: none;
    }

    .mainContent .demandData .demandUl > li {
        grid-area: auto;
    }

    .mainContent .goodsData .goodsDataUl li,
    .mainContent .demandData .demandUl li {
        flex-direction: column;
        align-items: flex-start;
    }

    .mainContent .goodsData .goodsDataUl li p,
    .mainContent .demandData .demandUl li p {
        width: 100%;
        text-align: left;
        justify-content: flex-start;
    }

    .operationBtnWrapper {
        flex-direction: column;
    }

    .mainContent .operationBtn {
        flex-direction: column;
        width: 100%;
        max-width: none;
    }

    .mainContent .operationBtn button {
        width: 100%;
    }
}

/* RFQ Tips Sidebar */
.rfqTipsSidebar {
    width: 100%;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.tipsCard {
    padding: 20px;
}

.tipsCard:hover {
    box-shadow: 0 8px 22px rgba(15, 23, 41, 0.07);
    transform: none;
}

.tipsCardBlue,
.tipsCardWhite {
    background: #ffffff;
    border: none;
}

.tipsCardHeader {
    display: flex;
    align-items: center;
    gap: 0;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e0e8f2;
}

.tipsCardWhite .tipsCardHeader {
    border-bottom-color: #e0e8f2;
}

.tipsIcon {
    display: none;
}

.tipsCardHeader h3 {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    color: #000000;
    line-height: 1.28;
}

.tipsList {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.tipsList li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0;
    padding: 0;
}

.tipsItemIcon {
    font-size: 14px;
    color: #22c55e;
    flex-shrink: 0;
    width: 14px;
    height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
}

.tipsCardWhite .tipsItemIcon {
    color: #ff6029;
}

.tipsList li span {
    flex: 1;
    font-size: 12px;
    line-height: 1.4;
    color: #000000;
    font-weight: 400;
}

.tipsCardBlue .tipsList li span {
    color: #000000;
}

.tipsItemIcon.iconfont {
    font-size: 14px;
}

.tipsIcon.iconfont {
    display: none;
}