/* =========================================================
   FluxHub Common — 고객 화면 공통 토큰 (--fx-*)   핸들: fhc-ui-tokens
   =========================================================

   기능 랜딩 시연과 같은 모양·색(검정 + 라임)을 고객 화면에 주는 토큰이다.
   값의 출처: specs/2026-10-09-flux-uiux-unify/design-spec.md 1절 (관리자 --fxa-* 와 값이 같다).

   ── 선언 위치 ──
   :root 가 아니라 `.fx-ui` 와 각 플러그인 고객 화면 루트 클래스에 선언한다(design-spec 6절).
   사이트 테마의 :root 변수와 섞이지 않게 하려는 것이다. 새 고객 화면은 루트에 `fx-ui` 클래스를
   달거나, 아래 목록에 자기 루트 클래스를 추가한다.

   ── 규칙 ──
   · (2026-11 변경) 라임 자리(--fx-lime*)는 사이트 대표 색 그 자체(--fh-accent-fill)를, 그 위 글자는 --fx-on-lime 을 따른다. soft·row 넓은 면은 대표 색의 옅은 톤(FHC_Brand 가 템플릿 사이트에만 출력).
     대표 색 변수가 없는 사이트(허브 본 사이트)는 기존 라임 폴백 그대로. 주 버튼·글자는 여전히 검정.
   · 라임(대표 색)은 켜짐·선택됨·방금 바뀜 면에만, 그 면 위 글자는 항상 --fx-on-lime(대표 색에 맞춰 흰/검정 자동, 4.5:1 이상 — --fx-ink 고정 금지). 라임을 글자색·얇은 선으로 쓰지 않는다.
   · 플러그인 CSS 는 색 리터럴을 새로 쓰지 않는다 — 이 토큰만 쓴다(scripts/validate.sh 19번).
   · 기존 변수 세트(--fhc-* · --fxm-* · --acct-* · --fhs-* …)는 값을 var(--fx-…) 로 이어서 쓴다.
   · 이 파일은 화면에 보이는 규칙이 없다. 부품 모양은 ui.css(핸들 fhc-ui).
   ========================================================= */

:root {
	/* 라임 자리 연결 — .fx-ui 루트 밖(오래된 셀렉터·플로팅 요소)에서도 대표 색을 따른다. 값은 아래 루트 선언과 같다. */
	--fx-lime: var(--fh-accent-fill, #c8f05a);
	--fx-lime-2: var(--fh-accent-fill-2, #b5e03c);
	--fx-lime-soft: var(--fh-accent-fill-soft, #eef9cf);
	--fx-lime-row: var(--fh-accent-fill-row, rgba(200, 240, 90, 0.22));
	--fx-on-lime: var(--fh-accent-on, #111111);
	--fx-lime-lite: var(--fh-accent-lite, #c8f05a);
}

.fx-ui,
/* fluxshop */
.fluxshop, .fhs-wrap, .fhs-pdp, .fluxshop-cart, .fhs-checkout, .fhs-account, #fhs-cart-drawer,
/* fluxshop-ebook · fluxshop-groupbuy */
.fhs-ebook-reader, .fhs-ebook-card, .fhs-ebook-shelf, .gb-round, .gb-home,
/* fluxmember · fluxhub-common */
.fluxmember-auth, .fluxmember-mypage, .fluxmember,
.fxm, .fhc-bell, .fhc-msg, .fhc-notify-prefs, .fxi, .acct,
/* fluxboard · fluxlms · fluxlink · fluxpost · fluxcs */
.fluxboard, .fs-board, .fb-cafe, .flux-lms, .flms-learn, .fxl-page, .fxp-lock, .fxp-series, .fcs-w,
/* fluxreach · fluxads · fluxpop · flux-adult-gate · fluxhub-admin-auth */
.fxr-event, .fxr-inapp, .fxad-apply, .fxad-my, .fp-popup, .fag-gate, .fha-login, .fha-session, .fha-modal {
	/* 면 */
	--fx-surface: #ffffff;                       /* 카드·입력·표 */
	--fx-canvas: #f5f5f5;                        /* 고객 화면의 회색 구역 */
	--fx-sunken: #f2f3f5;                        /* 말풍선·공지 행·썸네일 자리·트랙 */

	/* 선 */
	--fx-line: #ededf0;                          /* 행 구분선 */
	--fx-line-strong: #dcdee3;                   /* 카드·입력·칩 테두리, 꺼진 스위치 트랙 */

	/* 글자 */
	--fx-ink: #111111;                           /* 제목·본문 강조·버튼 면 */
	--fx-ink-2: #5d5f6d;                         /* 본문·라벨 */
	--fx-ink-3: #6b6e7b;                         /* 캡션·표 머리·단위(회색 바탕 위에서도 4.5:1) */
	--fx-ink-4: #9298a6;                         /* 장식 회색 — 글자 금지(3.0:1) */

	/* 강조 */
	--fx-accent: #111111;                        /* 주 버튼·링크·포커스 링 */
	--fx-accent-hover: #2b2b29;
	--fx-on-accent: #ffffff;

	/* 라임 — 켜짐·선택됨·방금 바뀜 면에만. 위 글자는 --fx-ink */
	--fx-lime: var(--fh-accent-fill, #c8f05a);                            /* 선택·켜짐 면 = 대표 색 그대로(없으면 라임) */
	--fx-on-lime: var(--fh-accent-on, #111111);                          /* 위 면 위 글자 = 흰/검정 중 대비 높은 쪽(4.5:1 이상) */
	--fx-lime-lite: var(--fh-accent-lite, #c8f05a);                      /* 어두운 바탕 위 글자·아이콘용(대표 색을 밝게 보정) */
	--fx-lime-2: var(--fh-accent-fill-2, #b5e03c);                        /* 라임 칩 hover */
	--fx-lime-soft: var(--fh-accent-fill-soft, #eef9cf);                     /* 활성 탭·선택된 행 바탕 */
	--fx-lime-row: var(--fh-accent-fill-row, rgba(200, 240, 90, 0.22));     /* 새로 생긴 줄·합계 줄 */

	/* 위험 — 오류·삭제·필수 표시에만 */
	--fx-danger: #c2352b;
	--fx-danger-soft: #fbecea;

	/* 형태 */
	--fx-radius: 16px;                           /* 카드·섹션·모달 */
	--fx-radius-lg: 24px;                        /* 요약 판·빈 상태 판 */
	--fx-radius-sm: 10px;                        /* 입력·선택·안내 박스 */
	--fx-radius-xs: 8px;                         /* 썸네일·작은 버튼·페이지 번호 */
	--fx-radius-pill: 999px;                     /* 버튼·칩·배지·스위치 */
	--fx-shadow-card: 0 4px 24px rgba(0, 0, 0, 0.06);
	--fx-shadow-pop: 0 12px 40px rgba(0, 0, 0, 0.14);
	--fx-shadow-knob: 0 1px 2px rgba(0, 0, 0, 0.25); /* 꺼진 스위치 손잡이 */
	--fx-focus: 0 0 0 3px rgba(17, 17, 17, 0.12); /* 입력 포커스 링 */

	/* 글꼴·전환 */
	--fx-font: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, "Malgun Gothic", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;
	--fx-ease: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}