@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 12px 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: 1px solid var(--border-color) !important;
  border-radius: 4px !important;
  overflow: hidden;
}

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

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

/* —— 좌측 고객관리 —— */
.client-layer-user-menu .user_level {
  color: var(--theme-green-deep) !important;
}

.client-layer-user-menu .user_header_btn {
  background-color: var(--color-blue) !important;
  color: var(--button-text) !important;
  border-radius: 4px !important;
}

.client-layer-user-menu .user_header_btn:hover {
  background-color: var(--theme-green-deep) !important;
}

.client-layer-user-menu .user_header_btn[style*="background: #777"],
.client-layer-user-menu .user_header_btn[style*="background:#777"] {
  background: var(--color-gray-dark) !important;
}

/* 좌측 하단 설정 (공통 partial) */
.vertical-section-left .wr-pro-left-settings {
  margin-top: auto;
  position: sticky;
  bottom: 0;
  z-index: 5;
  border-top: 1px solid var(--border-color);
  background: var(--bg-secondary);
  padding: 8px 10px 12px;
}

.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 (명단) — 셸 톤
   세로 모바일: 메뉴바 아래, 우상/우하 radius, 폭 축소,
   라이트=어두운 배경·밝은 글자 / 다크=반대 (text↔bg var) */
@media (max-width: 768px) and (orientation: portrait) {
  .layer-toggle-btn {
    top: 130px !important; /* topbar + pro 카테고리 메뉴 아래 + 여백 */
    width: 32px !important;
    background: var(--text-primary) !important;
    border: 1px solid var(--text-secondary) !important;
    color: var(--bg-primary) !important;
    border-radius: 0 4px 4px 0 !important;
    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.08);
  }

  .layer-toggle-btn .layer-toggle-text {
    color: var(--bg-primary) !important;
  }

  .layer-toggle-btn:hover {
    border-color: var(--theme-green) !important;
    background: var(--text-secondary) !important;
  }
}

/* 태블릿 등 그 외: 기존 셸 톤 유지 */
@media (min-width: 769px), (max-width: 768px) and (orientation: landscape) {
  .layer-toggle-btn {
    background: var(--bg-secondary) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    border-radius: 0 4px 4px 0 !important;
    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.08);
  }

  .layer-toggle-btn .layer-toggle-text {
    color: var(--text-primary) !important;
  }

  .layer-toggle-btn:hover {
    border-color: var(--theme-green) !important;
    background: var(--bg-tertiary) !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 {
    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;
  }
}