@charset "utf-8";
/* ============================================================
   LOVVON DARK  —  다크 전환 레이어  (2026-08-19)

   [설계]
   원본 CSS(lovvon.css / mobile_shop.css / mobile.css / 스킨 style.css)를
   한 줄도 고치지 않는다. 이 파일 하나만 "가장 나중에" 로드해서 덮는다.
     · lovvon.css 는 var(--lv-*) 토큰을 1,055곳에서 쓴다
       → :root 값만 다시 정의하면 테마 화면이 통째로 반전된다
     · mobile_shop.css / mobile.css 는 색이 하드코딩(671곳)이고
       theme/lovvon/head.sub.php 59줄에서 직접 echo 되므로
       이 파일을 그 "바로 다음 줄"에 넣어 순서로 이긴다 (특이도 싸움 회피)

   [롤백]
   head.sub.php 에 추가한 <link> 한 줄만 주석 처리하면 즉시 원래 밝은 테마로 복귀.

   [토큰 역할이 반전된다 — 이름 ≠ 값]
   1,055곳을 고치지 않으려고 토큰 "이름은 그대로 두고 값만" 뒤집었다.
   그래서 --lv-black 이 밝은색, --lv-white 가 어두운색이 된다. 헷갈리지 말 것.
   실제 사용 분포를 재서 이렇게 해도 논리가 맞는 걸 확인했다:
     --lv-black : 텍스트82 / 버튼배경42 / 보더68  → 밝은 글씨·흰 버튼면·밝은 보더
     --lv-white : 배경59 / 버튼위글씨62          → 어두운 패널·흰 버튼 위 어두운 글씨
   즉 기존 "검정 버튼 + 흰 글씨"가 자동으로 "밝은 버튼 + 어두운 글씨"가 된다.
   ============================================================ */

/* ── 1. 팔레트 (클라이언트 지정) ─────────────────────────────
   배경 뉴트럴 블랙 #111111 / 텍스트 뉴트럴 그레이 #E6E6E6 / 포인트 네온 하트비트 #ff007f
   (260901 — 배경 계열에서 파란 채도를 뺐다. 명도는 유지하고 채도만 0으로)
   ------------------------------------------------------------ */
:root {
  /* 전경/배경 (역할 반전) */
  --lv-black:    #F7F7F7;   /* 가장 강한 전경 — 제목·버튼면·강조 보더   17.1:1 AAA (중립) */
  --lv-white:    #111111;   /* 바탕면 — 뉴트럴 블랙 (260901 네이비 기미 제거) */

  /* 회색 스케일 (어두움→밝음 으로 의미가 뒤집힘) — 괄호는 배경 대비비 */
  --lv-gray-100: #1A1A1A;   /* 카드·섹션 면 (background 39곳) — 중립화 */
  --lv-gray-200: #2E2E2E;   /* 보더 전용 (border 197곳) — 중립화 */
  --lv-gray-400: #9E9E9E;   /* 흐린 텍스트  6.6:1 AA  (중립화 + 한 단계 밝게) */
  --lv-gray-600: #BDBDBD;   /* 보조 텍스트 · GNB 메뉴  9.6:1 AAA (중립화 + 밝게) */
  --lv-gray-700: #E6E6E6;   /* 본문  14.8:1 AAA — 플래티넘 모노에서 블루 채도 제거 */
  --lv-gray-800: #EDEDED;   /* 본문 강조 (중립) */
  --lv-gray-900: #EAEAEA;   /* 어두운 버튼이던 자리 → 밝은 버튼면 (중립) */

  /* 브랜드 강조 — 베이지에서 네온 핑크로 교체 (50곳이 즉시 바뀐다) */
  --lv-accent:       #ff007f;
  --lv-accent-light: #7a0040;   /* 그라디언트 시작색 */
  --lv-bg-warm:      #171717;   /* 매거진 섹션 배경 — 중립화 */

  /* 네온 (원래도 핑크였음 — 유지) */
  --lv-neon:      #ff007f;
  --lv-neon-glow: rgba(255, 0, 127, 0.55);
  --lv-neon-haze: rgba(255, 0, 127, 0.28);

  /* 위험/삭제 — 어두운 바탕에서 읽히도록 조정 */
  --lv-danger:        #ff6b6b;
  --lv-danger-border: #7a2b2b;
  --lv-danger-bg:     #2A1418;

  /* 타이포 — 국문·영문 Pretendard, 폴백 Noto Sans KR */
  --lv-font:     'Pretendard Variable', Pretendard, 'Noto Sans KR', system-ui, 'Helvetica Neue', Arial, sans-serif;
  /* 숫자 전용 — Montserrat (가격·수량 등에 .lv-num 으로 적용) */
  --lv-font-num: 'Montserrat', 'Pretendard Variable', Pretendard, sans-serif;
}

/* ── 2. 바탕 강제 ─────────────────────────────────────────────
   mobile_shop.css:5 가 body{color:#222; background:#fff} 를 하드코딩하고
   mobile.css:5 는 background:#e6e6e6 이다. 둘 다 여기서 덮는다.
   ------------------------------------------------------------ */
html { background: var(--lv-white); }
body {
  background: var(--lv-white);
  color: var(--lv-gray-700);
  font-family: var(--lv-font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 원본 CSS가 흰 배경을 깔던 대표 컨테이너들 */
#wrapper, #container, #contents, .lv-wrap { background: transparent; }

/* ── 3. 숫자 타이포 ───────────────────────────────────────────
   가격·수량은 Montserrat. tabular-nums 로 자릿수가 흔들리지 않게.
   ------------------------------------------------------------ */
.lv-num,
.lv-price, .lv-price-original, .lv-discount {
  font-family: var(--lv-font-num);
  font-feature-settings: 'tnum' 1;
  font-variant-numeric: tabular-nums;
}

/* ── 4. 개별 보정 ─────────────────────────────────────────────
   토큰 일괄 반전만으로는 어색해지는 소수 지점.
   ------------------------------------------------------------ */
/* 매거진 히어로 자리표시자 — gray-900 이 밝아졌으므로 어두운 면으로 되돌린다 */
.lv-mag-hero-placeholder { background: var(--lv-gray-100); }

/* 썸네일 면은 색을 깔지 않는다 (260821)
   흰 누끼 완화용으로 어두운 면을 깔았었는데, 상품 사진의 여백과 면 색이
   어긋나 사각형 테두리처럼 보였다. 원본 lovvon.css 820줄에도 gray-100 이
   들어있으므로 여기서 transparent 로 덮는다(원본은 수정하지 않는다).
   특이도: 원본이 `.lv-product-card .lv-thumb`(0,2,0) 이라 같은 형태로 맞받아야 이긴다. */
.lv-product-card .lv-thumb, .lv-thumb { background: transparent; }

/* 상품 카드 면 (260821) — 시안: 배경보다 한 겹 어두운 카드 위에 상품이 얹힌다
   #0000002b = 검정 알파 2b(43/255 ≈ 17%). 불투명 색이 아니라 반투명이라
   페이지 배경(#080c15)이 비쳐 같은 색 계열을 유지한 채 한 단계만 가라앉는다.
   썸네일은 위에서 transparent 로 비웠으므로 이 카드 면이 그대로 비쳐 보인다. */
.lv-product-card {
  background: #0000002b;
  border-radius: 6px;
  padding: 14px;
}
/* 위시 하트 — 원본은 흰 원(rgba(255,255,255,.9))이라 다크에서 흰 점으로 튄다.
   시안처럼 면을 없애고 선만 남긴다. 위치는 카드 패딩 안쪽으로 맞춘다. */
.lv-product-card .lv-wish-btn {
  top: 12px;
  right: 12px;
  background: transparent;
  color: rgba(255, 255, 255, 0.55);
}
.lv-product-card .lv-wish-btn:hover { color: var(--lv-neon); background: transparent; }
.lv-product-card .lv-wish-btn.is-on { color: var(--lv-neon); background: transparent; box-shadow: none; }

/* ============================================================
   5. UI ELEMENTS — 시안 07 반영
   ------------------------------------------------------------
   [왜 필요한가]
   --lv-black 은 텍스트 82곳 / 버튼면 42곳 / 보더 68곳에 함께 쓰인다.
   토큰을 밝게 뒤집으면 텍스트·선·보더는 맞지만 "면"으로 쓰이던 42곳이
   흰 덩어리가 된다(푸터·하단탭·공지바·버튼 등).
   토큰은 다수인 텍스트 기준(밝게)으로 두고, 면으로 쓰이던 곳만 여기서 덮는다.
   ============================================================ */

:root {
  --lv-face:        #262626;   /* 버튼·뱃지 기본 면 (시안 Default) — 중립화 */
  --lv-face-strong: #181818;   /* 푸터·하단탭 등 구조 면 — 중립화. 바탕(#111)보다 한 단계 밝다 */
  --lv-on-neon:     #ffffff;   /* 네온 핑크 위 글씨 */
}

/* ── 5-1. 구조 면 — 밝아지면 안 되는 덩어리들 ───────────────── */
.lv-notice-bar,
.lv-footer,
.lv-tabbar,
#modalLayer .carting,
.lv-order-layout .od_coupon h3,
#sod_frm.lv-order-layout #order_address {
  background: var(--lv-face-strong);
  color: var(--lv-gray-700);
}
/* 아이콘 메뉴 원형 배경 — 원래 #111 원형이었다. 밝아지면 흰 원이 된다 */
.lv-icon-menu .sh-banner-img-wrap img { background: var(--lv-face-strong); }

/* 선으로 쓰이는 것들은 밝은 채로 두는 게 맞다 (덮지 않음)
   .lv-hamburger span / .lv-panel-close::before,::after                     */

/* ── 5-2. BUTTON — 시안: Default 어두운 면 + 밝은 글씨 / Hover 네온 보더 ── */
.lv-btn-fill, .lv-btn-black, .lv-search-btn, .lv-btn-addr, .lv-btn-order,
.lv-btn-shop, .lv-cancel-submit, .lv-qa-btn-write, .lv-qa-search-btn,
.lv-search-bar-btn, .lv-faq-search-btn,
.lv-order-layout .btn_address,
.lv-order-layout #display_pay_button .btn_submit,
.lv-order-layout .od_coupon .cp_apply,
.lv-order-layout .od_coupon .od_cp_apply,
.lv-search-wrap #sch_res_detail .btn_submit,
#bo_w .btn_submit, #bo_w #btn_submit {
  background: var(--lv-face);
  color: var(--lv-black);
  border: 1px solid transparent;
  border-radius: 6px;
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}
.lv-btn-fill:hover, .lv-btn-black:hover, .lv-search-btn:hover, .lv-btn-addr:hover,
.lv-btn-order:hover, .lv-btn-shop:hover, .lv-cancel-submit:hover,
.lv-qa-btn-write:hover, .lv-qa-search-btn:hover, .lv-search-bar-btn:hover,
.lv-faq-search-btn:hover,
.lv-order-layout .btn_address:hover,
.lv-order-layout #display_pay_button .btn_submit:hover,
#bo_w .btn_submit:hover, #bo_w #btn_submit:hover {
  background: var(--lv-face);
  border-color: var(--lv-neon);
  opacity: 1;
}
/* 구매 버튼은 Primary — 시안 Active 상태(네온 채움 + 글로우) */
.lv-buybar-buy {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
}
/* border-radius·border·glow 는 12-2 에서 네 버튼을 묶어서 준다.
   여기 단독으로 두면 스크롤 전후로 모양이 달라진다(260821 실제로 그랬다). */

/* ── 5-3. 활성 탭 / 페이지네이션 — 시안: 네온 포인트 ────────── */
.lv-cat-tag.active, .lv-cat-tag:hover,
.lv-ship-tab.active, .lv-ship-tab:hover,
.lv-qa-cat-tab.active, .lv-faq-cat-tab.active,
.lv-sort-btn.active,
.lv-step.active .lv-step-num,
.lv-faq-item.open .lv-faq-toggle,
.lv-iu-write-btn:hover {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
  border-color: var(--lv-neon);
}

/* ── 5-4. BADGE — 시안: BEST 네온 채움 / NEW·SALE 어두운 면 ── */
.lv-badge, .lv-view-badge, .lv-badge-notice,
.lv-faq-q-badge, .lv-qa-block-label.q, .lv-qa-status.done {
  background: var(--lv-face);
  color: var(--lv-black);
  /* ⚠️ 원본 .lv-badge 에는 border 가 아예 없다(875줄). width 가 0 이라
     각 배지에서 border-color 만 줘도 선이 안 그려진다 — 여기서 1px 를 깔아 둔다. */
  border: 1px solid transparent;
}
/* 시안 07 기준: BEST 만 네온 채움. NEW·SALE 은 어두운 면 유지 */
.lv-badge.best {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
}
/* 장바구니 개수 — 시안의 핑크 원형 뱃지 */
.lv-cart-count {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
}

/* ============================================================
   6. 이미지 위 텍스트 & 링크 특이도 보정
   ------------------------------------------------------------
   [문제 1] 이미지 위에 얹는 글씨가 --lv-white 를 쓰고 있었다.
     원래는 "흰 글씨"라는 뜻이었지만 토큰을 뒤집으면 배경색(#080c15)이 되어
     사진 위에서 안 보인다. 이런 자리는 테마와 무관하게 항상 흰색이어야 한다.
   [문제 2] a 태그 규칙이 color 를 다시 잡는다.
     a.lv-btn-fill:link 는 특이도 (0,1,1) 이라 5-2 의 .lv-btn-fill (0,1,0) 이 진다.
     그래서 버튼 글씨가 어두운 채로 남았다. 같은 형태로 맞받아야 한다.
   ============================================================ */

:root { --lv-on-media: #ffffff; }   /* 이미지·영상 위 고정 흰색 */

/* ── 6-1. 이미지 위 오버레이 — 항상 흰색 ─────────────────── */
.lv-hero-content,
.lv-hero .main_banner_wrap,
.lv-hero .main_title,
.lv-editorial-label h3,
.lv-mag-hero-content {
  color: var(--lv-on-media);
}
.lv-editorial-label a,
.lv-editorial-label a:link,
.lv-editorial-label a:visited { color: var(--lv-on-media); }

/* ── 6-2. 히어로 CTA — 시안: 흰 외곽선, hover 는 네온 ────── */
.lv-hero-cta,
a.lv-hero-cta, a.lv-hero-cta:link, a.lv-hero-cta:visited {
  border: 1px solid var(--lv-on-media);
  color: var(--lv-on-media);
  background: transparent;
  border-radius: 6px;
}
.lv-hero-cta:hover,
a.lv-hero-cta:hover {
  background: transparent;
  border-color: var(--lv-neon);
  color: var(--lv-neon);
  box-shadow: 0 0 14px var(--lv-neon-haze);
}
/* 배너 스킨이 그리는 버튼도 동일하게 */
.lv-hero .banner_btn a,
.lv-hero .banner_btn a:link,
.lv-hero .banner_btn a:visited {
  border: 1px solid var(--lv-on-media);
  color: var(--lv-on-media);
  border-radius: 6px;
}
.lv-hero .banner_btn a:hover {
  border-color: var(--lv-neon);
  color: var(--lv-neon);
  box-shadow: 0 0 14px var(--lv-neon-haze);
}

/* ── 6-2b. 히어로 텍스트 위치 (260821) ────────────────────
   원본 lovvon.css 648줄이 bottom:60px. 번호 불릿과 너무 붙어서 80px 로 올린다.
   원본은 수정하지 않고 여기서 덮는다(특이도 동일 0,2,0 + 나중 로드).

   ⚠️ 이 규칙은 미디어쿼리 밖이라 **모바일에도 적용된다.**
      원본의 @media(≤768px) `left:24px; bottom:40px` 중 bottom 만 80px 로 덮이고
      left:24px 은 그대로 살아남는다 — 의도한 동작이다.
      (미디어쿼리는 특이도를 올리지 않는다. 순서로 이긴다) */
.lv-hero .main_banner_wrap { bottom: 80px; }

/* ── 6-3. 히어로 페이지네이션 — 01 / 02 / 03 번호 + 왼쪽 정렬 (260821) ──
   배너 스킨(swiper_main·main_banner·swiper_rolling)은 renderBullet 없이
   빈 <span class="swiper-pagination-bullet"> 만 찍는다.
   → JS·스킨을 건드리지 않고 CSS counter 로 번호를 만든다.
     배너를 늘리면 04·05… 가 자동으로 따라온다(decimal-leading-zero 라 10 부터는 두 자리).

   정렬 기준은 배너 텍스트 컨테이너와 동일:
     .lv-hero .main_banner_wrap  left 60px / 모바일(≤768px) 24px
   ⚠️ 특이도 — Swiper 원본이 `.swiper-horizontal>.swiper-pagination-bullets`(0,2,1) 이라
      `.lv-hero .swiper-pagination`(0,2,0) 으로는 진다. 클래스를 하나 더 붙여 (0,3,0) 으로 맞받는다. */
.lv-hero .swiper-pagination.swiper-pagination-bullets {
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 18px;
  counter-reset: lv-hero-num;
  left: 60px;
  right: auto;
  bottom: 24px;
  width: auto;
  transform: none;
  text-align: left;
}
.lv-hero .swiper-pagination-bullet {
  counter-increment: lv-hero-num;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0 0 6px;
  border-radius: 0;
  background: none;
  opacity: 1;
  font-family: var(--lv-font-num);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
  font-variant-numeric: tabular-nums;
  color: rgba(255, 255, 255, 0.42);
  border-bottom: 2px solid transparent;
  transition: color 0.2s, border-color 0.2s;
}
.lv-hero .swiper-pagination-bullet::before {
  content: counter(lv-hero-num, decimal-leading-zero);
}
.lv-hero .swiper-pagination-bullet:hover { color: var(--lv-on-media); }
.lv-hero .swiper-pagination-bullet:focus-visible {
  outline: 2px solid var(--lv-neon);
  outline-offset: 3px;
}
/* 활성 — 네온 글자 + 네온 밑줄 (원본의 24×3px 막대 규칙을 여기서 무력화한다) */
.lv-hero .swiper-pagination-bullet-active {
  width: auto;
  background: none;
  color: var(--lv-neon);
  border-bottom-color: var(--lv-neon);
}
@media (max-width: 768px) {
  .lv-hero .swiper-pagination.swiper-pagination-bullets {
    left: 24px;
    bottom: 24px;   /* 텍스트가 모바일에서도 80px 이므로 데스크톱과 같은 간격(56px)으로 맞춘다 */
    gap: 14px;
  }
  .lv-hero .swiper-pagination-bullet { font-size: 12px; }
}

/* ── 6-4. 링크 특이도 보정 ────────────────────────────────
   5-2 에서 정한 "어두운 면 + 밝은 글씨"를 a 태그에서도 유지한다. */
a.lv-btn-fill,  a.lv-btn-fill:link,  a.lv-btn-fill:visited,
a.lv-btn-black, a.lv-btn-black:link, a.lv-btn-black:visited {
  background: var(--lv-face);
  color: var(--lv-black);
  border-radius: 6px;
}
a.lv-btn-fill:hover, a.lv-btn-black:hover {
  border-color: var(--lv-neon);
  color: var(--lv-black);
  opacity: 1;
}
/* 활성 탭은 네온 채움 — 그 위 글씨는 흰색 고정 */
a.lv-qa-cat-tab.active,  a.lv-qa-cat-tab.active:link,  a.lv-qa-cat-tab.active:visited,
a.lv-faq-cat-tab.active, a.lv-faq-cat-tab.active:link, a.lv-faq-cat-tab.active:visited {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
}
a.lv-qa-btn-write, a.lv-qa-btn-write:link, a.lv-qa-btn-write:visited {
  background: var(--lv-face);
  color: var(--lv-black);
}

/* ── 6-5. 푸터 링크 hover — 어두운 면이므로 네온으로 ──────── */
.lv-footer-col ul li:hover,
.lv-footer-col ul li a:hover { color: var(--lv-neon); }

/* ============================================================
   7. 원본 CSS 덮개 (mobile_shop.css / mobile.css / 스킨 style.css)
   ------------------------------------------------------------
   원본은 색이 하드코딩돼 있다 — 흰 배경 60곳 / 어두운 글씨 68곳.
   개별로 다 쓰지 않고 구조 단위(폼·버튼·표·패널)로 묶어 덮는다.
   이 파일은 mobile_shop.css 바로 뒤에 로드되므로 같은 특이도면 이긴다.
   인라인 style 로 박힌 것만 !important 를 쓴다.
   ============================================================ */

/* ── 7-1. 맨 위로 버튼 ────────────────────────────────────────
   shop.tail.php 162줄에 style="background:var(--lv-black);color:#fff"
   가 인라인으로 박혀 있다. 토큰이 밝아지면서 "밝은 버튼 + 흰 화살표"가
   되어 화살표가 사라졌다. 인라인이라 !important 가 필요하다. */
#lv_to_top {
  background: var(--lv-face) !important;
  color: var(--lv-black) !important;
  border: 1px solid var(--lv-gray-200) !important;
  border-radius: 6px;
}
#lv_to_top:hover {
  border-color: var(--lv-neon) !important;
  color: var(--lv-neon) !important;
}

/* ── 7-2. 폼 요소 ─────────────────────────────────────────── */
input[type="text"], input[type="password"], input[type="email"],
input[type="tel"], input[type="number"], input[type="search"],
input[type="url"], input[type="date"], select, textarea,
.frm_input, .form_01 textarea, #captcha #captcha_key,
#settle_bank #od_deposit_name, .sod_frm_point #od_temp_point,
#sod_fin_cancelfrm .frm_input {
  background: var(--lv-gray-100);
  color: var(--lv-gray-700);
  border: 1px solid var(--lv-gray-200);
}
input::placeholder, textarea::placeholder { color: var(--lv-gray-400); }

/* ★ check_field() 가 인라인으로 박는 흰 배경 덮기 — 260902
 *
 * 그누보드 코어 js/common.js 의 clear_field() 가 이렇게 되어 있다:
 *
 *     function clear_field(fld) { fld.style.background = "#FFFFFF"; }
 *
 * 주문서 검증(forderform_check)이 필수 입력칸마다 check_field() 를 부르고,
 * 값이 채워진 칸은 clear_field() 로 넘어가 **흰색이 인라인으로 박힌다.**
 * 밝은 테마 전제의 하드코딩이라 다크 테마에서는 입력칸이 통째로 하얘진다.
 *
 * 인라인 스타일은 일반 CSS 로 못 이기므로 !important 가 필요하다.
 * 다만 통째로 덮으면 오류 강조까지 지워지므로 **흰색 인라인만** 고른다:
 *
 *   error_field() → background "#BDDEF7"  = rgb(189, 222, 247)  ← 남겨둔다(오류 표시)
 *   clear_field() → background "#FFFFFF"  = rgb(255, 255, 255)  ← 여기만 덮는다
 *
 * 브라우저가 style 속성을 정규화하는 방식이 갈릴 수 있어 표기 네 가지를 모두 건다.
 * 인라인 배경이 없는 평상시 입력칸은 이 규칙에 걸리지 않는다. */
input[style*="255, 255, 255"],
input[style*="#FFFFFF"],
input[style*="#ffffff"],
input[style*="background: white"],
textarea[style*="255, 255, 255"],
textarea[style*="#FFFFFF"],
textarea[style*="#ffffff"],
select[style*="255, 255, 255"] {
  background-color: var(--lv-gray-100) !important;
  color: var(--lv-gray-700);
}

/* 오류 강조(#BDDEF7)는 값이 빈 칸에만 붙는다.
 * 배경이 밝아 글자는 안 보여도 되지만, 커서와 placeholder 가 묻히지 않게 글자색만 잡아준다. */
input[style*="189, 222, 247"],
input[style*="#BDDEF7"],
input[style*="#bddef7"],
textarea[style*="189, 222, 247"] {
  color: #191f28;
  caret-color: #191f28;
}
input[style*="189, 222, 247"]::placeholder,
input[style*="#BDDEF7"]::placeholder,
input[style*="#bddef7"]::placeholder { color: #5a6570; }
select option { background: var(--lv-gray-100); color: var(--lv-gray-700); }

/* 파일첨부 — 위 목록에 file 타입이 빠져 있어 게시판 글쓰기·1:1문의에서
   첨부 줄만 브라우저 기본(밝은 면)으로 떠 있었다 (260901) */
input[type="file"] {
  background: var(--lv-gray-100);
  color: var(--lv-gray-700);
  border: 1px solid var(--lv-gray-200);
  border-radius: 6px;
  padding: 7px 9px;
  font-family: inherit;
}
/* 파일선택 버튼은 브라우저가 별도로 그린다 — 크롬/사파리 계열 */
input[type="file"]::file-selector-button {
  background: var(--lv-face);
  color: var(--lv-black);
  border: 1px solid var(--lv-gray-200);
  border-radius: 4px;
  padding: 5px 10px;
  margin-right: 10px;
  font-family: inherit;
  cursor: pointer;
}
input[type="file"]::file-selector-button:hover { border-color: var(--lv-neon); }

/* ── 7-3. 원본 버튼류 — 시안 Default(어두운 면 + 밝은 글씨) ── */
.btn01, .btn02, .btn_b01, .btn_b02, .btn_b03, .btn_cancel,
.btn_frmline, .btn_submit, .btn_close, .btn_out, .line_btn,
a.btn01, a.btn_b01, a.btn_b03, a.btn_cancel, button.btn01,
.btn_top .btn_cancel, .btn_top .btn_b01,
#sod_ws_act .btn02, .more_btn a, .all_btn a {
  background: var(--lv-face);
  color: var(--lv-black);
  border: 1px solid var(--lv-gray-200);
  border-radius: 6px;
}
.btn01:hover, .btn02:hover, .btn_b01:hover, .btn_b02:hover, .btn_b03:hover,
.btn_cancel:hover, .btn_frmline:hover, .btn_submit:hover, .btn_out:hover,
.line_btn:hover, a.btn01:hover, a.btn01:focus, a.btn_b01:hover,
a.btn_b03:hover, a.btn_cancel:hover, .more_btn a:hover, .all_btn a:hover {
  background: var(--lv-face);
  border-color: var(--lv-neon);
  color: var(--lv-black);
}

/* ── 7-4. 표 ─────────────────────────────────────────────── */
.tbl_head01 thead th, .tbl_head02 thead th, .tbl_head03 thead th {
  background: var(--lv-gray-100);
  color: var(--lv-black);
  border-color: var(--lv-gray-200);
}
.tbl_head01 td, .tbl_head01 th,
.tbl_head02 td, .tbl_head02 th,
.tbl_head03 td, .tbl_head03 th,
.tbl_frm01 th, .tbl_frm01 td {
  border-color: var(--lv-gray-200);
  color: var(--lv-gray-700);
}

/* ── 7-5. 패널·카드·리스트 ───────────────────────────────── */
.sod_list .sod_li, .sod_list .mod_options, #mod_option_frm,
#sod_bsk .sod_ta_wr, .sod_frm_point div, #settle_bank,
.od_coupon, #sod_fin_cancelfrm, #smb_my_ov, .mp_card_section,
.out_wrap ul li, #sod_ws li, #sod_inquiry li, #m_sod_frm_orderer ul,
.review_card, #validation_check p, .search_modal_box,
#sit_opt_added button, #sit_opt_added .sit_opt_del {
  background: var(--lv-gray-100);
  color: var(--lv-gray-700);
  border-color: var(--lv-gray-200);
}

/* ── 7-6. 헤더·카테고리·메뉴 ─────────────────────────────── */
#hd_wr.fixed, .menu_cate.fixed, #category, .sidemenu_top,
.community_menu_wr, .main_nav ul li, .gnb_2dul_left, .gnb_3dul,
.gnb_all_wrap, #gnb .gnb_1dli_over .gnb_2dul, #gnb .gnb_1dli_over2 .gnb_2dul,
.hd_search #sch_str {
  background: var(--lv-face-strong);
  color: var(--lv-gray-700);
  border-color: var(--lv-gray-200);
}

/* ── 7-7. 원본의 어두운 글씨 일괄 ────────────────────────── */
.hd_right_btn button, .hd_right_btn > a, .hd_search #sch_submit,
.search_modal_box h3, #btn_hdcate, .sidemenu_top .head_btnwrap .head_btn,
.cate_tab .selected, .out_point a, .community_menu_grid a,
#hd_sch .sch_submit, .total, #ft h3 a, .ft_con, #ft_if strong,
.ft_copy, .ftc_btn, .sanchor a.sanchor_on,
.sod_list .total_price strong, #mod_option_frm h3, #sod_addr .sel_address,
.mp_name strong, .mp_stat_item, .mp_stat_value,
.mp_shortcut_item, .mp_shortcut_value, .my_info dd {
  color: var(--lv-gray-700);
}
.total_price strong, .mp_stat_value, #ft_if strong { color: var(--lv-black); }

/* ── 7-8. 관리자 입력 HTML(교환/환불·상품설명) ───────────────
   쇼핑몰설정에 붙여넣은 내용이 흰 배경·검은 글씨를 그대로 갖고 오는 경우가 있다.
   그 영역 안에서만 배경을 걷어내고 글자색을 상속시킨다. */
.lv-refund-content, .lv-refund-content * ,
#sit_inf_explan, #sit_inf_explan * {
  background: transparent !important;
  border-color: var(--lv-gray-200);
}
.lv-refund-content, .lv-refund-content p, .lv-refund-content li,
.lv-refund-content td, .lv-refund-content div, .lv-refund-content span {
  color: var(--lv-gray-600) !important;
}
.lv-refund-content h3, .lv-refund-content strong, .lv-refund-content b {
  color: var(--lv-black) !important;
}

/* ============================================================
   8. lovvon.css 하드코딩 잔여분 (72곳)
   ------------------------------------------------------------
   테마 CSS 는 89% 토큰화돼 있지만 나중에 붙은 블록들이 hex 를 직접 썼다.
   전수조사 결과 밝은배경 24 / 어두운글씨 23 / 밝은보더 25.
   구매후기(sps_) · 상품문의(sqa_) · 상품정보 · 무료배송바에 몰려 있다.
   ============================================================ */

/* ── 8-1. 밝은 면 → 카드 면 ─────────────────────────────── */
#sit_inf_open th,
#free_ship_bar_bg,
.sps_card_img_wrap, .sps_card_prd, .sps_toggle_btn, .sps_reply_wrap,
#sps_modal_close, .sps_modal_prd_link,
.sps_filter_btn:hover, .sps_filter_btn.active,
.sps_filter_drop a:hover,
.sqa_section .sqa_con,
#sit_opt_added li {           /* mobile_shop.css:370 background:#ffffff9e */
  background: var(--lv-gray-100);
}

/* ── 8-2. 흰 면 → 바탕 ──────────────────────────────────── */
#loading_message, .sps_card, #sps_modal_box, #sps_search_toggle,
.sps_filter_btn, .sps_filter_drop, #sps_sch .sch_input,
#sqa_sch .sch_wr, #sqa_sch select, #sqa li,
.sqa_con_btn button, #itemqa_list, #itemuse_list {
  background: var(--lv-white);
}
.couponzone_list ul li .coupon_btn .disabled {
  background: var(--lv-gray-200);
  color: var(--lv-gray-400);
}

/* ── 8-3. 어두운 글씨 → 본문 / 강조 ─────────────────────── */
#sit_inf_open th, #sit_inf_open td,
#free_ship_msg,
#sps_sch select, .sps_card_content, .sps_card_prd, .sps_card_prd span,
.sps_card_detail_inner, .sps_modal_prd_link, .sps_modal_prd_link span,
#sps_modal_body, #sps_search_toggle, #sps_search_inner select,
.sps_filter_btn, .sps_filter_drop a, .sqa_con_btn button {
  color: var(--lv-gray-600);
}
#free_ship_msg strong, .sps_card_title, .sps_reply_title,
#sps_modal_title, .sps_total_count strong,
#sps_search_toggle:hover, .sps_filter_btn:hover,
.sps_filter_btn.active, .sps_filter_drop a:hover {
  color: var(--lv-black);
}

/* ── 8-4. 밝은 보더 → 보더 토큰 ─────────────────────────── */
#sit_inf_open th, #sit_inf_open td,
#free_ship_bar_wrap,
#sps_sch select, #sps_sch .sch_input, #sps_sch > a,
.sps_card, .sps_card_prd img, .sps_toggle_btn, .sps_card_detail,
.sps_modal_prd_link img, #sps_modal_meta, #sps_filter_bar,
#sps_search_toggle, #sps_search_inner select, #sps_search_inner input,
.sps_filter_btn, .sps_filter_drop,
#sqa_sch .sch_wr, #sqa_sch select, #sqa ol, #sqa li,
.sqa_con_btn button, #sqa .sit_qa_qaa,
#itemqa_list, #itemuse_list,
#sit_opt_added li, #sit_opt_added button, #sit_opt_added .num_input {
  border-color: var(--lv-gray-200);
}

/* ── 8-5. 무료배송 진행바 — 네온으로 ─────────────────────── */
#free_ship_bar { background: linear-gradient(90deg, var(--lv-accent-light), var(--lv-neon)); }
#free_ship_labels { color: var(--lv-gray-400); }

/* ============================================================
   9. 마이페이지 (/shop/mypage.php) — 30곳
   ------------------------------------------------------------
   mobile_shop.css 에 mp_* / my_* / out_wrap 계열이 전부 하드코딩돼 있다.
   7장에서 일부만 덮었기에 여기서 전 범위를 다시 정리한다.
   ============================================================ */

/* 면 */
.mp_card_section, .btn_my_if, .btn_out, .out_wrap ul li,
.sod_frm_point #od_temp_point {
  background: var(--lv-gray-100);
}

/* 보더 — 카드·구분선 전부 */
.mp_profile_left .my_img, .mp_edit_btn, .btn_out,
.mp_stat_grid, .mp_stat_item, .mp_stat_item:nth-child(3), .mp_stat_item:nth-child(4),
.mp_shortcut_grid, .mp_shortcut_item,
.my_info, .btn_my_if,
.mp_card_section, .mp_card_section_head, .mp_card_section_more,
.mp_grid_img img, .out_wrap ul li,
.sod_frm_point #od_temp_point {
  border-color: var(--lv-gray-200);
}

/* 강조 텍스트 (#111 자리) */
.mp_name strong, .mp_stat_item, .mp_stat_value,
.mp_shortcut_item, .mp_shortcut_value,
.my_info dd, .mp_card_section_title, .mp_card_section_more:hover,
.mp_grid_list li a, .mp_grid_price {
  color: var(--lv-black);
}

/* 보조 텍스트 (#333·#555·#777·#888 자리) */
.mp_edit_btn, .mp_shortcut_label, .btn_my_if,
.mp_grid_name, .out_wrap ul li a {
  color: var(--lv-gray-600);
}

/* 등급 뱃지는 포인트로 */
.mp_grade { color: var(--lv-neon); }

/* hover 는 네온 (시안 07) */
.mp_edit_btn:hover, .mp_card_section_more:hover,
.btn_my_if:hover, .btn_out:hover, .out_wrap ul li a:hover {
  border-color: var(--lv-neon);
  color: var(--lv-neon);
}

/* ============================================================
   12. 브랜드 가이드 반영 (260821) — 창업자 지정 규격
   ------------------------------------------------------------
   [배경] 창업자 팔레트는 쿨 그레이 축이다. 수치로 확인:
     Platinum Mono #D1D5DB  216.0°  |  Matte Coat Black #111827  220.9°
     우리 배경     #080c15  221.5°  → 같은 축의 더 어두운 버전. 그대로 둔다.
     "실버·알루미늄·하이엔드 디바이스" 는 쿨 그레이로만 나온다(따뜻한 회색 = 종이·나무).
     즉 파란 기울기는 오차가 아니라 금속 질감의 근거다.

   [원칙] 네온 핑크는 3~5%, "사용자의 행동이 일어나는 순간"에만.
     → 채움(가장 강함) 은 행동 유도에만: 바로구매 · SALE · 활성탭
     → 정보성 배지(BEST) 는 매트 블랙 면에 네온 "글자" 로 절제
   ------------------------------------------------------------ */
:root {
  --lv-matte:    #111111;   /* Matte Coat Black — 창업자 원값 #111827 에서 중립화(260901).
                              배경으로 8곳 쓰여 바탕(--lv-white)과 톤이 맞아야 한다 */
  --lv-platinum: #D1D5DB;   /* Platinum Mono   — 창업자 원값 */
  --lv-silver:   #E5E7EB;   /* PREMIUM·VIP 글자용 실버 */
}

/* ── 12-1. 배지 — 창업자 지정 4종 ──────────────────────────
   ⚠️ 특이도 주의: lovvon.css 의 `.lv-badge.sale`(0,2,0) 을 이기려면
      여기도 최소 (0,2,0) 이어야 한다. `.lv-badge` 하나로는 진다. */

/* BEST : 매트 블랙 배경 + 네온 핑크 글자
   (다크 전환 때 네온 채움으로 잘못 덮었던 것을 되돌린다 —
    많이 팔렸다는 "정보"지 행동 유도가 아니다) */
.lv-badge.best {
  background: var(--lv-matte);
  color: var(--lv-neon);
  border: 1px solid var(--lv-neon);
}

/* SALE : 네온 핑크 배경 + 흰 글자
   (배경은 맞았고 글자가 --lv-white 였다 → 반전 후 어두운색이 되어 안 읽혔다) */
.lv-badge.sale {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
  border-color: var(--lv-neon);
}

/* NEW : 라인 + 글자만 플래티넘, 면은 비운다 (260821 미라님 지정)
   창업자 규격은 "플래티넘 배경 + 블랙 글자" 였는데, 신상품 8개에 전부 붙으면
   다크 화면에 밝은 사각형이 줄지어 서서 BEST·SALE 보다 시선을 먼저 가져간다.
   NEW 는 정보성 배지라 아웃라인으로 낮추는 게 위계상 맞다. */
.lv-badge.new {
  background: transparent;
  color: var(--lv-platinum);
  border: 1px solid var(--lv-platinum);
}

/* PREMIUM·VIP : 블랙 배경 + 실버 글자 */
.lv-badge.premium, .lv-badge.vip {
  background: var(--lv-matte);
  color: var(--lv-silver);
  border: 1px solid var(--lv-gray-200);
}
/* 회원 등급 표기도 같은 규칙 (네온은 행동용이므로 등급에서 뺀다) */
.mp_grade { color: var(--lv-silver); }

/* ── 12-2. 버튼 위계 — 채움 vs 외곽선 ──────────────────────
   바로구매 = 네온 채움(Primary) / 장바구니 = 네온 테두리(Secondary)
   창업자: "장바구니: 블랙 또는 투명 배경 + 네온 핑크 테두리"

   ⚠️ 같은 역할의 버튼이 상세페이지와 하단 고정바 두 군데에 있고,
      클래스 이름이 서로 다르다(.lv-btn-* / .lv-buybar-*).
      한쪽만 고치면 스크롤 전후로 모양이 달라진다 — 260821 실제로 그랬다
      (.lv-buybar-buy 에만 radius 가 있어서 넷 중 하나만 둥글었다).
      → 모서리·테두리 같은 형태 속성은 반드시 네 개를 한 줄에 묶어서 준다. */
.lv-btn-buy, .lv-btn-cart,
.lv-buybar-buy, .lv-buybar-cart {
  border-radius: 6px;
  border: 1px solid var(--lv-neon);
}
/* ⚠️ 고정바의 원본 `.lv-buybar-btn` 은 `border: 1px solid var(--lv-black)` 인데
   반전 후 --lv-black 이 밝은색(#F3F4F6)이라 네온 버튼에 흰 테두리가 둘러졌다.
   위에서 네 개 모두 네온 테두리로 덮는다.

   글로우는 평상시엔 넷 다 없고 hover 에서만 켠다 —
   고정바는 스크롤 내내 떠 있어서 계속 빛나면 "행동하는 순간에만" 원칙에서 벗어난다. */
.lv-btn-buy:hover, .lv-buybar-buy:hover {
  box-shadow: 0 0 20px var(--lv-neon-glow);
  opacity: 1;
}
.lv-buybar-cart, .lv-btn-cart {
  background: var(--lv-matte);
  color: var(--lv-neon);
}
.lv-buybar-cart:hover, .lv-btn-cart:hover {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
  opacity: 1;
}

/* ★ hover 테두리는 예외 없이 네온이다 (260901)
   ------------------------------------------------------------
   평상시 테두리는 위에서 네온으로 덮었는데 **hover 블록에 border 를 안 적어서**,
   그 순간 원본의 `border: 1px solid var(--lv-black)`(= 반전 후 밝은색)이 다시 이겨
   버튼에 흰 테두리가 둘러졌다. hover 상태에도 같은 값을 명시해 못을 박는다.

   원본이 ID 스코프나 인라인으로 거는 경우가 있어 !important 를 붙인다 —
   여기서 지는 순간 '행동할 때 핑크'라는 규칙이 화면마다 어긋난다. */
.lv-btn-buy:hover, .lv-btn-cart:hover,
.lv-buybar-buy:hover, .lv-buybar-cart:hover,
.lv-buybar-btn:hover, .lv-btn-wish:hover,
/* 원본 lovvon.css 가 hover 에 var(--lv-black)(반전 후 밝은색)을 주는 버튼들.
   같은 증상이라 함께 잡는다 — lovvon.css:346 / :371 / :435 */
.lv-btn-outline:hover, .lv-quick-btn:hover, .lv-community-btn:hover {
  border-color: var(--lv-neon) !important;
}
/* 위 세 버튼은 글자색도 밝은색으로 바뀌어 테두리만 핑크면 어긋난다 */
.lv-btn-outline:hover, .lv-quick-btn:hover, .lv-community-btn:hover {
  color: var(--lv-neon) !important;
}
/* 바로구매는 채움 유지 (이미 규격과 일치) — hover 만 글로우 */
.lv-btn-buy {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
}

/* ── 12-3. accent 51곳 역할 분리 ────────────────────────────
   lovvon.css 의 --lv-accent 는 원래 베이지(#c8a98a) 장식색이었다.
   다크 전환에서 이 토큰을 네온으로 바꿔 51곳이 한꺼번에 핑크가 됐는데,
   그 중 대부분이 "행동"이 아니라 카테고리 라벨·별점·댓글수 같은 정보다.
   → 창업자 원칙("행동이 일어나는 순간에만")대로 역할을 나눈다.

   [네온 유지 = 행동·가격]  hover / 본문링크 / SALE / 할인율·옵션가·적립금 /
                            필수입력 표시 / 무료배송 진행바 / 선택된 카테고리
   [아래로 변경 = 정보]     라벨·별점·섹션제목·카운트·상태배지
   ------------------------------------------------------------ */

/* (a) 소형 대문자 라벨류 → 보조 텍스트 (작은 글씨라 너무 밝으면 튄다) */
.lv-mag-hero-cat, .lv-mag-card-cat, .lv-article-cat,
.lv-more-cat, .lv-popular-cat, .lv-mag-label,
.lv-iu-reply-label, .lv-tab-section-label,
.lv-detail-brand {
  color: var(--lv-gray-600);
}

/* (b) 섹션 제목 → 가장 강한 전경(제목색) */
.lv-form-section-title, .lv-detail-section-title,
.lv-order-layout section > h2 {
  color: var(--lv-black);
}

/* (c) 별점·평점 → 실버 (브랜드에 금색이 없다) */
.lv-stars::after, .lv-review-stars, .lv-score-stars,
.sps_card_star .star.on {
  color: var(--lv-silver);
}
.lv-score-bar-fill { background: var(--lv-silver); }

/* (d) 카운트류(댓글수·탭수·검색결과수) → 보조 텍스트 */
.lv-cmt-cnt, .bo_vc_tit .cmt_total, .lv-tab-cnt,
.lv-tab-btn em, .lv-search-wrap #sch_res_ov strong,
.lv-accent {
  color: var(--lv-gray-600);
}

/* (e) 상태 배지·답변 라벨 → 매트 블랙 면 + 실버 글자
       (답변완료는 "상태"지 행동이 아니다) */
.lv-qa-label-a, .lv-qa-block-label.a,
.lv-qa-badge-status.done, .lv-faq-a-badge {
  background: var(--lv-matte);
  color: var(--lv-silver);
  border: 1px solid var(--lv-gray-200);
}

/* (f) 리뷰 인용 좌측선 → 보더색 */
.lv-iu-reply-body, .lv-iu-reply {
  border-left-color: var(--lv-gray-200);
}

/* ── 12-4. 로고 — 평상시 플래티넘 / hover 네온 점등 (260821) ──
   로고는 관리자 업로드 이미지(/data/common/mobile_logo_img)이고
   검은 단색 + 투명 배경이다. 다크에서 그냥 두면 안 보인다.
   → 알파 실루엣을 mask 로 쓰고 그 위에 색을 칠한다. 이미지 파일은 그대로 둔다.
     로고를 교체해도 이 CSS 는 그대로 동작하고, 평상시 색은 아래 한 줄로 바꾼다.

   ⚠️ filter 와 mask 를 같은 요소에 걸면 안 된다 —
      필터가 먼저 적용되고 그 결과에 마스크가 씌워져서 글로우가 실루엣에 잘린다.
      그래서 부모 <a> 에 글로우, 자식 <span class="lv-logo-mark"> 에 마스크로 나눴다.
      (shop.head.php 51·141줄에 span 래퍼를 추가했다. 백업 .bak_260821_logo)

   시안의 O 안쪽 가로선은 여기서 못 한다 — CSS 는 이미지 속 특정 글자를 못 고른다.
   O 두 개에만 넣으려면 로고 SVG 원본이 필요하다. */
.lv-logo, .lv-panel-logo {
  transition: filter 0.25s ease;
}
.lv-logo-mark {
  display: block;
  -webkit-mask: url("/data/common/mobile_logo_img") no-repeat center / contain;
          mask: url("/data/common/mobile_logo_img") no-repeat center / contain;
  background-color: var(--lv-gray-700);   /* 플래티넘 #D1D5DB */
  transition: background-color 0.25s ease;
}
/* img 는 자리(크기)만 잡고 그림은 마스크가 대신한다 — display:none 이면 크기가 사라진다 */
.lv-logo-mark img { visibility: hidden; display: block; }

.lv-logo:hover, .lv-logo:focus-visible,
.lv-panel-logo:hover, .lv-panel-logo:focus-visible {
  filter: drop-shadow(0 0 9px var(--lv-neon-glow)) drop-shadow(0 0 22px var(--lv-neon-haze));
}
.lv-logo:hover .lv-logo-mark, .lv-logo:focus-visible .lv-logo-mark,
.lv-panel-logo:hover .lv-logo-mark, .lv-panel-logo:focus-visible .lv-logo-mark {
  background-color: var(--lv-neon);
}
.lv-logo:focus-visible, .lv-panel-logo:focus-visible {
  outline: 2px solid var(--lv-neon);
  outline-offset: 6px;
}

/* ── 12-5. buzinga 잔재 오렌지(#ff4c00) 일소 (260821) ────────
   mobile_shop.css 에 14곳 남아 있다. 예전에 "서비스 마크업 미사용"으로 판단하고
   놔뒀는데, 검색창에서 실제로 오렌지가 보인다는 제보가 나왔다.
   → 어느 경로로 새는지 하나씩 쫓는 대신 **선택자 전부를 브랜드 색으로 덮는다.**
      #ff4c00 은 색상각 18°(주황)로 LOVVON 팔레트에 아예 없는 색이다.

   원본은 수정하지 않는다. mobile_shop.css 는 head.sub.php 59줄에서 echo 되고
   이 파일이 바로 다음 줄이라 같은 특이도면 순서로 이긴다. */

/* 행동·강조 자리 → 네온 */
.hd_right_btn .cart .cart-count { background: var(--lv-neon); color: var(--lv-on-neon); }
#gnb_scroll li:hover a,
#gnb .gnb_1da:hover { color: var(--lv-neon); }
.search_modal_box #sch_submit {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
}
.search_modal_box #popular a:hover {
  border-color: var(--lv-neon);
  color: var(--lv-neon);
}
.sanchor a.sanchor_on span { background: var(--lv-neon); }
.more_btn a:hover {
  background: var(--lv-neon);
  border-color: var(--lv-neon);
  color: var(--lv-on-neon);
}
.cate_box li.on {
  color: var(--lv-neon);
  border-bottom-color: var(--lv-neon);
}
.cate_box li:hover { color: var(--lv-neon); }
.active { color: var(--lv-neon); }

/* 정보 자리 → 12-3 과 같은 규칙(별점은 실버). 네온은 행동에만 쓴다 */
.cate_box li { color: var(--lv-gray-600); border-bottom-color: transparent; }
.review_card_star .star.on,
.rv_star .star.on { color: var(--lv-silver); }
.review_card_star .star,
.rv_star .star { color: var(--lv-gray-200); }

/* ── 12-6. 장바구니 버튼 위계 (260821) ──────────────────────
   cart.php 186줄 주문하기 = .lv-btn-black / 191줄 쇼핑 계속하기 = .lv-btn-white.
   전역 규칙(5-1)에서 .lv-btn-black 은 어두운 면, .lv-btn-white 는 원본 그대로라
   모서리·배경·테두리가 서로 달랐다.

   ⚠️ .lv-btn-black 을 전역에서 네온으로 바꾸면 안 된다 —
      5-1 에 검색·주소·문의 등 10여 개 버튼이 같이 묶여 있어서 네온이 화면에 퍼진다.
      그래서 `.lv-cart-wrap` 스코프로만 승격시킨다.

   ⚠️ 특이도 — 쇼핑 계속하기는 <a> 이고 원본에 `a.lv-btn-white:link`(0,2,1) 이 있다.
      `.lv-cart-wrap .lv-btn-white`(0,2,0) 로는 글자색이 안 바뀐다. a 형태로 맞받는다. */

/* 주문하기 = Primary — 상세 '바로 구매'와 같은 모양 */
.lv-cart-wrap .lv-btn-black {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
  border: 1px solid var(--lv-neon);
  border-radius: 6px;
}
.lv-cart-wrap a.lv-btn-black,
.lv-cart-wrap a.lv-btn-black:link,
.lv-cart-wrap a.lv-btn-black:visited { color: var(--lv-on-neon); }
.lv-cart-wrap .lv-btn-black:hover {
  background: var(--lv-neon);
  box-shadow: 0 0 20px var(--lv-neon-glow);
  opacity: 1;
}

/* 쇼핑 계속하기 = Secondary — 이탈 동선이라 네온을 쓰지 않는다(중립 외곽선) */
.lv-cart-wrap .lv-btn-white {
  background: var(--lv-matte);
  border: 1px solid var(--lv-gray-200);
  border-radius: 6px;
}
.lv-cart-wrap a.lv-btn-white,
.lv-cart-wrap a.lv-btn-white:link,
.lv-cart-wrap a.lv-btn-white:visited { color: var(--lv-gray-700); }
.lv-cart-wrap .lv-btn-white:hover,
.lv-cart-wrap a.lv-btn-white:hover {
  border-color: var(--lv-neon);
  color: var(--lv-neon);
}

/* ── 위시리스트 · 오늘본상품 폭 제한 (260901) ─────────────
   #container 의 max-width 가 none 이라 페이지마다 자기 wrap 으로 폭을 잡는 구조인데
   (.lv-cart-wrap 1100 / .lv-coupon-wrap 960 / .lv-notice-wrap 800),
   shop/wishlist.php · shop/todayview.php 는 그런 wrap 없이 #sod_ws 하나로 끝나
   화면 폭을 그대로 다 썼다. 장바구니와 같은 값으로 맞춘다.

   ★ 두 페이지가 같은 #sod_ws 를 쓴다 — 한 규칙으로 둘 다 해결된다.
   ------------------------------------------------------------ */
#sod_ws {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 40px 80px;
  box-sizing: border-box;
}
@media (max-width: 768px) {
  #sod_ws { padding: 0 16px 60px; }
}

/* ── 12-7. 위시리스트 액션 버튼 (260821) ────────────────────
   /shop/wishlist.php 는 테마 오버라이드가 없어 영카트 코어 마크업을 그대로 쓴다.
     <div id="sod_ws_act">
       <button class="btn02">바로구매</button>
       <button class="btn01">장바구니</button>

   세 가지가 겹쳐 있었다:
   ① 7-3 덮개에 `#sod_ws_act .btn02` 는 있는데 **.btn01 이 빠졌다.**
      원본 `#sod_ws_act .btn01`(1,1,0) 은 `background:#111` 이라
      **다크 배경에 검은 버튼**이 남아 거의 안 보였다.
      → ID 선택자라 특이도 (1,1,0) 으로 맞받아야 한다. 클래스만으로는 못 이긴다.
   ② 위계가 뒤집혀 있었다 — 장바구니가 검정 채움(강조), 바로구매가 중립 면.
   ③ float 배치라 마크업 순서(바로구매→장바구니)와 화면 순서가 반대였다.
      상세페이지(.lv-cta-buttons)는 바로구매가 먼저다 → flex 로 바꿔 순서를 맞춘다.
      컨테이너 width 200px 도 너무 좁아 버튼 하나가 98px 이었다. */
#sod_ws_act {
  display: flex;
  gap: 10px;
  width: 100%;
  max-width: 420px;
  margin: 20px auto;
}
#sod_ws_act .btn01,
#sod_ws_act .btn02 {
  float: none;
  width: 50%;
  height: 46px;
  font-size: 13px;
  font-weight: 500;
  border-radius: 6px;
  cursor: pointer;
  transition: box-shadow 0.15s, background 0.15s, color 0.15s;
}
/* 바로구매 = Primary (상세 '바로 구매'와 같은 모양) */
#sod_ws_act .btn02 {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
  border: 1px solid var(--lv-neon);
}
#sod_ws_act .btn02:hover {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
  box-shadow: 0 0 20px var(--lv-neon-glow);
}
/* 장바구니 = Secondary (상세 '장바구니 담기'와 같은 모양) */
#sod_ws_act .btn01 {
  background: var(--lv-matte);
  color: var(--lv-neon);
  border: 1px solid var(--lv-neon);
}
#sod_ws_act .btn01:hover {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
}

/* ── 12-8. 코어 화면 3종 (260821) ───────────────────────────
   /bbs/point.php · /shop/orderinquiry.php · /shop/coupon.php
   셋 다 **테마 오버라이드가 없어** 영카트/그누보드 코어 마크업을 그대로 쓴다.
   다크 전환 때 lovvon 전용 클래스(.lv-*) 위주로 훑어서 통째로 빠졌고,
   원본에 밝은 배경(#fff·#f9f9f9·#f3f3f3)이 하드코딩돼 있어 다크에 흰 패널이 떴다.

   ⚠️ 원본이 대부분 ID 스코프(`#point .x`·`#scp_list .x`, 특이도 1,1,0)라
      클래스만으로는 못 이긴다. 같은 형태로 맞받는다.
   ⚠️ 브랜드에 없는 색 2개를 여기서 잡는다 — 팝업 헤더 파랑 #4162ff, 포인트 상태 주황 #eb3b0e. */

/* ── 팝업 레이아웃 공통 (포인트·쿠폰이 새 창으로 뜬다) ── */
.new_win #win_title {
  background: var(--lv-matte);
  color: var(--lv-black);
  border-bottom: 1px solid var(--lv-gray-200);
}
.new_win .win_ul li .selected {          /* 선택 상태 = 네온 (창업자 지정 자리) */
  background: var(--lv-neon);
  color: var(--lv-on-neon);
}
.new_win .win_desc { color: var(--lv-gray-600); }
.new_win .win_btn .btn_close {
  background: var(--lv-face);
  color: var(--lv-black);
  border: 1px solid var(--lv-gray-200);
}
.new_win .win_btn .btn_close:hover { border-color: var(--lv-neon); color: var(--lv-neon); }

/* ── 포인트 /bbs/point.php ── */
#point .point_all {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
#point .point_all .full_li span { color: var(--lv-black); }
#point .point_status {                    /* 원본 주황 #eb3b0e */
  background: var(--lv-matte);
  color: var(--lv-black);
  border: 1px solid var(--lv-gray-200);
}
.point_list li {
  background: var(--lv-gray-100);
  border-bottom-color: var(--lv-gray-200);
}
.point_list li:first-child { border-top-color: var(--lv-gray-200); }
.point_list .point_use { background: var(--lv-face-strong); }
.point_list .point_use .point_num { color: var(--lv-neon); }   /* 차감 — 원본 #ff4f76 */
.point_list .point_num { color: var(--lv-black); }
.point_list .point_date1,
.point_list .point_date { color: var(--lv-gray-400); }
.point_list .txt_expired { color: var(--lv-danger); }
.memo_list li.empty_li { color: var(--lv-gray-600); }
#point .btn_close {
  background: var(--lv-face);
  color: var(--lv-black);
  border: 1px solid var(--lv-gray-200);
  border-radius: 6px;
}
#point .btn_close:hover { border-color: var(--lv-neon); color: var(--lv-neon); }

/* ── 쿠폰 /shop/coupon.php ── */
#scp_list ul li { border-bottom-color: var(--lv-gray-200); }
#scp_list ul li .cou_bt { border-bottom-color: var(--lv-gray-200); }
#scp_list .pd_price strong { color: var(--lv-neon); }   /* 원본 #ff006c → 브랜드 네온 */
#scp_list .li_title { color: var(--lv-black); }
#scp_list .li_target {
  background: var(--lv-face-strong);
  color: var(--lv-gray-600);
  border-top-color: var(--lv-gray-200);
}
#scp_list .pd_date { color: var(--lv-gray-400); }

/* ── 주문조회 /shop/orderinquiry.php ── */
#sod_v_info {
  background: var(--lv-face-strong);
  color: var(--lv-gray-600);
  border: 1px solid var(--lv-gray-200);
  border-radius: 6px;
}

/* ── 12-9. 내용관리 /bbs/content.php (260821) ───────────────
   이용약관·개인정보처리방침·회사소개. 스킨 CSS 는 구분선 하나뿐이다.

   260821 확인: 세 페이지 모두 **아직 내용이 안 채워져 있었다.**
   "개인정보 처리방침에 대한 내용을 입력하십시오." 라는 그누보드 기본 더미이고,
   그 더미에 인라인 스타일이 딸려 있다 —
     background-color:rgb(255,255,255) / color:rgb(0,0,0)
   → 다크 화면에 흰 블록 + 검은 글씨가 떴다. 관리자 에디터에는 안 보인다.
   (provision 자리에도 개인정보 문구가 들어가 있다. 관리자 > 내용관리에서 채울 것)

   ⚠️ 인라인 style 은 특이도 최상이라 선택자로는 못 이긴다. !important 가 유일한 방법.
      (같은 함정을 #lv_to_top 에서 이미 겪었다)
   → 아래는 안전망이다. 내용을 채울 때 다른 문서에서 붙여넣어 서식이 딸려와도 막아준다.
     대신 본문에 의도적으로 색을 쓰려면 이 규칙을 완화해야 한다. */
/* 상단 구분선 제거 — 원본 `#ctt {border-top:1px solid #e9e9e9}`.
   ⚠️ content 스킨의 style.css 는 add_stylesheet(버퍼 주입)라 이 파일보다 뒤에 올 수 있다.
      같은 특이도(1,0,0)면 순서로 진다 → `body` 를 붙여 (1,0,1) 로 확실히 이긴다. */
body #ctt { border-top: none; }
#ctt_con { color: var(--lv-gray-700); }
/* 본문 안의 색 지정을 전부 무력화하고 테마 색을 상속시킨다.
   약관류는 색 강조가 의미를 갖지 않아 통째로 눕혀도 잃는 정보가 없다. */
#ctt_con *,
#ctt_con [style] {
  background-color: transparent !important;
  color: inherit !important;
}
#ctt_con a,
#ctt_con a:link,
#ctt_con a:visited { color: var(--lv-neon) !important; }
#ctt_con table,
#ctt_con td,
#ctt_con th {
  border-color: var(--lv-gray-200) !important;
  background-color: transparent !important;
}
#ctt_con th { color: var(--lv-black) !important; }

/* ── 12-10. 주문서 /shop/orderform.sub.php (260821) ─────────
   실화면 스크린샷으로 확인한 3가지.

   ① 결제수단 버튼이 **흰 박스에 흰 글자**라 라벨이 안 보였다.
      원본 831줄 `#od_pay_sl .lb_icon` : background:#eee; color:#777; border:1px solid #fff
      → 다크에서 배경 #eee 가 그대로 남아 밝은 덩어리 3개가 떴다.
      선택 상태(833줄)는 background:#111 이라 다크에서 거의 안 보인다.
      → 기본은 매트 면, 선택·hover 는 네온 채움. "선택 상태 = 네온"은 창업자 지정 자리다.

   ② 추가배송비 칸이 흰 박스. 원본 860줄 `td { background:#ffffffd6 }` (반투명 흰).

   ③ 결제하기 버튼이 중립 면이었다 → 장바구니 '주문하기'와 같은 Primary(네온 채움)로 맞춘다.
      주문서의 최종 CTA 인데 취소 버튼과 무게가 같으면 안 된다. */

/* ① 결제수단 */
#od_pay_sl .lb_icon {
  background: var(--lv-face);
  color: var(--lv-gray-700);
  border: 1px solid var(--lv-gray-200);
  border-radius: 6px;
}
#od_pay_sl .lb_icon:hover,
#od_pay_sl input[type="radio"]:checked + .lb_icon {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
  border: 1px solid var(--lv-neon);
}

/* ② 결제 금액표 */
#sod_frm_pay .pay_tbl th {
  border-bottom-color: var(--lv-gray-200);
  color: var(--lv-gray-600);
}
#sod_frm_pay .pay_tbl td {
  background: transparent;
  border-bottom-color: var(--lv-gray-200);
  color: var(--lv-gray-700);
}
#sod_frm_pay .pay_tbl td .btn_frmline {
  background: var(--lv-face);
  color: var(--lv-black);
  border: 1px solid var(--lv-gray-200);
  border-radius: 4px;
}
#od_tot_price strong { color: var(--lv-black); }

/* ③ 결제하기 = Primary (장바구니 '주문하기'·상세 '바로 구매'와 같은 모양) */
.lv-order-layout #display_pay_button .btn_submit {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
  border: 1px solid var(--lv-neon);
  border-radius: 6px;
}
.lv-order-layout #display_pay_button .btn_submit:hover {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
  box-shadow: 0 0 20px var(--lv-neon-glow);
  opacity: 1;
}

/* ④ 상품표가 오른쪽에서 잘린다 (다크와 무관한 레이아웃 건이지만 같은 화면이라 여기서 잡는다)
   `.lv-order-left`(padding-right:48px) 안에서 #sod_list 가 넘치는데 스크롤이 없어
   '배송비' 열의 "선불" 이 세로로 깨져 보였다. 표만 가로 스크롤시킨다 —
   페이지 body 가 가로로 밀리면 안 되므로 컨테이너에만 준다. */
.lv-order-layout .od_prd_list,
.lv-order-layout .tbl_wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ── 12-11. 매거진 섹션 + 아이콘 메뉴 (260821) ──────────────── */

/* ① 매거진 섹션 배경 제거 — 원본 543줄 `.lv-mag-index-section { background: var(--lv-bg-warm) }`.
   라이트 테마에서 베이지 면으로 구역을 나누던 장치인데, 다크에서는
   페이지 배경과 미묘하게만 달라 얼룩처럼 보인다. 면을 걷어낸다. */
.lv-mag-index-section { background: transparent; }

/* ② 매거진 카드 글자가 안 보인다 — latest 위젯 `theme/main` 스킨이
   buzinga(라이트) 기준으로 하드코딩돼 있다. dark 덮개가 없어 통째로 빠져 있었다.
     .lt_tit    #2c2c2a  ← 거의 검정. 다크에서 안 읽힌다
     .lt_detail #b0afa8  /  .lt_img background #f0f0ee (흰 썸네일 면)
   ⚠️ 스킨 style.css 는 add_stylesheet 로 이 파일보다 뒤에 올 수 있어
      `.lv-mag-index-section` 을 앞에 붙여 특이도를 올려 확실히 이긴다. */
.lv-mag-index-section .lt_gal li .lt_img { background: transparent; }
.lv-mag-index-section .lt_gal li .lt_txt .lt_tit { color: var(--lv-black); }
.lv-mag-index-section .lt_gal li .lt_txt .lt_tit:hover { color: var(--lv-neon); }
.lv-mag-index-section .lt_gal li .lt_txt .lt_detail,
.lv-mag-index-section .lt_gal .empty_list { color: var(--lv-gray-600); }

/* ③ 아이콘 메뉴 간격 16px → 25px (원본 747줄).
   원본이 `display:grid !important` 를 쓰는 블록이라 여기도 같은 선택자로 맞받는다. */
.lv-icon-menu > div { gap: 25px; }

/* ══════════════════════════════════════════════════════════
   회원 스킨 (mbskin) — 로그인·회원가입·비밀번호·포인트·메모 등 19개 화면
   ══════════════════════════════════════════════════════════
   skin/member/basic/style.css 가 밝은 색을 하드코딩하고 있는데,
   그 파일은 스킨이 add_stylesheet() 로 직접 부르고 선택자도
   `.mbskin .btn_submit`(0,2,0)·`#fregisterform .frm_label`(1,1,0) 처럼
   특이도가 높아 7-2/7-3 의 전역 덮개로는 못 이긴다.
   → 같은 형태의 선택자로 맞받는다. (260901)

   ★ 한 화면만 고치면 안 된다 — 19개 스킨이 이 style.css 하나를 공유한다.
   ------------------------------------------------------------ */

.mbskin { color: var(--lv-gray-700); }
.mbskin h1 { color: var(--lv-black); }
.mbskin p strong { color: var(--lv-black); }
.mbskin #mb_confirm_id { color: var(--lv-black); }

/* 주 액션 버튼 — 사이트의 다른 '실행' 버튼과 같은 네온 채움 */
.mbskin .btn_submit,
#fregisterform .btn_confirm .btn_submit {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
  border: 1px solid var(--lv-neon);
  border-radius: 6px;
}
.mbskin .btn_submit:hover,
#fregisterform .btn_confirm .btn_submit:hover {
  box-shadow: 0 0 20px var(--lv-neon-glow);
  opacity: 1;
}
#fregisterform .btn_confirm .btn_cancel {
  background: var(--lv-face);
  color: var(--lv-gray-700);
  border: 1px solid var(--lv-gray-200);
  border-radius: 6px;
}
#fregisterform .btn_confirm .btn_cancel:hover {
  border-color: var(--lv-neon);
  color: var(--lv-neon);
}

/* 가입 단계 표시 */
.reg_step .step { color: var(--lv-gray-400); }
.reg_step .step.active { color: var(--lv-neon); }
.reg_step .step_arrow { color: var(--lv-gray-200); }

/* 약관 섹션 */
#fregister section {
  background: var(--lv-gray-100);
  border-bottom: 1px solid var(--lv-gray-200);
}
#fregister_chkall {
  background: var(--lv-face);
  border-top: 2px solid var(--lv-gray-200);
  border-bottom: 1px solid var(--lv-gray-200);
}
#fregister_chkall label,
#fregister h2 { color: var(--lv-black); }
#fregister textarea {
  background: var(--lv-white);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}

/* 개인정보 처리 표 */
#fregister_private .tbl_head01 th {
  background: var(--lv-face);
  color: var(--lv-black);
  border: 1px solid var(--lv-gray-200);
}
#fregister_private .tbl_head01 td {
  background: var(--lv-gray-100);
  color: var(--lv-gray-700);
  border: 1px solid var(--lv-gray-200);
}
.private_info_txt {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
}
.private_info_txt p::before { color: var(--lv-gray-400); }

/* 가입 폼 */
#fregisterform .form_01 h2 { border-top: 2px solid var(--lv-gray-200); color: var(--lv-black); }
#fregisterform .frm_label { color: var(--lv-black); }
#fregisterform .frm_info,
#fregisterform #captcha_info { color: var(--lv-gray-400); }
#fregisterform .chk_li { color: var(--lv-gray-700); }
#fregisterform #msg_certify {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}

/* 체크박스 — 원본이 흰 면 + 검은 체크라 다크에서 보이지 않았다 */
.chk_box input[type="checkbox"] + label { color: var(--lv-gray-700); }
.chk_box input[type="checkbox"] + label:hover,
#fregisterform .chk_box input[type="checkbox"] + label:hover { color: var(--lv-neon); }
.chk_box input[type="checkbox"] + label span,
#fregisterform .chk_box input[type="checkbox"] + label span,
.fregister_agree input[type="checkbox"] + label span {
  background: var(--lv-white);
  border-color: var(--lv-gray-400);
}
.chk_box input[type="checkbox"]:checked + label { color: var(--lv-black); }
.chk_box input[type="checkbox"]:checked + label span,
#fregisterform .chk_box input[type="checkbox"]:checked + label span,
.fregister_agree input[type="checkbox"]:checked + label span {
  background-color: var(--lv-neon);
  border-color: var(--lv-neon);
  /* ★ 체크 아이콘 복구 (260908)
     바로 위 규칙이 `background:` 단축이라 체크 이미지를 none 으로 날린다.
     그 셀렉터엔 `:checked` 가 없어서 체크된 칸까지 같이 걸리는데,
     여기선 background-color 만 되돌리니 이미지가 영영 안 돌아왔다.
     ★ 스킨의 chk.png 를 다시 지정하지 않는다 — 경로가 화면마다 다르다.
       /bbs/register.php   → theme/lovvon/mobile/skin/member/basic/img/
       소셜 가입폼         → mobile/skin/social/img/
       (소셜 페이지는 member 스킨 CSS 자체가 로드되지 않는다)
       인라인 SVG 로 박아 경로 의존을 없앤다. 원본 PNG 와 같은 12×9 흰 체크다. */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 9'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M1 4.6 4.4 8 11 1.3'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 11px 8px;
}
.fregister_agree input[type="checkbox"] + label { color: var(--lv-gray-600); }
.fregister_agree input[type="checkbox"] + label:hover,
.fregister_agree input[type="checkbox"]:checked + label { color: var(--lv-black); }

/* 캡차 — 한 줄 배치 + 아이콘 보존
   ★ background 단축 속성으로 덮으면 안 된다.
     #captcha_mp3 · #captcha_reload 는 배경이 곧 아이콘이라
     (mobile.css: url(captcha2.png) 를 0 / -40px 로 잘라 쓴다)
     background 로 색을 주는 순간 아이콘이 사라진다. background-color 만 건드린다. */
#fregisterform #captcha {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
#fregisterform #captcha_img {
  display: block;
  height: 44px;
  margin: 0;
  border: 1px solid var(--lv-gray-200);
  border-radius: 6px;
  flex: 0 0 auto;
}
#fregisterform #captcha_key {
  flex: 1 1 110px;
  min-width: 90px;
  margin: 0;
  background-color: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
#fregisterform #captcha_mp3,
#fregisterform #captcha_reload { flex: 0 0 auto; }

/* 아이콘 버튼 — 회원가입뿐 아니라 게시판·1:1문의 캡차도 같은 이미지를 쓴다.
   captcha2.png 가 흰 바탕에 검은 아이콘이라 다크에서 그대로 두면 안 보인다.
   배경 이미지는 건드리지 않고 색만 반전한다. */
#captcha_mp3, #captcha_reload {
  border: 1px solid var(--lv-gray-200);
  border-radius: 6px;
  filter: invert(1);
}
#captcha_mp3:hover, #captcha_reload:hover { border-color: var(--lv-neon); }

/* 파일첨부 — 원본이 `color:red` 라 다크에서 특히 튄다 */
.filebox .fileName {
  background-color: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
.filebox .btn_file {
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
.filebox .btn_file:hover { border-color: var(--lv-neon); color: var(--lv-neon); }

/* ── 회원 스킨 2차 — ID 스코프로 남아 있던 것들 (260901) ──────
   1차에서 `.mbskin ...` 형태만 잡았더니 `#mb_confirm p`(1,0,1) ·
   `#mb_login .btn_submit`(1,1,0) 처럼 ID 로 걸린 규칙이 그대로 이겼다.
   같은 ID 스코프로 맞받는다.
   ------------------------------------------------------------ */

/* 비밀번호 재확인 */
#mb_confirm p { background: transparent; border-bottom-color: var(--lv-gray-200); }
#mb_confirm fieldset { color: var(--lv-gray-600); }

/* 로그인 */
#mb_login h1, #mb_login h2 { color: var(--lv-black); }
#mb_login p { color: var(--lv-gray-700); }
#mb_login .frm_input {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
#mb_login .frm_input:focus { border-color: var(--lv-neon); }
#mb_login .frm_input::placeholder { color: var(--lv-gray-400); }
#mb_login #login_info { color: var(--lv-gray-600); }
#mb_login #login_password_lost { color: var(--lv-gray-600) !important; }

/* 로그인 버튼 — 주 액션이라 네온 채움 */
#mb_login .btn_submit {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
  border: 1px solid var(--lv-neon);
  border-radius: 6px;
}
#mb_login .btn_submit:hover {
  opacity: 1;
  box-shadow: 0 0 20px var(--lv-neon-glow);
}

/* 회원가입 버튼 — 보조 액션이라 외곽선형 */
.join_wrap a {
  background: var(--lv-face);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
  border-radius: 6px;
}
.join_wrap a:hover { border-color: var(--lv-neon); color: var(--lv-neon); }

/* 비회원 성인인증 */
.adult_exit_wrap {
  background: var(--lv-face);
  border-bottom: 1px solid var(--lv-gray-200);
}
.adult_19_badge { border: 2px solid var(--lv-neon); color: var(--lv-neon); }
.adult_exit_msg { color: var(--lv-gray-700); }
.adult_exit_btn {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-600);
  border-radius: 6px;
}
.adult_exit_btn:hover { border-color: var(--lv-neon); color: var(--lv-neon); }

.adult_certi {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  border-radius: 6px;
}
.adult_certi .main_tit { color: var(--lv-black); }
.adult_certi ul { color: var(--lv-gray-400); }
.adult_certi .ad_list_span { color: var(--lv-gray-600); }
.adult_certi .ad_btn {
  background: var(--lv-face);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
  border-radius: 6px;
}
.adult_certi .ad_btn:hover { border-color: var(--lv-neon); color: var(--lv-neon); }

/* 비회원 개인정보 동의 박스 */
#guest_privacy {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}

/* 가입 폼 입력칸 (ID 스코프) */
#fregisterform .frm_input {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
#fregisterform .frm_input:focus,
#fregisterform #captcha_key:focus { border-color: var(--lv-neon); }

/* 가입완료 · 아이디/비번찾기 · 비번재설정 */
#reg_result #result_email { color: var(--lv-black); }
#reg_result h2 strong { color: var(--lv-neon); }
/* ★ 가입 축하 문구의 이름 — 원본(member/basic/style.css:206)이 `color:#222` 라
   다크 바탕에서 이름만 묻혀 보이지 않았다. 축하 문구의 주인공이라 강조로 올린다.
   (260908 — 같은 날 혜택 1~6 블록을 스킨에서 제거해 이 줄만 남았다) */
#reg_result .reg_cong { color: var(--lv-gray-700); }
#reg_result .reg_cong strong { color: var(--lv-neon); }
/* 축하 문구만 남은 화면이라 카드 껍데기를 없앤다 (260908)
   ★ background 는 `none` 이 아니라 `transparent` 로 둔다.
     원본(member/basic/style.css:201)이 `background:#fff` 라 반드시 덮어야 하고,
     border 는 원본에 없으므로 앞서 이 덮개가 넣은 것을 되돌리는 것이다. */
#reg_result .reg_result_wr {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
}
#reg_result .btn_confirm a {
  background: var(--lv-face);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
#reg_result .btn_confirm a:hover { border-color: var(--lv-neon); color: var(--lv-neon); }

#find_info #info_fs p { color: var(--lv-gray-700); }
#find_cert_wrap .cert_box,
#pw_reset_wrap .reset_box,
#pw_reset_wrap .id_box {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
}
#find_cert_wrap h3, #pw_reset_wrap h3 { color: var(--lv-black); }
#find_cert_wrap .btn_secondary {
  background: var(--lv-face);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
#find_cert_wrap .btn_secondary:hover { border-color: var(--lv-neon); color: var(--lv-neon); }

/* ── 회원 스킨 3차 — 남은 밝은 면 전부 (260901) ──────────────
   비회원 주문조회 · 비번재설정 · 쪽지 · 스크랩 · 정보수신 · 프로필.
   자주 보는 화면은 아니지만 하나라도 남으면 그 화면만 흰 판이 된다.
   ------------------------------------------------------------ */

/* 비밀번호 재설정 */
#pw_reset_wrap .id_box span.value { color: var(--lv-black); }
#pw_reset_wrap .frm_input {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
#pw_reset_wrap .frm_input:focus { border-color: var(--lv-neon); }

/* 로그인 화면의 비회원 주문조회 */
#mb_login_notmb, #mb_login_od_wr {
  background: var(--lv-gray-100);
  border-bottom: 1px solid var(--lv-gray-200);
}
#mb_login_notmb h2, #mb_login_odinfo {
  background: var(--lv-face);
  color: var(--lv-gray-700);
}

/* 쪽지 */
.memo_list li.read { background: var(--lv-face); }
#memo_view_ul { background: var(--lv-face); }
.memo_from {
  background: var(--lv-gray-100);
  border-bottom: 1px solid var(--lv-gray-200);
}
.memo_from li.memo_view_date { color: var(--lv-gray-600); }
#memo_view p { background: var(--lv-gray-100); color: var(--lv-gray-700); }

/* 스크랩 */
#scrap_do .scrap_tit { background: var(--lv-face); color: var(--lv-black); }

/* 정보 메일 */
#formmail .file_wr {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
#formmail .lb_icon { background: var(--lv-face); color: var(--lv-gray-400); }

/* 라디오 — 체크박스와 같은 이유로 다크에서 안 보였다 */
.chk_box input[type="radio"] + label { color: var(--lv-gray-700); }
.chk_box input[type="radio"] + label span {
  background: var(--lv-white);
  border: 1px solid var(--lv-gray-400);
}
.chk_box input[type="radio"]:checked + label { color: var(--lv-black); }
.chk_box input[type="radio"]:checked + label span {
  background: var(--lv-neon);
  border-color: var(--lv-neon);
}

/* 프로필 */
#profile table th, #profile table td {
  background: var(--lv-gray-100);
  color: var(--lv-gray-700);
  border-bottom: 1px solid var(--lv-gray-200);
}
#profile table th { color: var(--lv-black); }
#profile p {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-600);
}

/* 가입 안내 박스 */
.reg_wr ul li { background: var(--lv-gray-100); }

/* ── 회원 스킨 4차 — 어두운 배경 버튼 (260901) ────────────────
   ★ 1~3차는 '밝은 색'만 훑었는데, 진짜 안 보이는 건 오히려 이쪽이었다.
     원본이 주 액션 버튼을 background:#111 / #1a1a1a 로 칠해 두었는데
     다크 전환 후 바탕(--lv-white)이 #111111 이라 **버튼이 배경에 묻힌다.**
     밝은 면만 찾는 검사로는 절대 안 걸리는 유형이다.
   → 사이트의 다른 주 액션과 같이 네온 채움으로 통일한다.
   ------------------------------------------------------------ */
#fregister .btn_confirm .btn_submit,
#fregisterform .btn_frmline.btn,
#find_cert_wrap .btn_primary,
#pw_reset_wrap .btn_submit {
  background: var(--lv-neon);
  color: var(--lv-on-neon);
  border: 1px solid var(--lv-neon);
  border-radius: 6px;
}
#fregister .btn_confirm .btn_submit:hover,
#fregisterform .btn_frmline.btn:hover,
#find_cert_wrap .btn_primary:hover,
#pw_reset_wrap .btn_submit:hover {
  opacity: 1;
  box-shadow: 0 0 20px var(--lv-neon-glow);
}

/* 로그인 화면 좌측 비주얼 — 바탕과 같은 톤이 되면 분할이 안 보인다 */
#mb_login .login-visual { background: var(--lv-face-strong); }

/* 스크랩 분류 뱃지 — 원본 color 값이 깨져 있다(#ㄹㄹㄹ) */
#scrap .scrap_cate { background: var(--lv-face); color: var(--lv-gray-700); }

/* 게시판·1:1문의 캡차도 같은 줄 배치로 맞춘다 (260901) */
#captcha {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
#captcha #captcha_img {
  height: 44px;
  margin: 0;
  border: 1px solid var(--lv-gray-200);
  border-radius: 6px;
  flex: 0 0 auto;
}
#captcha #captcha_key { flex: 1 1 110px; min-width: 90px; margin: 0; }

/* ══════════════════════════════════════════════════════════
   주문서 상품목록 — 표 걷어내기 (260901)
   ══════════════════════════════════════════════════════════
   `.tbl_head03`(mobile_shop.css) 이 검은 상단선·흰 헤더·격자를 그리고 있고
   7-4 다크 덮개가 색만 바꿔 격자가 그대로 드러났다.
   오른쪽 '결제 금액' 카드와 톤이 안 맞아 유독 표처럼 보인다.

   → 세로선을 없애고 가로 구분선만 남겨 카드 안의 목록처럼 만든다.
   `.od_prd_list ...`(0,2,1)이 `.tbl_head03 ...`(0,1,1)을 이기므로 !important 불필요.
   ------------------------------------------------------------ */
.od_prd_list {
  border: 1px solid var(--lv-gray-200);
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 28px;
}
.od_prd_list table { border-bottom: 0; }

.od_prd_list thead th {
  background: transparent;
  border-top: 0;                                   /* 원본의 2px 검은 선 제거 */
  border-bottom: 1px solid var(--lv-gray-200);
  border-left: 0; border-right: 0;
  color: var(--lv-gray-400);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 14px 14px;
  white-space: nowrap;                             /* '배송비' 세로쓰기 방지 */
}
.od_prd_list tbody td,
.od_prd_list tbody th {
  border-top: 0;
  border-left: 0; border-right: 0;
  border-bottom: 1px solid var(--lv-gray-200);
  padding: 16px 14px;
  vertical-align: middle;
}
.od_prd_list tbody tr:last-child td { border-bottom: 0; }

/* 정렬 — 상품명은 왼쪽, 수량·배송비는 가운데, 금액은 오른쪽 */
.od_prd_list th, .od_prd_list td { text-align: center; white-space: nowrap; }
.od_prd_list th:first-child, .od_prd_list td:first-child { text-align: left; white-space: normal; }
.od_prd_list th:nth-child(3), .od_prd_list td:nth-child(3),
.od_prd_list th:nth-child(4), .od_prd_list td:nth-child(4),
.od_prd_list th:nth-child(5), .od_prd_list td:nth-child(5) { text-align: right; }

/* 배송비 칸 — 값이 짧아 세로로 쪼개지던 자리. 작은 라벨로 둔다 */
.od_prd_list td:last-child {
  font-size: 11px;
  color: var(--lv-gray-400);
  min-width: 54px;
}

/* 소계는 금액 중 가장 중요한 값이라 한 단계 밝게 */
.od_prd_list td:nth-child(4) { color: var(--lv-gray-800); }

/* 좁은 화면 — 표를 버리고 카드로 바꾼다
   ------------------------------------------------------------
   ★ 선택자를 `.lv-order-layout #sod_list` 로 잡아야 한다.
     원본(lovvon.css @media 768)이 같은 스코프로
     `td:nth-child(3){width:16%}` 처럼 폭을 고정하는데, 그게 (1,2,1) 이라
     `.od_prd_list tbody td`(0,2,1) 로는 못 이긴다.
     그 상태로 tr 을 flex 로 만들면 16% 안에 금액이 넘쳐 **옆 칸과 겹친다.**

   원본은 5·6번 열(포인트·배송비)을 display:none 으로 감춘다 — 그건 그대로 둔다.
   td 순서: 1 상품명 · 2 총수량 · 3 판매가 · 4 소계 · 5 포인트 · 6 배송비 */
@media (max-width: 768px) {
  .lv-order-layout #sod_list,
  .lv-order-layout #sod_list thead,
  .lv-order-layout #sod_list tbody,
  .lv-order-layout #sod_list tr,
  .lv-order-layout #sod_list td { display: block; width: auto; }

  .lv-order-layout #sod_list { table-layout: auto; }
  .lv-order-layout #sod_list thead { display: none; }

  .lv-order-layout #sod_list tbody tr {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 16px;
    padding: 16px 14px;
    border-bottom: 1px solid var(--lv-gray-200);
  }
  .lv-order-layout #sod_list tbody tr:last-child { border-bottom: 0; }

  /* ★ width:auto 를 nth-child 까지 맞춰 눌러 준다 — 겹침의 직접 원인 */
  .lv-order-layout #sod_list td:nth-child(1),
  .lv-order-layout #sod_list td:nth-child(2),
  .lv-order-layout #sod_list td:nth-child(3),
  .lv-order-layout #sod_list td:nth-child(4) {
    width: auto;
    flex: 0 0 auto;
    border: 0;
    padding: 0;
    font-size: 12px;
    color: var(--lv-gray-600);
    text-align: left;
    white-space: nowrap;
  }

  /* 상품명 칸 — 썸네일과 텍스트를 나란히 붙인다
     ★ 원본은 .sod_img 를 float:left 로 흘려서, 상품명이 길면 썸네일 아래로
       감아 내려가 카드마다 들쭉날쭉했다. flex 로 두 덩어리를 고정한다.
       썸네일 오른쪽 공간을 텍스트가 다 쓰고, 세부내용은 상품명 바로 아래에 붙는다. */
  .lv-order-layout #sod_list td:nth-child(1) {
    flex: 1 1 100%;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    white-space: normal;
    margin-bottom: 6px;
  }
  .lv-order-layout #sod_list .sod_img {
    float: none;
    flex: 0 0 auto;
    margin: 0;
    display: block;
  }
  .lv-order-layout #sod_list .sod_name {
    flex: 1 1 auto;
    min-width: 0;              /* 긴 상품명이 칸을 밀어내지 않게 */
    display: block;
    overflow: visible;
    line-height: 1.45;
  }
  .lv-order-layout #sod_list .sod_opt {
    margin-top: 4px;
    font-size: 11px;
    color: var(--lv-gray-400);
    line-height: 1.5;
  }

  /* 라벨 — thead 를 숨겼으니 값만으로는 무슨 숫자인지 모른다 */
  .lv-order-layout #sod_list td:nth-child(2)::before { content: '수량 '; }
  .lv-order-layout #sod_list td:nth-child(3)::before { content: '판매가 '; }
  .lv-order-layout #sod_list td:nth-child(4)::before { content: '소계 '; }
  .lv-order-layout #sod_list td:nth-child(2)::before,
  .lv-order-layout #sod_list td:nth-child(3)::before,
  .lv-order-layout #sod_list td:nth-child(4)::before {
    color: var(--lv-gray-400);
    font-size: 11px;
    margin-right: 3px;
  }

  /* 소계는 이 카드에서 제일 중요한 값 */
  .lv-order-layout #sod_list td:nth-child(4) {
    color: var(--lv-black);
    font-weight: 600;
    margin-left: auto;      /* 오른쪽 끝으로 밀어 판매가와 확실히 떨어뜨린다 */
  }

}

/* ── 주문서 아코디언 화살표 (260901) ─────────────────────────
   원본(lovvon.css:2542)이 `font-size:12px` + gray-400 이라
   눌러야 하는 자리인 줄 아무도 모른다. 화살표만 크게 키우고 색을 밝힌다.
   원본과 같은 @media (max-width:768px) 안에서만 적용해야 한다.
   ------------------------------------------------------------ */
@media (max-width: 768px) {
  .lv-order-layout #sod_frm_orderer h2.lv-accordion-h2,
  .lv-order-layout #sod_frm_taker h2.lv-accordion-h2 {
    padding: 4px 0;
  }
  .lv-order-layout #sod_frm_orderer h2.lv-accordion-h2::after,
  .lv-order-layout #sod_frm_taker h2.lv-accordion-h2::after {
    content: '▾';
    font-size: 22px;
    line-height: 1;
    color: var(--lv-gray-600);
    flex-shrink: 0;
  }
  /* 펼쳐진 동안에는 네온 — 지금 열린 섹션이 어디인지 바로 보인다 */
  .lv-order-layout #sod_frm_orderer.lv-acc-open h2.lv-accordion-h2::after,
  .lv-order-layout #sod_frm_taker.lv-acc-open h2.lv-accordion-h2::after {
    color: var(--lv-neon);
  }
}

/* ══════════════════════════════════════════════════════════
   배송지 목록 팝업 (/shop/orderaddress.php) — 카드형 (260901)
   ══════════════════════════════════════════════════════════
   테마 오버라이드가 없어 그누보드 기본 표(tbl_head03)가 그대로 나온다.
   좁은 팝업에 4열 표라 배송지·주소·버튼이 다 눌려 읽기 어렵다.
   → 표를 풀어 배송지 하나당 카드 한 장으로 만든다.

   `#sod_addr`(1,0,0) 스코프라 기본 표 규칙(0,1,1)을 넉넉히 이긴다.
   td 순서: 1 배송지명(체크박스+입력) · 2 이름 · 3 주소·연락처 · 4 관리버튼
   ------------------------------------------------------------ */
#sod_addr {
  max-width: 680px;
  margin: 0 auto;
  padding: 24px 20px 40px;
  box-sizing: border-box;
}
#sod_addr #win_title {
  font-size: 15px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0 0 20px;
}

/* 표 껍데기 걷어내기 */
#sod_addr .tbl_head03 { margin: 0; border: 0; }
/* ★ collapse 면 tr 에 준 테두리가 셀로 병합돼 카드가 안 그려진다 */
#sod_addr table { border: 0; border-collapse: separate; width: 100%; }
#sod_addr thead { display: none; }
#sod_addr table, #sod_addr tbody, #sod_addr tr, #sod_addr td { display: block; width: auto; }

/* 카드 */
#sod_addr tbody tr {
  border: 1px solid var(--lv-gray-200);
  border-radius: 8px;
  padding: 16px 16px 14px;
  margin-bottom: 12px;
  background: var(--lv-face);        /* 바탕(#111)과 확실히 구분되게 한 단계 밝게 */
}
#sod_addr tbody td {
  border: 0;
  padding: 0;
  text-align: left;
  font-size: 13px;
  color: var(--lv-gray-700);
}

/* 1) 배송지명 — 체크박스 + 입력칸 */
#sod_addr td.td_sbj {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
#sod_addr td.td_sbj .frm_input {
  flex: 1 1 auto;
  min-width: 0;
  height: 40px;
  background: var(--lv-white);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-black);
  font-weight: 600;
}

/* 2) 이름 */
#sod_addr td.td_name {
  color: var(--lv-black);
  font-weight: 600;
  margin-bottom: 4px;
}

/* 3) 주소 · 연락처 */
#sod_addr td.td_address { line-height: 1.7; color: var(--lv-gray-600); }
#sod_addr td.td_address .ad_tel {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: var(--lv-gray-400);
}

/* 4) 관리 버튼 */
#sod_addr td.td_mng {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--lv-gray-200);
}
/* ★ 원본(mobile_shop.css:464-465)이 .sel_address / .del_address 에
   `width:32%; float:left` 를 준다. 그대로 두면 flex 안에서 버튼이 과하게 커지고
   float 가 남아 줄이 어긋난다. 같은 특이도로 눌러 준다. */
#sod_addr .sel_address,
#sod_addr .del_address,
#sod_addr .default_lb,
#sod_addr .add_lb,
#sod_addr .mng_btn {
  width: auto;
  float: none;
  line-height: normal;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  padding: 0 14px;
  font-size: 12px;
  border-radius: 6px;
  border: 1px solid var(--lv-gray-200);
  background: var(--lv-face);
  color: var(--lv-gray-700);
  text-decoration: none;
  cursor: pointer;
}
#sod_addr .mng_btn:hover { border-color: var(--lv-neon); color: var(--lv-neon); }

/* 선택 = 이 화면의 주 액션 */
#sod_addr .sel_address {
  background: var(--lv-neon);
  border-color: var(--lv-neon);
  color: var(--lv-on-neon);
}
#sod_addr .sel_address:hover {
  color: var(--lv-on-neon);
  box-shadow: 0 0 16px var(--lv-neon-glow);
}

/* 기본배송지 — 라디오는 숨기고 라벨을 토글처럼 */
#sod_addr td.td_mng input[type="radio"] { position: absolute; opacity: 0; width: 0; height: 0; }
/* 기본배송지 라벨
   ★ 클래스가 PC(.default_lb) / 모바일(.add_lb) 로 다르다. 둘 다 잡아야 한다.
     원본 mobile_shop.css:467 이 `border/color:#4162ff` 라 다크에서 파란 버튼이 됐다. */
#sod_addr .default_lb,
#sod_addr .add_lb {
  margin-left: auto;
  color: var(--lv-gray-600);
  border: 1px solid var(--lv-gray-200);
  background: var(--lv-face);
}
#sod_addr td.td_mng input[type="radio"]:checked + .default_lb,
#sod_addr input[type="radio"]:checked + .add_lb {
  background: var(--lv-face);
  border-color: var(--lv-neon);
  color: var(--lv-neon);
}

/* 하단 버튼 */
#sod_addr .win_btn {
  display: flex;
  align-items: stretch;
  gap: 8px;
  margin: 18px 0 0;
  text-align: left;
}
/* ★ 원본(mobile.css:293-294)이 .btn_close 에 `margin:10px 0`,
   .btn_submit 에 `margin:0 0 20px` 을 준다. 마진을 안 지우면
   두 버튼의 세로 위치가 어긋나 한쪽만 내려앉는다. */
#sod_addr .win_btn .btn_submit,
#sod_addr .win_btn .btn_close {
  flex: 1 1 0;
  width: auto;
  height: 46px;
  line-height: 44px;
  margin: 0;
  padding: 0;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 400;
  cursor: pointer;
  box-sizing: border-box;
}
#sod_addr .win_btn .btn_submit {
  background: var(--lv-neon);
  border: 1px solid var(--lv-neon);
  color: var(--lv-on-neon);
}

@media (max-width: 768px) {
  #sod_addr { padding: 18px 14px 32px; }
  #sod_addr td.td_mng { flex-wrap: wrap; }
  #sod_addr .default_lb, #sod_addr .add_lb { margin-left: 0; }
}

/* ══════════════════════════════════════════════════════════
   소셜 로그인 화면 다크 (260908)
   ══════════════════════════════════════════════════════════
   네이버·카카오 로그인을 켜면서 새로 노출된 화면들인데
   다크 덮개가 한 줄도 없었다. 대상은 두 곳이다.

     /bbs/register.php                      → #sns_register 패널
     /plugin/social/register_member.php     → 소셜 전용 가입폼 + 연결 모달

   ★ 왜 기존 회원가입 규칙이 안 먹었나
     일반 가입은 `#fregister`(member/basic/register.skin.php) 스코프인데
     소셜 가입폼은 같은 마크업을 `#fregisterform` 안에 넣는다.
     그래서 1310~1345 의 약관·textarea 덮개가 통째로 빗나갔다.
     여기서 `#fregisterform` 스코프로 다시 받는다.

   ★ 로드 순서
     스킨 style.css·remodal 테마는 add_stylesheet() 로 </title> 직후에
     주입되고 lovvon-dark.css 는 그 뒤(head.sub.php:83)라 같은 특이도면
     이쪽이 이긴다. 단 동의 상세 모달만 예외 — 아래 별도 표기.
   ------------------------------------------------------------ */

/* ── 1. 약관동의 화면의 SNS 가입 패널 (#sns_register) ────────
   스킨 style.css:81 이 `background:#fff;border:1px solid #dbdbdb` 라
   다크 바탕 위에 흰 카드가 그대로 떠 있었다.
   ★ 버튼 색(네이버 #1fc800 · 카카오 #ffeb00)은 각 사업자
     브랜드 가이드에 묶여 있어 건드리지 않는다. 판만 어둡게 만든다. */
#sns_register {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  border-radius: 8px;
  overflow: hidden;

  /* ★ 폭 — 이 화면의 진짜 문제였다.
     member/basic/style.css:87 이 `#fregister {max-width:720px;margin:0 auto}` 로
     가입폼을 묶는데, #sns_register 는 register.skin.php:20 에서 폼 **바깥**
     (.mbskin 직속)에 include 된다. 그래서 폭 제한을 못 받고 혼자 화면
     끝까지 터져 아래 폼과 어긋나 보였다. 같은 720px 에 맞춘다. */
  max-width: 720px;
  margin: 0 auto 24px;
  box-sizing: border-box;
}
#sns_register h2 {
  color: var(--lv-black);
  border-bottom: 1px solid var(--lv-gray-200);
}

/* 버튼 2단 배치 — 로그인 화면(member/basic/style.css:315 `#mb_login
   #sns_login .sns-icon {width:49%}`)과 같은 규칙으로 맞춘다.
   ★ 원본의 `:nth-child(3n+1){clear:both}`(1,1,0) 은 3단 기준이라
     2단에서 줄이 어긋난다. (1,2,0) 으로 받아 무력화한다.
     .sns-wrap 마지막에 <script> 가 들어오지만(PC 는 팝업 방식)
     링크 뒤라 odd/even 계산에는 영향이 없다. */
#sns_register .sns-icon { width: 49%; margin: 0 0 5px; }
#sns_register .sns-icon:nth-child(odd) { clear: both; margin-right: 2%; }
/* 로그인 화면 SNS 블록도 같은 이유로 구분선만 톤을 맞춘다 */
#sns_login h3 { color: var(--lv-gray-400); }

/* 소셜 안내·경고 박스 (style.css:3-7) — 전부 밝은 파스텔 면이다 */
.social_info_guide {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
.bg-warning1, .bg-warning2, .bg-warning3 {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}

/* ── 2. 소셜 전용 가입폼 (#fregisterform) ────────────────── */

/* ★ 폭 — #sns_register 와 똑같은 이유다.
   이 화면은 bbs/register.php 가 아니라 plugin/social/register_member.php 라
   `#fregister {max-width:720px}`(member/basic/style.css:87) 가 아예 없다.
   래퍼 `.social_register` 는 스킨 style.css:97 에서 `padding:15px` 뿐이라
   폭이 화면 전체로 퍼졌다. 일반 가입폼과 같은 720px 로 맞춘다.
   .member_connect 는 .social_register 밖의 형제 div 라 따로 잡아야 한다. */
.social_register {
  max-width: 720px;
  margin: 0 auto;
  box-sizing: border-box;
}

/* 약관·개인정보 섹션 — 스킨 style.css:100 `section {background:#fff}` */
.social_register #fregisterform section,
#fregister_term,
#fregister_private {
  background: var(--lv-gray-100);
  border-bottom: 1px solid var(--lv-gray-200);
}
#fregisterform h2 { color: var(--lv-black); }

/* 약관 본문 — 원본이 `background:#fbfbfb;color:#555` 로 밝은 판을 깐다.
   1330 의 `#fregister textarea` 가 여기까지 닿지 않던 자리다. */
#fregisterform textarea {
  background: var(--lv-white);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}

/* 상단 안내 문구 — 원본이 #f2838f(연분홍) 면에 #da4453 막대다.
   다크에서 형광처럼 뜨고 브랜드 네온과도 색이 부딪힌다.
   어두운 면 + 네온 막대로 바꿔 '주의' 신호는 그대로 남긴다. */
.social_register #fregisterform > p {
  background: var(--lv-face);
  color: var(--lv-gray-700);
}
.social_register #fregisterform > p:before { background: var(--lv-neon); }
.social_register #fregisterform > p i { color: var(--lv-neon); }

/* '자세히보기' — 원본 #3f51b5(남색)라 어두운 면에서 거의 안 읽힌다 */
#fregisterform .js-open-consent { color: var(--lv-neon); }

/* ── 3. 기존 계정 연결 안내 (.member_connect) ─────────────── */
.member_connect {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);   /* 원본 2px #cacaca */
  border-radius: 6px;
  /* 원본이 `margin:10px` 뒤에 `margin-top:30px` 를 덧쓴다. 통째로 다시 준다.
     ★ 아래쪽 60px 은 푸터와의 간격이다. 이 박스가 페이지 마지막 흐름 요소인데
       원본에 bottom 마진이 없어 푸터에 딱 붙어 겹쳐 보였다. (260908) */
  max-width: 720px;
  margin: 30px auto 60px;
  box-sizing: border-box;
}
.member_connect .strong { color: var(--lv-black); }
/* 원본 버튼이 #6f50e7(보라)로 브랜드 밖 색이다 — 보조 액션이라 외곽선형 */
.member_connect button {
  background: var(--lv-face);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
.member_connect button:hover {
  background: var(--lv-face);
  border-color: var(--lv-neon);
  color: var(--lv-neon);
}

/* ── 4. 계정 연결 모달 (#sns-link-pnl) ────────────────────
   remodal-default-theme.css 가 `.remodal {background:#fff}` 라
   모달이 통째로 흰 판이었다. ID+클래스로 받는다. */
#sns-link-pnl.remodal {
  background: var(--lv-gray-100);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
  box-shadow: 0 0 24px rgba(0, 0, 0, .75);
}
#sns-link-pnl .connect-title { color: var(--lv-black); }
#sns-link-pnl .connect-close { color: var(--lv-gray-400); }
#sns-link-pnl .connect-close:hover { color: var(--lv-neon); }
/* 안내문 — 원본이 부트스트랩 success 색(#dff0d8 연두)이다 */
#sns-link-pnl .connect-fg .connect-desc {
  background: var(--lv-white);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-600);
}
#sns-link-pnl #login_fs label { color: var(--lv-gray-600); }
#sns-link-pnl #login_fs .frm_input {
  background: var(--lv-white);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
#sns-link-pnl #login_fs .frm_input:focus { border-color: var(--lv-neon); }
#sns-link-pnl #login_fs .frm_input::placeholder { color: var(--lv-gray-400); }
/* 연결하기 = 이 모달의 주 액션이라 네온 채움 (1453 로그인 버튼과 같은 규칙) */
#sns-link-pnl #login_fs .login_submit {
  background: var(--lv-neon);
  border: 1px solid var(--lv-neon);
  color: var(--lv-on-neon);
  border-radius: 6px;
}
#sns-link-pnl #login_fs .login_submit:hover { box-shadow: 0 0 16px var(--lv-neon-glow); }
/* remodal 이 body 에 얹는 오버레이 — 기본값이 밝아 바탕이 뿌옇게 뜬다 */
.remodal-overlay { background: rgba(0, 0, 0, .72); }

/* ── 5. 동의 상세 모달 (consent_modal.inc.php) ────────────
   ★ 이 모달만 스타일이 <style> 인라인으로 body 안에 있다.
     lovvon-dark.css 보다 뒤라 순서로는 못 이긴다.
     `.cd-card`(0,1,0) 를 `#consentDialog .cd-card`(1,1,0) 로 받아
     특이도로 이긴다. 클래스만 쓰면 조용히 무시된다.
   (cf_use_promotion=1 일 때만 노출된다) */
#consentDialog .cd-card {
  background: var(--lv-gray-100);
  color: var(--lv-gray-700);
}
#consentDialog .cd-title { color: var(--lv-black); }
#consentDialog .cd-body {
  border-top: 1px solid var(--lv-gray-200);
  border-bottom: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
#consentDialog .cd-actions .cd-agree {
  background: var(--lv-neon);
  border: 1px solid var(--lv-neon);
  color: var(--lv-on-neon);
}
#consentDialog .cd-actions .cd-close {
  background: var(--lv-face);
  border: 1px solid var(--lv-gray-200);
  color: var(--lv-gray-700);
}
#consentDialog .cd-actions .cd-close:hover { border-color: var(--lv-neon); color: var(--lv-neon); }

/* ── 6. 소셜 가입폼 레이아웃 정리 (260908) ────────────────
   ★ 이 화면(plugin/social/register_member.php)은 member 스킨 CSS 가
     아예 로드되지 않는다. register.skin.php 가 add_stylesheet 로 붙이는
     파일이라, 소셜 스킨을 include 하는 이 페이지에는 안 딸려온다.
     그래서 아래 규칙들이 전부 빠진 채로 렌더된다.
        #fregisterform .form_01 ul {margin:0;padding:0;list-style:none}
        #fregisterform .form_01 li {margin-bottom:10px}
        #fregisterform .chk_box {padding:7px 0}
        #fregisterform .chk_li {padding-left:26px}
     항목 간격이 들쭉날쭉하고 체크박스와 글자가 붙어 보이던 원인이다.
     여기서 같은 값을 직접 정의해 두 화면의 간격을 맞춘다.
   ------------------------------------------------------------ */
#fregisterform .form_01 ul { margin: 0; padding: 0; list-style: none; }
#fregisterform .form_01 > ul > li { margin: 0; padding: 7px 0; }

/* 체크 항목 한 줄 — 체크박스(절대배치 17px)와 글자가 겹치지 않게
   padding-left 를 명시한다. gap 은 쓰지 않는다. label 이 폭 0 이라
   gap 을 주면 들여쓰기가 화면마다 어긋난다. */
#fregisterform .consent-line { display: flex; align-items: center; }
#fregisterform .consent-line .chk_li { flex: 1 1 auto; padding-left: 26px; }
#fregisterform .js-open-consent { flex: 0 0 auto; margin-left: auto; padding: 0; }

/* 하위 채널(이메일 · SMS) */
#fregisterform .consent-group .sub-consents { margin: 4px 0 0; padding: 0 0 0 20px; }
#fregisterform .sub-consents > li { margin: 0; padding: 5px 0; }
#fregisterform .sub-consents .chk_li { padding-left: 26px; }

/* 안내 원문 보관용 — 자리를 차지하면 안 되는 것들 */
#fregisterform template { display: none !important; }

/* ── 7. 개인정보 수집 표 — 폴백 (260908) ──────────────────
   ★ 평소엔 쓰이지 않는다. 같은 날 social_register_member.skin.php 의
     <table> 을 `.private_info_txt` 3줄로 교체했기 때문이다(8번 참조).
     스킨을 원복하거나 플러그인을 업데이트해 표가 되돌아오는 경우를 대비해
     남겨 둔다 — 표가 살아나면 이 규칙이 격자를 걷어낸다.
   ★ 위 2번의 `#fregister_private .tbl_head01 th/td` 다크 규칙보다
     뒤에 와야 이긴다(같은 특이도 → 순서). 위치를 옮기지 말 것. */
#fregister_private .tbl_head01 {
  background: var(--lv-white);
  border: 1px solid var(--lv-gray-200);
  padding: 2px 16px 8px;
  margin-bottom: 10px;
}
#fregister_private .tbl_head01 table { border: 0; border-collapse: collapse; }
#fregister_private .tbl_head01 th {
  background: none;
  border: 0;
  border-bottom: 1px solid var(--lv-gray-200);
  padding: 10px 0 8px;
  color: var(--lv-gray-400);
  font-size: 12px;
  font-weight: 500;
  text-align: left;
}
#fregister_private .tbl_head01 td {
  background: none;
  border: 0;
  border-bottom: 1px solid var(--lv-gray-200);
  padding: 9px 0;
  color: var(--lv-gray-600);
  font-size: 13px;
  line-height: 1.7;
  vertical-align: top;
}
#fregister_private .tbl_head01 tr:last-child td { border-bottom: 0; }
/* 보유기간 열 — 값이 짧아 오른쪽에 붙여 두면 항목이 넓게 쓰인다 */
#fregister_private .tbl_head01 th + th,
#fregister_private .tbl_head01 td + td {
  width: 130px;
  padding-left: 12px;
  text-align: right;
  white-space: nowrap;
}

/* ── 8. 개인정보 수집 3줄 (.private_info_txt) — 260908 ────
   social_register_member.skin.php 의 <table> 을 /bbs/register.php 와
   같은 `.private_info_txt` 3줄로 교체했다. 그런데 그 뼈대 CSS
   (member/basic/style.css:105-107) 는 소셜 페이지에 로드되지 않는다.
   6번과 같은 이유다. 그래서 값을 여기서 그대로 다시 준다.

   ★★ 특이도 함정 — 이게 핵심이다.
     소셜 스킨 style.css:105 `#fregisterform p {background:#f2838f;
     padding:15px;margin:15px}` 는 (1,0,1) 이고 자손 선택자라 이 세 줄까지
     걸린다. `.private_info_txt p`(0,1,1) 로는 못 이겨서, 그냥 두면
     안내 3줄이 전부 분홍 박스로 나온다. ID 를 붙여 (1,1,1) 로 받는다.
     :before 도 마찬가지다. 원본이 절대배치 5px 빨간 막대라
     position·width·height 를 되돌려야 '· ' 글머리가 제자리에 온다. */
.private_info_txt { padding: 14px 16px; margin: 0 0 10px; }
#fregisterform .private_info_txt p,
.private_info_txt p {
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  font-size: 13px;
  line-height: 2;
  color: var(--lv-gray-600);
}
#fregisterform .private_info_txt p:before,
.private_info_txt p:before {
  content: "\00b7 ";
  position: static;
  width: auto;
  height: auto;
  background: none;
  border-radius: 0;
  color: var(--lv-gray-400);
}