/* Minimal tweaks on top of Bootstrap 5 */
:root{
  --sidebar-w: 260px;
}

body{ background:#f6f7fb; }

.app-shell{ min-height:100vh; }

.sidebar{
  width:var(--sidebar-w);
  position:fixed;
  top:0; left:0;
  height:100vh;
  overflow-y:auto;
  background:#111827;
}

.sidebar .brand{
  height:56px;
  display:flex;
  align-items:center;
  padding:0 16px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.sidebar .brand a{
  color:#fff;
  text-decoration:none;
  font-weight:700;
  letter-spacing:.2px;
}

/* ===== Sidebar nav ===== */
.sidebar .nav-section{
  padding:10px 10px; /* tighter */
}

/* (구버전 호환) 섹션 라벨 */
.sidebar .nav-label{
  color:rgba(255,255,255,.75);
  font-size:.95rem;
  font-weight:700;
  margin:8px 10px 6px;
  padding:10px 6px 6px;
  border-top:1px solid rgba(255,255,255,.10);
  text-transform:none;
  letter-spacing:0;
}

/* (신버전) details/summary 기반 섹션 */
.nav-group{
  border-top:1px solid rgba(255,255,255,.10);
  padding-top:8px;
  margin-top:8px;
}
.nav-group:first-child{
  border-top:none;
  padding-top:0;
  margin-top:0;
}

.nav-title{
  list-style:none;
  cursor:pointer;
  user-select:none;
  color:rgba(255,255,255,.80);
  font-size:.95rem;
  font-weight:700;
  padding:6px 6px;
  margin:0 4px 4px;
}
.nav-title::-webkit-details-marker{ display:none; }
.nav-title::marker{ content:""; }

.nav-title:after{
  content:"›";
  float:right;
  opacity:.55;
  transform:rotate(90deg);
  transition:transform .12s ease;
}
.nav-group:not([open]) .nav-title:after{
  transform:rotate(0deg);
}

.nav-items{ padding:0 4px 2px; }

.sidebar .nav-link{
  color:rgba(255,255,255,.78);
  border-radius:.5rem;
  padding:.30rem .75rem;  /* 50% tighter */
  display:flex;
  gap:.6rem;
  align-items:center;
}

.sidebar .nav-link:hover{
  color:#fff;
  background:rgba(255,255,255,.08);
}

.sidebar .nav-link.active{
  color:#fff;
  background:rgba(59,130,246,.22);
  border:1px solid rgba(59,130,246,.35);
}

.main{
  margin-left:var(--sidebar-w);
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

.topbar{
  height:56px;
  position:sticky;
  top:0;
  z-index:1020;
  background:#fff;
  border-bottom:1px solid rgba(0,0,0,.08);
}

.content{
  padding:20px 20px 40px;
  flex:1;
}

.card-kpi .kpi-title{ color:#6b7280; font-size:.85rem; }
.card-kpi .kpi-value{ font-size:1.6rem; font-weight:700; }
.card-kpi .kpi-meta{ color:#6b7280; font-size:.85rem; }

.section-title{
  font-weight:700;
  letter-spacing:.2px;
}

.help-text{
  color:#6b7280;
  font-size:.9rem;
}

.table thead th{
  color:#6b7280;
  font-weight:600;
  font-size:.85rem;
}

.form-label{ color:#374151; font-weight:600; }
.form-control, .form-select{ border-radius:.6rem; }
.btn{ border-radius:.6rem; }

.badge-soft{
  background:rgba(59,130,246,.12);
  color:#1d4ed8;
  border:1px solid rgba(59,130,246,.25);
}

@media (max-width: 991.98px){
  :root{ --sidebar-w: 0px; }
  .sidebar{ display:none; }
  .main{ margin-left:0; }
}


.brand-badge{
  font-size:1.1rem;
  font-weight:700;
  padding:6px 12px;
  border-radius:999px;
  background:#f1f3f5;
  border:1px solid #dee2e6;
  letter-spacing:.5px;
}

.brand-btn{
  font-size:1.15rem;
  font-weight:700;
  padding:6px 14px;
  border-radius:8px;
  border:1px solid #ced4da;
  background:#fff;
  cursor:default;
}
.brand-btn:hover{ background:#f8f9fa; }


.dash-badge{
  font-size:20px !important;
}


/* === filter inline (single row) === */
.filter-inline{
  display:flex;
  flex-wrap:nowrap;          /* 여러 줄 금지 */
  gap:12px;
  overflow-x:auto;           /* 한 줄 유지 + 가로 스크롤 */
  padding-bottom:6px;
}
.filter-cell{
  flex:0 0 auto;             /* 줄바꿈 방지 */
  min-width:360px;           /* 각 필터 최소 폭 */
}
.filter-cell .filter-line{
  display:flex;
  align-items:flex-start;
  gap:10px;
}
.filter-cell .filter-label{
  width:110px;               /* 라벨 고정폭 */
  padding-top:6px;
  font-weight:600;
  color:#374151;
  white-space:nowrap;
}
.filter-cell .filter-input{
  flex:1;
  min-width:0;
}
.chk-row{
  flex-wrap:nowrap;          /* 체크박스도 줄바꿈 금지 */
  overflow-x:auto;
  white-space:nowrap;
}

.filter-actions{
  display:flex;
  justify-content:center;    /* 하단 중앙 */
  margin-top:12px;
}
.filter-actions .btn{
  min-width:160px;
  font-weight:700;
}

.brand-title { font-size: 26px; }  /* 서비스 타이틀 */