@charset "utf-8";
/**
 * Pro 셸 × 별챗 톤 오버라이드
 * #pro-container.wr-shell-pro 로 공통 셸에 감쌈 — vertical-section-* ID 유지
 */

#pro-container.wr-shell-pro {
  --pro-accent: var(--color-blue, #5a6b4a);
  --pro-accent-hover: var(--theme-green-deep, #5a6b4a);
}

#pro-container.wr-shell-pro .wr-shell-grid {
  width: 100%;
  max-width: 1600px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 0 24px;
  box-sizing: border-box;
}

/* —— 카테고리 메뉴 바 —— */
.pro-category-menu-bar {
  background: var(--bg-secondary) !important;
  border-bottom: 1px solid var(--border-color) !important;
}

.pro-category-menu-item {
  color: var(--text-secondary) !important;
  border-radius: 4px !important;
}

.pro-category-menu-item:hover {
  background: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

.pro-category-menu-item.active {
  color: var(--text-primary) !important;
  background: var(--bg-primary) !important;
  box-shadow: inset 0 -2px 0 var(--theme-green) !important;
  font-weight: 700;
}

/* —— 패널: 제목 바만 박스, 본문은 테두리·좌우패딩 없음 —— */
.window-panel {
  border: none !important;
  border-radius: 0 !important;
  overflow: visible;
}

.window-panel-header {
  background: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: 4px !important;
}

/* 명단 레이어 제목: 배경·테두리 없음 */
#pro-container.wr-shell-pro .client-form-panel-header {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  color: var(--text-primary) !important;
}

.window-panel-body {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.panel-toggle-btn {
  color: var(--theme-green-deep) !important;
}

/* 좌측 드로어 레이아웃 */
.vertical-section-left.wr-shell-left {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

/* —— 실행 버튼·탭·링크: 블루 → 올리브 —— */
.simple-form-action-row .simple-manseoryeop-btn,
.output-btn,
.ganzhi-toggle-btn-client.simple-manseoryeop-btn,
button.btn_submit,
.btn_submit,
a.btn_b01,
.btn_b01,
a.btn_b02,
.btn_b02 {
  background: var(--color-blue) !important;
  border-color: var(--color-blue) !important;
  color: var(--button-text) !important;
  border-radius: 4px !important;
}

.fortune-report-tab.active,
.naming-panel .naming-tab.active,
.naming-eum .ohang-btn.active {
  background: var(--color-blue) !important;
  color: var(--button-text) !important;
  border-color: var(--color-blue) !important;
}

.fortune-report-tab {
  border-radius: 4px 4px 0 0;
}

#pro-container .saju-input-select:focus,
#pro-container input:focus,
#pro-container select:focus,
#pro-container textarea:focus {
  border-color: var(--theme-green) !important;
  outline-color: var(--theme-green);
}

/* layer toggle (명단) — 메뉴바 좌측 아이콘 (플로팅 제거) */
.pro-category-menu-left .layer-toggle-btn,
.pro-category-menu-left .pro-category-icon-btn {
  background: var(--bg-secondary) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-primary) !important;
}

.pro-category-menu-left .layer-toggle-btn:hover,
.pro-category-menu-left .pro-category-icon-btn:hover {
  background: var(--bg-tertiary) !important;
  border-color: var(--theme-green) !important;
  color: var(--text-primary) !important;
}

.pro-category-menu-left .pro-category-icon-btn.active,
.pro-category-menu-left .pro-category-icon-btn.is-active {
  background: var(--bg-primary) !important;
  color: var(--theme-green-deep) !important;
  box-shadow: inset 0 -2px 0 var(--theme-green) !important;
}

/* 하단 Pro 버튼 */
.pro-bottom-btn-left,
.pro-bottom-btn-right,
a.pro-bottom-btn-left,
a.pro-bottom-btn-right {
  background: var(--color-blue) !important;
  color: var(--button-text) !important;
  border-radius: 4px !important;
}

/* ≥1100: contents 구 1200 규칙 잔여 보정 */
@media (min-width: 1100px) {
  #pro-container.wr-shell-pro .layer-toggle-btn,
  #pro-container.wr-shell-pro .pro-category-menu-left .layer-toggle-btn {
    display: none !important;
  }

  #pro-container.wr-shell-pro .vertical-section-left.wr-shell-left {
    position: relative !important;
    left: auto !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    box-shadow: none !important;
  }

  #pro-container.wr-shell-pro .layer-overlay {
    display: none !important;
  }
}

/* —— 밀도: 표 가로 스크롤 · 좁은 화면 셀 패딩 —— */
#pro-container.wr-shell-pro .saju-display-wrapper,
#pro-container.wr-shell-pro .daeun-table-container,
#pro-container.wr-shell-pro .ohaeng-tab-content,
#pro-container.wr-shell-pro .ohaeng-all-section-content {
  max-width: 100%;
}

#pro-container.wr-shell-pro .fiveElements-table,
#pro-container.wr-shell-pro .tenGods-table,
#pro-container.wr-shell-pro .twelveFortune-table,
#pro-container.wr-shell-pro .wealthStructure-table,
#pro-container.wr-shell-pro .shishenShangguanStructure-table,
#pro-container.wr-shell-pro .careerStructure-table,
#pro-container.wr-shell-pro .saju-table,
#pro-container.wr-shell-pro .daeun-table,
#pro-container.wr-shell-pro .relationships-matrix {
  max-width: 100%;
}

/* 표가 부모를 넘치면 가로 스크롤 (셀 강제 압축 완화) */
#pro-container.wr-shell-pro .ohaeng-all-section-content,
#pro-container.wr-shell-pro .ohaeng-tab-content,
#pro-container.wr-shell-pro .saju-display-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

#pro-container.wr-shell-pro .defines-myung-wrap,
#pro-container.wr-shell-pro .defines-topic-list,
#pro-container.wr-shell-pro .defines-topic-item,
#pro-container.wr-shell-pro .defines-unse-detail {
  padding-left: 0;
  padding-right: 0;
}

@media (max-width: 768px) {
  #pro-container.wr-shell-pro .saju-table th,
  #pro-container.wr-shell-pro .saju-table td {
    padding: 8px 4px;
  }

  #pro-container.wr-shell-pro .fiveElements-table th,
  #pro-container.wr-shell-pro .fiveElements-table td,
  #pro-container.wr-shell-pro .tenGods-table th,
  #pro-container.wr-shell-pro .tenGods-table td {
    padding: 6px 3px;
    font-size: 12px;
  }

  #pro-container.wr-shell-pro .window-panel-header {
    padding-left: 10px;
    padding-right: 10px;
  }
}

/* 세로형 모바일: 카테고리 메뉴 전폭 */
@media (max-width: 768px) and (orientation: portrait) {
  #pro-container.wr-shell-pro .pro-category-menu-bar {
    width: calc(100% + 20px) !important;
    max-width: none !important;
    margin-left: -10px !important;
    margin-right: -10px !important;
  }

  #pro-container.wr-shell-pro .pro-category-menu-left {
    padding-left: 8px !important;
  }

  #pro-container.wr-shell-pro .pro-category-menu-scroll {
    padding-left: 4px !important;
    padding-right: 8px !important;
  }
}