/*
 * 보험사 PRM(업무포털) 스타일 테마.
 * site.css 다음에 로드해 공통 요소의 글꼴·여백·색상만 덮어쓴다. 화면 구조와 입력 폼 배치는 변경하지 않는다.
 * 한 화면에 많은 자료를 보이도록 작은 글꼴, 좁은 행 간격, 격자형 표, 색상 탭을 사용한다.
 */
:root {
    --prm-font: "Malgun Gothic", "맑은 고딕", "Apple SD Gothic Neo", "Noto Sans KR", Dotum, sans-serif;
    --prm-text: #1f2933;
    --prm-muted: #5b6776;
    --prm-bg: #e8ecf1;
    --prm-panel: #fff;
    --prm-line: #a9b5c3;
    --prm-line-soft: #cfd7e1;
    --prm-label-bg: #edf1f6;
    --prm-head-top: #f3f6f9;
    --prm-head-bottom: #d9e0ea;
    --prm-brand: #1f4680;
    --prm-brand-light: #2f5d9d;
    --prm-brand-dark: #142f58;
    --prm-accent: #e2620e;
    --prm-row-alt: #f5f7fa;
    --prm-row-hover: #fff3c4;
    --prm-focus: #ffd45c;
    font-family: var(--prm-font);
    font-size: 14px;
    color: var(--prm-text);
    background: var(--prm-bg);
}

body {
    font-size: 12px;
    line-height: 1.4;
    letter-spacing: -.01em;
    color: var(--prm-text);
    background: var(--prm-bg);
}

a { color: var(--prm-brand-light); }

/* ---------- 헤더(상단 메뉴) ---------- */
.app-header {
    background: linear-gradient(180deg, var(--prm-brand-light) 0%, var(--prm-brand) 55%, var(--prm-brand-dark) 100%);
    border-bottom: 3px solid var(--prm-accent);
}

.brand { font-size: 15px; letter-spacing: -.03em; }
.menu-group-label { font-size: 11px; }
.app-menu a, .nav-user { font-size: 13px; font-weight: 700; }
.link-button { font-size: 12px; }

.app-menu a.is-current {
    background: var(--prm-accent);
    color: #fff;
}

.app-header-light {
    background: linear-gradient(180deg, #fff 0%, #f1f4f8 100%);
    border-bottom: 3px solid var(--prm-brand);
}

.app-header-light .app-menu a.is-current { background: var(--prm-brand); color: #fff; }

@media (min-width: 768px) {
    .app-header { min-height: 38px; padding-block: 0; }
    .app-menu a, .nav-user, .link-button { padding: 0 11px; line-height: 38px; border-radius: 0; }
    .menu-group-admin { padding-left: 4px; }
}

@media (min-width: 1200px) {
    /* 업무포털처럼 메뉴를 로고 오른쪽에 붙여 왼쪽 정렬한다. */
    .app-menu { position: static; flex: 1; transform: none; }
}

/* ---------- 화면 탭 줄(현재 화면 표시) ---------- */
.screen-tabs {
    display: flex;
    align-items: flex-end;
    gap: 2px;
    padding: 4px 10px 0;
    background: linear-gradient(180deg, #f4f6f9, #dfe5ec);
    border-bottom: 2px solid var(--prm-brand);
}

.screen-tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 260px;
    height: 24px;
    padding: 0 12px;
    overflow: hidden;
    border: 1px solid #a3b0c0;
    border-bottom: 0;
    border-radius: 3px 3px 0 0;
    background: linear-gradient(180deg, #fff, #e4e9f0);
    color: #33475f;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.screen-tab.home { padding: 0 9px; color: var(--prm-brand); }
.screen-tab.active { border-color: var(--prm-brand-dark); background: linear-gradient(180deg, var(--prm-brand-light), var(--prm-brand)); color: #fff; }

/* ---------- 본문 영역 ---------- */
.app-shell > main { max-width: none; }
.page { padding: 8px 12px 12px; }

.app-shell main h1:not(:is(.report-compose-surface, .rich-output, .rich-surface) *) {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 4px;
    font-size: 16px;
    letter-spacing: -.03em;
    color: #1b2b40;
}

.app-shell main h1:not(:is(.report-compose-surface, .rich-output, .rich-surface) *)::before {
    content: "";
    flex: none;
    width: 7px;
    height: 7px;
    border: 3px solid var(--prm-accent);
    border-radius: 50%;
}

.app-shell main h2:not(:is(.report-compose-surface, .rich-output, .rich-surface) *),
.app-shell .form-section .panel-header h2,
.app-shell .dialog-heading h2 {
    font-size: 13px;
    letter-spacing: -.02em;
    color: #1b2b40;
}

.app-shell main h2:not(:is(.report-compose-surface, .rich-output, .rich-surface, .dialog-heading) *)::before {
    content: "";
    display: inline-block;
    width: 5px;
    height: 5px;
    margin: 0 6px 0 1px;
    vertical-align: 3px;
    background: var(--prm-accent);
}

.app-shell main h3:not(:is(.report-compose-surface, .rich-output, .rich-surface) *) { font-size: 12px; }

.eyebrow { margin-bottom: 2px; color: var(--prm-brand-light); font-size: 11px; }
.page-title p, .case-page-heading p:not(.eyebrow) { font-size: 12px; }

/* 패널·카드: 둥근 모서리와 그림자를 없애고 얇은 테두리로 구분한다. */
section, .detail-grid, .work-panel, .metric-card, .form-section, .search-grid, .form-grid,
.table-wrap, .stack-item, .access-denied-panel {
    border: 1px solid var(--prm-line-soft);
    border-radius: 0;
    box-shadow: none;
}

.work-panel, .form-section, section, .detail-grid { padding: 8px 10px; }
.panel-header { margin-bottom: 6px; }
.form-section .panel-header { padding-bottom: 5px; border-bottom: 1px solid var(--prm-line-soft); }
.section-kicker { width: 20px; height: 20px; border-radius: 2px; font-size: 10px; }

.metric-grid { gap: 6px; margin-bottom: 8px; }
.metric-card { gap: 2px; padding: 6px 10px; border-top: 2px solid var(--prm-brand-light); }
.metric-card span { font-size: 11px; }
.metric-card strong { font-size: 18px; }

/* 조회 조건 영역: 업무포털의 조회 박스처럼 강조 테두리를 둔다. */
.search-grid {
    gap: 4px 8px;
    margin: 6px 0;
    padding: 6px 8px;
    border: 1px solid #9fb0c6;
    border-top: 2px solid var(--prm-brand);
    background: #f7f9fc;
}

.form-grid { gap: 6px 10px; margin: 6px 0; padding: 8px 10px; }

/* ---------- 입력 요소 ---------- */
label { gap: 2px; color: #34465c; font-size: 12px; }

input, select, textarea {
    padding: 2px 6px;
    border: 1px solid #a7b3c2;
    border-radius: 2px;
    background-color: #fff;
    font-size: 12px;
    line-height: 18px;
}

input:not([type=checkbox], [type=radio], [type=file], [type=range], [type=color]), select { height: 24px; }
input[type=file] { padding: 1px 4px; }

input:focus, select:focus, textarea:focus {
    border-color: var(--prm-brand-light);
    outline: 0;
    box-shadow: 0 0 0 2px var(--prm-focus);
}

input[readonly], input:disabled, select:disabled, textarea[readonly], textarea:disabled { background-color: #eef1f5; color: #4a5866; }

.date-picker-input { padding-right: 22px; background-position: right 5px center; background-size: 14px; }

.field-error, .label-help { font-size: 11px; }

/* ---------- 버튼 ---------- */
button, .button {
    padding: 3px 10px;
    border-radius: 2px;
    font-size: 12px;
    line-height: 16px;
    background-image: linear-gradient(180deg, rgba(255, 255, 255, .18), rgba(0, 0, 0, .1));
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .25);
}

.button.secondary { background: linear-gradient(180deg, #7f8b99, #5c6775); }
button.danger:not(.text-button), .button.danger { background: linear-gradient(180deg, #d24b3f, #a3271d); }
.button.outline { border: 1px solid #93a3b6; background: linear-gradient(180deg, #fff, #e9edf2); color: var(--prm-brand); box-shadow: none; }
.button.compact { padding: 2px 8px; font-size: 11px; }
.text-button { box-shadow: none; font-size: 12px; }

/* ---------- 표(목록) ---------- */
table { font-size: 12px; }

th, td { padding: 3px 6px; line-height: 1.35; }

:where(.table-wrap, .work-panel, .form-section, section, .settlement-table-panel, .statistics-table-panel) table:not(:is(.report-compose-surface, .rich-output, .rich-surface) *) {
    border-collapse: collapse;
    border: 1px solid var(--prm-line);
}

:where(.table-wrap, .work-panel, .form-section, section, .settlement-table-panel, .statistics-table-panel) :is(th, td):not(:is(.report-compose-surface, .rich-output, .rich-surface) *) {
    border: 1px solid var(--prm-line-soft);
}

:where(.table-wrap, .work-panel, .form-section, section, .settlement-table-panel, .statistics-table-panel) thead th:not(:is(.report-compose-surface, .rich-output, .rich-surface) *) {
    border-color: var(--prm-line);
    background: linear-gradient(180deg, var(--prm-head-top), var(--prm-head-bottom));
    color: #26384e;
    font-weight: 700;
    text-align: center;
}

:where(.table-wrap, .work-panel, .form-section, section, .settlement-table-panel, .statistics-table-panel) tbody th:not(:is(.report-compose-surface, .rich-output, .rich-surface) *) {
    background: var(--prm-label-bg);
    color: #34465c;
}

/* 목록 본문 셀은 기본 중앙정렬, 숫자형(.numeric — site.js TableAlign 이 자동 부여) 셀은 우측정렬한다. */
:where(.table-wrap, .work-panel, .form-section, section, .settlement-table-panel, .statistics-table-panel) table:has(> thead):not(.excel-table, :is(.report-compose-surface, .rich-output, .rich-surface) *) > tbody > tr > td {
    text-align: center;
}

:where(.table-wrap, .work-panel, .form-section, section, .settlement-table-panel, .statistics-table-panel) table:has(> thead):not(.excel-table, :is(.report-compose-surface, .rich-output, .rich-surface) *) > tbody > tr > td.numeric {
    text-align: right;
}

.table-wrap tbody tr:nth-child(even) > td { background-color: var(--prm-row-alt); }
.table-wrap tbody tr:hover > td { background-color: var(--prm-row-hover); }
.empty-table { padding: 14px; }

/* ---------- 정의 목록(상세 화면): 라벨 칸을 회색 격자로 표시한다. ---------- */
.definition-list { border-top: 1px solid var(--prm-line-soft); border-left: 1px solid var(--prm-line-soft); }
.definition-list > div,
.definition-list > div:nth-last-child(-n+2) {
    gap: 0;
    padding: 0;
    border-right: 1px solid var(--prm-line-soft);
    border-bottom: 1px solid var(--prm-line-soft);
}
.definition-list dt { display: flex; align-items: center; padding: 3px 6px; background: var(--prm-label-bg); color: #34465c; font-size: 12px; font-weight: 700; }
.definition-list dd { padding: 3px 6px; font-size: 12px; font-weight: 600; }

/* ---------- 상태 표시·태그 ---------- */
.status-pill, .tag, .tag-row span, .billing-count, .investigator-chip, .policy-section-label, .policy-result-count, .statistics-period, .policy-heading-tags span {
    padding: 1px 6px;
    border-radius: 2px;
    font-size: 11px;
}

.alert { padding: 4px 8px; border-radius: 0; border: 1px solid currentColor; font-size: 12px; }
.empty-note { padding: 8px; border-radius: 0; font-size: 12px; }
.stack-list { gap: 4px; }
.stack-item { padding: 5px 8px; }

/* ---------- 탭(회계 화면 등) ---------- */
.accounting-page .accounting-tabs { gap: 2px; margin-bottom: 8px; border-bottom: 2px solid var(--prm-brand); }
.accounting-page .accounting-tabs a {
    margin-bottom: -2px;
    padding: 4px 14px;
    border: 1px solid #a3b0c0;
    border-bottom: 0;
    border-radius: 3px 3px 0 0;
    background: linear-gradient(180deg, #fff, #e4e9f0);
    color: #33475f;
    font-size: 12px;
}
.accounting-page .accounting-tabs a.active { border-color: var(--prm-brand-dark); background: linear-gradient(180deg, var(--prm-brand-light), var(--prm-brand)); color: #fff; }

/* ---------- 페이지 이동 ---------- */
.pagination { gap: 2px; margin-top: 6px; }
.pagination-link { min-width: 24px; height: 22px; padding: 0 6px; border-radius: 2px; font-size: 11px; }
.pagination-edge { font-size: 13px; }
.pagination-summary { font-size: 11px; }

/* ---------- 대화상자 ---------- */
.app-dialog { border: 1px solid var(--prm-brand-dark); border-radius: 2px; }
.dialog-heading { padding-bottom: 5px; border-bottom: 2px solid var(--prm-brand); }

/* ---------- 하단 상태 표시줄 ---------- */
.app-footer {
    padding: 3px 12px calc(3px + env(safe-area-inset-bottom));
    border-top: 1px solid #aab6c4;
    background: linear-gradient(180deg, #eef1f5, #d7dee7);
    text-align: left;
}
.app-footer p { font-size: 11px; }

/* ---------- 로그인 등 인증 화면 ---------- */
.auth-page { background: linear-gradient(135deg, #dfe6ef, #f4f6f9); }
.auth-card { padding: 20px 22px; border-top: 3px solid var(--prm-brand); border-radius: 2px; box-shadow: 0 6px 18px rgba(20, 47, 88, .15); }
.auth-card h1 { font-size: 17px; }

/* 로그인: 좌측 회사 이미지 + 우측 로그인 패널 */
.auth-page.login-split { display: block; padding: 0; background: var(--prm-brand-dark); }
.login-shell { display: grid; grid-template-columns: minmax(0, 1fr) 420px; min-height: 100vh; }
.login-visual {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    padding: 48px 56px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: #2a3a58 url("../images/login-hero.jpg") center / cover no-repeat;
    color: #fff;
    overflow: hidden;
}
.login-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(12, 26, 50, .78) 0%, rgba(12, 26, 50, .45) 45%, rgba(12, 26, 50, .1) 100%);
}
.login-visual > * { position: relative; }
.login-visual-logo { position: absolute; top: 34px; left: 56px; width: 150px; height: auto; }
.login-visual-lead { margin: 0 0 14px; word-break: keep-all; font-size: clamp(26px, 3vw, 42px); font-weight: 800; line-height: 1.3; letter-spacing: -.02em; text-shadow: 0 2px 12px rgba(0, 0, 0, .35); }
.login-visual-sub { margin: 0; font-size: clamp(16px, 1.6vw, 22px); font-weight: 600; text-shadow: 0 2px 10px rgba(0, 0, 0, .35); }
.login-visual-sub strong { color: #ff3b3b; }

.login-panel {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0 44px;
    background: linear-gradient(180deg, var(--prm-brand) 0%, var(--prm-brand-dark) 100%);
    color: #fff;
}
.login-panel-body { margin: auto 0; padding: 48px 0 24px; }
.login-panel h1 { display: flex; align-items: center; gap: 8px; margin: 0 0 18px; font-size: 16px; font-weight: 800; color: #fff; }
.login-brand-bar { width: 22px; height: 6px; flex: none; background: #f00; }
.login-panel-tagline { margin: 0 0 26px; font-size: 19px; line-height: 1.5; color: #e3ebf6; }
.login-panel form { gap: 9px; }
.login-panel label { color: #c7d6ea; font-size: 12px; font-weight: 600; }
.login-panel input:not([type=checkbox]) {
    height: 38px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 2px;
    background: #f4f7fb;
    color: #17202a;
    font-size: 14px;
}
.login-panel input:not([type=checkbox]):focus { border-color: #fff; outline: 2px solid rgba(255, 255, 255, .45); outline-offset: 0; }
.login-panel button[type=submit] {
    height: 42px;
    margin-top: 8px;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 2px;
    background: #0d2346;
    box-shadow: none;
    color: #fff;
    font-size: 14px;
}
.login-panel button[type=submit]:hover, .login-panel button[type=submit]:focus-visible { background: #071630; }
.login-options { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 4px; }
.login-options label.check { gap: 5px; color: #e3ebf6; }
.login-options a { color: #e3ebf6; font-size: 12px; text-decoration: none; }
.login-options a:hover, .login-options a:focus-visible { color: #fff; text-decoration: underline; }
.login-panel .alert { margin: 0 0 10px; }
.login-copyright { margin: 0; padding: 0 0 22px; color: #9fb2cc; font-size: 11px; }

@media (max-width: 860px) {
    .login-shell { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
    .login-visual { min-height: 220px; padding: 84px 20px 24px; justify-content: flex-end; }
    .login-visual-logo { top: 20px; left: 20px; width: 110px; }
    .login-visual-lead { font-size: 20px; margin-bottom: 6px; }
    .login-visual-sub { font-size: 15px; }
    .login-panel { padding: 0 16px; }
    .login-panel-body { padding: 28px 0 20px; }
    .login-panel-tagline { font-size: 16px; margin-bottom: 18px; }
}

/* ---------- 조회 조건 영역(.prm-search): 업무포털 조회 박스처럼 라벨 칸 + 입력 칸을 가로로 배치하고 조회 버튼을 오른쪽 끝에 둔다. ---------- */
form.prm-search {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    align-items: stretch;
    gap: 0;
    margin: 6px 0 8px;
    padding: 0;
    border: 1px solid #9fb0c6;
    border-top: 2px solid var(--prm-brand);
    background: var(--prm-label-bg);
}

form.prm-search > :is(label, fieldset),
form.prm-search > .prm-search-fields > :is(label, fieldset) {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    align-items: center;
    column-gap: 8px;
    min-height: 32px;
    margin: 0;
    padding: 3px 8px 3px 0;
    border: 0;
    border-right: 1px dotted var(--prm-line-soft);
    border-bottom: 1px solid var(--prm-line-soft);
    border-radius: 0;
    background: linear-gradient(90deg, var(--prm-head-bottom) 0, var(--prm-head-bottom) 96px, transparent 96px);
    color: #26384e;
    font-size: 12px;
    font-weight: 700;
}

form.prm-search > .prm-search-fields { display: contents; }

/* 라벨 글자(텍스트 노드 또는 첫 span)는 왼쪽 칸에 오른쪽 정렬로 둔다. */
form.prm-search :is(label, fieldset) { text-align: right; }
form.prm-search :is(label, fieldset) > :is(input, select, textarea, div, .label-help) { text-align: left; }
form.prm-search :is(label, fieldset) > span:first-child { padding-right: 0; }
form.prm-search input:not([type=checkbox], [type=radio]), form.prm-search select { width: 100%; min-height: 0; }

/* 체크박스 조건은 라벨 칸 없이 한 칸에 표시한다. */
form.prm-search > label.check, form.prm-search > label:has(> input[type=checkbox]) {
    display: flex;
    align-items: center;
    gap: 6px;
    padding-left: 10px;
    background: var(--prm-label-bg);
    font-weight: 600;
    text-align: left;
}

/* 기간 조건: 시작일 ~ 종료일을 한 칸에 둔다. */
form.prm-search > fieldset { grid-column: span 2; }
form.prm-search > fieldset > legend { float: left; width: 96px; padding: 0; text-align: right; }
form.prm-search > fieldset > div { display: flex; align-items: center; gap: 6px; }
form.prm-search > fieldset > div > label { display: block; flex: 1; margin: 0; }
form.prm-search > fieldset > div > label > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* 조회·초기화 버튼은 마지막 칸 오른쪽 끝에 붙인다. */
form.prm-search > button,
form.prm-search > :is(.actions, .prm-search-actions, .settlement-filter-actions, .statistics-filter-actions, .policy-search-actions) {
    display: flex;
    grid-column: -2 / -1;
    align-items: center;
    justify-content: flex-end;
    justify-self: stretch;
    gap: 4px;
    margin: 0;
    padding: 3px 8px;
    border: 0;
    border-bottom: 1px solid var(--prm-line-soft);
    background: var(--prm-label-bg);
}
form.prm-search > button { justify-self: end; align-self: center; margin: 3px 8px; padding: 3px 18px; border-bottom: 0; background: linear-gradient(180deg, var(--prm-brand-light), var(--prm-brand)); }
form.prm-search > :is(.actions, .prm-search-actions, .settlement-filter-actions, .statistics-filter-actions, .policy-search-actions) > :is(button, .button) { min-height: 0; padding: 3px 16px; white-space: nowrap; }

@media (max-width: 700px) {
    form.prm-search { grid-template-columns: 1fr; }
    form.prm-search > fieldset { grid-column: auto; }
    form.prm-search > :is(label, fieldset), form.prm-search > .prm-search-fields > :is(label, fieldset) { grid-template-columns: 80px minmax(0, 1fr); background: linear-gradient(90deg, var(--prm-head-bottom) 0, var(--prm-head-bottom) 80px, transparent 80px); }
    form.prm-search > fieldset > legend { width: 80px; }
    form.prm-search > button, form.prm-search > :is(.actions, .prm-search-actions, .settlement-filter-actions, .statistics-filter-actions, .policy-search-actions) { grid-column: auto; }
}

/* ---------- 본문 탭(ContentTabs, prm-ui.js) ---------- */
.content-tabs {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 2px;
    margin: 6px 0 0;
    padding: 0;
    border-bottom: 2px solid var(--prm-brand);
}

.content-tab {
    position: relative;
    min-width: 96px;
    margin-bottom: -2px;
    padding: 5px 16px;
    border: 1px solid #a3b0c0;
    border-bottom: 0;
    border-radius: 3px 3px 0 0;
    background: linear-gradient(180deg, #fff, #e4e9f0);
    box-shadow: none;
    color: #33475f;
    font-size: 12px;
    font-weight: 700;
}

.content-tab:hover, .content-tab:focus-visible { background: linear-gradient(180deg, #fff, #d4deea); color: var(--prm-brand); }
.content-tab.active { border-color: var(--prm-brand-dark); background: linear-gradient(180deg, var(--prm-brand-light), var(--prm-brand)); color: #fff; }

/* 탭 버튼이 없는 영역(data-tab-hidden)을 보는 동안 나타나는 첫 탭 복귀 링크 */
.content-tab-back { margin: 0 0 4px 8px; padding: 4px 10px; border: 1px solid #a3b0c0; border-radius: 3px; background: #fff; color: var(--prm-brand); font-size: 12px; font-weight: 700; }
.content-tab-back:hover, .content-tab-back:focus-visible { background: #eef3f9; }
.content-tab-back[hidden] { display: none; }

.content-tab-panel { margin-top: 0; }
.content-tabs + .content-tab-panel, .content-tab-panel + .content-tab-panel { border-top: 0; }
.content-tabs-host > .content-tab-panel:is(section, .form-section, .work-panel, .detail-grid) { border-top: 0; }
.content-tabs-host > .content-tab-panel:not(section, .form-section, .work-panel, .detail-grid) {
    padding: 8px 10px;
    border: 1px solid var(--prm-line-soft);
    border-top: 0;
    background: var(--prm-panel);
}

/* 탭 아래 일괄 저장 버튼 줄 */
.content-tabs-actions {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
    margin-top: 8px;
    padding: 6px 0 0;
    border-top: 1px solid var(--prm-line-soft);
}

/* ---------- 엑셀형 머리글 정렬(TableSort, prm-ui.js) ---------- */
th.sortable { position: relative; padding-right: 16px; cursor: pointer; user-select: none; }
th.sortable:hover { background: linear-gradient(180deg, #fff, #cbd6e4) !important; color: var(--prm-brand) !important; }
th.sortable:focus-visible { outline: 2px solid var(--prm-focus); outline-offset: -2px; }
th.sortable::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 5px;
    width: 0;
    height: 0;
    margin-top: -6px;
    border: 4px solid transparent;
    border-top-color: #9aa8b8;
    box-shadow: none;
    opacity: .45;
    transform: translateY(5px);
}
th.sortable::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 5px;
    width: 0;
    height: 0;
    margin-top: -10px;
    border: 4px solid transparent;
    border-bottom-color: #9aa8b8;
    opacity: .45;
}
th.sortable.sort-asc::before { border-bottom-color: var(--prm-accent); opacity: 1; }
th.sortable.sort-asc::after { opacity: 0; }
th.sortable.sort-desc::after { border-top-color: var(--prm-accent); opacity: 1; }
th.sortable.sort-desc::before { opacity: 0; }
th.sortable:is(.sort-asc, .sort-desc) { color: var(--prm-brand-dark) !important; text-decoration: underline; text-underline-offset: 3px; }

/* 격자 폼(.form-grid 등) 안의 탭: 탭 줄은 한 줄 전체, 탭 영역은 원래 격자 배치를 이어 쓴다. */
.content-tabs-host:is(.form-grid, .case-form-grid, .signature-form-grid) > .content-tabs { grid-column: 1 / -1; }
.content-tabs-host > .content-tab-panel.content-tab-grid,
.content-tabs-host > .content-tab-panel.signature-form-grid { grid-column: 1 / -1; }
.content-tab-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 10px; }
.content-tab-grid > .full, .content-tab-grid > h2 { grid-column: 1 / -1; }
@media (max-width: 800px) { .content-tab-grid { grid-template-columns: 1fr; } }
.content-tabs-host > .content-tab-panel.content-tab-group { display: block; padding: 8px 0 0; border: 0; background: transparent; }
.case-work-grid.case-work-single { grid-template-columns: minmax(0, 1fr); }
.case-detail-tabs > .content-tab-panel.case-work-grid { padding: 8px; border: 1px solid var(--prm-line-soft); border-top: 0; background: var(--prm-panel); }
.statistics-tabs > .content-tab-panel, .case-detail-tabs > .content-tab-panel { margin-top: 0; }

/* 보험사 담당자 등록·수정: 항목이 적어 탭 대신 카드로 묶어 한 화면에 보여 준다. */
.insurer-contact-form { display: grid; gap: 8px; margin: 6px 0; }
.insurer-contact-form > .form-section { margin: 0; }
.insurer-contact-form .check-row { display: flex; flex-direction: row; align-items: center; gap: 6px; }
.insurer-contact-form .check-row input { width: auto; }

/* 사건 통합 메일 작성 창 */
.case-mail-dialog form{display:grid;gap:12px}
.case-mail-dialog fieldset{border:1px solid var(--line, #d9dee7);border-radius:8px;padding:10px 12px;display:grid;gap:8px;margin:0}
.case-mail-dialog legend{font-weight:600;padding:0 4px}
.case-mail-picker{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.case-mail-picker select{flex:1 1 260px;min-width:0}
.case-mail-attachment-group{display:grid;gap:4px}
.case-mail-attachment-group:empty{display:none}
.case-mail-file-list{max-height:180px;overflow:auto;display:grid;gap:4px;padding-right:4px}
.mail-attachment-summary{word-break:break-all}
.mail-signature-list{margin-bottom:12px}
.code-group.mail-template label{display:grid;gap:4px;margin-bottom:8px}
.code-group.mail-template textarea{width:100%}