/* ============================================
   패키지 관리 페이지
   프리픽스: pkg_
   ============================================ */

/* ── 필터 바 ─────────────────────────────────── */

.pkg_filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 0;
  border-radius: var(--radius-xl) var(--radius-xl) 0 0;
  border: none;
  position: relative;
  z-index: 20;
}

.pkg_filter .cselect {
  width: 9rem;
}

.pkg_filter .cselect_trigger {
  height: 2.375rem;
}

.pkg_filter_right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* ── 테이블 스크롤 영역 ──────────────────────── */

.pkg_table_scroll {
  flex: 1 1 0%;
  min-height: 0;
  overflow-x: auto;
  overflow-y: auto;
}

.pkg_table_scroll::-webkit-scrollbar {
  width: 0;
  height: 9px;
}

.pkg_table_scroll::-webkit-scrollbar-corner {
  background: transparent;
}

/* ── 테이블 컬럼 너비 ────────────────────────── */
/* 순서: 카테고리 - 회원유형 - 패키지명 - 가격 - 마일리지 - 적용기간 - 활성 - 관리 */

.pkg_table {
  table-layout: fixed;
  min-width: 1100px;
}

/* 카테고리 */
.pkg_table .dtable_th:nth-child(1),
.pkg_table .dtable_td:nth-child(1) {
  width: 9%;
}

/* 회원유형 */
.pkg_table .dtable_th:nth-child(2),
.pkg_table .dtable_td:nth-child(2) {
  width: 9%;
}

/* 패키지명 */
.pkg_table .dtable_th:nth-child(3),
.pkg_table .dtable_td:nth-child(3) {
  width: 26%;
}

/* 가격 */
.pkg_table .dtable_th:nth-child(4),
.pkg_table .dtable_td:nth-child(4) {
  width: 10%;
}

/* 마일리지 */
.pkg_table .dtable_th:nth-child(5),
.pkg_table .dtable_td:nth-child(5) {
  width: 10%;
}

/* 적용기간 */
.pkg_table .dtable_th:nth-child(6),
.pkg_table .dtable_td:nth-child(6) {
  width: 18%;
}

/* 활성 */
.pkg_table .dtable_th:nth-child(7),
.pkg_table .dtable_td:nth-child(7) {
  width: 5%;
}

/* 관리 */
.pkg_table .dtable_th:nth-child(8),
.pkg_table .dtable_td:nth-child(8) {
  width: 9%;
}

/* ── dtable_badge 확장 ──────────────────────── */

/* 판매상태 (클릭형 토글 가능) */
.dtable_badge.is_sale_on {
  background-color: var(--c-success);
  color: #fff;
}

.dtable_badge.is_sale_off {
  background-color: var(--c-gray-400);
  color: #fff;
}

/* 박수 곱 */
.dtable_badge.is_nightly {
  background-color: #818cf8;
  color: #fff;
}

.dtable_badge.is_once {
  background-color: var(--c-gray-300);
  color: var(--c-text-2);
}

/* 마일리지 */
.dtable_badge.is_mileage_ok {
  background-color: var(--c-success);
  color: #fff;
}

.dtable_badge.is_mileage_no {
  background-color: var(--c-warning);
  color: #fff;
}

/* PMS 연동 */
.dtable_badge.is_pms_linked {
  background-color: #06b6d4;
  color: #fff;
}

/* 무료 */
.dtable_badge.is_free {
  background-color: #34d399;
  color: #fff;
}

/* 필수/선택 */
.dtable_badge.is_required {
  background-color: var(--c-error);
  color: #fff;
}

.dtable_badge.is_optional {
  background-color: var(--c-gray-200);
  color: var(--c-text-2);
}

/* 클릭 가능한 뱃지 */
.pkg_badge_click {
  cursor: pointer;
  border: none;
  font: inherit;
  transition: opacity var(--duration-fast) var(--ease-default);
}

.pkg_badge_click:hover {
  opacity: 0.85;
}

/* ── 가격 셀 ──────────────────────────────────── */
.pkg_price {
  font-weight: 500;
  color: var(--c-text-1);
}

.pkg_period_text {
  font-size: 0.75rem;
  color: var(--c-text-3);
  white-space: nowrap;
}

/* ── 카테고리 관리 모달 ─────────────────────── */

.pkg_cat_modal {
  max-width: 42rem;
}

.pkg_cat_help {
  font-size: 0.875rem;
  color: var(--c-text-2);
  line-height: 1.5;
  margin-top: 1rem;
  padding: 0.75rem;
  background-color: var(--c-gray-50);
  border-radius: var(--radius-lg);
}

.dark .pkg_cat_help {
  background-color: var(--c-surface-3);
}

/* 신규 등록 row */
.pkg_cat_new {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 1rem;
}

.pkg_cat_new .form_input {
  height: 2.375rem;
}

/* 카테고리 테이블 스크롤 래퍼 */
.pkg_cat_scroll {
  max-height: 20rem;
  overflow-y: auto;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-lg);
}

.dark .pkg_cat_scroll {
  border-color: var(--c-border-strong);
}

/* 카테고리 테이블 */
.pkg_cat_table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

.pkg_cat_table thead {
  position: sticky;
  top: 0;
  z-index: 1;
  background-color: var(--c-gray-100);
}

.dark .pkg_cat_table thead {
  background-color: var(--c-primary-100);
}

.pkg_cat_table th {
  text-align: left;
  padding: 0.5rem 0.75rem;
  font-weight: 500;
  font-size: 0.875rem;
  color: var(--c-text-2);
}

.pkg_cat_table .dtable_td {
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  color: var(--c-text-2);
  border-top: 1px solid var(--c-line);
}

.pkg_cat_row.is_inactive {
  opacity: 0.55;
}

/* 편집 모드 인풋: 행 높이 변화 없도록 축소 */
.pkg_cat_table .pkg_cat_row .form_input {
  height: 1.625rem;
  padding: 0 0.5rem;
  font-size: 0.8125rem;
  border-radius: var(--radius-md);
}

.pkg_cat_code {
  font-size: 0.875rem;
  color: var(--c-text-2);
}


/* ── 패키지 등록/수정 드로어 ──────────────────── */

/* 2열 그리드 */
.pkg_2col_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

/* 판매 가격 전체 너비 */
.pkg_price_half {
  width: 100%;
}

/* 판매 가격 입력 필드 우측 정렬 */
.pkg_price_half .form_input {
  text-align: right;
}

/* 운영 방식 박스 래퍼 */
.pkg_ops_box {
  padding: 1.25rem;
  border: 1px solid var(--c-input-border);
  border-radius: var(--radius-lg);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.dark .pkg_ops_box {
  border-color: var(--c-border-strong);
}

.pkg_ops_title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--c-text-1);
  margin-bottom: 0.25rem;
}

.dark .pkg_ops_title {
  color: var(--c-dark-text);
}

/* 운영 방식 그리드 (2열) */
.pkg_ops_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem 1rem;
}

.pkg_ops_item {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.pkg_ops_item_full {
  grid-column: 1 / -1;
}

.pkg_ops_label {
  font-size: 0.875rem;
  color: var(--c-text-2);
}

.dark .pkg_ops_label {
  color: var(--c-text-3);
}

/* 판매 기간 (토글 + 날짜 세로 배치) */
.pkg_period_inline {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
}

.pkg_period_inline .daterange_wrap {
  width: 100%;
}

/* 판매 기간 래퍼 */
.pkg_period_wrapper {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

/* 입력 필드 모서리 둥글게 */
.pkg_drawer .form_input {
  border-radius: var(--radius-xl);
}

/* 토글 버튼 고정 너비 (드로어 전용) */
.pkg_drawer .toggle_btn {
  width: 5.125rem;
  min-width: 5.125rem;
  flex: 0 0 auto;
  white-space: nowrap;
  padding: 0.5rem 0.75rem;
}

/* 토글 버튼 그룹 */
.pkg_drawer .toggle_btn_group {
  width: fit-content;
  display: flex;
}

/* 조식 선택 시 disabled 버튼 스타일 */
.pkg_drawer .toggle_btn:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}


/* 다크모드 달력: 공통 .dark .daterange_dropdown 스타일 사용 (별도 오버라이드 불필요) */

.pkg_modal {
  max-width: 38rem;
}

.pkg_modal_2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}

.pkg_modal_3col {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0.75rem;
}

.pkg_modal_calc {
  font-size: 0.8125rem;
  color: var(--c-text-2);
  background-color: var(--c-gray-50);
  border-radius: var(--radius-md);
  padding: 0.625rem 0.75rem;
  line-height: 1.6;
}

.dark .pkg_modal_calc {
  background-color: var(--c-surface-2);
  color: var(--c-text-2);
}

.pkg_modal_calc code {
  font-family: var(--font-mono, monospace);
  font-size: 0.75rem;
  padding: 0.125rem 0.375rem;
  background-color: var(--c-white);
  border: 1px solid var(--c-line);
  border-radius: var(--radius-sm);
  color: var(--c-text-1);
}

.dark .pkg_modal_calc code {
  background-color: var(--c-surface);
  border-color: var(--c-border);
}

.pkg_modal_calc strong {
  color: var(--c-primary-500);
  font-weight: 600;
}