aiquery2/web/client/src/sections/aiTenderDocument/container/index.module.less

:root{
 font-size: 14px;
}
.container {
   height: 100dvh;
   min-height: 100dvh;
   background: #f6f8fb;
   overflow: hidden;
   box-sizing: border-box;
}
.embeddedContainer {
   background: #fff;
   scrollbar-width: none;
   -ms-overflow-style: none;
}

.embeddedContainer::-webkit-scrollbar,
.embeddedContainer :global(*)::-webkit-scrollbar {
   display: none;
   width: 0;
   height: 0;
}

.embeddedContainer :global(*) {
   scrollbar-width: none;
   -ms-overflow-style: none;
}

.embeddedContainer .mainLayout {
   background: #fff;
}
.navSider {
   background-image: linear-gradient(180deg, #f9fbff 0%, #e0eaff 99%);
   box-shadow: 2px 0 7px 0 #d9e6ff;
   padding: 14px 14px;
   display: flex;
   flex-direction: column;
   height: 100%;
   transition: all 0.2s;
}

.navSider :global(.ant-layout-sider-children) {
   display: flex;
   flex-direction: column;
   height: 100%;
   align-items: center;
}

.navSider :global(.ant-layout-sider-collapsed) {
   padding: 12px 4px;
}

.logo {
   height: 44px;
   margin: 0 auto 20px;
   border-radius: 8px;
   color: #2468ff;
   font-size: 1.5rem;
   font-weight: 700;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
   white-space: nowrap;
   overflow: hidden;
   cursor: pointer;
}

.logoImage {
   width: 40px;
   height: 40px;
   object-fit: contain;
   flex-shrink: 0;
}

.logoText {
   line-height: 1;
}

.navMenu {
   background: transparent;
   border-inline-end: none !important;
   color: #26456e;
   min-height: 0;
   width: 100%;
}

.navMenu :global(.ant-menu-item) {
   height: 42px;
   justify-content: flex-start;
   flex-direction: row;
   display: flex;
   align-items: center;
   padding: 0 16px !important;
   margin: 6px 0;
   border-radius: 8px;
   width: 100%;
   transition: all 0.3s;
}

.navMenu :global(.ant-menu-item-selected) {
   background: #2e73ff !important;
}
.navMenu :global(.ant-menu-title-content) {
   margin-inline-start: 10px !important;
   text-align: left;
   min-width: 0;
}
.navMenu :global(.ant-menu-item:hover),
.navMenu :global(.ant-menu-item-active) {
   background: rgba(46, 115, 255, 0.12);
}

.navMenu :global(.ant-menu-item .ant-menu-title-content),
.navMenu :global(.ant-menu-item .ant-menu-item-icon) {
   color: #26456e;
   display: inline-flex;
   align-items: center;
   justify-content: center;
}
.navMenu :global(.ant-menu-item .ant-menu-item-icon) {
   margin-inline-start: 0;
   margin-inline-end: 0;
   min-width: 18px;
}
.navMenu :global(.ant-menu-item .ant-menu-title-content) {
   font-size: 16px;
   flex: 1 1 auto;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.navMenu :global(.ant-menu-item-selected .ant-menu-title-content),
.navMenu :global(.ant-menu-item-selected .ant-menu-item-icon) {
   color: #fff;
}

.navMenuCollapsed {
   width: 100% !important;
}

.navMenuCollapsed :global(.ant-menu-item) {
   padding: 0 !important;
   width: 100% !important;
   justify-content: center !important;
}

.navMenuCollapsed :global(.ant-menu-title-content) {
   display: none !important;
}

.navMenuCollapsed :global(.ant-menu-item-icon) {
   margin: 0 !important;
   min-width: unset !important;
   width: 100% !important;
   display: flex !important;
   align-items: center !important;
   justify-content: center !important;
}

.navMenuCollapsed :global(.ant-menu-item .ant-menu-item-icon) {
   margin-inline-end: 0 !important;
}

.menuLabel {
   line-height: 1;
}

.menuIcon {
   width: 18px;
   height: 18px;
   object-fit: contain;
}
.collapseMenuIcon {
}
.footerActions {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
   margin-top: auto;
}

.avatarButton {
   width: 44px;
   height: 40px;
   border: none;
   border-radius: 8px;
   background: transparent;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   margin: 0;
   transition: all 0.2s ease;
}

.avatarButton:hover {
   background: rgba(36, 104, 255, 0.08);
}

.userInitialAvatar {
   background: linear-gradient(180deg, #eaf4ff 0%, #d7eaff 100%) !important;
   color: #176ae6 !important;
   display: inline-flex !important;
   align-items: center;
   justify-content: center;
   flex: 0 0 auto;
   font-weight: 600;
   line-height: 1;
   box-shadow: inset 0 0 0 1px rgba(47, 135, 245, 0.18);
}

.collapseButton {
   height: 44px;
   width: 44px;
   border: none;
   background: transparent;
   color: #000000;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 1.25rem;
   transition: all 0.2s ease;
   margin-bottom: 0;
}

.collapseButton:hover {
   color: #2e73ff;
}

.mobileTopBar {
   height: 52px;
   display: flex;
   align-items: center;
   gap: 10px;
   padding: 0 12px;
   border-bottom: 1px solid #e7edf7;
   background: rgba(255, 255, 255, 0.95);
   backdrop-filter: blur(8px);
   flex: 0 0 auto;
   position: fixed !important;
   top: 0;
   left: 0;
   right: 0;
   z-index: 99999;
   width: 100%;
}

.mobileTopBarLeft {
   min-width: 0;
   display: inline-flex;
   align-items: center;
   gap: 8px;
}

.mobileTopBarTitle {
   font-size: 0.9375rem;
   font-weight: 600;
   color: #1a1f36;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

.mobileMenuButton {
   width: 32px;
   height: 32px;
   border: none;
   background: #f4f7ff;
   color: #26456e;
   border-radius: 8px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   flex: 0 0 auto;
}

.mobileDrawerMenu {
   border-inline-end: none !important;
}

.mobileDrawerLogo {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   color: #2468ff;
   font-size: 2rem;
   font-weight: 700;
   cursor: pointer;
}

.mobileDrawerMenu :global(.ant-menu-item) {
   margin: 6px 0;
   border-radius: 8px;
}

.profileHeader {
   display: flex;
   align-items: center;
   gap: 12px;
   margin-bottom: 12px;
}

.profileMeta {
   min-width: 0;
}

.profileName {
   font-size: 1rem;
   font-weight: 600;
   color: #1a1f36;
}

.profileDesc {
   font-size: 0.75rem;
   color: #6b7280;
}

.profileSubmitBtn {
   width: 100%;
   height: 36px;
   border: none;
   border-radius: 8px;
   background: #2e73ff;
   color: #fff;
   cursor: pointer;
   margin-bottom: 10px;
}

.profileSubmitBtn:disabled {
   opacity: 0.6;
   cursor: not-allowed;
}

.nicknameRow {
   display: flex;
   align-items: center;
   gap: 8px;
}

.nicknameSaveBtn {
   height: 32px;
   min-width: 52px;
   border: 1px solid #d8e1f2;
   border-radius: 6px;
   background: #fff;
   color: #26456e;
   cursor: pointer;
   padding: 0 10px;
}

.nicknameSaveBtn:disabled {
   cursor: not-allowed;
   opacity: 0.6;
}

.profileActionRow {
   margin: 6px 0 10px;
}

.quotaSummaryCard {
   width: 100%;
   border: 1px solid #d8e1f2;
   border-radius: 10px;
   background: linear-gradient(180deg, #ffffff 0%, #f7faff 100%);
   color: #1a1f36;
   display: inline-flex;
   align-items: center;
   justify-content: space-between;
   padding: 10px 12px;
   cursor: pointer;
}

.quotaSummaryLeft {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   font-size: 0.8125rem;
}

.quotaSummaryIcon {
   color: #2e73ff;
}

.quotaSummaryValue {
   color: #2e73ff;
   font-weight: 600;
}

.quotaSummaryArrow {
   color: #98a2b3;
   font-size: 0.75rem;
}

.quotaErrorText {
   margin-top: 8px;
   color: #d4380d;
   font-size: 0.75rem;
}

.quotaDetailHeader {
   display: flex;
   flex-direction: column;
   gap: 6px;
   margin-bottom: 10px;
}

.quotaDetailPolicy {
   color: #667085;
   font-size: 0.75rem;
}

.quotaDetailList {
   display: flex;
   flex-direction: column;
   gap: 10px;
}

.quotaDetailItem {
   border: 1px solid #e4e7ec;
   border-radius: 10px;
   padding: 10px 12px;
   background: #fff;
}

.quotaDetailTop {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 12px;
   margin-bottom: 8px;
}

.quotaDetailTitle {
   color: #1d2939;
   font-size: 0.8125rem;
}

.quotaDetailCount {
   color: #475467;
   font-size: 0.75rem;
}

.quotaDetailBar {
   width: 100%;
   height: 6px;
   border-radius: 999px;
   background: #eef2f7;
   overflow: hidden;
}

.quotaDetailBarInner {
   display: block;
   height: 100%;
   border-radius: 999px;
   background: linear-gradient(90deg, #5b8cff 0%, #2e73ff 100%);
}

.quotaDetailFoot {
   margin-top: 8px;
   color: #667085;
   font-size: 0.75rem;
}

.profileGhostBtn {
   width: 100%;
   height: 36px;
   border: 1px solid #d8e1f2;
   border-radius: 8px;
   background: #fff;
   color: #26456e;
   cursor: pointer;
}

.profileDangerBtn {
   width: 100%;
   height: 36px;
   border: 1px solid #f5c2c7;
   border-radius: 8px;
   background: #fff5f5;
   color: #cf1322;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
   cursor: pointer;
   margin-top: 4px;
}

.profileConfirmBtn {
   width: 100%;
   height: 36px;
   border: 1px solid #2e73ff;
   border-radius: 8px;
   background: #2e73ff;
   color: #fff;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
   cursor: pointer;
   margin-top: 4px;
}


.mainLayout {
   background-image: url("../../../../assets/img/aiTenderDocument/background.png");
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
   height: 100%;
   min-height: 0;
   overflow: hidden;
}

.header {
   background: #fff;
   padding: 12px 20px;
   border-bottom: 1px solid #edf0f5;
   display: flex;
   align-items: center;
   justify-content: space-between;
}

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

.avatar {
   background: #2e73ff;
   font-weight: 700;
}

.titleGroup {
   display: flex;
   flex-direction: column;
   gap: 2px;
}

.title {
   font-size: 1.125rem;
   font-weight: 600;
   color: #1a1f36;
}

.subtitle {
   font-size: 0.75rem;
   color: #6b7280;
}

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

.contentLayout {
   background: transparent;
}

.listSider {
   border-right: 1px solid #edf0f5;
   padding: 12px;
   background: none !important;
}

.listHeader {
   display: flex;
   flex-direction: column;
   gap: 10px;
   margin-bottom: 10px;
}
.listTitle {
   font-size: 1.375rem;
   font-weight: 600;
   color: #1a1f36;
   display: flex;
   align-items: center;
   justify-content: start;
   margin-bottom: 10px;
}
.createButton {
   font-weight: 600;
}

.planList {
   display: flex;
   flex-direction: column;
   gap: 8px;
   overflow: auto;
   max-height: calc(100dvh - 200px);
   padding-right: 4px;
}

.planCard {
   transition: all 0.2s ease;
   cursor: pointer;
}

.planCard:hover {
   box-shadow: 0 6px 18px rgba(19, 33, 68, 0.08);
}

.planCardActive {
   border: 1px solid #2e73ff !important;
   box-shadow: 0 10px 24px rgba(46, 115, 255, 0.12);
}

.planTitle {
   font-size: 1rem;
   font-weight: 600;
   color: #1a1f36;
   margin-bottom: 6px;
}

.planMeta {
   display: flex;
   align-items: center;
   gap: 8px;
   color: #6b7280;
   font-size: 0.75rem;
   margin-bottom: 5px;
}

.planDate {
   color: #6b7280;
}

.contentArea {
   padding: 0;
   background: transparent;
   height: 100%;
   min-height: 0;
   overflow: hidden;
}

.homePlaceholder {
   width: 100%;
   height: 100%;
   background: transparent;
   .centerBackground {
      width: 80%;
      height: 80%;
      background-image: url("../../../../assets/img/aiTenderDocument/centerMenu-background.png");
      border-radius: 10px;
      margin: 0 auto;
      display: flex;
      align-items: start;
      flex-direction: column;
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      padding: 0 5%;
      margin-top: 5%;
      .cardContainer {
         width: 100%;
         height: 50%;
         display: flex;
         align-items: center;
         justify-content: space-between;
         .card {
            width: 28%;
            height: 100%;
            border-radius: 16px;
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            font-size: 1.125rem;
            font-weight: 500;
            transition: transform 0.25s ease, box-shadow 0.25s ease;
            padding: 10px;
            .cardBg {
               width: 120%;
               height: 120%;
               object-fit: contain;
            }
            .cardContent {
               position: absolute;
               top: 30%;
               left: 50%;
               transform: translateX(-50%);
               width: 80%;
               text-align: center;
               color: #4a4a4a;
               display: flex;
               justify-content: space-between;
               flex-direction: column;
               height: 60%;
               h3 {
                  font-size: 1.375rem;
                  margin-bottom: 10px;
               }

               p {
                  font-size: 1rem;
                  margin-bottom: 20px;
                  line-height: 1.5;
               }
               .cardBtn {
                  width: 100%;
                  height: 60px;
                  background-size: contain;
                  background-repeat: no-repeat;
                  background-position: center;
                  margin: 0 auto;
                  font-weight: 500;
                  font-size: 1.25rem;
                  color: #ffffff;
                  letter-spacing: 0;
                  display: flex;
                  justify-content: center;
                  align-items: center;
                  .cardBtnText {
                     margin-bottom: 0;
                     display: inline-flex;
                     align-items: center;
                     justify-content: center;
                     gap: 6px;
                     line-height: 1;
                  }
               }
               .cardBtn:hover {
                  cursor: pointer;
               }
            }
         }
         .card:hover {
            transform: translateY(-2px);
         }
      }
      .title {
         font-family: SourceHanSansCN-Regular;
         font-weight: 400;
         font-size: 1.9375rem;
         color: #666666;
         letter-spacing: 2.58px;
         .titleImg {
            width: 100%;
            height: 50%;
            object-fit: contain;
         }
      }
   }
}

.tenderLayout {
   display: flex;
   flex-direction: row;
   height: 100%;
   background: transparent;
   overflow: hidden;
}

.mobileWorkspaceHeader {
   display: none;
   align-items: center;
   justify-content: space-between;
   gap: 8px;
   padding: 8px 10px;
   background: #fff;
   border-bottom: 1px solid #e7edf7;
   flex: 0 0 auto;
}

.mobileWorkspaceTitle {
   min-width: 0;
   font-size: 1rem;
   font-weight: 600;
   color: #1f2937;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

.tenderContent {
   flex: 1;
   min-width: 0;
   padding: 0;
   background: transparent;
   display: flex;
   flex-direction: column;
   height: 100%;
   overflow: hidden;
}

.listTitle {
   display: flex;
   align-items: center;
   gap: 8px;
   font-weight: 600;
   margin-bottom: 12px;
   color: #1a1f36;
}

.planRow {
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.planActions {
   display: flex;
   align-items: center;
   gap: 6px;
}

.planEdit,
.planDelete {
   padding: 0;
   height: 24px;
   width: 24px;
   min-width: 24px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
}

.planEdit :global(.anticon),
.planDelete :global(.anticon) {
   font-size: 1rem;
}

.planEdit {
   color: #1677ff;
}

.planDelete {
   color: #ff4d4f;
}

.catalogHeader {
   font-size: 1rem;
   font-weight: 600;
   margin-bottom: 8px;
   color: #1a1f36;
}

.catalogList {
   display: flex;
   flex-direction: column;
   gap: 6px;
   flex: 1;
   overflow: auto;
}

.catalogItem {
   display: flex;
   gap: 8px;
   padding: 8px;
   border-radius: 8px;
   cursor: pointer;
   transition: all 0.2s ease;
}

.catalogItem:hover {
   background: #f3f6ff;
}

.catalogItemActive {
   background: #e8f0ff;
   border: 1px solid #2e73ff;
}

.catalogDot {
   display: none;
}

.catalogBody {
   display: flex;
   justify-content: space-between;
   align-items: center;
   width: 100%;
   gap: 8px;
}

.catalogTitle {
   font-size: 0.8125rem;
   color: #1a1f36;
}

.catalogProgress {
   font-size: 0.75rem;
   color: #6b7280;
}

.stepsBar {
   padding: 12px 16px;
   background: #fff;
   border-radius: 8px;
   margin-bottom: 12px;
   box-shadow: 0 4px 10px rgba(19, 33, 68, 0.05);
   display: flex;
   align-items: center;
   gap: 12px;
   flex: 0 0 auto;
   margin: 10px 20px;
}

.sectionCard {
   margin-bottom: 16px;
   box-shadow: 0 6px 18px rgba(19, 33, 68, 0.08);
}

.sectionTitle {
   margin-bottom: 12px;
}

.textBlock {
   line-height: 1.7;
   color: #2c3e50;
}

.tablePlaceholder {
   border: 1px dashed #cbd5e1;
   border-radius: 8px;
   margin: 12px 0 16px;
   overflow: hidden;
}

.tableRow {
   display: grid;
   grid-template-columns: 1fr 2fr;
   border-bottom: 1px solid #eef2f7;
}

.tableRow:last-child {
   border-bottom: none;
}

.tableCell {
   padding: 10px 12px;
   font-size: 0.8125rem;
   color: #1f2937;
   background: #fff;
}

.tableRow:nth-child(odd) .tableCell {
   background: #f8fafc;
}

.imagePlaceholder {
   border: 1px dashed #cbd5e1;
   border-radius: 8px;
   padding: 16px;
   text-align: center;
   color: #6b7280;
   background: #f8fafc;
}

.emptyState {
   padding: 48px 24px;
   text-align: center;
   color: #6b7280;
   margin: auto;
}

.emptyStateContainer {
   flex: 1;
   min-height: 0;
   display: flex;
   align-items: center;
   justify-content: center;
}

.stepsBack {
   min-width: 80px;
}

.stepsWrapper {
   flex: 1;
}

.catalogLayout {
   display: flex;
   flex-direction: column;
   height: 100%;
   overflow: hidden;
}

.contentRow {
   display: flex;
   align-items: flex-start;
   flex: 1;
   min-height: 0;
   overflow: hidden;
   gap: 12px;
}

.catalogSider {
   background: #fff;
   border-right: 1px solid #edf0f5;
   padding: 16px 12px 12px;
   height: 100%;
   display: flex;
   flex-direction: column;
   overflow: hidden;
   box-sizing: border-box;
}

.catalogSider :global(.ant-layout-sider-children) {
   height: 100%;
   display: flex;
   flex-direction: column;
   overflow: hidden;
}

.detailContent {
   padding: 16px 20px;
   background: transparent;
   width: 100%;
   padding-top: 0;
   height: 100%;
   overflow: auto;
   box-sizing: border-box;
}

.createTenderWrapper {
   display: flex;
   gap: 14px;
   height: 100%;
   width: 100%;
   box-sizing: border-box;
   padding: 0 14px 14px;
   align-items: stretch;
}

.createTenderWrapperStageForm {
   .createTenderLeft {
      width: 100%;
      min-width: 0;
      max-width: none;
   }
}

.createTenderWrapperStageDirectory {
   .createTenderLeft {
      width: 30%;
      min-width: 300px;
      max-width: 430px;
      padding: 16px 18px;
   }

   .createTenderCenter {
      width: 35%;
      min-width: 280px;
   }

   .createTenderRight {
      width: 35%;
      min-width: 280px;
   }

   .formTitle {
      font-size: 1.9375rem;
      margin-bottom: 10px !important;
   }

   .createTenderForm :global(.ant-form-item) {
      margin-bottom: 16px;
   }
}

.createTenderWrapperNoSidebar {
   padding: 20px;
}

.createTenderLeft,
.createTenderCenter,
.createTenderRight {
   background: #fff;
   border: 1px solid #e5e8ef;
   border-radius: 8px;
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
   overflow: hidden;
   box-shadow: 0 1px 2px rgba(10, 22, 70, 0.04);
}

.createTenderLeft {
   width: 34%;
   min-width: 320px;
   max-width: 440px;
   padding: 18px 22px;
   overflow-y: auto;
}

.createTenderCenter {
   width: 33%;
   min-width: 0;
}

.createTenderRight {
   width: 33%;
   min-width: 0;
}

.formTitle {
   margin-bottom: 12px !important;
   font-size: 1.875rem;
   font-weight: 600;
   color: #1f2937;
}

.createTenderForm {
   height: 100%;

   :global(.ant-form-item) {
      margin-bottom: 14px;
   }

   :global(.ant-form-item-label > label) {
      color: #1f2937;
      font-weight: 600;
      font-size: 1rem;
   }

   :global(.ant-input),
   :global(.ant-input-number),
   :global(.ant-select-selector) {
      border-radius: 6px;
   }
}

.inlineItem :global(.ant-radio-group) {
   display: flex;
   flex-wrap: wrap;
   gap: 12px 16px;
}

.inlineItem :global(.ant-radio-button-wrapper),
.inlineItem :global(.ant-radio-wrapper) {
   border-radius: 6px;
}

.planTypeItem :global(.ant-radio-group) {
   gap: 12px;
}

.planTypeItem :global(.ant-radio-button-wrapper) {
   min-width: 104px;
   height: 34px;
   border-radius: 6px !important;
   border: 1px solid #d1d8e6 !important;
   background: #fff;
   color: #4b5563;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   margin-inline-start: 0 !important;
   padding: 0 12px;
}

.planTypeItem :global(.ant-radio-button-wrapper::before) {
   display: none !important;
}

.planTypeItem
   :global(
      .ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled)
   ) {
   color: #2e73ff;
   background: #edf4ff;
   border-color: #2e73ff !important;
   box-shadow: 0 0 0 1px rgba(46, 115, 255, 0.08);
}

.planTypeButtonContent {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   font-size: 1rem;
   line-height: 1;
}

.planTypeButtonIcon {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   font-size: 1rem;
}

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

.planTypeReadonlyTag {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   height: 34px;
   padding: 0 14px;
   border-radius: 6px;
   border: 1px solid #2e73ff;
   background: #edf4ff;
   color: #2e73ff;
   font-size: 1rem;
}

.uploadBox {
   padding: 0;
   cursor: pointer;
   background: #fff;
   :global(.ant-upload) {
      width: 100%;
      display: block;
   }
   :global(.ant-upload-drag) {
      border: 1px dashed #2e73ff !important;
      border-radius: 8px;
      background: #fafdff !important;
      padding: 0 !important;
      min-height: 162px;
   }
}

.uploadBoxDirectory {
   :global(.ant-upload-drag) {
      min-height: 190px;
      padding: 10px !important;
      background: #fff !important;
   }
}

.tenderUploadContent {
   min-height: 160px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   text-align: center;
   padding: 18px 20px;
}

.tenderUploadIcon {
   width: 44px;
   height: 44px;
   border-radius: 50%;
   margin-bottom: 10px;
   background: linear-gradient(180deg, #60a5fa 0%, #2e73ff 100%);
   color: #fff;
   font-size: 1.375rem;
   font-weight: 700;
   display: flex;
   align-items: center;
   justify-content: center;
}

.tenderUploadButton {
   margin-top: 10px;
   border-color: #2e73ff !important;
   color: #2e73ff !important;
   border-radius: 6px !important;
}

.tenderUploadFilledBox {
   min-height: 190px;
   border: 1px dashed #2e73ff;
   border-radius: 8px;
   padding: 10px;
   box-sizing: border-box;
}

.tenderUploadFileCard {
   width: 100%;
   min-height: 76px;
   border-radius: 8px;
   background: #eaf1f8;
   padding: 10px 12px;
   display: flex;
   align-items: center;
   gap: 10px;
}

.tenderUploadFileIcon {
   width: 30px;
   height: 24px;
   border-radius: 8px;
   background: linear-gradient(180deg, #60a5fa 0%, #2e73ff 100%);
   color: #fff;
   font-size: 0.9375rem;
   font-weight: 700;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   flex: 0 0 auto;
}

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

.tenderUploadFileName {
   margin: 0;
   color: #1f2937;
   font-size: 0.8125rem;
   line-height: 1.45;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   text-decoration: none;
}

.tenderUploadFileName:hover {
   color: #1677ff;
}

.tenderUploadFileSize {
   margin-top: 6px;
   font-size: 0.75rem;
   color: #6b7280;
}

.tenderUploadFileDelete {
   flex: 0 0 auto;
   color: #9ca3af;
   cursor: pointer;
   font-size: 1rem;
}

.tenderUploadFileDelete:hover {
   color: #ff4d4f;
}

.parseAction {
   margin-top: auto;
   margin-bottom: 0 !important;

   :global(.ant-btn) {
      height: 40px;
      border-radius: 6px;
      font-weight: 500;
   }
}

.parseButtonBusy,
.parseButtonBusy:disabled {
   background: #b7d2f1 !important;
   border-color: #b7d2f1 !important;
   color: #2e73ff !important;
   opacity: 1 !important;
}

.uploadHint {
   margin: 0;
   font-size: 1rem;
   line-height: 1.5;
   color: #1f2937;
}

.uploadSubHint {
   margin: 4px 0 0;
   font-size: 12px;
   color: #8c98ab;
}

.appendixBox {
   background: transparent;
   :global(.ant-upload) {
      width: 100%;
      height: 72px;
   }
   :global(.ant-upload.ant-upload-select-picture-card) {
      width: 72px;
      height: 72px;
      border: 1px dashed #2e73ff;
      border-radius: 8px;
      background: #fafdff;
      margin-right: 8px;
      margin-bottom: 8px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 !important;
   }
   :global(.ant-upload-select-picture-card > div) {
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
   }
   :global(.ant-upload-list-picture-card-container) {
      width: 72px;
      height: 72px;
   }
   :global(.ant-upload-list-item-container) {
      width: 72px !important;
      height: 72px !important;
   }
}

.appendixUploadTrigger {
   width: 100%;
   height: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 6px;
   margin: 0 auto;
}

.appendixUploadIcon {
   font-size: 1.125rem;
   color: #2e73ff;
}

.appendixUploadText {
   font-size: 1rem;
   color: #1f2937;
   line-height: 1;
}

.previewTitle {
   margin: 0;
   padding: 16px 20px;
   font-size: 1rem;
   font-weight: 600;
   color: #111827;
   border-bottom: 1px solid #f3f4f6;
   background: #fff;
}

.previewCard {
   flex: 1;
   display: flex;
   flex-direction: column;
   border: none !important;
   box-shadow: none !important;
   box-sizing: border-box;
   min-height: 0;
   overflow-y: auto;
   padding: 0 !important;

   :global(.ant-card-body) {
      padding: 12px !important;
   }
}

.customTree {
   min-width: 0;
   width: 100%;
   overflow-x: hidden;
}

.customTree :global(.ant-tree),
.customTree :global(.ant-tree-list),
.customTree :global(.ant-tree-list-holder),
.customTree :global(.ant-tree-list-holder-inner),
.customTree :global(.ant-tree-treenode) {
   min-width: 0;
}

.customTree :global(.ant-tree-list),
.customTree :global(.ant-tree-list-holder) {
   overflow-x: hidden !important;
}

.customTree :global(.ant-tree-list-holder-inner) {
   width: 100%;
}

.customTree :global(.ant-tree-treenode) {
   display: flex;
   align-items: center;
   width: 100%;
}

.customTree :global(.ant-tree-node-content-wrapper) {
   display: flex;
   align-items: center;
   flex: 1 1 auto;
   width: 0;
   min-width: 0;
   max-width: 100%;
   overflow: hidden;
}

.customTree :global(.ant-tree-title) {
   flex: 1;
   min-width: 0;
   max-width: 100%;
   overflow: hidden;
}

.previewCatalogTreeTitle {
   display: block;
   min-width: 0;
   max-width: 100%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.previewEmpty,
.previewEditableEmpty {
   flex: 1;
   display: flex;
   align-items: center;
   justify-content: center;
   color: #6b7280;
   text-align: center;
}

.rightButtons {
   display: flex;
   gap: 8px;
   justify-content: flex-end;
   margin-top: auto;
   padding: 12px;
   border-top: 1px solid #f0f0f0;
}

.scoreModalContent {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 16px;
   font-size: 1rem;
}

.scoreColumn {
   display: flex;
   flex-direction: column;
   gap: 8px;
   height: 100%;
}

.scoreColumnHeader {
   display: flex;
   align-items: center;
   height: 32px;
   font-size: 1rem;
}

.scoreListBox {
   min-height: 260px;
   border: 1px solid #d9d9d9;
   border-radius: 6px;
   padding: 12px;
   overflow: auto;
   flex: 1;
}

.scoreTabs {
   flex: 1;
   overflow: hidden;
   display: flex;
   flex-direction: column;
   :global(.ant-tabs-nav) {
      margin: 0;
      flex-shrink: 0;
   }
   :global(.ant-tabs-content-holder) {
      flex: 1;
      overflow: hidden;
   }
   :global(.ant-tabs-content) {
      height: 100%;
   }
   :global(.ant-tabs-tabpane) {
      height: 100%;
      display: flex;
      flex-direction: column;
   }
   :global(.ant-tabs-nav-list) {
      height: 32px;
   }
   :global(.ant-tabs-tab-btn) {
      font-size: 1rem;
   }
}

.scoreModalFooter {
   display: flex;
   justify-content: flex-end;
   gap: 8px;
}

.generateWrapper {
   display: flex;
   gap: 12px;
   height: 100%;
   width: 100%;
   padding: 20px;
   box-sizing: border-box;
}

.mobileCatalogToolbar {
   display: flex;
   align-items: center;
   justify-content: flex-start;
   position: fixed !important;
   right: 12px;
   bottom: calc(env(safe-area-inset-bottom, 0px) + 52px);
   top: auto;
   left: auto;
   transform: none;
   z-index: 1200;
   pointer-events: none;
}

.mobileCatalogToolbar :global(.ant-btn) {
   pointer-events: auto;
   height: 38px;
   padding: 0 14px;
   border-radius: 999px;
   border: none;
   color: #fff;
   font-weight: 600;
   background: linear-gradient(135deg, #4e8eff 0%, #2f6bff 100%);
   box-shadow: 0 8px 18px rgba(47, 107, 255, 0.34);
}

.mobileCatalogToolbar :global(.ant-btn:hover),
.mobileCatalogToolbar :global(.ant-btn:focus) {
   color: #fff;
   border: none;
   background: linear-gradient(135deg, #5f99ff 0%, #2f6bff 100%);
}

.mobileCatalogToolbar :global(.ant-btn:active) {
   color: #fff;
   border: none;
   background: linear-gradient(135deg, #3b7ff7 0%, #2459e9 100%);
}

.mobileCatalogDrawer :global(.ant-drawer-body) {
   padding: 8px;
}

.mobileCatalogDrawerPanel {
   height: 100%;
   min-height: 0;
   display: flex;
}

.mobileCatalogDrawerPanel .generateSidebar {
   width: 100%;
   max-height: none;
   height: 100%;
}

.mobileCatalogDrawerPanel .catalogListCompact {
   max-height: none;
}

.generateSidebar {
   width: 30%;
   display: flex;
   flex-direction: column;
   border: 1px solid #d9d9d9;
   padding: 10px;
   border-radius: 6px;
}

.generatePreview {
   width: 70%;
   border: 1px solid #d9d9d9;
   border-radius: 6px;
   min-height: 100%;
   display: flex;
   flex-direction: column;
   align-items: stretch;
   justify-content: flex-start;
}

.generatePreviewEmpty {
   color: #6b7280;
}

.generateHeader {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-bottom: 10px;
}

.projectTitle {
   font-weight: 600;
   font-size: 1rem;
   display: flex;
   justify-content: space-between;
   width: 100%;
   align-items: center;
   margin-bottom: 10px;
}

.projectExitBtn {
   font-size: 0.75rem;
}

.projectMeta {
   font-size: 0.75rem;
   color: #6b7280;
}

.catalogListCompact {
   display: flex;
   flex-direction: column;
   gap: 8px;
   flex: 1;
   overflow: auto;
}

.catalogCard {
   border: 1px solid #e5e7eb;
}

.catalogBlock {
   padding: 8px 0;
   border-bottom: 1px solid #e5e7eb;
}
.catalogBlock:last-child {
   border-bottom: none;
}
.catalogBlockHeader {
   display: flex;
   align-items: center;
   margin-bottom: 6px;
}
.catalogBlockTitle {
   font-size: 1rem;
   color: #1a1f36;
}

.catalogRow {
   display: flex;
   align-items: center;
   gap: 8px;
   padding: 6px 0;
}

.catalogRowTitle {
   flex: 1;
}

.catalogSelect {
   width: 90px;
}
.scoreTabs :global(.ant-tabs-nav) {
   margin: 0 0 8px 0;
}

.generateFooterActions {
   display: flex;
   gap: 8px;
   justify-content: flex-end;
   margin-top: 10px;
}

.previewContent {
   padding: 12px;
   overflow: auto;
   overflow-y: scroll;
   overflow-x: hidden;
   scrollbar-gutter: stable;
   flex: 1;
   min-height: 0;
   position: relative;
}

.documentToolbar {
   position: sticky;
   top: 0;
   z-index: 40;
   width: fit-content;
   max-width: 100%;
   box-sizing: border-box;
   padding: 8px 12px;
   border-bottom: 1px solid #e5e7eb;
   background: #ffffff;
   border-radius:  0 0 10px 10px;
   box-shadow: 0 1px 4px rgba(15, 23, 42, 0.06);
}

.documentToolbarHint {
   font-size: 0.75rem;
   color: #4b5563;
   margin-right: 2px;
}

.documentSectionActionWrap {
   display: inline-flex;
   align-items: center;
   max-width: 100%;
}

.documentColorInput {
   width: 34px;
   padding: 1px 3px;
}

.documentHoverTrigger {
   text-align: left;
   overflow: hidden;
}

.documentHoverMenu {
   max-height: 260px;
   overflow-y: auto;
   padding: 4px;
   border-radius: 6px;
   background: #ffffff;
   box-shadow: 0 6px 16px rgba(15, 23, 42, 0.14);
}

.documentHoverOption {
   width: 100%;
   min-height: 30px;
   padding: 4px 10px;
   border: 0;
   border-radius: 4px;
   background: transparent;
   color: #111827;
   text-align: left;
   cursor: pointer;
}

.documentHoverOption:hover,
.documentHoverOptionActive {
   background: #f0f0f0;
}

.documentSettingsPanel {
   padding: 12px;
   border-radius: 8px;
   background: #ffffff;
   box-shadow: 0 8px 24px rgba(15, 23, 42, 0.16);
}

.documentSettingsTitle {
   margin-bottom: 10px;
   font-size: 0.8125rem;
   font-weight: 600;
   color: #111827;
}

.documentSettingsGrid {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 10px 12px;
}

.documentSettingItem {
   display: grid;
   grid-template-columns: 72px minmax(0, 1fr);
   align-items: center;
   gap: 8px;
   font-size: 0.75rem;
   color: #4b5563;
}

.documentSettingItem :global(.ant-select),
.documentSettingItem :global(.ant-input-number) {
   width: 100%;
}

.documentTitleSettingRow,
.documentCaptionSettingRow {
   display: grid;
   align-items: center;
   gap: 8px;
   margin-top: 10px;
}

.documentTitleSettingRow {
   grid-template-columns: 72px 112px 88px 92px 60px;
}

.documentCaptionSettingRow {
   grid-template-columns: 64px 70px 76px 108px 86px 86px 86px;
}

.exportPreviewStage {
   min-height: 100%;
   padding: 24px;
   background: #f3f4f6;
   overflow: auto;
}

.exportPreviewPage {
   width: 794px;
   min-height: 1123px;
   margin: 0 auto;
   padding:
      var(--doc-padding-top, 2.54cm)
      var(--doc-padding-right, 3.18cm)
      var(--doc-padding-bottom, 2.54cm)
      var(--doc-padding-left, 3.18cm);
   background: #ffffff;
   box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
   box-sizing: border-box;
}

.exportPreviewPage :global(.ProseMirror) {
   min-height: auto;
   border: 0;
   padding: 0;
   margin: 0;
   font-family: var(--doc-font-family, "宋体");
   font-size: var(--doc-font-size, 12pt);
   line-height: var(--doc-line-height, 1.5);
   color: #111827;
   white-space: pre-wrap;
}

.exportPreviewPage :global(.ProseMirror p) {
   margin: 0 0 8px;
   text-indent: var(--doc-text-indent, 2em);
   text-align: var(--doc-text-align, left);
}

.exportPreviewPage :global(.ProseMirror h1) {
   margin: 0 0 16px;
   font-family: var(--doc-h1-font-family, "宋体");
   font-size: var(--doc-h1-font-size, 18pt);
   font-weight: var(--doc-h1-font-weight, 700);
   text-align: var(--doc-h1-text-align, left);
}

.exportPreviewPage :global(.ProseMirror h2),
.exportPreviewPage :global(.ProseMirror h3) {
   margin: 12px 0 8px;
   font-family: var(--doc-h2-font-family, "宋体");
   font-size: var(--doc-h2-font-size, 16pt);
   font-weight: var(--doc-h2-font-weight, 700);
   text-align: var(--doc-h2-text-align, left);
}

.exportPreviewPage :global(.ProseMirror h4) {
   margin: 12px 0 8px;
   font-family: var(--doc-h3-font-family, "宋体");
   font-size: var(--doc-h3-font-size, 15pt);
   font-weight: var(--doc-h3-font-weight, 700);
   text-align: var(--doc-h3-text-align, left);
}

.exportPreviewCaption {
   margin: 6px 0 !important;
   text-indent: 0 !important;
}

.exportPreviewFigureCaption {
   font-family: var(--doc-figure-caption-font-family, "宋体");
   font-size: var(--doc-figure-caption-font-size, 9pt);
   font-weight: var(--doc-figure-caption-font-weight, 700);
   text-align: var(--doc-figure-caption-text-align, center) !important;
}

.exportPreviewTableCaption {
   font-family: var(--doc-table-caption-font-family, "宋体");
   font-size: var(--doc-table-caption-font-size, 9pt);
   font-weight: var(--doc-table-caption-font-weight, 700);
   text-align: var(--doc-table-caption-text-align, center) !important;
}

.exportPreviewPage :global(.ProseMirror table) {
   width: 100%;
   margin: 8px 0 12px;
   border-collapse: collapse;
   table-layout: auto;
}

.exportPreviewPage :global(.ProseMirror th),
.exportPreviewPage :global(.ProseMirror td) {
   border: 1px solid #111827;
   padding: 6px 8px;
   vertical-align: middle;
   word-break: break-word;
}

.exportPreviewPage :global(.ProseMirror th) {
   font-weight: 700;
   text-align: center;
}

.exportPreviewPage :global(.ProseMirror img),
.exportPreviewPage :global(.ProseMirror .react-renderer img) {
   display: block;
   max-width: 100% !important;
   width: auto !important;
   height: auto !important;
   max-height: 520px;
   object-fit: contain;
   margin: 8px auto;
}

.exportPreviewPage :global(.ProseMirror .image-resizer),
.exportPreviewPage :global(.ProseMirror [data-node-view-wrapper]) {
   max-width: 100%;
}

.previewHeaderRow {
   display: flex;
   align-items: flex-start;
   margin-bottom: 6px;
   gap: 6px;
   row-gap: 6px;
   padding-left: 5px;
   border-radius: 5px;
}

.previewSection .previewHeaderRow {
   position: static;
   z-index: 20;
   background: #fff;
   box-shadow: none;
   padding: 6px 5px;
   border-radius: 5px;
}

.previewChapter {
   padding: 8px 0 12px;
   border-bottom: 0;
}

.previewChapterTitle {
   font-size: 1rem;
   margin-bottom: 0;
   text-align: center;
   width: 100%;
}

.previewSection {
   border-bottom: 1px solid #e5e7eb;
}

.previewSectionTitle {
   font-size: 12pxrem;
   font-weight: 600;
}

.previewParagraph {
   overflow: visible;
   box-sizing: border-box;
   position: relative;
   outline: none;
}

.previewParagraph:focus,
.previewParagraph:focus-within {
   outline: none;
}
.previewParagraph + .previewParagraph {
   border-top: 0;
   margin-top: 0;
   padding-top: 0;
}

.previewChapter + .previewChapter {
   border-top: 0;
}

.previewParagraphTitle {
   display: block;
   width: 100%;
   min-width: 0;
   color: #111827;
   font-family: var(--super-doc-h2-font-family, "宋体");
   font-size: var(--super-doc-h2-font-size, 16pt);
   font-weight: var(--super-doc-h2-font-weight, 700);
   line-height: 1.4;
   text-align: var(--super-doc-h2-text-align, left);
   margin: 0;
   padding: 0;
   box-sizing: border-box;
   overflow-wrap: anywhere;
   white-space: normal;
}

.previewParagraphLevelOne .previewParagraphTitle {
   font-family: var(--super-doc-h1-font-family, "宋体");
   font-size: var(--super-doc-h1-font-size, 18pt);
   font-weight: var(--super-doc-h1-font-weight, 700);
   text-align: var(--super-doc-h1-text-align, center);
}

.previewFloatingActions {
   position: static;
   z-index: 16;
   display: flex;
   justify-content: flex-end;
   max-width: calc(100% - 16px);
   height: 30px;
   margin: 2px 8px 6px auto;
   overflow: visible;
   opacity: 1;
   pointer-events: auto;
   transform: none;
   transition:
      opacity 0.16s ease,
      transform 0.16s ease;
}

.previewParagraph:hover .previewFloatingActions,
.previewParagraph:focus-within .previewFloatingActions {
   opacity: 1;
   pointer-events: auto;
   transform: translateY(0);
}

.previewFloatingActions :global(.ant-btn) {
   background: rgba(255, 255, 255, 0.82);
   border-color: rgba(203, 213, 225, 0.84);
   box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}

.previewFloatingActions :global(.ant-btn-primary) {
   background: #1677ff;
   border-color: #1677ff;
   box-shadow: 0 2px 6px rgba(22, 119, 255, 0.16);
}

.previewFloatingActions :global(.ant-space) {
   max-width: 100%;
   overflow-x: auto;
   padding-bottom: 2px;
   scrollbar-width: thin;
}

@media (max-width: 768px) {
   .previewParagraphTitle {
      padding-right: 0;
   }

   .previewFloatingActions {
      position: static;
      height: auto;
      opacity: 1;
      pointer-events: auto;
      transform: none;
      margin: 4px 0 6px;
      padding: 4px 0;
      background: rgba(255, 255, 255, 0.92);
      backdrop-filter: blur(6px);
   }
}

.previewParagraph .previewHeaderRow {
   position: static;
   z-index: 10;
   background: #fff;
   padding: 6px 0;
   box-shadow: none;
   pointer-events: auto;
}

.previewHeaderRow :global(.ant-space) {
   flex: 0 0 auto;
   margin-left: auto;
   flex-wrap: nowrap;
   pointer-events: auto;
   max-width: 80%;
   overflow-x: auto;
    scrollbar-width: thin;
   scrollbar-color: rgba(0, 0, 0, 0.3) transparent;
}

.previewEditorToolbar {
   display: inline-flex;
   align-items: center;
   flex-wrap: nowrap;
   white-space: nowrap;
   gap: 5px;
}

.previewEditorToolbar :global(.ant-btn) {
   flex: 0 0 auto;
   white-space: nowrap;
}

.richText {
   min-height: 120px;
   border: 1px solid #d9d9d9;
   border-radius: 6px;
   padding: 8px;
   background: #fff;
   word-break: break-word;
   overflow-wrap: break-word;
   white-space: pre-wrap;
   overflow-x: auto;
}

.versionModal {
   display: flex;
   gap: 16px;
   height: 100%;
}

.versionList {
   width: 220px;
   flex: 0 0 220px;
   overflow-y: auto;
   padding-right: 12px;
   border-right: 1px solid #e5e7eb;
}

.versionListItem {
   width: 100%;
   appearance: none;
   border: 1px solid #e5e7eb;
   border-radius: 8px;
   padding: 8px;
   background: #fff;
   cursor: pointer;
   display: block;
   text-align: left;
   font: inherit;
   margin-bottom: 8px;
}

.versionListItemActive {
   border-color: #1677ff;
   background: #f0f7ff;
}

.versionListHeader {
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 8px;
}

.versionListTitle {
   font-size: 0.8125rem;
   color: #111827;
   font-weight: 600;
}

.versionListTime {
   font-size: 0.75rem;
   color: #6b7280;
}

.versionListSnippet {
   margin: 6px 0 0;
   color: #4b5563;
   overflow: hidden;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
}

.versionCompare {
   flex: 1;
   display: flex;
   gap: 16px;
   min-width: 0;
}

.versionPanel {
   flex: 1;
   display: flex;
   flex-direction: column;
   min-width: 0;
}

.versionPanelHeader {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 8px;
   margin-bottom: 8px;
}

.versionPanelTitle {
   font-size: 0.8125rem;
   font-weight: 600;
   color: #111827;
}

.versionPanelBody {
   flex: 1;
   overflow: auto;
   min-height: 0;
}

.versionModal :global(.ProseMirror img) {
   display: block;
   max-width: 100% !important;
   width: auto !important;
   height: auto !important;
   max-height: calc(86vh - 220px);
   object-fit: contain;
   margin: 8px auto;
}

.richTextTitle {
   font-size: 0.75rem;
   color: #6b7280;
   margin-bottom: 6px;
}

.richTextBlock {
   display: flex;
   flex-direction: column;
   gap: 6px;
   width: 100%;
}

.richText table {
   width: 100%;
   border-collapse: collapse;
}

.richText th,
.richText td {
   border: 1px solid #e5e7eb;
   padding: 6px 8px;
}
/* duplicate rules removed */

.previewParagraph :global(.ProseMirror table) {
   width: 100%;
   border-collapse: collapse;
}

.previewParagraph :global(.ProseMirror th),
.previewParagraph :global(.ProseMirror td) {
   border: 1px solid #e5e7eb;
   padding: 6px 8px;
   position: relative;
}

.previewParagraph :global(.ProseMirror td::after),
.previewParagraph :global(.ProseMirror th::after) {
   content: "";
   position: absolute;
   top: 0;
   right: -2px;
   width: 4px;
   height: 100%;
   cursor: col-resize;
}

.previewParagraph :global(.ProseMirror .column-resize-handle) {
   cursor: col-resize;
}

.previewParagraph :global(.ProseMirror .selectedCell) {
   background: rgba(24, 144, 255, 0.18);
}

.previewParagraph :global(.ProseMirror) {
   word-break: break-word;
   overflow-wrap: break-word;
   white-space: pre-wrap;
   margin-top: 8px;
   border: 0;
   border-radius: 0;
   padding: 8px;
   background: #fff;
   box-sizing: border-box;
   outline: none;
}

.previewParagraph :global(.ProseMirror:focus) {
   outline: none;
}

.previewParagraph :global(.super-document-editor .ProseMirror) {
   font-family: var(--super-doc-font-family, "宋体");
   font-size: var(--super-doc-font-size, 12pt);
   line-height: var(--super-doc-line-height, 1.5);
   color: #111827;
}

.previewParagraph :global(.super-document-editor .ProseMirror p) {
   margin: 0 0 8px;
   text-indent: var(--super-doc-body-text-indent, 2em);
   text-align: var(--super-doc-body-text-align, left);
}

.previewParagraph :global(.super-document-editor .ProseMirror h1) {
   font-family: var(--super-doc-h1-font-family, "宋体");
   font-size: var(--super-doc-h1-font-size, 18pt);
   font-weight: var(--super-doc-h1-font-weight, 700);
   text-align: var(--super-doc-h1-text-align, center);
}

.previewParagraph :global(.super-document-editor .ProseMirror h2) {
   font-family: var(--super-doc-h2-font-family, "宋体");
   font-size: var(--super-doc-h2-font-size, 16pt);
   font-weight: var(--super-doc-h2-font-weight, 700);
   text-align: var(--super-doc-h2-text-align, left);
}

.previewParagraph :global(.super-document-editor .ProseMirror h3),
.previewParagraph :global(.super-document-editor .ProseMirror h4),
.previewParagraph :global(.super-document-editor .ProseMirror h5),
.previewParagraph :global(.super-document-editor .ProseMirror h6) {
   font-family: var(--super-doc-h3-font-family, "宋体");
   font-size: var(--super-doc-h3-font-size, 15pt);
   font-weight: var(--super-doc-h3-font-weight, 700);
   text-align: var(--super-doc-h3-text-align, left);
}

.previewParagraph :global(.super-document-editor .ProseMirror [data-ai-caption-type="figure"]) {
   font-family: var(--super-doc-figure-caption-font-family, "宋体");
   font-size: var(--super-doc-figure-caption-font-size, 9pt);
   font-weight: var(--super-doc-figure-caption-font-weight, 600);
   text-align: var(--super-doc-figure-caption-text-align, center) !important;
   text-indent: 0;
}

.previewParagraph :global(.super-document-editor .ProseMirror [data-ai-caption-type="table"]) {
   font-family: var(--super-doc-table-caption-font-family, "宋体");
   font-size: var(--super-doc-table-caption-font-size, 9pt);
   font-weight: var(--super-doc-table-caption-font-weight, 600);
   text-align: var(--super-doc-table-caption-text-align, center) !important;
   text-indent: 0;
}

:global(.ai-reference-item) {
   display: inline-block;
   margin: 0 2px;
   vertical-align: super;
   font-size: smaller;
   color: #1890ff;
   cursor: pointer;
   font-weight: 600;
   user-select: none;
   pointer-events: auto;
}

.previewParagraph :global(.ProseMirror img) {
   max-width: 100%;
   height: auto;
}

.previewParagraph
   :global(.ProseMirror [data-report-block-id]:not([data-report-block-type="kpi"])) {
   border: 1px dashed #d9d9d9;
   border-radius: 8px;
   padding: 8px 12px;
   margin: 10px 0;
   cursor: pointer;
   transition:
      border-color 0.2s ease,
      background 0.2s ease;
}

.previewParagraph
   :global(.ProseMirror [data-report-block-id]:not([data-report-block-type="kpi"]):hover) {
   border-color: #1677ff;
   background: #f8fbff;
}

.previewEditorBox {
   position: relative;
}

.previewInlineChartWrap {
   margin: 8px 0 10px;
   border: 1px solid #e5e7eb;
   border-radius: 8px;
   background: #fff;
   padding: 10px 12px;
}

.previewInlineChartWrapEditable {
   cursor: pointer;
   transition:
      border-color 0.2s ease,
      box-shadow 0.2s ease;
}

.previewInlineChartWrapEditable:hover {
   border-color: #1677ff;
   box-shadow: 0 0 0 2px rgba(22, 119, 255, 0.08);
}

.previewInlineChartTitle {
   margin-bottom: 8px;
   font-size: 0.8125rem;
   font-weight: 600;
   color: #111827;
}

.previewInlineChart {
   width: 100%;
   height: 280px;
}

.previewLoadingMask {
   position: absolute;
   inset: 0;
   background: rgba(255, 255, 255, 0.7);
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 5;
}

.previewParagraph :global(.ProseMirror h1),
.previewParagraph :global(.ProseMirror h2),
.previewParagraph :global(.ProseMirror h3),
.previewParagraph :global(.ProseMirror h4),
.previewParagraph :global(.ProseMirror h5),
.previewParagraph :global(.ProseMirror h6) {
   margin: 0 0 8px;
}

.previewParagraph :global(.ProseMirror ul),
.previewParagraph :global(.ProseMirror ol) {
   margin: 0 0 8px;
   padding-left: 1.5em;
   list-style-position: outside;
}

.previewParagraph :global(.ProseMirror li) {
   line-height: 1.6;
}

.previewParagraph :global(.ql-toolbar) {
   font-size: 0.75rem;
}
.previewParagraph :global(.ql-toolbar.ql-snow) {
   display: flex;
   flex-wrap: wrap;
   justify-content: flex-end;
   gap: 4px;
   padding: 4px 6px;
   border-radius: 4px;
}
.previewParagraph :global(.ql-toolbar .ql-formats) {
   margin-right: 0;
}
.previewParagraph :global(.ql-toolbar button),
.previewParagraph :global(.ql-toolbar .ql-picker) {
   font-size: 0.75rem;
}

/* Paragraph header keeps default flow; toolbar styling remains compact from previous rules */

.previewImageDrawer :global(.ant-drawer-body) {
   background: #f7f8fa;
   height: 100%;
   overflow: hidden;
}

.previewImageDrawer :global(.ant-drawer-header) {
   display: flex;
   align-items: center;
}

.previewImageDrawer :global(.ant-drawer-header-title) {
   display: flex;
   align-items: center;
   width: 100%;
}

.previewImageDrawer :global(.ant-drawer-title) {
   flex: 1;
}

.previewImageDrawer :global(.ant-drawer-header-close) {
   margin-left: auto;
   order: 2;
}

.previewImageDrawerBody {
   display: grid;
   grid-template-columns: 200px 1fr;
   gap: 12px;
   height: 100%;
   min-height: 0;
}

.previewImageDrawerLeft {
   display: flex;
   flex-direction: column;
   gap: 12px;
   overflow: hidden;
}

.previewImageDrawerSearch {
   width: 100%;
}

.previewImageDrawerSection {
   background: #fff;
   border-radius: 8px;
   padding: 8px;
   border: 1px solid #e5e7eb;
}

.previewImageDrawerTitle {
   font-size: 0.75rem;
   font-weight: 600;
   margin-bottom: 5px;
   color: #1f2937;
   display: flex;
   align-items: center;
   cursor: pointer;
}
.previewImageDrawerTitle:hover {
   color: #1677ff;
}
.previewImageDrawerTitleActive {
   color: #1677ff;
}

.previewImageDrawerList {
   display: flex;
   flex-wrap: wrap;
   gap: 6px;
}

.previewImageDrawerItem {
   border-radius: 999px;
}

.previewImageDrawerRight {
   background: #fff;
   border-radius: 8px;
   padding: 8px;
   border: 1px solid #e5e7eb;
   overflow: auto;
}

.previewImageDrawerFormArea {
   display: flex;
   flex-direction: column;
   gap: 12px;
}

.previewImageDrawerForm {
   background: #f9fafb;
   border-radius: 8px;
   padding: 10px;
   border: 1px solid #e5e7eb;
   max-height: 300px;
   overflow: auto;
}

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

.previewImageDrawerField {
   min-width: 0;
}

.previewImageDrawerFieldWide {
   grid-column: 1 / -1;
}
.previewImageDrawerField {
   display: flex;
   flex-direction: row;
   align-items: center;
   gap: 8px;
   font-size: 0.75rem;
   color: #4b5563;
}

.previewImageDrawerField > span {
   flex: 0 0 auto;
   white-space: nowrap;
}

.previewImageDrawerField :global(.ant-input),
.previewImageDrawerField :global(.ant-input-affix-wrapper),
.previewImageDrawerField :global(.ant-select),
.previewImageDrawerField :global(.ant-picker),
.previewImageDrawerField :global(.ant-input-group) {
   flex: 1;
   min-width: 0;
}

.previewImageDrawerFormActions {
   display: flex;
   gap: 8px;
}

.previewImageDrawerRange {
   display: flex;
   align-items: center;
   gap: 6px;
   flex-wrap: nowrap;
   width: 100%;
}

.previewImageDrawerRangeDash {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   padding: 0 6px;
   color: #9ca3af;
   flex: 0 0 auto;
}

.previewImageDrawerRange :global(.ant-input),
.previewImageDrawerRange :global(.ant-input-affix-wrapper),
.previewImageDrawerRange :global(.ant-select-selector) {
   flex: 1;
   min-width: 0;
}

.previewImageDrawerRange :global(.ant-input-group) {
   display: flex;
   flex-wrap: nowrap;
   flex: 1;
   min-width: 0;
}

.previewImageDrawerGrid {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 10px;
}

.previewImageDrawerCard {
   background: #f9fafb;
   border-radius: 8px;
   padding: 6px;
   cursor: pointer;
   border: 1px solid transparent;
   transition: border-color 0.2s ease;
}

.previewImageDrawerCard:hover {
   border-color: #1677ff;
}

.previewImageDrawerThumb {
   width: 100%;
   height: 120px;
   object-fit: cover;
   border-radius: 6px;
}

.previewImageDrawerLabel {
   margin-top: 6px;
   font-size: 0.75rem;
   color: #374151;
   text-align: center;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}
svg[aria-roledescription="error"],
.mermaid-error {
   display: none !important;
}

@media (max-width: 1200px) {
   .stepsBar {
      margin: 8px 12px;
      padding: 10px 12px;
   }

   .createTenderWrapper {
      gap: 10px;
      padding: 0 10px 10px;
   }

   .createTenderLeft {
      width: 36%;
      min-width: 280px;
   }
}

@media (max-width: 991px) {
   .container {
      height: auto;
      min-height: 100dvh;
      overflow: auto;
   }

   .mainLayout {
      overflow: hidden;
   }

   .contentArea {
      overflow: auto;
      padding-top: 52px;
   }

   .tenderLayout {
      flex-direction: column;
      overflow: visible;
      height: auto;
      min-height: 0;
   }

   .mobileWorkspaceHeader {
      display: flex;
   }

   .tenderContent {
      overflow: visible;
      height: auto;
      min-height: 0;
   }

   .emptyState {
      padding: 24px 12px;
   }

   .homePlaceholder {
      height: auto;
      overflow: auto;

      .centerBackground {
         width: 100%;
         height: auto;
         margin-top: 0;
         padding: 10px;
         background-image: none;
         background-size: cover;
         align-items: stretch;
         gap: 10px;

         .title {
            font-size: 1.5rem;
            letter-spacing: 1px;
            width: 100%;

            .titleImg {
               width: min(100%, 360px);
               height: auto;
            }
         }

         .titleText {
            font-size: 1rem;
            line-height: 1.6;
         }

         .cardContainer {
            height: auto;
            flex-direction: column;
            gap: 10px;

            .card {
               width: 100%;
               height: auto;
               min-height: 200px;
               padding: 8px;
               background: transparent;
               background-size: cover;
               background-repeat: no-repeat;
               background-position: center;
               border: 1px solid #d8e7ff;
               overflow: hidden;
               position: relative;

               &::after {
                  content: "";
                  position: absolute;
                  inset: 0;
                  background: linear-gradient(
                     180deg,
                     rgba(255, 255, 255, 0.44) 0%,
                     rgba(255, 255, 255, 0.26) 100%
                  );
                  pointer-events: none;
                  z-index: 2;
               }

               .cardBg {
                  display: none;
               }

               .cardContent {
                  position: relative;
                  top: auto;
                  left: auto;
                  transform: none;
                  width: 100%;
                  height: auto;
                  gap: 10px;
                  padding: 12px 12px 10px;
                  text-align: left;
                  justify-content: space-between;
                  z-index: 3;

                  h3,
                  p {
                     word-break: break-word;
                  }

                  .cardBtn {
                     width: min(100%, 236px);
                     height: 48px;
                     background-size: 100% 100%;
                     justify-content: center;
                     align-items: center;
                     margin-top: 2px;
                  }

                  .cardBtnText {
                     margin-bottom: 0;
                     font-size: 0.9375rem;
                     font-weight: 700;
                     color: #0f3f87;
                     text-shadow: 0 1px 2px rgba(255, 255, 255, 0.7);
                     display: inline-flex;
                     align-items: center;
                     gap: 6px;
                  }
               }
            }

            .card:hover {
               width: 100%;
               height: auto;
            }
         }
      }
   }

   .stepsBar {
      margin: 8px 8px 0;
      padding: 10px;
   }

   .stepsWrapper {
      min-width: 0;
      overflow-x: auto;
   }

   .stepsWrapper :global(.ant-steps) {
      min-width: 560px;
   }

   .catalogLayout {
      height: auto;
      min-height: 0;
      overflow: visible;
   }

   .generateWrapper {
      flex-direction: column;
      height: auto;
      padding: 8px;
      gap: 8px;
   }

   .generateSidebar,
   .generatePreview {
      width: 100%;
      min-width: 0;
      max-width: none;
   }

   .generateSidebar {
      min-height: 180px;
      max-height: 42dvh;
   }

   .catalogListCompact {
      max-height: 34dvh;
   }

   .generateHeader {
      flex-wrap: wrap;
      gap: 8px;
   }

   .projectTitle {
      flex-wrap: wrap;
      gap: 6px;
      align-items: flex-start;
   }

   .previewContent {
      overflow-x: auto;
   }

   .previewHeaderRow {
      flex-wrap: wrap;
      align-items: flex-start;
   }

   .previewHeaderRow :global(.ant-space) {
      margin-left: 0;
      width: 100%;
      justify-content: flex-start;
      overflow-x: auto;
   }

   .previewParagraphTitle {
      flex: 1 1 auto;
      margin-left: 0;
      margin-right: 0;
   }

   .previewParagraph .previewHeaderRow {
      flex-wrap: nowrap;
      align-items: center;
   }

   .previewParagraph .previewParagraphTitle {
      flex: 0 1 42%;
      min-width: 80px;
      margin-right: 8px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
   }

   .previewParagraph .previewHeaderRow :global(.ant-space) {
      margin-left: auto;
      width: auto;
      max-width: calc(100% - 88px);
      justify-content: flex-start;
      overflow-x: auto;
      overflow-y: hidden;
      flex-wrap: nowrap;
      white-space: nowrap;
   }

   .previewParagraph .previewHeaderRow :global(.ant-space-item) {
      flex: 0 0 auto;
   }

   .versionModal {
      flex-direction: column;
      gap: 10px;
   }

   .versionList {
      width: 100%;
      flex: 0 0 auto;
      border-right: none;
      border-bottom: 1px solid #e5e7eb;
      padding-right: 0;
      padding-bottom: 8px;
      max-height: 180px;
   }

   .versionCompare {
      flex-direction: column;
   }

   .contentRow {
      flex-direction: column;
      align-items: stretch;
      overflow: visible;
      height: auto;
      gap: 8px;
      padding: 0 8px 8px;
   }

   .detailContent {
      padding: 12px;
      height: auto;
   }

   .createTenderWrapper,
   .createTenderWrapperNoSidebar {
      flex-direction: column;
      height: auto;
      padding: 0 8px 8px;
      gap: 8px;
   }

   .createTenderLeft,
   .createTenderCenter,
   .createTenderRight {
      width: 100%;
      min-width: 0;
      max-width: none;
   }

   .createTenderWrapperStageDirectory .createTenderLeft,
   .createTenderWrapperStageDirectory .createTenderCenter,
   .createTenderWrapperStageDirectory .createTenderRight {
      width: 100%;
      min-width: 0;
      max-width: none;
      padding: 12px;
   }

   .previewImageDrawerBody {
      grid-template-columns: minmax(0, 1fr);
   }

   .previewImageDrawerFormRow {
      grid-template-columns: minmax(0, 1fr);
   }
}

@media (max-width: 767px) {
   .mobileTopBar {
      height: 48px;
      padding: 0 10px;
   }

   .contentArea {
      padding-top: 48px;
   }

   .logo {
      margin-bottom: 10px;
   }

   .menuIcon {
      width: 16px;
      height: 16px;
   }

   .stepsBar {
      flex-wrap: wrap;
      gap: 8px;
   }

   .stepsBack {
      min-width: 64px;
   }

   .formTitle {
      font-size: 1.5rem;
   }

   .homePlaceholder .centerBackground .cardContainer .card .cardContent h3 {
      font-size: 1.125rem;
      margin-bottom: 0;
   }

   .homePlaceholder .centerBackground .cardContainer .card .cardContent p {
      font-size: 0.8125rem;
      margin-bottom: 0;
   }

   .homePlaceholder
      .centerBackground
      .cardContainer
      .card
      .cardContent
      .cardBtn {
      height: 46px;
      font-size: 1rem;
      justify-content: center;
   }

   .previewImageDrawerGrid {
      grid-template-columns: minmax(0, 1fr);
   }
}