/* Monoscale shared modal system
   페이지/모듈 내부에 흩어진 모달 색상 규칙을 공통 토큰으로 묶기 위한 파일입니다.
   기존 마크업을 대량 변경하지 않아도 적용되도록 .app-modal 계열과 기존 모달 클래스 alias를 함께 관리합니다. */

:root {
  --ms-modal-backdrop: rgba(15, 23, 42, .42);
  --ms-modal-bg: var(--ms-panel, #ffffff);
  --ms-modal-bg-solid: #ffffff;
  --ms-modal-section-bg: #ffffff;
  --ms-modal-card-bg: #ffffff;
  --ms-modal-table-bg: #ffffff;
  --ms-modal-table-head-bg: #0b1117;
  --ms-modal-input-bg: #ffffff;
  --ms-modal-input-border: var(--ms-line, #deded8);
  --ms-modal-text: var(--ms-ink, #1f1f1d);
  --ms-modal-muted: var(--ms-muted, #74746f);
  --ms-modal-border: var(--ms-line, #deded8);
  --ms-modal-radius: 24px;
  --ms-modal-section-radius: 18px;
  --ms-modal-shadow: 0 28px 90px rgba(15, 23, 42, .18);
  --ms-modal-surface-alpha: 100%;
  --ms-modal-backdrop-alpha: 42%;
  --ms-modal-surface-bg: color-mix(in srgb, var(--ms-modal-bg-solid, var(--ms-modal-bg)) var(--ms-modal-surface-alpha, 100%), transparent);
  --ms-modal-section-surface-bg: color-mix(in srgb, var(--ms-modal-section-bg) var(--ms-modal-surface-alpha, 100%), transparent);
  --ms-modal-header-surface-bg: color-mix(in srgb, var(--ms-modal-header-bg, var(--ms-modal-bg)) var(--ms-modal-surface-alpha, 100%), transparent);
  --ms-modal-backdrop-surface: color-mix(in srgb, #000000 var(--ms-modal-backdrop-alpha, 42%), transparent);
}

.app-modal,
.modal-backdrop,
.modal-overlay {
  background: var(--ms-modal-backdrop-surface, var(--ms-modal-backdrop));
}

.app-modal__panel,
body[data-ms-theme] .modal {
  background: var(--ms-modal-surface-bg, var(--ms-modal-bg));
  color: var(--ms-modal-text);
  border-color: var(--ms-modal-border);
  border-radius: var(--ms-modal-radius);
}

.app-modal__header,
body[data-ms-theme] .modal-head,
body[data-ms-theme] .modal-header {
  border-color: var(--ms-modal-border);
  color: var(--ms-modal-text);
}

.app-modal__section,
.app-modal__card,
.app-modal__summary,
body[data-ms-theme] .modal-card,
body[data-ms-theme] .setting-block,
body[data-ms-theme] .quote-summary-box,
body[data-ms-theme] .quote-total-table,
body[data-ms-theme] .requirements-card,
body[data-ms-theme] .requirements-table-wrap,
body[data-ms-theme] .spec-card,
body[data-ms-theme] .partner-match-card,
body[data-ms-theme] .partner-draft-row,
body[data-ms-theme] .partner-assignment-list,
body[data-ms-theme] .partner-search-list,
body[data-ms-theme] .partner-search-row,
body[data-ms-theme] .partner-picker-card,
body[data-ms-theme] .partner-quote-item-box {
  background: var(--ms-modal-section-surface-bg, var(--ms-modal-section-bg));
  color: var(--ms-modal-text);
  border-color: var(--ms-modal-border);
  border-radius: var(--ms-modal-section-radius);
}

.app-modal__table,
body[data-ms-theme] .quote-table,
body[data-ms-theme] .requirements-table,
body[data-ms-theme] .modal table {
  background: var(--ms-modal-table-bg);
  border-color: var(--ms-modal-border);
}

.app-modal__table th,
body[data-ms-theme] .quote-table th,
body[data-ms-theme] .requirements-table th,
body[data-ms-theme] .spec-card-head,
body[data-ms-theme] .modal table th {
  background: var(--ms-modal-table-head-bg);
  color: #ffffff;
  border-color: var(--ms-modal-border);
}

.app-modal__table td,
body[data-ms-theme] .quote-table td,
body[data-ms-theme] .requirements-table td,
body[data-ms-theme] .spec-card-body,
body[data-ms-theme] .modal table td {
  color: var(--ms-modal-text);
  border-color: var(--ms-modal-border);
}

.app-modal__input,
.app-modal__textarea,
.app-modal__select,
body[data-ms-theme] .modal input,
body[data-ms-theme] .modal textarea,
body[data-ms-theme] .modal select,
body[data-ms-theme] .quote-note {
  background: var(--ms-modal-input-bg);
  color: var(--ms-modal-text);
  border-color: var(--ms-modal-input-border);
}

.app-modal__input::placeholder,
.app-modal__textarea::placeholder,
body[data-ms-theme] .modal input::placeholder,
body[data-ms-theme] .modal textarea::placeholder,
body[data-ms-theme] .quote-note::placeholder {
  color: color-mix(in srgb, var(--ms-modal-muted) 72%, transparent);
}

.app-modal__muted,
body[data-ms-theme] .modal .muted,
body[data-ms-theme] .modal small,
body[data-ms-theme] .modal label {
  color: var(--ms-modal-muted);
}

.app-modal__footer,
body[data-ms-theme] .modal-actions,
body[data-ms-theme] .modal-footer {
  border-color: var(--ms-modal-border);
}

/* Attachment / template editor modal aliases
   기타 첨부 모듈의 템플릿 편집창도 공통 모달 토큰을 사용합니다. */
body[data-ms-theme] .attachment-modal .modal,
body[data-ms-theme].attachment-module-page .template-panel {
  background: var(--ms-modal-surface-bg, var(--ms-modal-bg));
  color: var(--ms-modal-text);
  border: 1px solid var(--ms-modal-border);
  border-radius: var(--ms-modal-radius);
  box-shadow: var(--ms-modal-shadow);
}
body[data-ms-theme] .attachment-modal .modal-head,
body[data-ms-theme].attachment-module-page .template-head,
body[data-ms-theme].attachment-module-page .template-footer {
  background: var(--ms-modal-section-surface-bg, var(--ms-modal-section-bg));
  color: var(--ms-modal-text);
  border-color: var(--ms-modal-border);
}
body[data-ms-theme] .attachment-modal .modal-body,
body[data-ms-theme].attachment-module-page,
body[data-ms-theme].attachment-module-page .template-body {
  background: var(--ms-modal-surface-bg, var(--ms-modal-bg));
  color: var(--ms-modal-text);
}
body[data-ms-theme].attachment-module-page .card,
body[data-ms-theme].attachment-module-page .template-list-row,
body[data-ms-theme].attachment-module-page .item-row,
body[data-ms-theme].attachment-module-page .attachment-table-wrap,
body[data-ms-theme].attachment-module-page .attachment-uploaded-file,
body[data-ms-theme].attachment-module-page .toggle,
body[data-ms-theme].attachment-module-page .ms-public-toggle {
  background: var(--ms-modal-section-surface-bg, var(--ms-modal-section-bg));
  color: var(--ms-modal-text);
  border-color: var(--ms-modal-border);
}
body[data-ms-theme].attachment-module-page .attachment-table {
  background: var(--ms-modal-table-bg);
  color: var(--ms-modal-text);
  border-color: var(--ms-modal-border);
}
body[data-ms-theme].attachment-module-page .attachment-table th {
  background: var(--ms-modal-table-head-bg);
  color: var(--ms-modal-text);
  border-color: var(--ms-modal-border);
}
body[data-ms-theme].attachment-module-page .attachment-table td {
  background: var(--ms-modal-table-bg);
  color: var(--ms-modal-text);
  border-color: var(--ms-modal-border);
}
body[data-ms-theme].attachment-module-page input,
body[data-ms-theme].attachment-module-page textarea,
body[data-ms-theme].attachment-module-page select {
  background: var(--ms-modal-input-bg);
  color: var(--ms-modal-text);
  border-color: var(--ms-modal-input-border);
}
body[data-ms-theme].attachment-module-page .sub,
body[data-ms-theme].attachment-module-page .status,
body[data-ms-theme].attachment-module-page .empty,
body[data-ms-theme].attachment-module-page .item-meta,
body[data-ms-theme].attachment-module-page .attach-item-memo,
body[data-ms-theme].attachment-module-page .file-meta-compact,
body[data-ms-theme].attachment-module-page .attachment-footer-actions .ms-public-toggle-hint {
  color: var(--ms-modal-muted);
}