/*
  어드민 '디자인 설정' 색상(publicGameConfig -> :root --shop-* 변수)을 실제 상점 본문에 적용.
  변수 미설정 시 기존 기본색으로 폴백. minified 전역 CSS를 확실히 덮기 위해 !important 사용.
*/
body,
body .page {
    background-color: var(--shop-background-color, #fff) !important;
}
body .btn-purchase,
body .btn--purchase {
    background-color: var(--shop-button-color, #917651) !important;
}
body .btn-purchase .text,
body .btn--purchase .text {
    color: var(--shop-button-text-color, #fff) !important;
}
/*
  메인 스토어 이미지 위 텍스트 박스(타이틀/설명) — 배경 / 글자색.
  textboxColor 는 '스토어 이미지 텍스트 박스 배경색'(KGPTWO-2087)으로 의미가 바뀌어 입력창 테두리에는 더 이상 쓰지 않는다.
*/
.kg-billing .page--product-index .section--intro .section__title--theme {
    background-color: var(--shop-textbox-color, #595346) !important;
    color: var(--shop-textbox-text-color, #fff) !important;
}
.kg-billing .page--product-index .section--intro .section__title--theme h2:before {
    background-color: var(--shop-textbox-text-color, #fff) !important;
}

/* 카테고리 탭 — 비선택 글자색 / 선택(--on) 배경·글자색. 전역 CSS의 !important 셀렉터를 이기려 동일 셀렉터 사용 */
.kg-billing .page--product-index .section--product .section__content .product-option__type ul li .btn-product-type {
    color: var(--shop-category-text-color, #717171) !important;
}
.kg-billing .page--product-index .section--product .section__content .product-option__type ul li .btn-product-type--on {
    background-color: var(--shop-category-active-bg-color, #000) !important;
    color: var(--shop-category-active-text-color, #fff) !important;
    border-color: var(--shop-category-active-bg-color, #000) !important;
}

/* 사용자 가이드 버튼 — 버튼 배경 / 버튼 안 글자색 */
body .product-float .btn-guide {
    background-color: var(--shop-guide-button-color, #000) !important;
}
body .product-float .btn-guide .text {
    color: var(--shop-guide-button-text-color, #fff) !important;
}

/* 호버 색상 */
/* 구매 버튼 호버(오버레이 .bg) */
body .btn-purchase .bg,
body .btn--purchase .bg {
    background: var(--shop-button-hover-color, #998467) !important;
}
body .btn-purchase:hover .text,
body .btn--purchase:hover .text {
    color: var(--shop-button-hover-text-color, #fff) !important;
}
/* 가이드 버튼 호버(오버레이 .bg) + 호버 시 글자색 */
body .product-float .btn-guide .bg {
    background: var(--shop-guide-button-hover-color, #272727) !important;
}
body .product-float .btn-guide:hover .text {
    color: var(--shop-guide-button-hover-text-color, #fff) !important;
}

/* =========================================================
   모바일(/m/) — 셀렉터가 PC와 달라 별도로 동일 변수를 소비
   ========================================================= */
/* 헤더 */
.header { background-color: var(--shop-header-color, #000) !important;
}
.header__logo span { color: var(--shop-header-text-color, #fff) !important;
}
.header .gnb__account .btn-area .btn-account,
.header .gnb__account .btn-account { background-color: var(--shop-header-button-color, #917651) !important;
}
.btn-account .text { color: var(--shop-header-button-text-color, #fff) !important;
}
/* 서버(캐릭터) 선택 토글: 닫힘 상태 글자·화살표만 헤더 글자색. 열림(.active) 금색·드롭다운 패널은 기존 유지 */
.kg-billing .header .gnb__select-character__btn-toggle:not(.active) span { color: var(--shop-header-text-color, #ebebeb) !important;
}
.kg-billing .header .gnb__select-character__btn-toggle:not(.active):after { border-top-color: var(--shop-header-text-color, #fff) !important;
}
/* 메인 스토어 이미지 텍스트(모바일은 박스 없이 이미지 위 글자만 노출 → 글자색만 적용) */
.section--intro .section__title--theme-m { color: var(--shop-textbox-text-color, #fff) !important;
}
/* 카테고리 탭(모바일 V2 .btn-product-type 브로드) */
.btn-product-type { color: var(--shop-category-text-color, #717171) !important;
}
.btn-product-type--on {
    background-color: var(--shop-category-active-bg-color, #000) !important;
    color: var(--shop-category-active-text-color, #ffffff) !important;
    border-color: var(--shop-category-active-bg-color, #000) !important;
}
/* 가이드 버튼(모바일 플로팅 .btn-guide, product-float 밖) */
.btn-guide { background-color: var(--shop-guide-button-color, #000) !important;
}
.btn-guide:hover { background-color: var(--shop-guide-button-hover-color, #272727) !important;
}
/* 푸터 */
.footer--common,
.footer--aw,
.footer__social,
.footer__service {
    background-color: var(--shop-footer-color, #000) !important;
}
.info_copyright { color: var(--shop-copyright-color, #a3a3a3) !important;
}
.footer {
    --shop-dd-select: color-mix(in srgb, var(--shop-footer-color, #000) 88%, #fff);
    --shop-dd-panel: color-mix(in srgb, var(--shop-footer-color, #000) 76%, #fff);
    --shop-dd-text: var(--shop-footer-text-color, #a3a3a3);
}
/* 모바일 언어 드롭다운(native select) */
.footer__select-language,
.footer__select-language select {
    background-color: var(--shop-dd-panel) !important;
    color: var(--shop-dd-text) !important;
    border: 1px solid var(--shop-dd-panel) !important;
}
/* 위로가기: 가이드 버튼 기본(호버 전) 배경·글자색만 사용 */
.btn-scroll-top,
.link_top {
    background-color: var(--shop-guide-button-color, #000) !important;
}
.btn-scroll-top:before,
.page__btn-area .btn-scroll-top:before {
    border-top-color: var(--shop-guide-button-text-color, #fff) !important;
    border-right-color: var(--shop-guide-button-text-color, #fff) !important;
}
.ico_goto {
    background-image: none !important;
    background-color: var(--shop-guide-button-text-color, #fff) !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27%3E%3Cpath fill=%27%23000%27 d=%27M12 6l8 10H4z%27/%3E%3C/svg%3E") no-repeat center / 14px 9px;
    mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27%3E%3Cpath fill=%27%23000%27 d=%27M12 6l8 10H4z%27/%3E%3C/svg%3E") no-repeat center / 14px 9px;
}

/* =========================================================
   구매내역(목록/상세, PC·모바일) — 신규 어드민 필드 없이 기존 테마 변수 재사용.
   바탕=배경색, 본문 글자·진한 면=카테고리 선택 배경/글자색, 보조 글자=카테고리 비선택 글자색,
   강조=구매 버튼 색. 회색 면/구분선은 배경색에 본문색을 조금 섞어 만든다.
   기본값으로 계산하면 기존 고정색과 동일(주석의 HEX)하도록 비율을 맞춤.
   ========================================================= */
.page--history-index,
.page--history-detail {
    --hist-bg: var(--shop-background-color, #fff);
    --hist-ink: var(--shop-category-active-bg-color, #000);
    --hist-ink-on: var(--shop-category-active-text-color, #fff);
    --hist-ink-hover: color-mix(in srgb, var(--hist-ink) 85%, var(--hist-ink-on));  /* #272727 */
    --hist-sub: var(--shop-category-text-color, #717171);
    --hist-sub-label: color-mix(in srgb, var(--hist-sub) 94%, var(--hist-bg));      /* #7a7a7a */
    --hist-sub-weak: color-mix(in srgb, var(--hist-sub) 77%, var(--hist-bg));       /* #929292 */
    --hist-accent: var(--shop-button-color, #917651);
    --hist-hover: color-mix(in srgb, var(--hist-bg) 98%, var(--hist-ink));          /* #fafafa */
    --hist-surface: color-mix(in srgb, var(--hist-bg) 96%, var(--hist-ink));        /* #f5f5f5 */
    --hist-line: color-mix(in srgb, var(--hist-bg) 91%, var(--hist-ink));           /* #e9e9e9 */
    --hist-border: color-mix(in srgb, var(--hist-bg) 87.5%, var(--hist-ink));       /* #dfdfdf */
    --hist-line-strong: color-mix(in srgb, var(--hist-bg) 83%, var(--hist-ink));    /* #d4d4d4 */
    --hist-border-strong: color-mix(in srgb, var(--hist-bg) 76%, var(--hist-ink));  /* #c2c2c2 */
    --hist-border-heavy: color-mix(in srgb, var(--hist-bg) 71%, var(--hist-ink));   /* #b5b5b5 */
}
/* 모바일은 강조 기본색이 #998467 */
.page--history-index:has(.history__search),
.page--history-detail:has(.info-list) {
    --hist-accent: var(--shop-button-color, #998467);
}

/* 사용자 정보 / 타이틀 (회색 박스는 PC에만 존재) */
.page--history-index .section--user-info .user-info { color: var(--hist-ink) !important;
}
.page--history-index:has(.history-list) .section--user-info .user-info { background-color: var(--hist-surface) !important;
}
.page--history-index .section--user-info .user-info .id { color: var(--hist-accent) !important;
}
.page--history-index .section--history-list .section__title,
.page--history-index .section--history-list .section__title h3 { color: var(--hist-ink) !important;
}

/* 검색 — 기간 탭 (PC) */
.page--history-index .section--history-list .section__content .history-list__search .item-month .kg-input label {
    border-color: var(--hist-border) !important;
    color: var(--hist-sub) !important;
}
.page--history-index .section--history-list .section__content .history-list__search .item-month .kg-input:hover label {
    border-color: var(--hist-border-heavy) !important;
}
.page--history-index .section--history-list .section__content .history-list__search .item-month .kg-input.kg-input--on label {
    border-color: var(--hist-ink) !important;
    color: var(--hist-ink-on) !important;
    background-color: var(--hist-ink) !important;
}
/* 검색 — 기간 탭 (모바일) */
.page--history-index .section--history-list .section__content .history__search .item-month .kg-input--radio {
    border-color: var(--hist-border-heavy) !important;
}
.page--history-index .section--history-list .section__content .history__search .item-month .kg-input--radio label {
    color: var(--hist-sub) !important;
}
.page--history-index .section--history-list .section__content .history__search .item-month .kg-input--radio--on {
    border-color: var(--hist-ink) !important;
    background-color: var(--hist-ink) !important;
}
.page--history-index .section--history-list .section__content .history__search .item-month .kg-input--radio--on label {
    color: var(--hist-ink-on) !important;
}

/* 검색 — 상태 선택 (PC vue-multiselect, 펼친 목록 포함) */
.page--history-index .history-list__search .item-state .inp-select .multiselect__tags {
    border-color: var(--hist-border-strong) !important;
    background-color: var(--hist-bg) !important;
}
.page--history-index .history-list__search .item-state .inp-select .multiselect__single {
    background-color: transparent !important;
}
.page--history-index .history-list__search .item-state .inp-select .multiselect__single strong,
.page--history-index .history-list__search .item-state .inp-select .multiselect__option {
    color: var(--hist-sub) !important;
}
.page--history-index .history-list__search .item-state .inp-select .multiselect__content-wrapper {
    background-color: var(--hist-bg) !important;
    border-color: var(--hist-line) !important;
    border-top-color: var(--hist-bg) !important;
}
.page--history-index .history-list__search .item-state .inp-select .multiselect__option--highlight {
    background-color: var(--hist-hover) !important;
}
.page--history-index .history-list__search .item-state .inp-select .multiselect__option--selected {
    background-color: var(--hist-surface) !important;
}
/* 검색 — 상태 선택 (모바일 native select) */
.page--history-index .history__search .kg-input--select { border-color: var(--hist-border-heavy) !important;
}
.page--history-index .history__search .kg-input--select .kg-input__value { color: var(--hist-sub) !important;
}

/* 검색 — 날짜 */
.page--history-index .history-list__search .item-date .date input {
    border-color: var(--hist-border) !important;
}
.page--history-index .history__search .item-date .date input {
    border-color: var(--hist-border-heavy) !important;
}
.page--history-index .history-list__search .item-date .date input,
.page--history-index .history__search .item-date .date input {
    color: var(--hist-sub) !important;
    background-color: var(--hist-bg) !important;
}
.page--history-index .history-list__search .item-date .dash,
.page--history-index .history__search .item-date .dash {
    color: var(--hist-sub) !important;
}

/* 검색 — 조회하기 버튼 */
.page--history-index .history-list__search .item-submit .btn-submit,
.page--history-index .history__search .item-submit .btn-submit {
    background-color: var(--hist-ink) !important;
}
.page--history-index .history-list__search .item-submit .btn-submit .text,
.page--history-index .history__search .item-submit .btn-submit .text {
    color: var(--hist-ink-on) !important;
}
.page--history-index .history-list__search .item-submit .btn-submit .bg {
    background: var(--hist-ink-hover) !important;
}

/* 목록 테이블 (PC) */
.page--history-index .history-list__table table th {
    color: var(--hist-ink-on) !important;
    background-color: var(--hist-ink) !important;
}
.page--history-index .history-list__table table td {
    border-bottom-color: var(--hist-line) !important;
    color: var(--hist-ink) !important;
}
.page--history-index .history-list__table table td a { color: var(--hist-ink) !important;
}
.page--history-index .history-list__table table tr:hover td:not(.cell--empty) { background-color: var(--hist-hover) !important;
}
.page--history-index .history-list__table .pagination .btn-pagination {
    border-color: var(--hist-border-strong) !important;
    background-color: var(--hist-bg) !important;
}
.page--history-index .history-list__table .pagination .btn-pagination .bg { background: var(--hist-bg) !important;
}
.page--history-index .history-list__table .pagination .btn-pagination .text { color: var(--hist-sub-weak) !important;
}

/* 목록 리스트 (모바일) */
.page--history-index .history__list ul li { border-top-color: var(--hist-line) !important;
}
.page--history-index .history__list ul li > div strong { color: var(--hist-sub-label) !important;
}
.page--history-index .history__list ul li > div span,
.page--history-index .history__list ul li > div span a { color: var(--hist-ink) !important;
}

/* 더보기 버튼 (모바일 목록·상세) */
.page--history-index .history__list .btn-area .btn-more,
.page--history-detail .info-list .btn-area .btn-more {
    border-color: var(--hist-sub-weak) !important;
    background-color: var(--hist-bg) !important;
}
.page--history-index .history__list .btn-area .btn-more .text,
.page--history-detail .info-list .btn-area .btn-more .text {
    color: var(--hist-sub-weak) !important;
}

/* 상세 (PC) */
.page--history-detail .section__title h2,
.page--history-detail .section .section__title h3,
.page--history-detail .section--order-info .btn-back {
    color: var(--hist-ink) !important;
}
.page--history-detail .section--order-info .section__content,
.page--history-detail .section--payment-info .section__content,
.page--history-detail .section--product-info .section__content .product-info table,
.page--history-detail .section--product-info .section__content .product-info table th {
    border-color: var(--hist-line-strong) !important;
}
.page--history-detail .order-info ul li strong,
.page--history-detail .payment-info ul li strong,
.page--history-detail .credit-info ul li strong,
.page--history-detail .product-info table th {
    color: var(--hist-sub-label) !important;
}
.page--history-detail .order-info ul li span,
.page--history-detail .payment-info ul li div,
.page--history-detail .credit-info ul li div,
.page--history-detail .credit-info ul li div .unit-credit,
.page--history-detail .credit-info ul li.total strong,
.page--history-detail .product-info table td.cell,
.page--history-detail .product-info table td.cell--name .thumb div strong,
.page--history-detail .product-info table td.cell--name .thumb div span {
    color: var(--hist-ink) !important;
}
.page--history-detail .product-info table td.cell--state { color: var(--hist-accent) !important;
}
.page--history-detail .credit-info ul li.total:before { background-color: var(--hist-line) !important;
}

/* 상세 (모바일) */
.page--history-detail .page__nav { background-color: var(--hist-bg) !important;
}
.page--history-detail .page__nav .link-back { color: var(--hist-ink) !important;
}
.page--history-detail .info-list ul { border-top-color: var(--hist-line) !important;
}
.page--history-detail .info-list ul li > div .subject { color: var(--hist-sub-label) !important;
}
.page--history-detail .info-list ul li > div .text,
.page--history-detail .info-list .total > div .subject,
.page--history-detail .info-list .unit-credit {
    color: var(--hist-ink) !important;
}
.page--history-detail .info-list ul li > div .text--state { color: var(--hist-accent) !important;
}
.page--history-detail .info-list .total { background-color: var(--hist-surface) !important;
}

/* 링크 / 유의사항 (목록·상세, PC·모바일) */
.page--history-index .history-list__caution ul li,
.page--history-index .history__caution ul li,
.page--history-detail .section--caution .section__content ul li,
.page--history-detail .caution ul li {
    color: var(--hist-sub-weak) !important;
}
.page--history-index .history-list__caution ul li a,
.page--history-index .history__caution ul li a,
.page--history-detail .section--caution .section__content ul li a,
.page--history-detail .caution ul li a,
.page--history-detail .payment-info ul li a,
.page--history-detail .credit-info ul li a,
.page--history-detail .info-list ul li > div .text a {
    color: var(--hist-accent) !important;
    border-bottom-color: var(--hist-accent) !important;
}