/* ==========================================================================
   KOCS 관리자 대시보드 전용 스타일
   ========================================================================== */
.adm-body, .adm-body * {box-sizing: border-box;}
.adm-body {background: #F4F5F6; min-height: 100vh; margin: 0; font-family: "Pretendard GOV", "Pretendard", -apple-system, "Malgun Gothic", sans-serif; color: #1E2124;}
.adm-body ul, .adm-body ol {list-style: none; margin: 0; padding: 0;}
.adm-body img {max-width: 100%;}
.adm-body a {text-decoration: none;}

/* 상단바 */
.adm-topbar {display: flex; justify-content: space-between; align-items: center; height: 58px; padding: 0 24px; background: #14284B; color: #fff;}
.adm-brand {display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; font-size: 16px; font-weight: 700;}
.adm-brand-mark {display: inline-flex; align-items: center; justify-content: center; height: 30px; padding: 0 10px; border-radius: 8px; background: var(--krds-primary); font-size: 13px; font-weight: 800; letter-spacing: .5px;}
.adm-topbar-right {display: flex; align-items: center; gap: 12px;}
.adm-user {font-size: 14px; color: rgba(255,255,255,.85);}
.adm-tb-btn {display: inline-flex; align-items: center; height: 32px; padding: 0 14px; border-radius: 16px; border: 1px solid rgba(255,255,255,.4); color: #fff; font-size: 13px; text-decoration: none;}
.adm-tb-btn:hover {background: rgba(255,255,255,.12);}
.adm-tb-out {border-color: rgba(255,120,120,.6); color: #FFB4B4;}

/* 레이아웃 */
.adm-layout {display: flex; min-height: calc(100vh - 58px);}
.adm-sidebar {width: 230px; flex-shrink: 0; background: #fff; border-right: 1px solid var(--krds-gray-20); padding: 18px 0;}
.adm-sidebar nav {display: flex; flex-direction: column;}
.adm-nav-group {padding: 16px 20px 6px; font-size: 11.5px; font-weight: 700; color: var(--krds-gray-50); letter-spacing: .5px;}
.adm-sidebar nav a {display: flex; align-items: center; gap: 10px; padding: 10px 20px; font-size: 14.5px; color: var(--krds-gray-70); text-decoration: none;}
.adm-sidebar nav a:hover {background: var(--krds-gray-5); color: var(--krds-primary-dark);}
.adm-sidebar nav a.adm-on {background: var(--krds-bg-sub); color: var(--krds-primary-dark); font-weight: 700; border-right: 3px solid var(--krds-primary);}
.adm-nav-soon {display: flex; align-items: center; gap: 10px; padding: 10px 20px; font-size: 14.5px; color: var(--krds-gray-40);}
.adm-ico {width: 18px; height: 18px; opacity: .72; flex-shrink: 0;}
.adm-on .adm-ico {opacity: 1;}
.adm-nav-soon .adm-ico {opacity: .35;}

.adm-content {flex: 1; min-width: 0; padding: 22px 28px 48px;}
.adm-content > * {max-width: 1240px;}
@media (min-width: 1700px) {
    .adm-content {padding-left: 48px;}
}
.adm-page-title {font-size: 22px; font-weight: 800; margin: 0 0 4px;}
.adm-page-title::after {content: ""; display: block; width: 34px; height: 3px; border-radius: 2px; background: var(--krds-primary); margin-top: 8px; margin-bottom: 16px;}

/* 통계 카드 — KRDS 톤 (절제된 파랑·회색) */
.adm-stat-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px;}
.adm-stat {display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid var(--krds-gray-20); border-radius: 12px; padding: 18px 20px; box-shadow: 0 1px 3px rgba(16,24,40,.05);}
.adm-stat .adm-stat-ico {display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 10px; background: var(--krds-bg-sub); flex-shrink: 0;}
.adm-stat .adm-stat-ico img {width: 22px; height: 22px;}
.adm-stat .adm-stat-label {font-size: 13px; font-weight: 600; color: var(--krds-gray-60);}
.adm-stat .adm-stat-value {margin-top: 2px; font-size: 26px; font-weight: 800; color: var(--krds-primary-dark); letter-spacing: -.5px;}
.adm-stat .adm-stat-value small {font-size: 13.5px; font-weight: 600; color: var(--krds-gray-50); margin-left: 2px;}

/* 카드/패널 */
.adm-panel {background: #fff; border: 1px solid var(--krds-gray-20); border-radius: 12px; padding: 20px 22px; margin-bottom: 16px; box-shadow: 0 1px 3px rgba(16,24,40,.05);}
.adm-panel h2 {font-size: 16px; font-weight: 700; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--krds-gray-10);}
.adm-grid-2 {display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start;}

/* 이전된 구 관리화면(component.css) 요소 보정 */
.adm-panel .condition {display: flex; gap: 8px; align-items: center; flex-wrap: nowrap; padding: 14px 16px; margin-bottom: 14px; background: var(--krds-gray-5); border: 1px solid var(--krds-gray-20); border-radius: 8px;}
.adm-panel .condition .item {margin: 0 !important; float: none !important;}
.adm-panel .condition label.f_select {position: static; width: auto; height: auto; padding: 0; border: 0; background: none; flex-shrink: 0;}
.adm-panel .condition select {height: 42px; min-width: 130px; padding: 0 34px 0 12px; border: 1px solid var(--krds-gray-30); border-radius: 6px; background-color: #fff; font-size: 14px;}
.adm-panel .condition .f_search {display: flex; gap: 8px; align-items: center; position: static; width: auto; flex: 1; min-width: 0; border: 0; background: none; padding: 0;}
.adm-panel .condition .f_search input[type="text"],
.adm-panel .condition input.f_input {flex: 1; width: auto !important; height: 42px; padding: 0 14px; border: 1px solid var(--krds-gray-30); border-radius: 6px; font-size: 14px; background: #fff;}
.adm-panel .condition .btn,
.adm-panel .condition a.btn,
.adm-panel .condition button {display: inline-flex; align-items: center; justify-content: center; position: static; width: auto !important; height: 42px; padding: 0 20px; border-radius: 6px; border: 1px solid var(--krds-gray-30); background: #fff; color: var(--krds-gray-70); font-size: 14px; font-weight: 700; cursor: pointer; text-indent: 0; line-height: 1; flex-shrink: 0;}
.adm-panel .condition .btn_blue_46,
.adm-panel .condition a[class*="btn_blue"] {background: var(--krds-primary); border-color: var(--krds-primary); color: #fff;}
.adm-panel .board_list table {width: 100%; border-collapse: collapse; font-size: 14.5px; border-top: 2px solid var(--krds-gray-80);}
.adm-panel .board_list caption {position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0);}
.adm-panel .board_list th {padding: 11px 12px; background: var(--krds-gray-5); border-bottom: 1px solid var(--krds-gray-20); font-weight: 700;}
.adm-panel .board_list td {padding: 11px 12px; border-bottom: 1px solid var(--krds-gray-10); text-align: center;}
.adm-panel .board_list td a {color: var(--krds-primary-dark);}
.adm-panel .txt_1 {font-size: 14px; color: var(--krds-gray-60); margin-bottom: 12px;}
.adm-panel .tit_2 {font-size: 16px; font-weight: 700; margin: 6px 0 12px;}
.adm-panel .tit_3 {font-size: 15px; font-weight: 700; margin: 14px 0 8px;}

/* 구 관리화면의 입력 폼(등록/수정) 보정 — board_view / board_view2 / board_write 공통 */
.adm-panel .board_view, .adm-panel .board_view2, .adm-panel .board_write {width: 100% !important;}
.adm-panel .board_view table, .adm-panel .board_view2 table, .adm-panel .board_write table {width: 100% !important; border-collapse: collapse; font-size: 14.5px; border-top: 2px solid var(--krds-gray-80); table-layout: fixed;}
.adm-panel .board_view caption, .adm-panel .board_view2 caption, .adm-panel .board_write caption {position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0);}
.adm-panel .board_view th, .adm-panel .board_view2 th, .adm-panel .board_write th {padding: 13px 16px; background: var(--krds-gray-5); border-bottom: 1px solid var(--krds-gray-20); text-align: left; width: 180px; font-weight: 700; vertical-align: middle;}
.adm-panel .board_view td, .adm-panel .board_view2 td, .adm-panel .board_write td {padding: 11px 16px; border-bottom: 1px solid var(--krds-gray-10); vertical-align: middle;}
.adm-panel input[type="text"], .adm-panel input[type="number"], .adm-panel input[type="email"], .adm-panel input[type="tel"], .adm-panel input[type="password"] {height: 42px; padding: 0 14px; border: 1px solid var(--krds-gray-30); border-radius: 6px; font-size: 14.5px; max-width: 100%;}
.adm-panel td input.f_txt, .adm-panel td input.w_full {width: 100% !important;}
.adm-panel select {height: 42px; min-width: 160px; padding: 0 34px 0 12px; border: 1px solid var(--krds-gray-30); border-radius: 6px; font-size: 14.5px; background-color: #fff;}
.adm-panel textarea {width: 100%; max-width: 100%; padding: 12px 14px; border: 1px solid var(--krds-gray-30); border-radius: 6px; font-size: 14.5px;}

/* 폼 하단 버튼 영역 (board_view_bot: 좌측 목록 / 우측 저장) */
.adm-panel .board_view_bot {display: flex; justify-content: flex-end; align-items: center; gap: 8px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--krds-gray-20);}
.adm-panel .board_view_bot .left_col {order: 1;}
.adm-panel .board_view_bot .right_col {order: 2; display: flex; gap: 8px;}
.adm-panel .board_view_bot .btn, .adm-panel .board_view_bot a.btn, .adm-panel .board_view_bot button {display: inline-flex; align-items: center; justify-content: center; height: 42px; padding: 0 22px; border-radius: 6px; border: 1px solid var(--krds-gray-30); background: #fff; color: var(--krds-gray-70); font-size: 14.5px; font-weight: 700; cursor: pointer; text-decoration: none; line-height: 1;}
.adm-panel .board_view_bot .btn_blue_46, .adm-panel .board_view_bot [class*="btn_blue"] {background: var(--krds-primary); border-color: var(--krds-primary); color: #fff;}
.adm-panel .radio_wrap {display: inline-flex; gap: 18px; align-items: center;}
.adm-panel .radio_wrap label {display: inline-flex; align-items: center; gap: 6px;}

/* 테이블 */
.adm-table {width: 100%; border-collapse: collapse; font-size: 14.5px;}
.adm-table th {padding: 10px 12px; background: var(--krds-gray-5); border-bottom: 1px solid var(--krds-gray-20); text-align: left; font-weight: 700; color: var(--krds-gray-70); white-space: nowrap;}
.adm-table td {padding: 10px 12px; border-bottom: 1px solid var(--krds-gray-10); color: var(--krds-gray-70);}
.adm-table tr:hover td {background: var(--krds-gray-5);}
.adm-table a {color: var(--krds-primary-dark); text-decoration: none;}
.adm-table a:hover {text-decoration: underline;}

/* 배지 */
.adm-badge {display: inline-block; padding: 3px 10px; border-radius: 11px; font-size: 12px; font-weight: 700;}
.adm-badge-on {background: #E3F0E6; color: #1D7D3F;}
.adm-badge-off {background: var(--krds-gray-10); color: var(--krds-gray-50);}

/* 버튼 */
.adm-btn {display: inline-flex; align-items: center; justify-content: center; height: 38px; padding: 0 18px; border-radius: 6px; font-size: 14px; font-weight: 700; text-decoration: none; border: 0; cursor: pointer;}
.adm-btn-primary {background: var(--krds-primary); color: #fff !important;}
.adm-btn-primary:hover {background: var(--krds-primary-dark);}
.adm-btn-line {background: #fff; border: 1px solid var(--krds-gray-30); color: var(--krds-gray-70) !important;}
.adm-btn-danger {background: #fff; border: 1px solid #E8A0A6; color: #C31220 !important;}
.adm-btn-sm {height: 30px; padding: 0 12px; font-size: 13px;}

/* 폼 */
.adm-form-row {display: flex; gap: 16px; margin-bottom: 16px; align-items: flex-start;}
.adm-form-row label.adm-form-label {width: 120px; flex-shrink: 0; padding-top: 10px; font-size: 14.5px; font-weight: 700; color: var(--krds-gray-70);}
.adm-input, .adm-textarea, .adm-select {width: 100%; max-width: 640px; padding: 10px 14px; border: 1px solid var(--krds-gray-30); border-radius: 6px; font-size: 14.5px;}
.adm-input:focus, .adm-textarea:focus {outline: 2px solid var(--krds-primary); border-color: var(--krds-primary);}
.adm-textarea {min-height: 90px; resize: vertical;}
.adm-form-actions {display: flex; gap: 8px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--krds-gray-20);}
.adm-hint {font-size: 13px; color: var(--krds-gray-50); margin-top: 6px;}

/* 만족도 그래프 — 가로 막대 */
.adm-bars {display: flex; flex-direction: column; gap: 12px; padding: 4px 0;}
.adm-bar-row {display: flex; align-items: center; gap: 12px;}
.adm-bar-label {flex-shrink: 0; width: 108px; font-size: 13.5px; color: var(--krds-gray-70); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.adm-bar-track {flex: 1; height: 22px; border-radius: 11px; background: var(--krds-gray-10); overflow: hidden;}
.adm-bar-fill {display: block; height: 100%; border-radius: 11px; transition: width .5s ease;}
.adm-bar-5 {background: #2BA353;} .adm-bar-4 {background: #6FBF73;} .adm-bar-3 {background: #F59E0B;}
.adm-bar-2 {background: #F08A5D;} .adm-bar-1 {background: var(--krds-point);}
.adm-bar-val {flex-shrink: 0; width: 50px; text-align: right; font-size: 13.5px; font-weight: 700; color: var(--krds-gray-70);}
/* 만족도 그래프 — 세로 막대 */
.adm-vbars {display: flex; align-items: flex-end; justify-content: space-around; gap: 10px; height: 180px; padding-top: 10px;}
.adm-vbar-col {display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 1;}
.adm-vbar {width: 60%; max-width: 40px; min-height: 3px; border-radius: 5px 5px 0 0; background: linear-gradient(180deg, var(--krds-primary) 0%, var(--krds-primary-dark) 100%);}
.adm-vbar-cnt {font-size: 12.5px; font-weight: 700; color: var(--krds-primary-dark);}
.adm-vbar-day {font-size: 12px; color: var(--krds-gray-50);}

@media (max-width: 900px) {
    .adm-layout {flex-direction: column;}
    .adm-sidebar {width: 100%;}
    .adm-stat-grid {grid-template-columns: repeat(2, 1fr);}
    .adm-grid-2 {grid-template-columns: 1fr;}
}

/* 관리자 폼 항목 아래 도움말 문구 (SEO 관리 등) */
.adm-help {
    margin: 6px 0 0;
    font-size: 12.5px;
    line-height: 1.6;
    color: var(--krds-gray-50, #6b7280);
}
.adm-help code {
    padding: 1px 5px;
    border-radius: 4px;
    background: var(--krds-gray-10, #f1f3f5);
    font-size: 12px;
}