/*
 * 파일관리 (시스템설정 > 파일관리) — 2026-09-08, 개발자 전용. B 탐색기형: 좌 트리 · 우 목록.
 * A-4 토큰(차콜블루 #3e6187 · 밴드 #f3f7fb · 보더 #dbe6f0). 시스템/업체 탭 공용.
 */
.sfm { font-size: 12.5px; color: #0f172a; }
.sfm-wrap { display: grid; grid-template-columns: 236px minmax(0, 1fr); gap: 12px; min-height: 520px; }
@media (max-width: 860px) { .sfm-wrap { grid-template-columns: 1fr; } }

/* ── 트리 ── */
.sfm-tree { background: #fff; border: 1px solid #dbe6f0; border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; }
.sfm-tree-hd { padding: 8px 12px; background: #f3f7fb; border-bottom: 1px solid #dbe6f0; font-size: 12px; font-weight: 700; color: #3e6187; }
.sfm-tree-hd-2 { border-top: 1px solid #eef4f9; margin-top: 6px; }
.sfm-tree-hd small { display: block; font-weight: 400; color: #94a3b8; font-size: 10.5px; margin-top: 1px; }
.sfm-tree-srch { padding: 8px; border-bottom: 1px solid #eef4f9; }
.sfm-tree-srch input { width: 100%; border: 1.5px solid #c4d3e2; border-radius: 9px; padding: 6px 9px; font-size: 12px; background: #fcfdfe; color: #0f172a; }
.sfm-tree-srch input:focus { outline: none; border-color: #3e6187; box-shadow: 0 0 0 3px #3e618722; background: #fff; }
.sfm-tree-scroll { max-height: 52vh; overflow: auto; }
.sfm-node { display: flex; align-items: center; gap: 6px; padding: 8px 12px; font-size: 12.5px; color: #374151; text-decoration: none;
  border-left: 3px solid transparent; cursor: pointer; }
.sfm-node:hover { background: #f8fbfd; }
.sfm-node.on { background: #f0f6ff; color: #3e6187; font-weight: 700; border-left-color: #3e6187; }
.sfm-node.sfm-sub { padding-left: 28px; font-size: 12px; }
.sfm-node.sfm-static { cursor: default; }
.sfm-node.sfm-static:hover { background: transparent; }
.sfm-node .sfm-cnt { margin-left: auto; font-size: 11px; color: #94a3b8; font-weight: 500; white-space: nowrap; }
.sfm-node.sfm-co { flex-direction: column; align-items: stretch; gap: 3px; }
.sfm-node.sfm-co.sel { background: #f8fbfd; }
.sfm-node.sfm-co.on { background: #f0f6ff; }
.sfm-co-t { display: flex; align-items: center; gap: 6px; min-width: 0; }
.sfm-co-t .sfm-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sfm-tree-ft { margin-top: auto; border-top: 1px solid #eef4f9; padding: 6px 0; }
.sfm-btn { width: 100%; background: transparent; border: none; border-left: 3px solid transparent; text-align: left; font: inherit; font-size: 12.5px; }

/* ── 본문 ── */
.sfm-main { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.sfm-crumb { font-size: 12px; color: #6b7280; }
.sfm-crumb b { color: #0f172a; }
.sfm-strip { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; background: #fff; border: 1px solid #dbe6f0; border-radius: 12px; padding: 10px 14px; font-size: 12px; }
.sfm-strip .sfm-bar { flex: 1 1 160px; }
.sfm-strip b { font-weight: 800; }
.sfm-mut { color: #94a3b8; font-size: 11.5px; }
.sfm-bar { height: 6px; border-radius: 4px; background: #e6edf4; overflow: hidden; display: block; }
.sfm-bar i { display: block; height: 100%; background: #3e6187; border-radius: 4px; }
.sfm-bar i.warn { background: #d97706; } .sfm-bar i.bad { background: #dc2626; } .sfm-bar i.teal { background: #0d9488; }
.sfm-bar.sfm-mini { height: 4px; }
.sfm-btn-sm { margin-left: auto; padding: 5px 12px; border-radius: 999px; border: 1px solid #dbe6f0; background: #fff; font-size: 11.5px; font-weight: 600; color: #374151; cursor: pointer; }
.sfm-btn-sm:hover { border-color: #3e6187; color: #3e6187; }
.sfm-btn-danger { margin-left: auto; padding: 5px 12px; border-radius: 999px; border: 1px solid #fecaca; background: #fff; font-size: 11.5px; font-weight: 600; color: #dc2626; cursor: pointer; }
.sfm-btn-danger:hover { background: #fef2f2; }

/* ── 섹션(필터+표) ── */
.sfm-sec { background: #fff; border: 1px solid #dbe6f0; border-radius: 12px; overflow: hidden; }
.sfm-filter { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 8px 12px; background: #f3f7fb; border-bottom: 1px solid #dbe6f0; }
.sfm-filter input[type="text"], .sfm-filter select { border: 1.5px solid #c4d3e2; border-radius: 10px; background: #fcfdfe; padding: 6px 10px; font-size: 12px; color: #374151; }
.sfm-filter input[type="text"] { min-width: 180px; }
.sfm-filter input:focus, .sfm-filter select:focus { outline: none; border-color: #3e6187; box-shadow: 0 0 0 3px #3e618722; background: #fff; }
.sfm-filter button[type="submit"] { padding: 6px 14px; background: #3e6187; color: #fff; border: none; border-radius: 999px; font-size: 11.5px; font-weight: 700; cursor: pointer; }
.sfm-filter button[type="submit"]:hover { background: #355475; }
.sfm-seg { display: inline-flex; background: #e9eff5; border-radius: 999px; padding: 2px; }
.sfm-seg a { padding: 4px 12px; border-radius: 999px; font-size: 11.5px; font-weight: 600; color: #6b7280; text-decoration: none; }
.sfm-seg a.on { background: #fff; color: #3e6187; box-shadow: 0 1px 2px rgba(15,23,42,.08); }
.sfm-count { margin-left: auto; font-size: 11.5px; color: #6b7280; }
.sfm-empty { padding: 44px 20px; text-align: center; color: #94a3b8; font-size: 13px; background: #fff; border: 1px dashed #c4d3e2; border-radius: 12px; }
.sfm-sec .sfm-empty { border: none; border-radius: 0; }
.sfm-table-wrap { overflow: auto; max-height: 58vh; }
.sfm-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.sfm-table th { position: sticky; top: 0; background: #fff; text-align: center; font-size: 11px; color: #94a3b8; font-weight: 600; padding: 8px 10px; border-bottom: 1px solid #dbe6f0; white-space: nowrap; }
.sfm-table td { padding: 8px 10px; border-bottom: 1px solid #eef4f9; text-align: center; vertical-align: middle; }
.sfm-table tr:last-child td { border-bottom: none; }
.sfm-table tr:hover td { background: #f8fbfd; }
.sfm-table .sfm-left { text-align: left; }
.sfm-table .sfm-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.sfm-table .sfm-name { font-weight: 600; color: #1e293b; max-width: 320px; display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.sfm-ft { display: inline-flex; width: 26px; height: 20px; border-radius: 5px; align-items: center; justify-content: center; font-size: 9.5px; font-weight: 800; color: #fff; margin-right: 6px; vertical-align: middle; }
.sfm-ft-image { background: #0ea5e9; } .sfm-ft-audio { background: #f59e0b; } .sfm-ft-document { background: #64748b; } .sfm-ft-video { background: #7c3aed; } .sfm-ft-archive { background: #0d9488; }
.sfm-acts { display: flex; gap: 4px; justify-content: flex-end; }
.sfm-ic { width: 26px; height: 26px; border-radius: 7px; border: 1px solid #dbe6f0; background: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; color: #475569; cursor: pointer; text-decoration: none; padding: 0; }
.sfm-ic:hover { border-color: #3e6187; color: #3e6187; }
.sfm-ic-red { color: #dc2626; border-color: #fecaca; }
.sfm-ic-red:hover { background: #fef2f2; border-color: #dc2626; color: #dc2626; }
.sfm-badge { display: inline-block; padding: 1px 7px; border-radius: 10px; font-size: 10px; font-weight: 600; white-space: nowrap; vertical-align: middle; }
.sfm-badge-off { background: #f1f5f9; color: #64748b; } .sfm-badge-warn { background: #fef3c7; color: #92400e; }
.sfm-badge-new { background: #ede9fe; color: #6d28d9; } .sfm-badge-out { background: #fff; color: #3e6187; border: 1px solid #c4d3e2; }

/* ── 채팅 첨부 정책 모달 (2026-09-09) ── */
.sfm-pol-wrap { padding: 16px; background: #f6f9fc; }
.sfm-pol-title { font-size: 15px; font-weight: 800; padding-left: 10px; border-left: 4px solid #3e6187; line-height: 1.2; margin-bottom: 12px; }
.sfm-pol-title small { display: block; font-size: 11.5px; font-weight: 400; color: #94a3b8; margin-top: 4px; }
.sfm-pol-sec { background: #fff; border: 1px solid #dbe6f0; border-radius: 12px; overflow: hidden; margin-bottom: 12px; }
.sfm-pol-hd { padding: 8px 14px; background: #f3f7fb; border-bottom: 1px solid #dbe6f0; font-size: 12px; font-weight: 700; color: #3e6187; }
.sfm-pol-hd small { font-weight: 400; color: #94a3b8; margin-left: 6px; }
.sfm-pol-ref td { font-size: 12px; }
.sfm-pol-in { width: 90px; border: 1.5px solid #c4d3e2; border-radius: 10px; background: #fcfdfe; padding: 6px 8px; font-size: 12.5px; text-align: right; color: #0f172a; }
.sfm-pol-in:focus { outline: none; border-color: #3e6187; box-shadow: 0 0 0 3px #3e618722; background: #fff; }
.sfm-pol-note { font-size: 11.5px; color: #6b7280; line-height: 1.6; background: #fff; border: 1px dashed #c4d3e2; border-radius: 10px; padding: 8px 12px; }
.sfm-pol-note code { font-size: 11px; background: #f1f5f9; padding: 1px 5px; border-radius: 4px; }