/* [F2.1] UV영업자료 페이지 — 버튼/모달/테이블/슬라이드패널 페이지 한정 정의
   (Bgent-label themes.css 변수에 맞춰 색팔레트 통일) */

/* ─── 버튼 ─── */
.btn { display:inline-flex; align-items:center; justify-content:center;
  height:34px; padding:0 14px; border-radius:6px; cursor:pointer;
  font-size:13px; font-weight:600; border:1px solid transparent;
  transition: background .12s, border-color .12s; user-select:none;
}
.btn-sm { height:28px; padding:0 12px; font-size:12px; }
.btn-primary  { background:#1e3a5a; color:#9eb8d8; border-color:#2a5a8a; }
.btn-primary:hover  { background:#2a4a6a; }
.btn-outline  { background:transparent; color:var(--text-secondary); border-color:var(--border-primary); }
.btn-outline:hover  { background:var(--bg-hover); color:var(--text-primary); }
.btn-secondary{ background:var(--bg-tertiary); color:var(--text-secondary); border-color:var(--border-primary); }
.btn-secondary:hover{ background:var(--bg-hover); }
.btn-danger { background:#3a1e1e; color:#f08; border-color:#5a2a2a; }
.btn-danger:hover { background:#4a2a2a; }
.btn:disabled { opacity:0.5; cursor:not-allowed; }

/* ─── 텍스트 색 보조 ─── */
.text-green  { color: var(--success, #10b981); }
.text-orange { color: var(--warning, #f59e0b); }
.text-gray   { color: var(--text-muted); }
.text-right  { text-align: right; }

/* ─── 데이터 테이블 ─── */
.data-table { width: max-content; min-width:100%; border-collapse: collapse; font-size:12px; }
.data-table th, .data-table td { padding:8px 10px; border-bottom:1px solid var(--border-primary); white-space:nowrap; }
.data-table th { background: var(--bg-tertiary); font-weight:600; color: var(--text-secondary);
  position: sticky; top:0; z-index:10; }
.data-table tbody tr { cursor: pointer; }
.data-table tbody tr:hover { background: var(--bg-tertiary); }
.data-table .col-check { width:40px; text-align:center; }
.empty-message { text-align:center; padding:40px 0; color: var(--text-muted); font-size:13px; }

/* ─── 페이지네이션 ─── */
.pagination { display:flex; gap:4px; }
.pagination button { padding:6px 12px; border:1px solid var(--border-primary);
  background: var(--bg-tertiary); color: var(--text-primary);
  border-radius:4px; cursor:pointer; font-size:13px; }
.pagination button:hover { background: var(--bg-hover); }
.pagination button.active { background: var(--accent-blue); border-color: var(--accent-blue); color:#fff; }
.pagination button:disabled { opacity:0.5; cursor:not-allowed; }

/* ─── 모달 ─── */
.modal-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,0.6);
  display:none; align-items:center; justify-content:center; z-index:100;
}
.modal-overlay.active { display:flex; }
.modal-container {
  background: var(--bg-secondary); border:1px solid var(--border-primary);
  border-radius:10px; width:90%; max-width:560px;
  box-shadow:0 16px 40px rgba(0,0,0,0.6);
  display:flex; flex-direction:column; max-height:90vh;
}
.modal-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 18px; border-bottom:1px solid var(--border-primary);
}
.modal-header h3 { margin:0; font-size:14px; color: var(--text-primary); font-weight:700; }
.modal-close {
  background:transparent; border:0; color: var(--text-muted);
  font-size:18px; cursor:pointer; padding:4px 8px; border-radius:4px;
}
.modal-close:hover { background: var(--bg-hover); color: var(--text-primary); }
.modal-body { padding:18px; overflow:auto; }
.modal-footer {
  display:flex; justify-content:flex-end; gap:8px;
  padding:12px 18px; border-top:1px solid var(--border-primary);
}

/* ─── 업로드 zone ─── */
.upload-zone {
  border:2px dashed var(--border-primary); border-radius:8px;
  padding:30px 20px; text-align:center; cursor:pointer;
  background: var(--bg-input);
  transition: border-color .12s, background .12s;
}
.upload-zone:hover, .upload-zone.dragover {
  border-color: var(--warning); background: rgba(245,158,11,0.05);
}
.upload-icon { font-size:36px; line-height:1; }
.upload-text { font-size:14px; color: var(--text-primary); margin-top:8px; }
.upload-hint { font-size:11px; color: var(--text-muted); margin-top:4px; }
.selected-file {
  margin-top:12px; display:none; align-items:center; justify-content:space-between;
  padding:8px 12px; background: var(--bg-input);
  border:1px solid var(--border-primary); border-radius:6px;
  font-size:12px; color: var(--text-primary);
}
.clear-file {
  background:transparent; border:0; color: var(--text-muted);
  cursor:pointer; font-size:14px; padding:0 6px;
}
.clear-file:hover { color:#ff6b6b; }

/* ─── 슬라이드 패널 ─── */
.slide-panel {
  position:fixed; top:60px; right:-560px; bottom:0; width:500px;
  background: var(--bg-secondary); border-left:1px solid var(--border-primary);
  z-index:90; transition: right .2s ease;
  display:flex; flex-direction:column; box-shadow:-8px 0 24px rgba(0,0,0,0.4);
}
.slide-panel.active { right:0; }
.slide-panel.w-500 { width:500px; }
.slide-panel-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 18px; border-bottom:1px solid var(--border-primary);
}
.slide-panel-header h3 { margin:0; font-size:14px; color: var(--text-primary); font-weight:700; }
.slide-panel-close {
  background:transparent; border:0; color: var(--text-muted);
  font-size:18px; cursor:pointer; padding:4px 8px; border-radius:4px;
}
.slide-panel-close:hover { background: var(--bg-hover); color: var(--text-primary); }
.slide-panel-body { flex:1; overflow:auto; padding:18px; }
.slide-panel-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,0.35);
  display:none; z-index:85;
}
.slide-panel-overlay.active { display:block; }

.detail-group { margin-bottom:20px; }
.detail-group-title {
  font-size:12px; font-weight:700; color: var(--accent-blue);
  margin-bottom:10px; padding-bottom:6px;
  border-bottom:1px solid var(--border-primary);
}
.detail-row { display:flex; margin-bottom:6px; font-size:12px; }
.detail-label { width:110px; color: var(--text-secondary); flex-shrink:0; }
.detail-value { flex:1; color: var(--text-primary); word-break:break-all; }
