/* Shared form finish for internal screens. Keep print and exported reports unchanged. */
@media screen {
  body.qf-ui {
    --form-ink: #262624;
    --form-muted: #5f5d58;
    --form-line: #d8d5ce;
    --form-line-hover: #c5d3db;
    --form-focus: #3f6c86;
    --form-focus-ring: #e7e5e0;
    --form-soft: #f7f7f5;
  }

  .qf-ui label {
    color: var(--form-ink);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: 0;
  }
  .qf-ui label:has(> :is(input[type="checkbox"], input[type="radio"])) {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
    cursor: pointer;
  }
  .qf-ui label > :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea) {
    display: block;
    margin-top: 6px;
  }
  .qf-ui :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select, textarea) {
    max-width: 100%;
    min-height: 42px;
    padding: 9px 12px;
    border: 1px solid var(--form-line);
    border-radius: 10px;
    background-color: #fff;
    color: var(--form-ink);
    font-size: 14px;
    line-height: 1.45;
    box-shadow: 0 1px 2px #26262406;
    transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
  }
  .qf-ui textarea { min-height: 84px; resize: vertical; line-height: 1.6; }
  /* Safari draws a date's own fields taller than a line of text: a date box stood 44 beside text boxes of 42 (2026-10-17, 合同's
     签订日期). It is held to the boxes' height, its padding top and bottom taken away; on a phone the larger least height holds. */
  .qf-ui :is(input[type="date"], input[type="month"], input[type="time"], input[type="datetime-local"]) { height: 42px; padding-top: 0; padding-bottom: 0; }
  .qf-ui :is(input, textarea)::placeholder { color: var(--qf-ink-3); opacity: 1; }
  .qf-ui :is(input, select, textarea):not(:disabled):hover { border-color: var(--form-line-hover); }
  .qf-ui :is(input, select, textarea):focus-visible {
    border-color: var(--form-focus);
    outline: 3px solid var(--form-focus-ring);
    outline-offset: 1px;
    box-shadow: none;
  }
  .qf-ui :is(input, select, textarea)[aria-invalid="true"] { border-color: #ad3f3b; }
  .qf-ui :is(input, select, textarea):disabled,
  .qf-ui :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), textarea):read-only {
    background: #f3f2ef;
    color: #5f5d58;
    box-shadow: none;
  }
  .qf-ui :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--form-focus); }
  .qf-ui input[type="file"] {
    max-width: 100%;
    padding: 6px;
    border: 1px solid var(--form-line);
    border-radius: 10px;
    background: var(--form-soft);
    color: var(--form-muted);
    font-size: 13px;
    line-height: 1.5;
  }
  .qf-ui input[type="file"]::file-selector-button {
    min-height: 32px;
    margin-right: 10px;
    padding: 5px 11px;
    border: 1px solid var(--form-line);
    border-radius: 7px;
    background: #fff;
    color: var(--form-ink);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
  }
  .qf-ui .file-clear:disabled { display: none !important; }

  .qf-ui button,
  .qf-ui a.iw-button {
    min-height: 40px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.45;
    transition: background-color .15s ease, border-color .15s ease, transform .12s ease;
  }
  .qf-ui button:not(:disabled):active { transform: scale(.98); }
  .qf-ui button.primary:not(:disabled),
  .qf-ui button.iw-primary:not(:disabled) {
    background: #3f6c86;
    border-color: #3f6c86;
    color: #fff;
    font-weight: 600;
  }
  .qf-ui button.primary:not(:disabled):hover,
  .qf-ui button.iw-primary:not(:disabled):hover {
    background: #3f6c86;
    border-color: #3f6c86;
  }

  .qf-ui dialog {
    max-height: min(88dvh, 900px);
    border: 1px solid #d8d5ce;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 20px 60px #2626241d;
  }
  .qf-ui dialog::backdrop { background: #26262466; }
  .qf-ui dialog form > h2 {
    margin: 0 0 8px;
    font-size: 21px;
    font-weight: 650;
    line-height: 1.3;
    letter-spacing: -.02em;
  }
  .qf-ui dialog form > h2 + p { color: var(--form-muted); font-size: 13px; line-height: 1.55; }
  .qf-ui dialog form > .actions,
  .qf-ui dialog form > .iw-actions {
    position: sticky;
    bottom: -24px;
    z-index: 2;
    justify-content: flex-end;
    margin-top: 18px;
    padding: 14px 0 0;
    border-top: 1px solid #e7e5e0;
    background: #fff;
  }
  .qf-ui dialog [role="alert"]:not(:empty) {
    margin: 10px 0 0;
    padding: 9px 12px;
    border: 1px solid #f8eceb;
    border-radius: 9px;
    background: #f8eceb;
    color: #ad3f3b;
    font-size: 13px;
    line-height: 1.5;
  }
  .qf-ui .qf-form-summary:not([hidden]):not(:empty) {
    margin: 12px 0 16px;
    padding: 10px 12px;
    border: 1px solid #f8eceb;
    border-radius: 9px;
    background: #f8eceb;
    color: #ad3f3b;
    font-size: 13px;
    line-height: 1.5;
  }
  .qf-ui .qf-field-error { display: block; margin-top: 5px; color: #ad3f3b; font-size: 12px; font-weight: 500; line-height: 1.45; }
  .qf-ui .qf-action-summary { margin: 12px 0 16px; padding: 12px 14px; border: 1px solid #e7e5e0; border-radius: 10px; background: #f7f7f5; color: #5f5d58; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
  .qf-ui .qf-action-summary strong { color: #262624; }
  .qf-ui .form-grid { gap: 0 16px; }
  .qf-ui .node-input {
    padding: 16px;
    border: 1px solid #e7e5e0;
    border-radius: 12px;
    background: var(--form-soft);
  }
  .qf-ui .node-input > label { font-weight: 650; }
  .qf-ui fieldset {
    min-width: 0;
    border: 1px solid #e7e5e0;
    border-radius: 12px;
  }
  .qf-ui legend { padding: 0 7px; font-weight: 650; color: var(--form-ink); }
  .qf-ui .scroll :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select) {
    min-height: 36px;
    padding: 6px 9px;
    font-size: 13px;
  }
  .qf-ui .studio-search input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]) {
    min-height: 32px;
    padding: 4px 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }
  .qf-ui .studio-search button { min-height: 32px; font-size: inherit; }
}

@media screen and (max-width: 700px) {
  .qf-ui :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea) {
    min-height: 44px;
    font-size: 16px;
  }
  .qf-ui button, .qf-ui a.iw-button { min-height: 44px; }
  .qf-ui dialog { width: calc(100vw - 20px); max-height: 92dvh; padding: 20px 16px; }
  .qf-ui dialog form > .actions,
  .qf-ui dialog form > .iw-actions { bottom: -20px; padding-bottom: 2px; }
  .qf-ui .form-grid { grid-template-columns: minmax(0, 1fr); }
  .qf-ui .scroll :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select) {
    min-height: 44px;
    font-size: 16px;
  }
  .qf-ui .studio-search input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]) { min-height: 32px; font-size: 16px; }
  .qf-ui .studio-search button { min-height: 32px; }
}
@media screen and (max-width: 440px) {
  .qf-ui .options { display: grid; grid-template-columns: minmax(0, 1fr); }
  .qf-ui .options :is(select, input[type="number"]) { width: 100%; }
}

@media screen and (prefers-reduced-motion: reduce) {
  .qf-ui :is(button, input, select, textarea) { transition: none; }
  .qf-ui button:not(:disabled):active { transform: none; }
}
@media screen and (prefers-contrast: more) {
  body.qf-ui { --form-ink: #262624; --form-muted: #5f5d58; --form-line: #3f6c86; --form-line-hover: #325a71; }
  .qf-ui dialog, .qf-ui fieldset, .qf-ui .node-input { border-color: var(--form-line); }
}

/* On phones a field is as tall as a button. The selector repeats the screen rule's, which the phone rule above does not outrank. */
@media screen and (max-width: 700px) {
  .qf-ui :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]), select) {
    min-height: 44px;
  }
}
