/* Business forms: one paper layout shared by filling, preview and records. */
.fc-paper,
.fdb-canvas {
  --sheet-line: #aeb9c5;
  --sheet-label: #f3f5f7;
  --sheet-ink: #253342;
  --sheet-muted: #647284;
  --sheet-focus: #2163c6;
}
.fc-editor.fc-paper,
.fdb-preview-device.fc-paper {
  --panel: #fff; --panel2: #f3f5f7; --text: #253342; --muted: #647284;
  --line: #aeb9c5; --ctl-border: #c4cdd7; --ctl-bg: #fff;
  --brand: #2163c6; --brand2: #2163c6; --brand-soft: #eaf2ff;
  color-scheme: light;
  width: 100%; max-width: 1040px; margin: 0 auto;
  padding: 28px 32px; gap: 18px; border: 1px solid #c9d1db;
  border-radius: 2px; background: #fff; color: var(--sheet-ink);
  box-shadow: 0 4px 18px #172b4d0a;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
}
.fc-paper .fc-editor-head { justify-content: center; align-items: center; }
.fc-paper .fc-editor-head > div { flex: 1 1 100%; order: 2; text-align: center; padding: 8px 0 12px; }
.fc-paper .fc-editor-head > button { margin-right: auto; }
.fc-paper .fc-editor-head h2,
.fc-paper.fdb-preview-device > h3,
.fdb-canvas .fdb-sheet-head h3 {
  font-family: "Songti SC", "STSong", "SimSun", serif;
  font-size: 26px; font-weight: 700; line-height: 1.5; letter-spacing: 2px;
  text-align: center; color: var(--sheet-ink); margin: 0 0 8px;
}
.fc-paper .fc-editor-head p,
.fc-paper .fc-paper-meta,
.fdb-canvas .fc-paper-meta { color: var(--sheet-muted); font-size: 12px; line-height: 1.7; text-align: center; margin: 0; }
.fc-paper .fc-note { border: 0; border-left: 2px solid #bac6d6; border-radius: 0; background: #f6f8fb; color: #48596e; font-size: 13px; }
.fc-paper [data-fc-form] { display: flex; flex-direction: column; gap: 20px; }
.fc-paper .panel { background: #fff; box-shadow: none; color: var(--sheet-ink); border: 0; border-radius: 0; padding: 0; }
.fc-paper .fc-section h3,
.fc-paper .fdb-preview-section h4 {
  font-size: 14px; font-weight: 600; color: #253342; margin: 0; padding: 10px 12px;
  background: #e9eef3; border: 1px solid var(--sheet-line); border-bottom: 0;
}
.fc-paper .fc-grid,
.fc-paper .fdb-preview-section {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0;
  border: 1px solid var(--sheet-line);
}
.fc-paper .fdb-preview-section h4 { grid-column: 1/-1; border: 0; border-right: 1px solid var(--sheet-line); border-bottom: 1px solid var(--sheet-line); }
.fc-paper .fc-fld,
.fc-paper .fdb-preview-field {
  display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 0;
  min-width: 0; margin: 0; padding: 0; min-height: 62px;
  border: 1px solid var(--sheet-line); border-left: 0;
  margin-top: -1px; margin-bottom: -1px;
  border-radius: 0; background: #fff; align-items: stretch;
}
.fc-paper .fc-span12,
.fc-paper .fdb-preview-field[style*="span 12"] { grid-template-columns: 132px minmax(0, 1fr); }
.fc-paper .fc-fld > .fc-label,
.fc-paper .fdb-preview-field > .fc-label {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap; align-content: center;
  padding: 12px 10px; margin: 0; min-width: 0; font-size: 14px; font-weight: 500;
  text-align: center; color: var(--sheet-ink); background: var(--sheet-label);
  border-right: 1px solid var(--sheet-line); line-height: 1.6; overflow-wrap: anywhere;
}
.fc-paper .fc-entry { display: flex; flex-direction: column; justify-content: center; gap: 8px; padding: 9px 12px; min-width: 0; overflow-wrap: anywhere; }
.fc-paper .fc-entry > [hidden] { display: none; }
.fc-paper .fc-entry > .kfc-status:empty { display: none; }
.fc-paper .fc-entry :is(input:not([type=checkbox]):not([type=radio]):not([type=file]), select, textarea) {
  width: 100%; max-width: 100%; min-width: 0; min-height: 40px; box-sizing: border-box;
  padding: 8px 7px; border: 1px solid transparent; border-radius: 2px;
  background: #fff; color: #253342; font: inherit; font-size: 14px; box-shadow: none;
}
.fc-paper .fc-entry :is(input, textarea)::placeholder { color: #7b8795; opacity: 1; }
.fc-paper .fc-entry :is(input, select, textarea):hover { border-color: #ccd6e2; }
.fc-paper .fc-entry :is(input, select, textarea):focus-visible { outline: 2px solid var(--sheet-focus); outline-offset: 0; border-color: transparent; background: #f7faff; box-shadow: none; }
.fc-paper .fc-entry textarea { min-height: 100px; resize: vertical; line-height: 1.8; }
.fc-paper .fc-entry input[readonly] { background: #f4f7fa; }
.fc-paper .fc-opt,
.fc-paper .fdb-choice label { min-height: 36px; color: #253342; font-size: 14px; }
.fc-paper .fc-opts,
.fc-paper .fdb-choice { padding: 0; gap: 6px 16px; }
.fc-paper .fc-entry .kfc-help { color: #647284; line-height: 1.7; }
.fc-paper .kfc-description { margin: 0; border: 0; border-bottom: 1px solid var(--sheet-line); border-right: 1px solid var(--sheet-line); border-radius: 0; background: #f8fafc; padding: 12px 16px; }
.fc-paper .kfc-inline { align-items: center; }
.fc-paper .kfc-inline > label { min-width: 80px; }
.fc-paper .kfc-upload { background: #f8fafc; color: #48596e; border-color: #bdc9d8; }
.fc-paper .kfc-selected > span { color: #334c6e; }
.fc-paper .fc-entry > button { align-self: flex-start; min-height: 40px; }
.fc-paper .fc-table-field { grid-template-columns: 1fr; }
.fc-paper .fc-table-field > .fc-label { justify-content: flex-start; border-right: 0; border-bottom: 1px solid var(--sheet-line); }
.fc-paper .fc-table-wrap { border: 1px solid var(--sheet-line); border-radius: 0; }
.fc-paper :is(.fc-table, .fc-detail) { border-collapse: collapse; background: #fff; color: #253342; }
.fc-paper :is(.fc-table, .fc-detail) :is(th, td) { border: 1px solid var(--sheet-line); padding: 10px; white-space: pre-wrap; }
.fc-paper :is(.fc-table, .fc-detail) th { background: var(--sheet-label); color: #334354; }
.fc-paper .fc-table input { min-width: 90px !important; }
.fc-paper .fc-sign-pad { border: 1px solid var(--sheet-line); border-radius: 0; }
.fc-paper .fc-sign-row { padding: 12px; border: 1px solid var(--sheet-line); margin: 0; }
.fc-paper .fc-actions { padding-top: 12px; gap: 10px; }
.fc-paper .fc-actions button { min-height: 44px; }
.fc-paper .fc-hint { flex: 1 1 300px; color: #647284; line-height: 1.6; }
.fdb-preview-device.fc-paper { gap: 16px; }
.fdb-preview-dialog { margin: auto; inset: 0; }
.fdb-preview-device.fc-paper.mobile { max-width: 390px; padding: 16px; border: 1px solid #c9d1db; border-radius: 2px; }
.fdb-preview-device.fc-paper.mobile .fdb-preview-section { grid-template-columns: repeat(12,minmax(0,1fr)); }
.fdb-preview-device.fc-paper .kfc-field { grid-column: span 6; }
.fdb-preview-device.fc-paper .kfc-field.fc-span12 { grid-column: span 12; }
.fdb-preview-device.fc-paper .kfc-field.fc-span3 { grid-column: span 3; }
.fdb-preview-device.fc-paper .kfc-field.fc-span4 { grid-column: span 4; }
.fdb-preview-device.fc-paper .kfc-field.fc-span8 { grid-column: span 8; }
.fdb-preview-device.fc-paper .kfc-field.fc-span9 { grid-column: span 9; }
.fdb-preview-device.fc-paper .kfc-field.fc-span2 { grid-column: span 2; }

/* The design canvas uses the same cells, while keeping drag and selection visible. */
.fdb-editor .fdb-workspace { padding: 24px; background: #e9edf2; }
.fdb-editor .fdb-canvas { max-width: 1040px; min-height: 620px; padding: 22px; border: 1px solid #c6d0db; border-radius: 2px; background: #fff; box-shadow: 0 4px 18px #172b4d0a; }
.fdb-editor .fdb-canvas.mobile { max-width: 390px; padding: 14px; border-width: 1px; border-radius: 2px; }
.fdb-canvas .fdb-sheet-head { padding: 12px 0 22px; border: 0; }
.fdb-canvas .fdb-sheet-head > p:not(.fc-paper-meta) { padding: 10px 12px; margin-top: 12px; background: #f6f8fb; color: #647284; }
.fdb-canvas .fdb-section { padding: 0; margin-bottom: 18px; background: #fff; border-top: 1px solid var(--sheet-line); border-left: 1px solid var(--sheet-line); }
.fdb-canvas .fdb-section > header { background: #e9eef3; border-right: 1px solid var(--sheet-line); border-bottom: 1px solid var(--sheet-line); min-height: 40px; padding: 5px 10px; }
.fdb-editor .fdb-section > header input { color: #334354; font-size: 13px; font-weight: 600; }
.fdb-canvas .fdb-dropzone { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0; min-height: 62px; }
.fdb-canvas .fdb-dropzone { border-right: 1px solid var(--sheet-line); border-bottom: 1px solid var(--sheet-line); }
.fdb-canvas .fdb-field-card { margin-top: -1px; margin-right: 0; margin-bottom: -1px; }
.fdb-canvas .fdb-field-card { border: 1px solid var(--sheet-line); border-left: 0; border-radius: 0; }
.fdb-canvas .fdb-field-card.selected { outline: 2px solid var(--sheet-focus); outline-offset: -2px; z-index: 1; }
.fdb-canvas .fdb-field-content { display: grid; grid-template-columns: 132px minmax(0, 1fr); padding: 0; min-height: 68px; }
.fdb-canvas .fdb-field-heading { margin: 0; padding: 12px 8px; justify-content: center; text-align: center; background: var(--sheet-label); border-right: 1px solid var(--sheet-line); }
.fdb-canvas .fdb-field-heading b { font-size: 13px; font-weight: 500; color: #334354; }
.fdb-canvas .fdb-field-sample { display: flex; align-items: center; padding: 12px 10px; font-size: 13px; color: #778595; }
.fdb-canvas .fdb-field-sample > div { flex: 1; min-width: 0; }
.fdb-canvas .fdb-card-actions { top: 2px; right: 2px; background: #fff; }
.fdb-canvas .selected .fdb-field-sample { padding-top: 30px; }
.fdb-canvas .fdb-drag { top: 50%; left: 0; transform: translateY(-50%); z-index: 2; color: #2163c6; }
.fdb-canvas .fdb-sample-options { flex-direction: row; flex-wrap: wrap; gap: 10px; }
.fdb-canvas .fdb-canvas-empty { grid-column: 1/-1; border-right: 1px solid var(--sheet-line); border-bottom: 1px solid var(--sheet-line); }
.fdb-canvas .fdb-canvas-end { padding: 18px 12px; min-height: 56px; color: #647284; }
.fdb-canvas [data-field-type="table"] .fdb-field-content,
.fdb-canvas [data-field-type="description"] .fdb-field-content { grid-template-columns: 1fr; }
.fdb-canvas :is([data-field-type="table"], [data-field-type="description"]) .fdb-field-heading { border-right: 0; border-bottom: 1px solid var(--sheet-line); justify-content: flex-start; }
.fdb-canvas.desktop .fdb-field-card:is([style*="span 2"], [style*="span 3"], [style*="span 4"]) .fdb-field-content { grid-template-columns: 1fr; }
.fdb-canvas.desktop .fdb-field-card:is([style*="span 2"], [style*="span 3"], [style*="span 4"]) .fdb-field-heading { border-right: 0; border-bottom: 1px solid var(--sheet-line); }
.fc-paper .fc-fld:is(.fc-span2,.fc-span3,.fc-span4),
.fc-paper .fdb-preview-field:is([style*="span 2"],[style*="span 3"],[style*="span 4"]) { grid-template-columns: 1fr; }
.fc-paper .fc-fld:is(.fc-span2,.fc-span3,.fc-span4) > .fc-label,
.fc-paper .fdb-preview-field:is([style*="span 2"],[style*="span 3"],[style*="span 4"]) > .fc-label { border-right: 0; border-bottom: 1px solid var(--sheet-line); }
.fdb-preview-device.mobile.fc-paper :is(.fc-fld,.fdb-preview-field) { grid-column: 1/-1 !important; grid-template-columns: 96px minmax(0,1fr); }
.fdb-preview-device.mobile.fc-paper :is(.fc-fld,.fdb-preview-field) > .fc-label { border-bottom: 0; border-right: 1px solid var(--sheet-line); }

@media (min-width: 681px) {
  .fc-paper .fc-span2 { grid-column: span 2; }
  .fc-paper .fc-span3 { grid-column: span 3; }
  .fc-paper .fc-span4 { grid-column: span 4; }
  .fc-paper .fc-span6 { grid-column: span 6; }
  .fc-paper .fc-span8 { grid-column: span 8; }
  .fc-paper .fc-span9 { grid-column: span 9; }
}

@media (max-width: 680px) {
  .fc-editor.fc-paper, .fdb-preview-device.fc-paper { padding: 18px 12px; }
  .fc-paper .fc-editor-head h2, .fc-paper.fdb-preview-device > h3 { font-size: 23px; }
  .fc-paper :is(.fc-fld,.fdb-preview-field) { grid-column: 1/-1 !important; grid-template-columns: 98px minmax(0,1fr); }
  .fc-paper :is(.fc-fld,.fdb-preview-field) > .fc-label { border-right: 1px solid var(--sheet-line); border-bottom: 0; padding: 10px 8px; font-size: 13px; }
  .fc-paper .fc-entry { padding: 8px; }
  .fc-paper .fc-entry :is(input,select,textarea) { font-size: 16px; }
  .fc-paper .fc-table-field { grid-template-columns: 1fr; }
  .fc-paper .fc-table-field > .fc-label { border-right: 0; border-bottom: 1px solid var(--sheet-line); }
  .fc-paper .fc-opt, .fc-paper .fdb-choice label { min-height: 44px; }
  .fc-paper .kfc-inline > label { min-width: 100%; }
  .fc-paper .fc-actions button { flex: 1; }
  .fc-paper .fc-detail th { width: 100px; }
  .fdb-editor .fdb-workspace { padding: 16px 10px; }
  .fdb-editor .fdb-canvas { padding: 16px 10px; }
  .fdb-canvas .fdb-field-card { grid-column: 1/-1 !important; }
  .fdb-canvas .fdb-field-content { grid-template-columns: 96px minmax(0,1fr); }
}
@media print {
  body:has(.fc-paper) { background: #fff; }
  body:has(.fc-paper) :is(.sidebar,.topbar,.fc-tabs,.skip-link,#page-tabs,[data-fc-leave-prompt]) { display: none !important; }
  body:has(.fc-paper) :is(#app,#mainContent,.view:has(.fc-paper),.form-center) { display: block; position: static; margin: 0; padding: 0; min-height: 0; height: auto; overflow: visible; background: #fff; }
  body:has(.fdb-preview-dialog[open]) .fdb-editor > :not(.fdb-preview-dialog) { display: none !important; }
  body:has(.fdb-preview-dialog[open]) :is(.fdb-editor,.fdb-preview-dialog,.fdb-live-preview,.fdb-preview-scroll) { position: static; display: block; width: 100%; height: auto; max-width: none; max-height: none; overflow: visible; padding: 0; border: 0; box-shadow: none; background: #fff; }
  .fdb-preview-dialog .fdb-live-preview > header { display: none; }
  .fc-paper { --sheet-line: #777; --sheet-label: #f3f3f3; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .fc-editor.fc-paper, .fdb-preview-device.fc-paper { max-width: none; width: 100%; border: 0; padding: 0; box-shadow: none; }
  .fc-paper :is(button,.fc-actions,.fc-sign-hint,[data-web-hint],.kfc-help,.kfc-status,.fc-col-op) { display: none !important; }
  .fc-paper .fc-editor-head > div { padding-top: 0; }
  .fc-paper .fc-entry :is(input,select,textarea) { border: 0; background: transparent; box-shadow: none; }
  .fc-paper :is(.fc-fld,.fdb-preview-field,.fc-sign-row,tr) { break-inside: avoid; }
  .fc-paper .fc-section h3 { break-after: avoid; }
  .fc-paper .fc-grid { grid-template-columns: repeat(12,minmax(0,1fr)); }
  .fc-paper .fc-span6 { grid-column: span 6 !important; }
  .fc-paper .fc-span12 { grid-column: span 12 !important; }
}