/* ========================================
   JSPV Solution Design System
   SolarEPC Manager — style.css
   컬러 팔레트: jspv_design_1.py 기준
   ======================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
    /* ── JSPV 주조색 (슬레이트 계열) ── */
    --ink:        #1C2B3A;   /* 진한 슬레이트 — 헤더·사이드바 */
    --ink-mid:    #3A4F63;   /* 중간 슬레이트 — 섹션 헤더·테이블 헤더 */
    --ink-lite:   #6B7F92;   /* 연한 슬레이트 — 레이블·캡션 */

    /* ── JSPV 포인트 (절제된 골드) ── */
    --gold:       #9E8148;   /* 좌측 강조선·활성 메뉴·수치 */
    --gold-lt:    #F5EFE3;   /* 골드 배경 (콜아웃·뱃지) */
    --gold-dark:  #7A6035;   /* 골드 어두운 버전 */

    /* ── JSPV 배경 계열 ── */
    --bg0:        #FFFFFF;
    --bg1:        #F7F8FA;   /* 극연한 배경 (교차 행·카드) */
    --bg2:        #EAEDF1;   /* 연한 구분선 배경 */
    --bg3:        #DDE1E8;   /* 테이블 헤더 배경 */

    /* ── JSPV 선·경계 ── */
    --line:       #C8CDD6;
    --line-lt:    #E2E5EA;

    /* ── JSPV 상태 색상 (절제) ── */
    --positive:   #2F6045;
    --caution:    #7A5020;
    --alert:      #7A2828;
    --positive-bg:#EAF3EE;
    --caution-bg: #F5EDE0;
    --alert-bg:   #F5E0E0;
    --info-bg:    #E8EEF5;

    /* 기존 변수 호환 매핑 */
    --primary-color: var(--gold);
    --sidebar-bg:    var(--ink);
    --content-bg:    var(--bg1);
    --border-light:  var(--line-lt);
    --text-muted:    var(--ink-lite);
    --success:       var(--positive);
    --warning:       var(--caution);
    --danger:        var(--alert);
    --info:          var(--ink-mid);
}

/* ========================================
   기본 리셋
   ======================================== */

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
    font-family: 'Inter', '맑은 고딕', system-ui, -apple-system, sans-serif;
    background-color: var(--bg1);
    color: var(--ink);
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
}

/* ========================================
   사이드바
   ======================================== */

.sidebar {
    background-color: var(--ink) !important;
    border-right: 1px solid rgba(255,255,255,0.06);
    position: sticky;
    top: 0;
    height: 100vh;
    box-shadow: 2px 0 12px rgba(0,0,0,0.15);
    width: 250px !important;
    min-width: 250px !important;
    max-width: 250px !important;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
}

.sidebar h5, .sidebar h6 {
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #fff;
}

.sidebar .nav-section-label {
    color: rgba(255,255,255,0.3);
    font-size: 0.65rem;
    padding: 14px 18px 4px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    font-weight: 600;
}

.sidebar .nav-link {
    color: rgba(255,255,255,0.82) !important;
    padding: 7px 16px 7px 18px;
    border-radius: 6px;
    transition: all 0.15s ease;
    margin: 1px 8px;
    font-size: 0.8rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.sidebar .nav-link:hover {
    background-color: rgba(255,255,255,0.07);
    color: rgba(255,255,255,0.9) !important;
    padding-left: 18px;
}

.sidebar .nav-link.active {
    background-color: var(--gold);
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(158,129,72,0.35);
}

.sidebar .form-select,
.sidebar .form-label {
    font-size: 0.8rem;
}

.sidebar .form-label {
    color: rgba(255,255,255,0.6) !important;
}

.sidebar .text-muted {
    color: rgba(255,255,255,0.55) !important;
}

.sidebar .border-secondary {
    border-color: rgba(255,255,255,0.2) !important;
}

.sidebar .form-select {
    background-color: rgba(255,255,255,0.08);
    border-color: rgba(255,255,255,0.15);
    color: #fff;
    font-size: 0.8rem;
    border-radius: 6px;
}

.sidebar .form-select option {
    background-color: var(--ink);
    color: #fff;
}

/* ========================================
   상단 네비바
   ======================================== */

.navbar {
    background-color: var(--bg0) !important;
    box-shadow: 0 1px 0 var(--line-lt);
    border-bottom: 1px solid var(--line-lt);
}

.navbar-brand {
    font-weight: 700;
    color: var(--ink) !important;
    font-size: 0.9rem;
    letter-spacing: -0.01em;
}

/* ========================================
   메인 콘텐츠
   ======================================== */

#main-content {
    background-color: var(--bg1);
    min-width: 0;
    overflow-x: auto;
    padding: 24px 28px;
}

/* ========================================
   카드 — INK_MID 헤더 + GOLD 좌측 강조선
   ======================================== */

.card {
    border: 1px solid var(--line-lt);
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    background-color: var(--bg0);
    transition: box-shadow 0.15s ease;
}

.card:hover {
    box-shadow: 0 3px 10px rgba(0,0,0,0.08);
}

.card-header {
    background-color: var(--ink-mid) !important;
    color: #fff !important;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    border-radius: 8px 8px 0 0 !important;
    font-weight: 600;
    font-size: 0.82rem;
    padding: 10px 16px 10px 20px;
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* GOLD 좌측 강조선 (jspv LINEBEFORE 패턴) */
.card-header::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background-color: var(--gold);
    border-radius: 8px 0 0 0;
}

.card-header .btn { font-size: 0.75rem; }

.card-title {
    font-weight: 700;
    color: var(--ink);
    margin-bottom: 0;
    font-size: 0.9rem;
}

/* ========================================
   섹션 헤더 (페이지 내 구분)
   ======================================== */

.section-header {
    background-color: var(--ink);
    color: #fff;
    padding: 8px 14px 8px 17px;
    font-weight: 700;
    font-size: 0.82rem;
    border-radius: 4px;
    position: relative;
    margin-bottom: 12px;
}

.section-header::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background-color: var(--gold);
    border-radius: 4px 0 0 4px;
}

/* ========================================
   테이블 — INK_MID 헤더, BG0/BG1 교차 행
   ======================================== */

.table {
    font-size: 0.82rem;
    color: var(--ink);
    border-color: var(--line-lt);
}

.table thead th {
    background-color: var(--ink-mid);
    color: #fff;
    font-weight: 600;
    font-size: 0.75rem;
    padding: 10px 12px;
    border-bottom: 2px solid var(--line);
    text-transform: uppercase;
    letter-spacing: 0.4px;
    white-space: nowrap;
    border-color: var(--ink-mid);
}

.table thead th:first-child {
    border-left: 3px solid var(--gold);
}

.table tbody td {
    font-size: 0.82rem;
    vertical-align: middle;
    padding: 9px 12px;
    color: var(--ink);
    border-bottom: 1px solid var(--bg2);
}

.table tbody tr:nth-child(odd) td  { background-color: var(--bg0); }
.table tbody tr:nth-child(even) td { background-color: var(--bg1); }
.table tbody tr:hover td           { background-color: var(--gold-lt) !important; }

/* ========================================
   뱃지 — Pill 형태 (jspv 절제 톤)
   ======================================== */

.badge {
    font-weight: 500;
    font-size: 0.72rem;
    padding: 4px 10px;
    border-radius: 20px;
    letter-spacing: 0.1px;
}

.badge.bg-success  { background-color: var(--positive-bg) !important; color: var(--positive) !important; }
.badge.bg-danger   { background-color: var(--alert-bg)    !important; color: var(--alert)    !important; }
.badge.bg-warning  { background-color: var(--caution-bg)  !important; color: var(--caution)  !important; }
.badge.bg-secondary{ background-color: var(--bg2)         !important; color: var(--ink-lite) !important; }
.badge.bg-info     { background-color: var(--info-bg)     !important; color: var(--ink-mid)  !important; }
.badge.bg-primary  { background-color: var(--gold-lt)     !important; color: var(--gold-dark)!important; }

/* ========================================
   버튼
   ======================================== */

.btn-primary {
    background-color: var(--ink-mid);
    border-color: var(--ink-mid);
    color: #fff;
    font-weight: 500;
    font-size: 0.82rem;
    border-radius: 6px;
    padding: 6px 16px;
}

.btn-primary:hover, .btn-primary:focus {
    background-color: var(--ink);
    border-color: var(--ink);
    color: #fff;
}

.btn-outline-primary  { color: var(--ink-mid); border-color: var(--ink-mid); font-size: 0.82rem; border-radius: 6px; font-weight: 500; }
.btn-outline-primary:hover  { background-color: var(--ink-mid); color: #fff; }

.btn-outline-secondary { color: var(--ink-lite); border-color: var(--line); font-size: 0.82rem; border-radius: 6px; font-weight: 500; }
.btn-outline-secondary:hover { background-color: var(--bg2); color: var(--ink); border-color: var(--line); }

.btn-outline-danger  { color: var(--alert); border-color: var(--alert); font-size: 0.82rem; border-radius: 6px; }
.btn-outline-danger:hover  { background-color: var(--alert); border-color: var(--alert); color: #fff; }

.btn-outline-success { color: var(--positive); border-color: var(--positive); font-size: 0.82rem; border-radius: 6px; }
.btn-outline-success:hover { background-color: var(--positive); color: #fff; }

.btn-outline-warning { color: var(--caution); border-color: var(--caution); font-size: 0.82rem; border-radius: 6px; }
.btn-outline-warning:hover { background-color: var(--caution); color: #fff; }

.btn-sm { font-size: 0.75rem; padding: 4px 10px; }

/* ========================================
   폼
   ======================================== */

.form-control, .form-select {
    font-size: 0.82rem;
    border-color: var(--line);
    border-radius: 6px;
    color: var(--ink);
}

.form-control:focus, .form-select:focus {
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(158,129,72,0.15);
    color: var(--ink);
}

.form-label {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--ink-lite);
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.form-select-sm, .form-control-sm { font-size: 0.78rem; padding: 4px 8px; }
.form-text { font-size: 0.75rem; color: var(--ink-lite); }

/* ========================================
   모달 — INK_MID 헤더 + GOLD 강조선
   ======================================== */

.modal-content {
    border-radius: 10px;
    border: 1px solid var(--line-lt);
    box-shadow: 0 20px 50px rgba(0,0,0,0.14);
}

.modal-header {
    background-color: var(--ink-mid);
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    border-radius: 10px 10px 0 0;
    padding: 14px 20px 14px 22px;
    position: relative;
}

.modal-header::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background-color: var(--gold);
    border-radius: 10px 0 0 0;
}

.modal-title { font-size: 0.88rem; font-weight: 700; color: #fff; }
.modal-header .btn-close { filter: invert(1) brightness(0.8); opacity: 0.7; font-size: 0.7rem; }
.modal-header .btn-close:hover { opacity: 1; }

.modal-body { padding: 20px 24px; background-color: var(--bg0); }

.modal-footer {
    border-top: 1px solid var(--line-lt);
    padding: 12px 20px;
    background-color: var(--bg1);
    border-radius: 0 0 10px 10px;
}

/* ========================================
   KPI 카드
   ======================================== */

.kpi-card {
    background-color: var(--bg0);
    border: 1px solid var(--line-lt);
    border-left: 3px solid var(--gold);
    border-radius: 8px;
    padding: 16px 18px;
    transition: box-shadow 0.15s ease;
}

.kpi-card:hover { box-shadow: 0 4px 14px rgba(0,0,0,0.08); }

.kpi-card .kpi-label {
    font-size: 0.72rem;
    color: var(--ink-lite);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}

.kpi-card .kpi-value {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.kpi-card .kpi-sub { font-size: 0.75rem; color: var(--ink-lite); margin-top: 4px; }

.kpi-positive { color: var(--positive); font-weight: 600; }
.kpi-negative { color: var(--alert);    font-weight: 600; }
.kpi-neutral  { color: var(--ink-lite); }

/* ========================================
   콜아웃 박스 (jspv callout 패턴)
   ======================================== */

.callout {
    padding: 10px 14px 10px 17px;
    border-radius: 4px;
    font-size: 0.82rem;
    position: relative;
    margin-bottom: 12px;
}

.callout::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    border-radius: 4px 0 0 4px;
}

.callout-note   { background-color: var(--bg1);         color: var(--ink-mid); }
.callout-note::before   { background-color: var(--line); }
.callout-action { background-color: var(--gold-lt);      color: var(--caution); }
.callout-action::before { background-color: var(--gold); }
.callout-warn   { background-color: var(--alert-bg);     color: var(--alert); }
.callout-warn::before   { background-color: var(--alert); }
.callout-good   { background-color: var(--positive-bg);  color: var(--positive); }
.callout-good::before   { background-color: var(--positive); }

/* ========================================
   간트 바
   ======================================== */

.gantt-bar {
    height: 22px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    padding: 0 8px;
    font-size: 0.72rem;
    font-weight: 600;
    color: #fff;
    transition: width 0.4s ease;
    min-width: 5%;
}

.gantt-completed   { background-color: var(--positive); }
.gantt-in-progress { background-color: var(--gold); }
.gantt-pending     { background-color: var(--ink-lite); }
.gantt-blocked     { background-color: var(--alert); }

/* ========================================
   상태 셀렉터
   ======================================== */

.status-select {
    font-size: 0.75rem;
    padding: 3px 6px;
    border-radius: 4px;
    border-color: var(--line);
    color: var(--ink);
    min-width: 80px;
}

/* ========================================
   페이지 타이틀
   ======================================== */

.page-title, h4.mb-0 {
    color: var(--ink);
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: -0.02em;
}

.page-title i, h4.mb-0 i { color: var(--gold); margin-right: 6px; }

/* ========================================
   토스트
   ======================================== */

.toast-container { z-index: 9999; }

.toast {
    border-radius: 8px;
    border: 1px solid var(--line-lt);
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    font-size: 0.82rem;
}

.toast-header {
    background-color: var(--bg1);
    border-bottom: 1px solid var(--line-lt);
    font-weight: 600;
    font-size: 0.78rem;
    color: var(--ink);
}

.toast-body { padding: 10px 14px; color: var(--ink-mid); }

/* ========================================
   로딩 스피너
   ======================================== */

.loading-spinner {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3rem;
}

.spinner-border { color: var(--gold); }

/* ========================================
   기한 초과 / 만료 경고
   ======================================== */

.overdue td        { background-color: var(--alert-bg) !important; }
.overdue-text      { color: var(--alert); font-weight: 600; }
.expiry-warning-30 td { background-color: var(--caution-bg); }
.expiry-warning-60 td { background-color: var(--gold-lt); }

/* ========================================
   인라인 편집
   ======================================== */

.editable {
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 4px;
    transition: background-color 0.15s ease;
}

.editable:hover { background-color: var(--gold-lt); }

.edit-input {
    padding: 2px 6px;
    border: 1px solid var(--gold);
    border-radius: 4px;
    font-size: inherit;
    font-family: inherit;
}

.edit-input:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(158,129,72,0.15);
}

/* ========================================
   코드 뱃지 (item_code)
   ======================================== */

code {
    font-family: 'JetBrains Mono', 'Consolas', monospace;
    font-size: 0.78rem;
    color: var(--gold-dark);
    background-color: var(--gold-lt);
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 600;
}

/* ========================================
   알림 (Alert)
   ======================================== */

.alert { border-radius: 6px; font-size: 0.82rem; border-width: 1px; }
.alert-info    { background-color: var(--info-bg);     border-color: var(--line);     color: var(--ink-mid);  }
.alert-danger  { background-color: var(--alert-bg);    border-color: var(--alert);    color: var(--alert);    }
.alert-success { background-color: var(--positive-bg); border-color: var(--positive); color: var(--positive); }
.alert-warning { background-color: var(--caution-bg);  border-color: var(--caution);  color: var(--caution);  }

/* ========================================
   모바일 탑바 & 오버레이
   ======================================== */

.mobile-topbar {
    display: none;                /* md 이상에서 숨김 (d-md-none으로도 처리) */
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 999;
    height: 50px;
    background: var(--ink);
    color: #fff;
    padding: 0 12px;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}

.mobile-topbar-title {
    font-weight: 600;
    font-size: 1rem;
}

.sidebar-overlay {
    position: fixed;
    inset: 0;
    z-index: 998;
    background: rgba(0,0,0,0.45);
    transition: opacity 0.25s ease;
}

/* ========================================
   반응형
   ======================================== */

@media (max-width: 767.98px) {
    /* 모바일 탑바 표시 */
    .mobile-topbar { display: flex; }

    /* 사이드바 오프캔버스 */
    .sidebar {
        position: fixed;
        left: 0; top: 0; height: 100%;
        z-index: 1000;
        transform: translateX(-100%);
        transition: transform 0.25s ease;
        width: 260px !important;
        min-width: 260px !important;
        max-width: 260px !important;
        padding-top: 16px !important;
    }
    .sidebar.active { transform: translateX(0); }

    /* 본문 — 탑바 높이만큼 여백 */
    .main-content, #main-content {
        margin-left: 0 !important;
        padding: 16px !important;
        padding-top: 62px !important;   /* 50px topbar + 12px gap */
    }
    .d-flex > .flex-grow-1 {
        margin-left: 0 !important;
        width: 100% !important;
    }

    /* 테이블 축소 */
    .kpi-card .kpi-value { font-size: 1.4rem; }
    .table { font-size: 0.78rem; }

    /* 모달 여백 */
    .modal-dialog { margin: 0.5rem; max-width: calc(100% - 1rem); }
}

@media (max-width: 576px) {
    .navbar-brand  { font-size: 0.9rem !important; }
    .kpi-card      { padding: 12px 14px; }
    .kpi-card .kpi-value { font-size: 1.2rem; }
}

/* ========================================
   경영보고 (M7) — 보고서 스타일
   ======================================== */

/* 보고서 본문 영역 */
.report-body {
    max-width: 960px;
    margin: 0 auto;
}

/* 보고서 헤더 블록 */
.report-header-block {
    background-color: var(--ink);
    color: #fff;
    border-radius: 10px;
    padding: 24px 28px;
    position: relative;
    overflow: hidden;
}

.report-header-block::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background-color: var(--gold);
    border-radius: 10px 0 0 10px;
}

.report-title {
    font-size: 1.15rem;
    font-weight: 700;
    color: #fff;
    margin: 0;
    letter-spacing: -0.02em;
}

.report-meta .meta-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.report-meta .meta-label {
    font-size: 0.72rem;
    color: rgba(255,255,255,0.55);
    width: 60px;
    text-align: right;
    font-weight: 600;
    letter-spacing: 0.3px;
    flex-shrink: 0;
}

.report-meta .meta-value {
    font-size: 0.82rem;
    color: rgba(255,255,255,0.9);
    font-weight: 500;
}

.meta-input {
    background-color: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 4px;
    color: #fff;
    font-size: 0.78rem;
    padding: 3px 8px;
    width: 200px;
    outline: none;
}

.meta-input::placeholder { color: rgba(255,255,255,0.35); }
.meta-input:focus { border-color: var(--gold); background-color: rgba(255,255,255,0.15); }

/* 섹션 타이틀 */
.report-section {
    background-color: var(--bg0);
    border: 1px solid var(--line-lt);
    border-radius: 8px;
    padding: 20px 22px;
}

.report-section-title {
    font-size: 0.82rem;
    font-weight: 700;
    color: #fff;
    background-color: var(--ink-mid);
    padding: 8px 14px;
    border-radius: 4px;
    margin-bottom: 16px;
    position: relative;
    padding-left: 17px;
}

.report-section-title::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background-color: var(--gold);
    border-radius: 4px 0 0 4px;
}

/* 보고서 테이블 */
.report-table {
    font-size: 0.8rem;
    margin-bottom: 0;
}

.report-table th {
    background-color: var(--ink-mid);
    color: #fff;
    font-weight: 600;
    font-size: 0.74rem;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    padding: 7px 10px;
    vertical-align: middle;
}

.report-table th:first-child { border-left: 3px solid var(--gold); }

.report-table td {
    font-size: 0.8rem;
    color: var(--ink);
    padding: 7px 10px;
    vertical-align: middle;
    border-color: var(--line-lt);
}

.report-table tbody tr:hover { background-color: var(--bg1); }

/* 사업개요 테이블 th (좌측 라벨 열) */
.report-table tbody th {
    background-color: var(--bg2);
    color: var(--ink-mid);
    font-size: 0.74rem;
    font-weight: 600;
    width: 18%;
    border-left: none;
    text-transform: none;
    letter-spacing: 0;
}

/* 허가·체크리스트 통계 박스 */
.permit-stat-box {
    background-color: var(--bg1);
    border: 1px solid var(--line-lt);
    border-radius: 6px;
    padding: 10px 6px;
    color: var(--ink);
}

.permit-stat-box.pending   { border-left: 3px solid var(--ink-lite); }
.permit-stat-box.submitted { border-left: 3px solid var(--ink-mid); }
.permit-stat-box.approved  { border-left: 3px solid var(--positive); }
.permit-stat-box.rejected  { border-left: 3px solid var(--alert); }
.permit-stat-box.expired   { border-left: 3px solid var(--caution); }
.permit-stat-box.rate      { border-left: 3px solid var(--gold); background-color: var(--gold-lt); }

/* 이슈 입력 힌트 */
.editable-hint {
    font-size: 0.75rem;
    color: var(--ink-lite);
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 5px;
}

/* 책임자 의견 textarea */
.report-textarea {
    font-size: 0.82rem;
    border-color: var(--line);
    border-radius: 6px;
    resize: vertical;
    color: var(--ink);
    background-color: var(--bg0);
    min-height: 120px;
}

.report-textarea:focus {
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(158,129,72,0.15);
}

/* KPI 카드 — 아이콘 */
.kpi-card .kpi-icon {
    font-size: 1.4rem;
    margin-bottom: 6px;
    color: var(--gold);
}

/* ========================================
   인쇄
   ======================================== */

.no-print    { /* 화면 전용: 인쇄 시 숨김 — @media print에서 처리 */ }
.print-only  { display: none; /* 화면에서는 숨김 */ }

/* 서명란 (인쇄 전용) */
.signature-block { padding-top: 20px; }

.signature-line {
    border-bottom: 1px solid var(--ink);
    height: 60px;
    margin-bottom: 6px;
}

.signature-label {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--ink-mid);
    margin-bottom: 3px;
}

.signature-name {
    font-size: 0.82rem;
    color: var(--ink);
    min-height: 18px;
}

@media print {
    /* 화면 UI 숨기기 */
    .sidebar,
    .navbar,
    footer,
    .no-print,
    #toastContainer { display: none !important; }

    /* 인쇄 전용 요소 보이기 */
    .print-only { display: block !important; }

    /* 레이아웃 초기화 */
    body {
        background-color: #fff !important;
        font-size: 10pt;
        font-family: 'Inter', 'Apple SD Gothic Neo', sans-serif;
        color: #000;
    }

    .d-flex { display: block !important; }

    #main-content {
        padding: 0 !important;
        background-color: #fff !important;
        overflow: visible !important;
    }

    .report-body {
        max-width: 100%;
    }

    /* 헤더 블록 */
    .report-header-block {
        background-color: #1C2B3A !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        border-radius: 0;
        padding: 14px 18px;
    }

    .report-header-block::before {
        background-color: #9E8148 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    /* 섹션 타이틀 */
    .report-section-title {
        background-color: #3A4F63 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        border-radius: 0;
    }

    .report-section-title::before {
        background-color: #9E8148 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .report-section {
        border-radius: 0;
        page-break-inside: avoid;
    }

    /* 테이블 헤더 */
    .report-table th {
        background-color: #3A4F63 !important;
        color: #fff !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .report-table th:first-child {
        border-left: 3px solid #9E8148 !important;
    }

    /* 진행 바 */
    .progress-bar {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    /* 메타 입력 → 텍스트로 보이기 */
    .meta-input {
        background-color: transparent !important;
        border: none !important;
        border-bottom: 1px solid rgba(255,255,255,0.5) !important;
        color: #fff !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .report-textarea {
        border: 1px solid #ccc !important;
        background-color: #fff !important;
        resize: none;
    }

    /* form-control → 인쇄 시 border 최소화 */
    .form-control, .form-select {
        border: none !important;
        border-bottom: 1px solid #ccc !important;
        border-radius: 0 !important;
        background-color: transparent !important;
        box-shadow: none !important;
        padding: 2px 4px;
        font-size: 9pt;
    }

    /* 페이지 나누기 */
    section.report-section { page-break-inside: avoid; }
    .signature-block { page-break-inside: avoid; }
}

/* ========================================
   유틸리티
   ======================================== */

.text-ink      { color: var(--ink); }
.text-ink-mid  { color: var(--ink-mid); }
.text-ink-lite { color: var(--ink-lite); }
.text-gold     { color: var(--gold); }
.text-positive { color: var(--positive); }
.text-caution  { color: var(--caution); }
.text-alert    { color: var(--alert); }

.bg-ink        { background-color: var(--ink); }
.bg-ink-mid    { background-color: var(--ink-mid); }
.bg-gold-lt    { background-color: var(--gold-lt); }

.border-gold   { border-color: var(--gold) !important; }
.border-line   { border-color: var(--line) !important; }

.fw-semibold   { font-weight: 600; }
.rounded-sm    { border-radius: 4px; }
.rounded-md    { border-radius: 8px; }

hr { border-color: var(--line-lt); opacity: 1; }