/* =============================================================================
   graph_modal_theme_v2.css — v7 그래프 모달을 v2 다크+teal 테마로 리매핑
   ---------------------------------------------------------------------------
   · graph_modal.css(v7 원본, 밝은 페이퍼+오렌지) 뒤에 로드.
   · #gm-window의 --gm-* 토큰만 v2 팔레트(tokens.css)로 덮어써서 크롬을 맞춤.
   · 원본 graph_modal.css는 무수정 → v7 재동기화 유지. v2 색은 이 파일에만.
   · 플롯 표시(#gm-display)는 흰 카드 유지 — 캔버스 축·격자 가독성 +
     v2 규칙(content 카드는 항상 white)과 일치.
   ========================================================================== */

#gm-window {
  /* 표면 — v2 다크 네이비 (tokens.css: --bg-raise / --bg-raise-2) */
  --gm-paper:      #14141f;
  --gm-paper-2:    #1c1c2a;
  --gm-paper-3:    #262636;   /* hover */
  --gm-card:       #1c1c2a;   /* 입력·접기 카드 = 어두운 표면 (텍스트 크림 가독) */

  /* 텍스트 — 크림 (tokens.css: --text / --text-mute) */
  --gm-ink:        #f5f0e6;
  --gm-ink-soft:   #d8d3e0;
  --gm-faint:      #a8a4b3;

  /* 액센트 — 오렌지 → teal (tokens.css: --teal-bright) */
  --gm-orange:      #14b8a6;
  --gm-orange-soft: rgba(20, 184, 166, .16);
  --gm-orange-deep: #5eead4;  /* teal 틴트 위 밝은 teal 텍스트 */

  /* 경계·그림자 (tokens.css: --border-subtle / --shadow-card) */
  --gm-rule:       rgba(245, 240, 230, .14);
  --gm-rule-soft:  rgba(245, 240, 230, .07);
  --gm-sh-soft:    0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.5);
  --gm-sh-pop:     0 2px 6px rgba(0,0,0,.4), 0 16px 44px rgba(0,0,0,.62);
}

/* 플롯 표시 영역만 흰 카드 유지 (그래프 곡선·축 가독) */
#gm-window #gm-display { background: #ffffff; }

/* 3D 안내핀: 하드코딩 라이트 배경 → 다크 */
#gm-window #gm-3d-hint { background: rgba(20, 20, 31, .86); }

/* 스텝퍼 input 포커스 하드코딩 흰배경 → 어두운 표면 유지 */
#gm-window .gm-stepper input:focus { background: #20202f; }

/* danger hover 하드코딩 라이트핑크 → 다크 레드 틴트 */
#gm-window .gm-btn.gm-danger:hover { background: rgba(211, 64, 47, .18); }

/* primary(회전체 그리기): v7은 잉크(검정) 채움 → v2에선 teal 채움이 자연스러움 */
#gm-window .gm-btn.gm-primary {
  background: var(--gm-orange); color: #04201c; border-color: var(--gm-orange);
}
#gm-window .gm-btn.gm-primary:hover { background: #0fd6c0; }

/* 토글 활성/적용 버튼: 하드코딩 오렌지 그림자 → teal 그림자 */
#gm-window .gm-btn.gm-on { box-shadow: 0 2px 8px rgba(20, 184, 166, .32); }
#gm-window .gm-apply     { box-shadow: 0 2px 10px rgba(20, 184, 166, .30); }
