/* ===================================================================
   agrisys-bootstrap-bridge.css
   agrisys 디자인 시스템(data-theme) ↔ Bootstrap 5.3(data-bs-theme) 다크 브리지.

   배경: 본 사이트는 Bootstrap 위에 agrisys 컴포넌트를 덧입혀 재스킨한다.
   agrisys 가 재정의한 컴포넌트(.card/.btn/.form-control/.badge/.alert/.modal-content
   /.page-link)는 [data-theme="dark"] 토큰으로 자동 전환되지만,
   agrisys 가 손대지 않은 Bootstrap 전용 컴포넌트(.table/.dropdown-menu/.list-group
   /.nav-tabs/.btn-close 등)와 고정 색 유틸리티(.bg-white/.bg-light/.text-dark/.text-muted
   /.border)는 다크에서 흰 배경·검은 글자로 남는다. 본 파일이 그 간극을 메운다.

   ★ 모든 규칙은 다크([data-theme="dark"] / [data-bs-theme="dark"])에만 적용 →
     이미 승인된 라이트 모드에는 영향 없음.
   =================================================================== */

/* ── 0) 다크 토큰 대비 강화 (사용자요청 2026-06-06) ──
   기존 다크: page #0B1220 vs card #111827 — 너무 비슷해 카드가 페이지에 묻힘.
   카드를 페이지보다 뚜렷이 밝게 + 테두리 또렷하게 → 계층(page < card < subtle) 분리.
   bridge 가 agrisys 뒤에 로드 → 동일 특이도(:root[data-theme=dark])라 본 값이 우선. */
:root[data-theme="dark"] {
    --color-bg-page:       #0A0F1A;   /* 페이지: 가장 어둡게 */
    --color-bg-card:       #1A2536;   /* 카드: 페이지보다 확실히 밝게 */
    --color-bg-subtle:     #232F44;   /* stat카드/헤더/hover: 한 단계 더 밝게 */
    --color-bg-muted:      #161F2E;
    --color-background:    var(--color-bg-page);
    --color-card:          var(--color-bg-card);
    --color-surface:       var(--color-bg-subtle);
    --color-border:        #2E3C52;   /* 테두리: 카드 경계 또렷하게 */
    --color-border-strong: #3C4D67;
}

/* ── 1) Bootstrap 네이티브 다크 팔레트를 agrisys 네이비 토큰으로 덮어쓰기 ──
   data-bs-theme="dark" 는 FOUC 스크립트/bs-theme-sync.js 가 data-theme 와 동기화. */
[data-bs-theme="dark"] {
    --bs-body-bg:            var(--color-bg-page);
    --bs-body-color:         var(--color-text);
    --bs-emphasis-color:     var(--color-text-strong);
    --bs-secondary-color:    var(--color-text-secondary);
    --bs-secondary-bg:       var(--color-bg-subtle);
    --bs-tertiary-bg:        var(--color-bg-subtle);
    --bs-tertiary-color:     var(--color-text-tertiary);
    --bs-border-color:       var(--color-border);
    --bs-heading-color:      var(--color-text);
    --bs-link-color:         var(--color-primary);
    --bs-link-color-rgb:     74, 222, 128;
    --bs-link-hover-color:   var(--color-primary-hover);
    --bs-code-color:         #f0a5b8;
}

/* ── 2) 고정 색 유틸리티 보정 (Bootstrap 이 테마와 무관하게 리터럴 유지) ── */
[data-theme="dark"] .bg-white          { background-color: var(--color-bg-card) !important; }
[data-theme="dark"] .bg-light          { background-color: var(--color-bg-subtle) !important; }
[data-theme="dark"] .bg-body           { background-color: var(--color-bg-page) !important; }
[data-theme="dark"] .bg-body-tertiary,
[data-theme="dark"] .bg-body-secondary { background-color: var(--color-bg-subtle) !important; }
[data-theme="dark"] .text-dark         { color: var(--color-text) !important; }
[data-theme="dark"] .text-black        { color: var(--color-text) !important; }
[data-theme="dark"] .text-muted,
[data-theme="dark"] .text-secondary    { color: var(--color-text-secondary) !important; }
[data-theme="dark"] .border,
[data-theme="dark"] .border-top,
[data-theme="dark"] .border-bottom,
[data-theme="dark"] .border-start,
[data-theme="dark"] .border-end        { border-color: var(--color-border) !important; }
[data-theme="dark"] hr                  { border-color: var(--color-border); opacity: 1; }

/* ── 3) 테이블 (agrisys 미정의 → Bootstrap 흰 셀 잔존) ── */
[data-theme="dark"] .table {
    --bs-table-bg:           transparent;
    --bs-table-color:        var(--color-text);
    --bs-table-border-color: var(--color-border);
    --bs-table-striped-bg:   var(--color-bg-subtle);
    --bs-table-striped-color:var(--color-text);
    --bs-table-hover-bg:     rgba(74, 222, 128, 0.08);
    --bs-table-hover-color:  var(--color-text);
    color: var(--color-text);
    border-color: var(--color-border);
}
[data-theme="dark"] .table > thead { color: var(--color-text-secondary); }
[data-theme="dark"] .table > :not(caption) > * > * { background-color: transparent; }

/* ── 4) 드롭다운 / 리스트그룹 / 탭 / 모달 / 카드 변수 매핑 ── */
[data-theme="dark"] .dropdown-menu {
    --bs-dropdown-bg:              var(--color-bg-card);
    --bs-dropdown-color:           var(--color-text);
    --bs-dropdown-border-color:    var(--color-border);
    --bs-dropdown-link-color:      var(--color-text);
    --bs-dropdown-link-hover-color:var(--color-text);
    --bs-dropdown-link-hover-bg:   var(--color-bg-subtle);
    --bs-dropdown-link-active-bg:  var(--color-primary);
    --bs-dropdown-divider-bg:      var(--color-border);
    --bs-dropdown-header-color:    var(--color-text-secondary);
}
[data-theme="dark"] .dropdown-item-text { color: var(--color-text-secondary); }
[data-theme="dark"] .list-group {
    --bs-list-group-bg:               var(--color-bg-card);
    --bs-list-group-color:            var(--color-text);
    --bs-list-group-border-color:     var(--color-border);
    --bs-list-group-action-color:     var(--color-text);
    --bs-list-group-action-hover-bg:  var(--color-bg-subtle);
    --bs-list-group-action-hover-color:var(--color-text);
}
[data-theme="dark"] .nav-tabs {
    --bs-nav-tabs-border-color:             var(--color-border);
    --bs-nav-tabs-link-hover-border-color:  var(--color-border);
    --bs-nav-tabs-link-active-bg:           var(--color-bg-card);
    --bs-nav-tabs-link-active-color:        var(--color-text);
    --bs-nav-tabs-link-active-border-color: var(--color-border);
}
[data-theme="dark"] .modal {
    --bs-modal-bg:                  var(--color-bg-card);
    --bs-modal-color:               var(--color-text);
    --bs-modal-border-color:        var(--color-border);
    --bs-modal-header-border-color: var(--color-border);
    --bs-modal-footer-border-color: var(--color-border);
}
[data-theme="dark"] .card {
    --bs-card-bg:          var(--color-bg-card);
    --bs-card-color:       var(--color-text);
    --bs-card-border-color:var(--color-border);
    --bs-card-cap-bg:      var(--color-bg-card);
}
[data-theme="dark"] .accordion {
    --bs-accordion-bg:               var(--color-bg-card);
    --bs-accordion-color:            var(--color-text);
    --bs-accordion-border-color:     var(--color-border);
    --bs-accordion-btn-color:        var(--color-text);
    --bs-accordion-active-bg:        var(--color-bg-subtle);
    --bs-accordion-active-color:     var(--color-text);
    --bs-accordion-btn-focus-border-color: var(--color-border-focus);
}

/* ── 5) 닫기 버튼(X) — 다크에서 보이도록 반전 ── */
[data-theme="dark"] .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}

/* ── 6) 입력/인풋그룹 보강 ── */
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select,
[data-theme="dark"] .input-group-text {
    background-color: var(--color-bg-subtle);
    color: var(--color-text);
    border-color: var(--color-border-input);
}
[data-theme="dark"] .form-control::placeholder { color: var(--color-text-tertiary); }
[data-theme="dark"] .form-control:disabled,
[data-theme="dark"] .form-select:disabled { background-color: var(--color-bg-muted); }

/* ── 7) 페이지네이션 / 탭 등 잔여 Bootstrap 컴포넌트 ── */
[data-theme="dark"] .pagination {
    --bs-pagination-bg:          transparent;
    --bs-pagination-color:       var(--color-text);
    --bs-pagination-border-color:var(--color-border);
    --bs-pagination-hover-bg:    var(--color-bg-subtle);
    --bs-pagination-hover-color: var(--color-text);
    --bs-pagination-active-bg:   var(--color-primary);
    --bs-pagination-disabled-bg: transparent;
    --bs-pagination-disabled-color: var(--color-text-tertiary);
}
[data-theme="dark"] .breadcrumb { --bs-breadcrumb-divider-color: var(--color-text-tertiary); }

/* ── 8) 스크롤바 (다크) ── */
[data-theme="dark"] ::-webkit-scrollbar-track { background: var(--color-bg-subtle); }
[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #374151; }
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #4b5563; }

/* ===================================================================
   레이아웃 보정 (라이트/다크 공통)
   헤더의 햄버거(.sidebar-toggle-btn, ☰)는 데스크톱에서 사이드바 로고 토글과
   중복 → 모든 화면에서 제거(사용자요청 2026-06-06).
   모바일(≤768px)에서 오프캔버스 사이드바를 여는 수단은 헤더 좌측의
   브랜드 로고(.header-brand-toggle)가 대신한다(햄버거 아이콘 비노출).
   =================================================================== */
.main-content > .header .sidebar-toggle-btn { display: none !important; }

.header-brand-toggle {
    display: none;                 /* 데스크톱: 숨김(사이드바 로고가 토글 담당) */
    align-items: center;
    gap: var(--space-sm);
    border: 0;
    background: transparent;
    cursor: pointer;
    padding: 6px 8px;
    border-radius: var(--radius-sm);
    color: var(--color-text);
    font-weight: 700;
    font-size: 1rem;
    transition: background var(--transition-fast), color var(--transition-fast);
}
.header-brand-toggle:hover { background: var(--color-bg-subtle); color: var(--color-primary); }
.header-brand-toggle:focus-visible { outline: none; box-shadow: var(--shadow-focus); }
.header-brand-toggle__img { width: 28px; height: 28px; pointer-events: none; }
@media (max-width: 768px) {
    .header-brand-toggle { display: inline-flex; }   /* 모바일: 로고 탭 → 메뉴 열기 */
}

/* ===================================================================
   컴포넌트 하모나이징 (라이트/다크 공통) — 사용자요청 2026-06-06
   뷰가 Bootstrap 클래스(.table/.btn-*/.badge bg-*)를 쓰는데 agrisys 가 일부만
   재정의 → 나머지가 Bootstrap 기본값/저대비로 떨어지는 문제를 전역 보정.
   =================================================================== */

/* ── (A) 테이블: 헤더 구분 + 행 구분 명확화 ── */
.table {
    --bs-table-border-color: var(--color-border-strong);
}
.table > thead {
    --bs-table-bg: var(--color-bg-subtle);          /* 헤더 행 배경 (본문과 구분) */
}
.table > thead > tr > th,
.table > thead > tr > td {
    color: var(--color-text-secondary);
    font-weight: 700;
    border-bottom: 2px solid var(--color-text-tertiary);   /* 헤더 하단 강조선 */
    vertical-align: middle;
    white-space: nowrap;                            /* 헤더 글자단위 줄바꿈 방지 */
}
.table > tbody > tr > td,
.table > tbody > tr > th { vertical-align: middle; }
.table-hover > tbody > tr:hover {
    --bs-table-bg: var(--color-primary-soft);       /* 행 호버 강조 */
}

/* ── (B) 버튼: 흰 배경 outline → 옅은 중립 배경(subtle, 라이트/다크 자동) +
   팔레트색 테두리/글자 + hover 채움. 모든 outline 변형을 동일 톤으로 통일. ── */
/* 채움형 보조 (info) — agrisys 미정의 */
.btn-info {
    background: var(--color-info);
    color: #fff;
    border-color: var(--color-info);
}
.btn-info:hover { filter: brightness(0.94); color: #fff; }

.btn-outline-primary {
    background: var(--color-bg-subtle);
    color: var(--color-primary);
    border-color: var(--color-primary);
}
.btn-outline-primary:hover { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }

.btn-outline-secondary {
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
    border-color: var(--color-border-strong);
}
.btn-outline-secondary:hover { background: var(--color-border-strong); color: var(--color-text); border-color: var(--color-border-strong); }

.btn-outline-success {
    background: var(--color-bg-subtle);
    color: var(--color-success);
    border-color: var(--color-success);
}
.btn-outline-success:hover { background: var(--color-success); color: #fff; border-color: var(--color-success); }

.btn-outline-info {
    background: var(--color-bg-subtle);
    color: var(--color-info);
    border-color: var(--color-info);
}
.btn-outline-info:hover { background: var(--color-info); color: #fff; border-color: var(--color-info); }

.btn-outline-warning {
    background: var(--color-bg-subtle);
    color: var(--color-warning);
    border-color: var(--color-warning);
}
.btn-outline-warning:hover { background: var(--color-warning); color: #fff; border-color: var(--color-warning); }

.btn-outline-danger {
    background: var(--color-bg-subtle);
    color: var(--color-danger);
    border-color: var(--color-danger);
}
.btn-outline-danger:hover { background: var(--color-danger); color: #fff; border-color: var(--color-danger); }

/* ── (C) 뱃지: 어두운 글자+어두운 배경 저대비 해소 → agrisys 소프트 뱃지(옅은 배경+짙은 글씨) ── */
/* Bootstrap .bg-* 유틸은 !important 라 뱃지 배경/글자 모두 !important 로 보정 */
.badge.bg-success   { background-color: var(--color-success-bg) !important; color: #065F46 !important; }
.badge.bg-danger    { background-color: var(--color-error-bg)   !important; color: #991B1B !important; }
.badge.bg-warning   { background-color: var(--color-warning-bg) !important; color: #92400E !important; }
.badge.bg-info      { background-color: var(--color-info-bg)    !important; color: #1E40AF !important; }
.badge.bg-primary   { background-color: var(--color-primary-light) !important; color: var(--color-primary-dark) !important; }
.badge.bg-secondary { background-color: var(--color-bg-subtle)  !important; color: var(--color-text-secondary) !important; }
.badge.bg-light     { background-color: var(--color-bg-subtle)  !important; color: var(--color-text) !important; }
.badge.bg-dark      { background-color: var(--color-text)       !important; color: var(--color-bg-card) !important; }

/* 뱃지 — 다크 테마: 옅은 글자색으로 보정 (어두운 반투명 배경 위 가독성) */
[data-theme="dark"] .badge.bg-success   { color: #6EE7B7 !important; }
[data-theme="dark"] .badge.bg-danger    { color: #FCA5A5 !important; }
[data-theme="dark"] .badge.bg-warning   { color: #FCD34D !important; }
[data-theme="dark"] .badge.bg-info      { color: #93C5FD !important; }
[data-theme="dark"] .badge.bg-primary   { color: #86EFAC !important; }
[data-theme="dark"] .badge.bg-secondary { background-color: var(--color-bg-subtle) !important; color: var(--color-text-secondary) !important; }
[data-theme="dark"] .badge.bg-light     { color: var(--color-text) !important; }

/* ── (D) Stat 카드: 무지개 파스텔(템플릿 느낌) 제거 → 절제된 단일 톤.
   균일한 옅은 배경(흰색 아님) + 테두리 + 그림자로 페이지와 분리, 큰 숫자.
   의미 구분은 작은 색 점 + 숫자색으로 절제 표현. 전 페이지 .stat-card 일괄. ── */
.card.stat-card {
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-card);
}
.card.stat-card .card-body { padding: var(--space-lg); }
/* 숫자(값) 크게 + 라벨 절제 */
.card.stat-card h3,
.card.stat-card .stat-value,
.card.stat-card .h3 {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.15;
    color: var(--color-text-strong);
    letter-spacing: -0.01em;
}
.card.stat-card h6,
.card.stat-card .card-subtitle {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-text-secondary);
    letter-spacing: 0.01em;
}
/* 라벨 앞 작은 색 점으로 의미 구분 (무지개 배경 대신 절제된 악센트) */
.card.stat-card h6::before {
    content: "";
    display: inline-block;
    width: 7px; height: 7px;
    border-radius: 50%;
    margin-right: 7px;
    vertical-align: middle;
    background: var(--color-text-tertiary);
}
.card.stat-card.primary h6::before { background: var(--color-primary); }
.card.stat-card.success h6::before { background: var(--color-success); }
.card.stat-card.warning h6::before { background: var(--color-warning); }
.card.stat-card.info    h6::before { background: var(--color-info); }
.card.stat-card.danger  h6::before { background: var(--color-danger); }
.card.stat-card.secondary h6::before { background: var(--color-text-tertiary); }
/* 한글 라벨 글자단위 줄바꿈 방지(단어 단위) + 좁은 카드 아이콘 축소 */
.card.stat-card h6 { word-break: keep-all; }
.card.stat-card .card-body .bi { font-size: 1.6rem; opacity: .3; }
/* .stat-card 가 직접 .d-flex 를 자식으로 둘 때(아이콘+값 구조) full-width 로 펴서 아이콘이 라벨과 겹치지 않게 */
.card.stat-card > .d-flex { flex: 1 1 auto; width: 100%; }

/* ── 폼 셀렉트 높이 통일 (2026-06-07) ──────────────────────────────────
   agrisys design-system 은 .form-control 만 --form-control-height(42px)로 스타일링하고
   Bootstrap .form-select 는 미정의 → 35px(-sm 29px)로 입력칸보다 낮아 필터/폼 정렬이 어긋난다.
   .form-select(및 -sm)를 .form-control 과 동일 높이/패딩으로 맞춰 전 페이지 정렬 일관성 확보. */
.form-select,
.form-select-sm {
    min-height: var(--form-control-height, 42px);
    padding-top: 8px;
    padding-bottom: 8px;
    font-size: 1rem;
    line-height: 1.5;
}
