/* 팝업 모달 공통 디자인. 문서·지도·목록의 폭과 내부 레이아웃은 각 기능이 소유한다. */
body :is(.modal--dialog, .tcg-correction-overlay, .tcg-popover-overlay,
    .dispatch-workload-overlap-backdrop, .settlement-action-modal, .driver-modal,
    .h2go-choice-overlay, .h2go-install-overlay, #h2go-pcr-overlay, #h2go-ucr-overlay, #h2goStaleReleaseOverlay) {
    background: rgba(5, 10, 18, .62);
    backdrop-filter: blur(5px);
}
body :is(.modal-content, .driver-modal-content, .tcg-correction-dialog, .tcg-popover,
    .dispatch-workload-overlap-dialog, .settlement-action-dialog, .h2go-install-card,
    .h2go-choice-dialog, .h2go-release-dialog, .mon-detail-panel, #h2go-pcr-modal, #h2go-ucr-modal) {
    --mod-block-bg: rgba(255, 255, 255, .028);
    --mod-field-bg: rgba(255, 255, 255, .04);
    --mod-btn2-bg: rgba(255, 255, 255, .05);
    --mod-btn2-bd: rgba(255, 255, 255, .2);
    --mod-btn1-bd: color-mix(in srgb, var(--h2-blue, #3b82f6) 55%, transparent);
    --mod-btn1-bg: color-mix(in srgb, var(--h2-blue, #3b82f6) 16%, transparent);
    --mod-btn1-fg: color-mix(in srgb, var(--h2-blue, #3b82f6) 64%, #fff);
    --mod-danger: var(--status-danger, #ff8585);
    --mod-danger-bg: rgba(239, 68, 68, .1);
    --mod-danger-bd: rgba(239, 68, 68, .34);
    box-sizing: border-box;
    border: 1px solid color-mix(in srgb, var(--h2-blue, #3b82f6) 24%, var(--border-color, #30343d));
    border-radius: 12px;
    background: var(--bg-card, #18181b);
    color: var(--text-primary, #f8fafc);
    box-shadow: 0 16px 48px rgba(0, 0, 0, .28);
    font-family: var(--font-sans, 'Pretendard', sans-serif);
    font-size: .78125rem;
    line-height: 1.5;
    color-scheme: dark;
}
body.theme-light :is(.modal-content, .driver-modal-content, .tcg-correction-dialog, .tcg-popover,
    .dispatch-workload-overlap-dialog, .settlement-action-dialog, .h2go-install-card,
    .h2go-choice-dialog, .h2go-release-dialog, .mon-detail-panel, #h2go-pcr-modal, #h2go-ucr-modal) {
    --mod-block-bg: rgba(15, 23, 42, .028);
    --mod-field-bg: rgba(15, 23, 42, .04);
    --mod-btn2-bg: rgba(15, 23, 42, .04);
    --mod-btn2-bd: rgba(15, 23, 42, .18);
    --mod-btn1-bg: color-mix(in srgb, var(--h2-blue, #3b82f6) 10%, transparent);
    --mod-btn1-fg: var(--h2-blue-dark, #2563eb);
    --mod-danger: #b42318;
    --mod-danger-bg: rgba(180, 35, 24, .08);
    --mod-danger-bd: rgba(180, 35, 24, .34);
    --status-warn: #92400e;
    --status-warn-bg: rgba(245, 158, 11, .1);
    --status-warn-bd: rgba(180, 83, 9, .3);
    color-scheme: light;
}
/* 한 번의 선택·입력용 패널. 문서 뷰어와 전체 화면 관제는 내부 캔버스를 보존한다. */
body :is(.modal-content:not(.qty-confirm-modal-content), .driver-modal-content--profile,
    .tcg-correction-dialog, .tcg-popover, .dispatch-workload-overlap-dialog,
    .settlement-action-dialog, .h2go-install-card, .h2go-choice-dialog,
    #h2go-pcr-modal, #h2go-ucr-modal) {
    padding: 18px 20px;
    max-height: calc(100dvh - 32px);
    overflow-y: auto;
    overscroll-behavior: contain;
}
body :is(.modal-content, .driver-modal-content, .tcg-correction-dialog, .tcg-popover,
    .dispatch-workload-overlap-dialog, .settlement-action-dialog, .h2go-install-card,
    .h2go-choice-dialog, .h2go-release-dialog, .mon-detail-panel, #h2go-pcr-modal, #h2go-ucr-modal)
    :is(h2, h3, .tcg-po-title, .h2go-dialog-title) {
    color: var(--text-primary, #f8fafc);
    font-size: .9375rem;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -.01em;
}
body :is(.modal-content, .tcg-correction-dialog, .settlement-action-dialog, .h2go-choice-dialog,
    #h2go-pcr-modal, #h2go-ucr-modal) > :is(h2, h3, .h2go-dialog-title) {
    margin: 0 32px 12px 0;
    padding: 0;
    border: 0;
}
body :is(.modal-content, .driver-modal-content--profile, .driver-modal-content--certs, .tcg-correction-dialog,
    .dispatch-workload-overlap-dialog, .settlement-action-dialog, #h2go-pcr-modal, #h2go-ucr-modal)
    :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not([type="file"]), select, textarea) {
    box-sizing: border-box;
    min-width: 0;
    min-height: var(--mod-control-height, 36px);
    padding: 8px 10px;
    border: 1px solid var(--border-color, #30343d);
    border-radius: 6px;
    background: var(--bg-card, #18181b);
    color: var(--text-primary, #f8fafc);
    font: 600 .78125rem/1.45 var(--font-sans, 'Pretendard', sans-serif);
    font-variant-numeric: tabular-nums;
}
body :is(.modal-content, .driver-modal-content--profile, .driver-modal-content--certs, .tcg-correction-dialog,
    .dispatch-workload-overlap-dialog, .settlement-action-dialog, #h2go-pcr-modal, #h2go-ucr-modal)
    :is(input, select, textarea):is([readonly], :disabled) {
    background: var(--mod-field-bg);
    color: var(--text-muted, #94a3b8);
    cursor: default;
}
body :is(.modal-content, .driver-modal-content, .tcg-correction-dialog,
    .dispatch-workload-overlap-dialog, .settlement-action-dialog, #h2go-pcr-modal, #h2go-ucr-modal) textarea {
    --mod-control-height: 54px;
}
body .driver-modal-content {
    --mod-control-height: 44px;
    --mod-button-height: 44px;
}
body :is(.modal-content, .driver-modal-content--profile, .driver-modal-content--certs, .tcg-correction-dialog,
    .dispatch-workload-overlap-dialog, .settlement-action-dialog, #h2go-pcr-modal, #h2go-ucr-modal)
    :is(input, select, textarea):focus-visible {
    outline: none;
    border-color: var(--h2-blue, #3b82f6);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--h2-blue, #3b82f6) 18%, transparent);
}
body :is(.modal-content, .driver-modal-content--profile, .driver-modal-content--certs, .tcg-correction-dialog,
    .settlement-action-dialog, #h2go-pcr-modal, #h2go-ucr-modal) label {
    color: var(--text-muted, #94a3b8);
    font-size: .8125rem;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 0;
}
body :is(.modal-content, .driver-modal-content, .tcg-correction-dialog, .tcg-popover,
    .dispatch-workload-overlap-dialog, .settlement-action-dialog, .h2go-install-card,
    .h2go-choice-dialog, .h2go-release-dialog, .mon-detail-panel, #h2go-pcr-modal, #h2go-ucr-modal)
    :is(.btn, .h2go-install-action, .h2go-pcr-btn, .h2go-ucr-btn, .tcg-po-close, .tcg-po-pick,
        .driver-qty-save, .driver-qty-document, .qty-confirm-document-link, .qty-confirm-save, .qty-confirm-pdf) {
    box-sizing: border-box;
    width: auto;
    min-height: var(--mod-button-height, 34px);
    height: auto;
    padding: 7px 14px;
    border: 1px solid var(--mod-btn2-bd);
    border-radius: 6px;
    background: var(--mod-btn2-bg);
    color: var(--text-primary, #f8fafc);
    box-shadow: none;
    transform: none;
    font: 700 .8125rem/1.4 var(--font-sans, 'Pretendard', sans-serif);
    cursor: pointer;
}
body :is(.modal-content, .driver-modal-content, .tcg-correction-dialog, .tcg-popover,
    .dispatch-workload-overlap-dialog, .settlement-action-dialog, .h2go-install-card,
    .h2go-choice-dialog, .h2go-release-dialog, #h2go-pcr-modal, #h2go-ucr-modal)
    :is(.btn-primary, .h2go-install-action--primary, .h2go-pcr-btn-primary, .h2go-ucr-btn-primary, .driver-qty-save, .qty-confirm-save, .qty-confirm-pdf) {
    border-color: var(--mod-btn1-bd);
    background: var(--mod-btn1-bg);
    color: var(--mod-btn1-fg);
}
body :is(.modal-content, .driver-modal-content, .tcg-correction-dialog, .settlement-action-dialog,
    .h2go-choice-dialog, #h2go-pcr-modal, #h2go-ucr-modal) .btn-danger {
    border-color: var(--mod-danger-bd);
    background: var(--mod-danger-bg);
    color: var(--mod-danger);
}
body :is(.modal-content, .driver-modal-content, .tcg-correction-dialog, .tcg-popover,
    .dispatch-workload-overlap-dialog, .settlement-action-dialog, .h2go-install-card,
    .h2go-choice-dialog, #h2go-pcr-modal, #h2go-ucr-modal) button:disabled {
    opacity: .5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}
body :is(.modal-content, .driver-modal-content, .tcg-correction-dialog, .tcg-popover,
    .dispatch-workload-overlap-dialog, .settlement-action-dialog, .h2go-install-card,
    .h2go-choice-dialog, .h2go-release-dialog, #h2go-pcr-modal, #h2go-ucr-modal) button:focus-visible {
    outline: 2px solid var(--h2-blue, #3b82f6);
    outline-offset: 2px;
}
body :is(.modal-content, .driver-modal-content, .dispatch-workload-overlap-dialog)
    :is(.modal-close, .driver-modal-close, .driver-qty-close, .qty-confirm-close, .dispatch-workload-overlap-close) {
    display: inline-grid;
    place-items: center;
    width: var(--mod-button-height, 28px);
    height: var(--mod-button-height, 28px);
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--text-muted, #94a3b8);
    font: 400 1.25rem/1 var(--font-sans, sans-serif);
}
.h2go-dialog-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.h2go-dialog-message { white-space: pre-line; margin-bottom: 12px; }
.h2go-choice-overlay { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: 16px; background: rgba(5, 10, 18, .62); }
.h2go-choice-dialog { width: min(400px, 100%); }
.h2go-release-dialog { width: min(420px, 100%); padding: 18px 20px; }
.h2go-release-dialog .h2go-dialog-title { margin-bottom: 12px; }
.h2go-release-dialog .btn { display: block; margin-left: auto; }
.h2go-install-description, .h2go-install-steps { font-size: .78125rem; color: var(--text-secondary, #94a3b8); }
.h2go-install-steps { border-radius: 6px; background: var(--mod-block-bg); }
#h2go-pcr-modal, #h2go-ucr-modal { display: flex; flex-direction: column; gap: 12px; width: min(420px, 92vw); }
#h2go-pcr-overlay, #h2go-ucr-overlay { position: fixed; inset: 0; z-index: 10020; display: grid; place-items: center; padding: 16px; background: rgba(5, 10, 18, .62); }
#h2go-pcr-modal input, #h2go-ucr-modal input { width: 100%; }
.h2go-pcr-actions, .h2go-ucr-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.h2go-pcr-warning, .h2go-ucr-warning { padding: 10px; border: 1px solid var(--status-warn-bd, #8c671d); border-radius: 6px; background: var(--status-warn-bg, #332b1b); color: var(--status-warn, #fbbf24); }
.h2go-pcr-error, .h2go-ucr-error { margin: 0; color: var(--mod-danger); }
.h2go-pcr-loading { color: var(--text-muted, #94a3b8); }
.leg-plan-address { display: flex; gap: 8px; align-items: center; margin-top: 8px; }
.leg-plan-address input { flex: 1; width: 0; }
.leg-plan-address .btn { flex: 0 0 auto; }
.leg-plan-eta { padding: 10px 12px; border: 1px solid var(--border-color); border-radius: 6px; background: var(--mod-block-bg); }
.leg-plan-eta p { margin: 4px 0 0; font-variant-numeric: tabular-nums; }
@media (max-width: 768px), (pointer: coarse) {
    body :is(.modal-content, .driver-modal-content, .tcg-correction-dialog, .tcg-popover,
        .dispatch-workload-overlap-dialog, .settlement-action-dialog, .h2go-install-card,
        .h2go-choice-dialog, #h2go-pcr-modal, #h2go-ucr-modal) {
        --mod-control-height: 44px;
        --mod-button-height: 44px;
    }
}

/* 편도운송 모달은 주소·시간을 나란히 읽을 수 있는 폭을 사용한다. T/T·기사 2칸 줄은 기본
   auto-fit 이 접고, 출발·도착일시·사유 3칸 줄만 폭을 나눈다. */
#legPlanOverlay .modal-content { max-width: 640px; }
#legPlanOverlay .leg-plan-section { gap: 12px; }
#legPlanOverlay .leg-plan-section > .form-group { margin: 0; }
#legPlanOverlay .leg-plan-section + .leg-plan-section { margin-top: 20px; padding-top: 20px; border-top: 1px solid color-mix(in srgb, var(--border-color) 60%, transparent); }
#legPlanOverlay [data-eta]:empty { display: none; }
#legPlanOverlay .modal-form-row:has([name="departAt"]) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body .modal-content::before { display: none; }
body .dispatch-workload-overlap-choice { border-radius: 6px; background: var(--mod-btn2-bg); }
body .dispatch-workload-overlap-choice.is-change { background: var(--mod-btn1-bg); color: var(--mod-btn1-fg); }
body .mon-detail-panel .mon-detail-close { border-radius: 6px; width: 28px; height: 28px; padding: 0; background: transparent; color: var(--text-muted); }
@media (max-width: 600px) {
    #legPlanOverlay .modal-form-row:has([name="departAt"]) { grid-template-columns: 1fr; }
}
