/* NorthTech ERP 공통 스타일 — Bootstrap 5.3 위에 덧씌움 (빌드 도구 없이 정적 파일로 제공) */
:root {
    --erp-sidebar-w: 248px;
    --erp-sidebar-bg: #15202f;
    --erp-sidebar-fg: rgba(255, 255, 255, .68);
    --erp-sidebar-fg-active: #fff;
    --erp-sidebar-hover: rgba(255, 255, 255, .06);
    --erp-accent: #2f6fed;
    --erp-content-bg: #f3f5f8;
    --erp-border: #e3e7ee;
    --bs-primary: #2f6fed;
    --bs-primary-rgb: 47, 111, 237;
    --bs-link-color: #2f6fed;
    --bs-link-color-rgb: 47, 111, 237;
    --bs-body-font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Malgun Gothic", sans-serif;
    --bs-body-font-size: .9rem;
    --bs-body-color: #1f2733;
}

body { background: var(--erp-content-bg); }
.btn-primary { --bs-btn-bg: #2f6fed; --bs-btn-border-color: #2f6fed; --bs-btn-hover-bg: #2259c9; --bs-btn-hover-border-color: #2259c9; --bs-btn-active-bg: #1d4daf; }
.btn-outline-primary { --bs-btn-color: #2f6fed; --bs-btn-border-color: #2f6fed; --bs-btn-hover-bg: #2f6fed; --bs-btn-hover-border-color: #2f6fed; }
.form-label { font-weight: 500; font-size: .85rem; color: #4a5568; margin-bottom: .3rem; }
.form-label.required::after { content: " *"; color: #e5484d; }
.table > :not(caption) > * > * { padding: .6rem .75rem; }
.table thead th { font-weight: 600; font-size: .8rem; color: #5b6576; background: #f8f9fb; white-space: nowrap; border-bottom-width: 1px; }
.table-hover tbody tr { cursor: default; }
.table td.actions, .table th.actions { width: 1%; white-space: nowrap; text-align: right; }
.card { border-color: var(--erp-border); border-radius: .6rem; box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
.card-header { background: #fff; font-weight: 600; border-bottom-color: var(--erp-border); }
.badge { font-weight: 500; }
.text-xs { font-size: .75rem; }
.text-sm { font-size: .85rem; }
.cursor-pointer { cursor: pointer; }
.min-w-0 { min-width: 0; }

/* ---------- 레이아웃 ---------- */
.erp-shell { display: flex; min-height: 100vh; }
.erp-sidebar {
    width: var(--erp-sidebar-w); flex-shrink: 0; background: var(--erp-sidebar-bg); color: var(--erp-sidebar-fg);
    position: fixed; top: 0; bottom: 0; left: 0; overflow-y: auto; z-index: 1040; transition: transform .2s;
}
.erp-sidebar::-webkit-scrollbar { width: 6px; }
.erp-sidebar::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .15); border-radius: 3px; }
.erp-brand { display: flex; align-items: center; gap: .6rem; padding: 1.1rem 1.25rem; color: #fff; text-decoration: none; font-weight: 700; font-size: 1.05rem; border-bottom: 1px solid rgba(255, 255, 255, .06); }
.erp-brand:hover { color: #fff; }
.erp-brand .logo { width: 30px; height: 30px; border-radius: 8px; background: var(--erp-accent); display: grid; place-items: center; font-size: .95rem; }
.erp-nav { padding: .75rem 0 2rem; }
.erp-nav-link {
    display: flex; align-items: center; gap: .65rem; padding: .5rem 1.25rem; color: var(--erp-sidebar-fg); text-decoration: none; font-size: .88rem; border-left: 3px solid transparent;
}
.erp-nav-link:hover { color: var(--erp-sidebar-fg-active); background: var(--erp-sidebar-hover); }
.erp-nav-link.active { color: var(--erp-sidebar-fg-active); background: rgba(47, 111, 237, .18); border-left-color: var(--erp-accent); }
.erp-nav-link .bi { font-size: 1rem; width: 1.1rem; text-align: center; }
.erp-nav-group > .erp-nav-link .chevron { margin-left: auto; font-size: .7rem; transition: transform .2s; }
.erp-nav-group > .erp-nav-link[aria-expanded="true"] .chevron { transform: rotate(90deg); }
.erp-nav-sub .erp-nav-link { padding-left: 2.9rem; font-size: .84rem; }
.erp-nav-sub .erp-nav-link .bi { display: none; }

.erp-main { flex: 1; margin-left: var(--erp-sidebar-w); min-width: 0; display: flex; flex-direction: column; }
.erp-topbar {
    height: 58px; background: #fff; border-bottom: 1px solid var(--erp-border); display: flex; align-items: center; padding: 0 1.5rem; gap: 1rem;
    position: sticky; top: 0; z-index: 1030;
}
.erp-content { padding: 1.5rem; flex: 1; }
.erp-footer { padding: 1rem 1.5rem; color: #8a94a6; font-size: .78rem; }
.erp-backdrop { display: none; }

@media (max-width: 991.98px) {
    .erp-sidebar { transform: translateX(-100%); }
    .erp-sidebar.show { transform: none; }
    .erp-main { margin-left: 0; }
    .erp-backdrop.show { display: block; position: fixed; inset: 0; background: rgba(0, 0, 0, .35); z-index: 1035; }
    .erp-content { padding: 1rem; }
}

/* ---------- 페이지 헤더 ---------- */
.erp-page-header { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: .75rem; margin-bottom: 1.25rem; }
.erp-page-header h1 { font-size: 1.35rem; font-weight: 700; margin: 0; }
.erp-page-header .subtitle { color: #6b7280; font-size: .85rem; margin-top: .2rem; }
.erp-page-header .breadcrumb { font-size: .78rem; margin-bottom: .3rem; }

/* ---------- 필터 바 ---------- */
.erp-filter { background: #fff; border: 1px solid var(--erp-border); border-radius: .6rem; padding: .85rem 1rem; margin-bottom: 1rem; }

/* ---------- 아바타 ---------- */
.erp-avatar { display: inline-grid; place-items: center; border-radius: 50%; background: #dbe5fb; color: #2550a8; font-weight: 600; overflow: hidden; flex-shrink: 0; }
.erp-avatar img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- 빈 상태 ---------- */
.erp-empty { text-align: center; color: #8a94a6; padding: 2.5rem 1rem; }
.erp-empty .bi { font-size: 2rem; display: block; margin-bottom: .5rem; opacity: .6; }

/* ---------- 알림 드롭다운 ---------- */
.erp-noti-menu { width: 340px; max-height: 420px; overflow-y: auto; padding: 0; }
.erp-noti-item { display: flex; gap: .65rem; padding: .7rem 1rem; border-bottom: 1px solid #f0f2f5; text-decoration: none; color: inherit; }
.erp-noti-item:hover { background: #f6f8fb; }

/* ---------- 대시보드 위젯 ---------- */
.erp-stat { display: flex; align-items: center; gap: .9rem; }
.erp-stat .icon { width: 44px; height: 44px; border-radius: 10px; display: grid; place-items: center; font-size: 1.25rem; }
.erp-stat .value { font-size: 1.4rem; font-weight: 700; line-height: 1.1; }
.erp-stat .label { color: #6b7280; font-size: .8rem; }

/* ---------- 첨부파일 ---------- */
.erp-file { display: flex; align-items: center; gap: .6rem; padding: .45rem .7rem; border: 1px solid var(--erp-border); border-radius: .45rem; background: #fff; }
.erp-file + .erp-file { margin-top: .4rem; }
.erp-file .bi { font-size: 1.2rem; color: #5b6576; }

/* ---------- 본문(서식 있는 텍스트) ---------- */
.erp-prose { line-height: 1.7; word-break: break-word; white-space: pre-wrap; }

/* ---------- 칸반 공통 ---------- */
.erp-kanban { display: flex; gap: 1rem; overflow-x: auto; padding-bottom: .5rem; align-items: flex-start; }
.erp-kanban-col { flex: 0 0 290px; background: #e9edf3; border-radius: .6rem; display: flex; flex-direction: column; max-height: calc(100vh - 230px); }
.erp-kanban-col-header { padding: .7rem .9rem; font-weight: 600; font-size: .85rem; display: flex; align-items: center; gap: .5rem; }
.erp-kanban-list { padding: 0 .6rem .6rem; overflow-y: auto; min-height: 60px; flex: 1; }
.erp-kanban-card { background: #fff; border-radius: .5rem; padding: .65rem .75rem; margin-bottom: .5rem; box-shadow: 0 1px 2px rgba(16, 24, 40, .08); cursor: grab; }
.erp-kanban-card.sortable-ghost { opacity: .4; }

/* ---------- tom-select 보정 ---------- */
.ts-wrapper.form-select, .ts-wrapper.form-control { padding: 0; }
.ts-control { border-radius: var(--bs-border-radius); min-height: 38px; }

/* ---------- 인쇄 ---------- */
@media print {
    .erp-sidebar, .erp-topbar, .erp-footer, .no-print { display: none !important; }
    .erp-main { margin-left: 0; }
    body { background: #fff; }
}

/* ---------- 상단 통합 검색 ---------- */
.erp-global-search { position: relative; width: min(360px, 40vw); }
.erp-global-search .bi { position: absolute; left: .65rem; top: 50%; transform: translateY(-50%); color: #8a94a6; font-size: .85rem; pointer-events: none; }
.erp-global-search .form-control { padding-left: 2rem; border-radius: 999px; background: var(--erp-content-bg); border-color: var(--erp-border); }

/* ---------- 사이드바 즐겨찾기 ---------- */
.erp-nav-item { position: relative; }
.erp-nav-item > .erp-nav-link { padding-right: 2.2rem; }
.erp-nav-fav {
    position: absolute; right: .6rem; top: 50%; transform: translateY(-50%); border: 0; background: transparent; padding: .15rem .3rem;
    color: var(--erp-sidebar-fg); font-size: .75rem; line-height: 1; opacity: 0; transition: opacity .15s; border-radius: .25rem;
}
.erp-nav-item:hover .erp-nav-fav, .erp-nav-fav:focus-visible, .erp-nav-fav.is-favorite { opacity: 1; }
.erp-nav-fav.is-favorite { color: #f5b942; }
.erp-nav-fav:hover { color: #f5b942; background: var(--erp-sidebar-hover); }
.erp-nav-caption { padding: .6rem 1.25rem .3rem; font-size: .72rem; letter-spacing: .02em; color: rgba(255, 255, 255, .42); }
.erp-nav-caption .bi { color: #f5b942; margin-right: .2rem; }
.erp-nav-favorites { padding-bottom: .4rem; margin-bottom: .4rem; border-bottom: 1px solid rgba(255, 255, 255, .06); }
.erp-nav-favorites .erp-nav-link { font-size: .85rem; }

/* ---------- 정렬 링크 · 날짜 범위 ---------- */
.erp-sort-link { color: inherit; text-decoration: none; white-space: nowrap; }
.erp-sort-link:hover, .erp-sort-link.active { color: var(--erp-accent); }
.erp-sort-link .bi { font-size: .7rem; }
.btn-xs { --bs-btn-padding-y: .1rem; --bs-btn-padding-x: .45rem; --bs-btn-font-size: .72rem; }

/* ---------- 다크 모드 (상단 달 아이콘 · localStorage 'erp-theme') ---------- */
[data-bs-theme="dark"] {
    --erp-content-bg: #0f1621;
    --erp-border: #2a3443;
    --erp-sidebar-bg: #0b111a;
    --erp-surface: #172131;
    --bs-body-color: #d7dde6;
    --bs-body-bg: #172131;
    --bs-secondary-bg: #1d2838;
    --bs-tertiary-bg: #1a2433;
    --bs-border-color: #2a3443;
    --bs-link-color: #6c9bff;
    --bs-link-color-rgb: 108, 155, 255;
    color-scheme: dark;
}
[data-bs-theme="dark"] body { background: var(--erp-content-bg); }
[data-bs-theme="dark"] .erp-topbar,
[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .card-header,
[data-bs-theme="dark"] .card-footer.bg-white,
[data-bs-theme="dark"] .erp-filter,
[data-bs-theme="dark"] .erp-file,
[data-bs-theme="dark"] .erp-kanban-card,
[data-bs-theme="dark"] .modal-content,
[data-bs-theme="dark"] .dropdown-menu { background-color: var(--erp-surface) !important; border-color: var(--erp-border); }
[data-bs-theme="dark"] .table { --bs-table-bg: transparent; --bs-table-color: var(--bs-body-color); --bs-table-border-color: var(--erp-border); }
[data-bs-theme="dark"] .table thead th { background: #1d2838; color: #a8b3c4; }
[data-bs-theme="dark"] .table-hover > tbody > tr:hover > * { --bs-table-hover-bg: rgba(255, 255, 255, .03); }
[data-bs-theme="dark"] .form-label { color: #a8b3c4; }
[data-bs-theme="dark"] .erp-page-header .subtitle, [data-bs-theme="dark"] .erp-stat .label { color: #8d98aa; }
[data-bs-theme="dark"] .erp-kanban-col { background: #1a2433; }
[data-bs-theme="dark"] .erp-noti-item { border-bottom-color: var(--erp-border); }
[data-bs-theme="dark"] .erp-noti-item:hover { background: #1d2838; }
[data-bs-theme="dark"] .btn-light { --bs-btn-bg: #1d2838; --bs-btn-border-color: #2a3443; --bs-btn-color: #d7dde6; --bs-btn-hover-bg: #243146; --bs-btn-hover-border-color: #2f3d53; --bs-btn-hover-color: #fff; }
[data-bs-theme="dark"] .erp-avatar { background: #24365a; color: #b9cdf7; }
[data-bs-theme="dark"] .erp-global-search .form-control { background: #0f1621; }
[data-bs-theme="dark"] .erp-footer { color: #6b778a; }
@media print {
    [data-bs-theme="dark"] body, [data-bs-theme="dark"] .card { background: #fff !important; color: #000; }
}

/* Alpine.js 초기화 전 깜빡임 방지 */
[x-cloak] { display: none !important; }
