/* 산출물 대화상자(#dlg-exports)의 모양. 선택자는 모두 #dlg-exports 아래에 둔다. 색과 간격은 css/desk.css의 토큰을 쓴다. */
#dlg-exports { width: min(680px, calc(100vw - 32px)); }

/* 머리: 딜 이름과 모든 산출물에 실리는 표기(가상 예시, 검증 수준, 빌드 식별자) */
#dlg-exports .ex-top { padding-bottom: 12px; border-bottom: 1px solid var(--line2); }
#dlg-exports .ex-deal { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; font-size: 14px; color: var(--mut); }
#dlg-exports .ex-deal b { font-size: 15px; font-weight: 650; color: var(--txt); overflow-wrap: anywhere; }
#dlg-exports .ex-marks { display: flex; flex-wrap: wrap; gap: 2px 14px; margin-top: 4px; font-size: 12.5px; line-height: 1.6; color: var(--mut); }
#dlg-exports .ex-marks .ex-sample { color: var(--gold-txt); }

/* 만들지 않는 이유: 대화상자에 한 번만 적는다 */
#dlg-exports .ex-block { margin-top: 12px; padding: 10px 12px; border: 1px solid var(--warn); border-radius: 3px; background: var(--wash); }
#dlg-exports .ex-block-main { font-size: 13.5px; line-height: 1.6; color: var(--txt); }
#dlg-exports .ex-block-lines { margin: 6px 0 0; padding-left: 18px; list-style: disc; font-size: 13px; line-height: 1.6; color: var(--dim); }
#dlg-exports .ex-block .p-note { margin-top: 6px; }

/* 묶음 제목과 항목 줄 */
#dlg-exports .ex-h { margin: 16px 0 0; padding-bottom: 4px; font-size: 12.5px; font-weight: 600; color: var(--mut); border-bottom: 1px solid var(--line2); }
#dlg-exports .ex-list { margin: 0; padding: 0; list-style: none; }
#dlg-exports .ex-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; align-items: start; padding: 10px 0; border-bottom: 1px solid var(--line); }
#dlg-exports .ex-txt { min-width: 0; }
#dlg-exports .ex-txt h5 { margin: 0; line-height: 1.5; font-size: 14px; font-weight: 600; color: var(--txt); }
#dlg-exports .ex-txt > p { margin: 2px 0 0; font-size: 12.5px; line-height: 1.6; color: var(--mut); }
#dlg-exports .ex-act { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; padding-top: 1px; }
#dlg-exports .ex-act .btn { min-width: 76px; justify-content: center; }
#dlg-exports .ex-more { grid-column: 1 / -1; min-width: 0; }
#dlg-exports .ex-more > .p-note:first-child { margin-top: 2px; }
#dlg-exports .ex-caution { color: var(--dim); }

/* 파일 옵션(임차인명 가림, 모델 열기 링크) */
#dlg-exports .ex-opts { padding: 6px 0 8px; border-bottom: 1px solid var(--line); }
#dlg-exports .ex-opt + .ex-opt { margin-top: 4px; }
#dlg-exports .ex-opt .chk-lab { font-size: 13.5px; color: var(--txt); }
#dlg-exports .ex-opt .p-note { margin: 0 0 0 22px; }
#dlg-exports input[type="checkbox"] { width: 15px; height: 15px; margin: 0; accent-color: var(--gold); flex: none; }

/* 접는 구획(포함 시트, 시트 설계, 지시문 미리보기) */
#dlg-exports .ex-fold { margin-top: 2px; }
#dlg-exports .ex-fold > summary { display: inline-flex; align-items: center; min-height: var(--ctl-h); font-size: 12.5px; color: var(--dim); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line3); list-style: none; }
#dlg-exports .ex-fold > summary::-webkit-details-marker { display: none; }
#dlg-exports .ex-fold > summary::after { content: "펼치기"; margin-left: 8px; font-size: 12px; color: var(--mut); }
#dlg-exports .ex-fold[open] > summary::after { content: "접기"; }
#dlg-exports .ex-fold > summary:hover { color: var(--txt); }
#dlg-exports .ex-sheets { margin: 2px 0 4px; padding-left: 26px; list-style: decimal; font-size: 12.5px; line-height: 1.7; color: var(--mut); }
#dlg-exports .ex-sheets .num { color: var(--dim); }
#dlg-exports .ex-plan th, #dlg-exports .ex-plan td { vertical-align: top; }
#dlg-exports .ex-plan td.txt { white-space: nowrap; }
#dlg-exports .ex-pre { max-height: 260px; margin: 2px 0 4px; tab-size: 2; padding: 10px 12px; overflow: auto; border: 1px solid var(--line2); border-radius: 3px; background: var(--wash); font-family: var(--font-num); font-size: 12px; line-height: 1.6; color: var(--dim); white-space: pre-wrap; overflow-wrap: anywhere; }

/* 문서 설정 */
#dlg-exports .ex-doc { display: grid; gap: 8px; margin-top: 4px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 3px; }
#dlg-exports .ex-field { display: grid; gap: 3px; min-width: 0; margin: 0; padding: 0; border: 0; }
#dlg-exports .ex-lab { padding: 0; font-size: 12.5px; color: var(--dim); }
#dlg-exports .ex-inp { width: 100%; height: var(--ctl-h); padding: 0 8px; border: 1px solid var(--line2); border-radius: 3px; background: transparent; font-size: 13.5px; color: var(--txt); }
#dlg-exports .ex-inp::placeholder { color: var(--mut); }
#dlg-exports .ex-inp:hover { border-color: var(--line3); }
#dlg-exports .ex-inp[disabled] { color: var(--mut); }
#dlg-exports .ex-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
#dlg-exports .ex-checks .chk-lab { align-items: flex-start; padding: 6px 0; font-size: 12.5px; line-height: 1.45; color: var(--dim); }
#dlg-exports .ex-checks .chk-lab input { margin-top: 2px; }
#dlg-exports .ex-doc .seg-btn { justify-self: start; max-width: 100%; flex-wrap: wrap; }

/* 공유 QR과 전체 주소 */
#dlg-exports .ex-qr { margin-top: 8px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 3px; }
#dlg-exports .ex-qr-pic { display: inline-block; padding: 6px; background: #FFFFFF; border-radius: 2px; line-height: 0; }
#dlg-exports .ex-qr-pic svg { display: block; width: 176px; height: 176px; }
#dlg-exports .ex-qr .p-note { margin: 6px 0; }
#dlg-exports .ex-area { width: 100%; padding: 6px 8px; border: 1px solid var(--line2); border-radius: 3px; background: transparent; font-family: var(--font-num); font-size: 12px; line-height: 1.5; color: var(--dim); resize: vertical; overflow-wrap: anywhere; }

/* 알림 줄: 대화상자 아래에 붙여 둔다(스크롤해도 보인다) */
#dlg-exports .ex-foot { position: sticky; bottom: -20px; margin: 12px -24px -20px; padding: 10px 24px 14px; border-top: 1px solid var(--line2); background: var(--pop-bg); }
#dlg-exports .ex-status { font-size: 13px; line-height: 1.55; color: var(--txt); overflow-wrap: anywhere; }
#dlg-exports .ex-status.warn { color: var(--warn); }
#dlg-exports .ex-status:empty { display: none; }
#dlg-exports .ex-fallback { margin-top: 8px; }

@media (max-width: 560px) {
  #dlg-exports .ex-item { grid-template-columns: minmax(0, 1fr); }
  #dlg-exports .ex-act { justify-content: flex-start; }
  #dlg-exports .ex-act .btn, #dlg-exports .ex-doc .seg-btn button, #dlg-exports .ex-fold > summary { min-height: 40px; }
  #dlg-exports .ex-checks { grid-template-columns: minmax(0, 1fr); }
}