/* ============================================================
   RENDER Wallet — theme-render.css (v1.0.0)
   rendernetwork.com 의 미니멀 흑백 무드를 따르는 라이트 테마.
   styles.css 뒤에 로드되어 변수와 주요 컴포넌트를 덮어씁니다.
   ============================================================ */

body.renderTheme{
  --bg:#FFFFFF;
  --bg2:#F6F6F4;
  --panel:#FFFFFF;
  --panel2:#F6F6F4;
  --panel3:#EEEEEA;
  --ink:#0A0A0A;
  --ink2:#1C1C1C;
  --mut:rgba(10,10,10,.56);
  --mut2:rgba(10,10,10,.38);
  --line:rgba(10,10,10,.10);
  --line2:rgba(10,10,10,.18);
  --orange:#E42313;
  --magenta:#0A0A0A;
  --violet:#4A4A4A;
  --grad:linear-gradient(120deg,#0A0A0A 0%,#2E2E2E 100%);
  --grad3:linear-gradient(120deg,#0A0A0A 0%,#E42313 130%);
  --pos:#D6362B;
  --neg:#2B62D6;
  --r-lg:10px;
  --r-md:8px;
  --r-sm:6px;
  --shadow:0 18px 44px rgba(10,10,10,.10);
  color:var(--ink);
}

/* 배경: 다크 그라데이션 제거, 순백 + 옅은 그리드 */
body.renderTheme,
body.renderTheme.ensoTheme{
  background:
    linear-gradient(rgba(10,10,10,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(10,10,10,.028) 1px, transparent 1px),
    var(--bg);
  background-size:44px 44px,44px 44px,auto;
}

/* 상단/사이드 구조물 */
body.renderTheme .sideRail,
body.renderTheme .topbar,
body.renderTheme .authShell,
body.renderTheme .screenHero{
  background:var(--bg);
}

/* 버튼: 검정 바탕, 호버 시 레드 */
body.renderTheme .btn--primary,
body.renderTheme .btnPrimary,
body.renderTheme button[type="submit"].btn--primary{
  background:#0A0A0A;
  color:#FFFFFF;
  border-color:#0A0A0A;
}
body.renderTheme .btn--primary:hover,
body.renderTheme .btnPrimary:hover{
  background:#E42313;
  border-color:#E42313;
  color:#FFFFFF;
}

/* 배지/필: 각지고 절제된 흑백 */
body.renderTheme .authBadge,
body.renderTheme .pill,
body.renderTheme .featureChip{
  background:#0A0A0A;
  color:#FFFFFF;
  border-color:#0A0A0A;
  letter-spacing:.14em;
  text-transform:uppercase;
}
body.renderTheme .featureChip{
  background:transparent;
  color:var(--ink);
  border:1px solid var(--line2);
}

/* 히어로 타이틀: Render 특유의 큼직한 그로테스크 */
body.renderTheme .authTitle{
  font-weight:700;
  letter-spacing:-.03em;
}
body.renderTheme .heroPanel__title{letter-spacing:-.02em}

/* 카드: 흰 카드 + 얇은 라인 + 은은한 그림자 */
body.renderTheme .card,
body.renderTheme .panel,
body.renderTheme .heroPanel,
body.renderTheme .coinRow,
body.renderTheme .holdingRow,
body.renderTheme .modal__box{
  background:var(--panel);
  border-color:var(--line);
  box-shadow:none;
}
body.renderTheme .heroPanel{box-shadow:var(--shadow)}

/* 시세 상승/하락 색 (국내 관례: 상승 빨강, 하락 파랑) */
body.renderTheme .pos{color:var(--pos)}
body.renderTheme .neg{color:var(--neg)}

/* 입력 필드 */
body.renderTheme .input,
body.renderTheme select.input,
body.renderTheme textarea.input{
  background:#FFFFFF;
  border-color:var(--line2);
  color:var(--ink);
}
body.renderTheme .input:focus{
  border-color:#0A0A0A;
  box-shadow:0 0 0 3px rgba(10,10,10,.08);
}

/* 네비게이션 활성 상태: 레드 인디케이터 */
body.renderTheme .navItem.is-active,
body.renderTheme .navItem[aria-current="page"]{
  color:#0A0A0A;
}
body.renderTheme .navItem.is-active::after{
  background:#E42313;
}

/* 점검 배너 (v2.3.0 회복탄력성 기능 승계) */
body.renderTheme .serviceBanner{
  color:#FFFFFF;
  background:#0A0A0A;
  box-shadow:0 2px 12px rgba(10,10,10,.18);
}

/* 토스트 */
body.renderTheme .toast{
  background:#0A0A0A;
  color:#FFFFFF;
  border:0;
}

/* 어두운 배경 전제로 만든 요소 보정 */
body.renderTheme .qrBox{background:#FFFFFF;border:1px solid var(--line2)}
body.renderTheme .skeleton{background:linear-gradient(90deg,#EFEFEC 25%,#E4E4E0 50%,#EFEFEC 75%)}


/* 히어로 장식 링: 네온 그라데이션 → 흑/적 모노 링 */
body.renderTheme .heroPanel::after{
  background:conic-gradient(from 200deg,#0A0A0A,#E42313 45%,transparent 78%,#0A0A0A);
  opacity:.9;
}
body.renderTheme .navItem.is-active{
  color:#FFFFFF;background:#0A0A0A;box-shadow:none;
}
body.renderTheme .btn--danger{color:#D6362B;border-color:rgba(214,54,43,.4)}
body.renderTheme .btn--danger:hover{border-color:#D6362B;background:rgba(214,54,43,.07)}
body.renderTheme .btn--primary:hover{box-shadow:0 10px 26px rgba(228,35,19,.25)}
body.renderTheme .coinRow:hover{background:rgba(10,10,10,.03)}
body.renderTheme .coinRow[data-ticker="RENDER"]{
  background:linear-gradient(0deg,rgba(228,35,19,.05),rgba(228,35,19,.05));
  border-left:3px solid #E42313;
}

/* ============================================================
   v1.0.1 — 로그인 페이지 가독성 + 아이콘 확대
   ============================================================ */

/* 1) 흰색으로 지정돼 있던 텍스트 → 잉크 컬러 (라이트 배경 가독성) */
body.renderTheme .authTitle,
body.renderTheme .heroMiniCard strong,
body.renderTheme .heroPanel__title,
body.renderTheme .modal__title,
body.renderTheme .assetTotal,
body.renderTheme .chip:hover{
  color:var(--ink);
}

/* 2) 빨간/주황 계열 라벨 텍스트 → 차분한 다크 그레이 */
body.renderTheme .heroMiniCard__label,
body.renderTheme .heroDevice__eyebrow{
  color:#4A4A4A;
}
body.renderTheme .heroDevice__pill{color:#4A4A4A}
body.renderTheme .authBadge{
  color:#FFFFFF; /* 검정 배지 위 흰 글자 유지 (배경이 검정이라 가독성 문제 없음) */
}

/* 3) 링크 아이콘 확대: 홈페이지는 원형 마크, 블로그/X도 크게 */
body.renderTheme .loginIconLinks{gap:14px}
body.renderTheme .iconLink{
  height:60px;min-width:60px;padding:0 14px;
  background:#FFFFFF;border:1px solid var(--line2);
}
body.renderTheme .iconLink:hover{
  border-color:#0A0A0A;
  box-shadow:0 6px 18px rgba(10,10,10,.12);
}
body.renderTheme .iconLink--render-site{padding:0}
body.renderTheme .iconLink--render-site img{
  width:40px;height:40px;max-height:none;object-fit:contain;border-radius:50%;
}
body.renderTheme .iconLink--x img{
  width:28px;height:28px;filter:none; /* 원본이 검정이라 라이트 배경에선 반전 불필요 */
}
body.renderTheme .blogIcon{
  font:700 15px var(--mono);letter-spacing:.06em;color:var(--ink);
}

/* 4) 회전 링/오브 색상: 네온 → 흑백 + 딥그레이 */
body.renderTheme .authOrb{
  background:conic-gradient(from 120deg,#0A0A0A,#8A8A8A 55%,transparent 82%,#0A0A0A);
}
body.renderTheme .authVisual::after{
  background:conic-gradient(from 140deg,#0A0A0A,#B4B4B4 40%,transparent 75%,transparent 92%,#0A0A0A);
  opacity:.5;
}
body.renderTheme .authVisual::before{
  background:radial-gradient(circle,rgba(10,10,10,.06),transparent 65%);
}

/* 남아있던 네온 링/라벨 일괄 보정 */
body.renderTheme .authCard__eyebrow{color:#4A4A4A}
body.renderTheme .moreHero__orb{
  background:conic-gradient(from 120deg,#0A0A0A,#8A8A8A 55%,transparent 82%,#0A0A0A);
}
body.renderTheme .screenHero__eyebrow{color:#4A4A4A}

/* ============================================================
   v1.0.2 — 좌측 내비게이션 가독성 + // 표기 제거
   ============================================================ */

/* 1) 검정 레일 위 텍스트/아이콘을 흰색 계열로 (기본은 어두워서 보이지 않음) */
body.renderTheme .bottomNav{
  background:#0A0A0A;
  border-color:rgba(255,255,255,.10);
  box-shadow:0 18px 50px rgba(10,10,10,.28);
}
body.renderTheme .navItem{
  color:rgba(255,255,255,.72);
}
body.renderTheme .navItem:hover{
  color:#FFFFFF;
  background:rgba(255,255,255,.08);
}
body.renderTheme .navItem.is-active{
  color:#FFFFFF;
  background:rgba(255,255,255,.14);
  box-shadow:none;
}
body.renderTheme .navIconSvg{stroke:currentColor}

/* 2) 로고 자리 제거 */
body.renderTheme .sideBrand{display:none !important}

/* 3) 메뉴 크기 확대 */
body.renderTheme .navItem{
  padding:11px 18px;gap:5px;
}
body.renderTheme .navItem__icon{font-size:22px}
body.renderTheme .navIconSvg{width:24px;height:24px}
body.renderTheme .navItem__label{
  font-size:12.5px;font-weight:600;letter-spacing:.02em;
}

@media(min-width:1024px){
  body.renderTheme{--railW:118px}
  body.renderTheme .bottomNav{padding:20px 12px;gap:8px}
  body.renderTheme .navItem{width:100%;padding:15px 6px;border-radius:8px}
  body.renderTheme .navItem__icon{font-size:24px}
  body.renderTheme .navIconSvg{width:26px;height:26px}
  body.renderTheme .navItem__label{font-size:13px}
  body.renderTheme .navItem.is-active{
    background:rgba(255,255,255,.14);
    color:#FFFFFF;
    box-shadow:inset 3px 0 0 #E42313;
  }
}
@media(max-width:520px){
  body.renderTheme .navItem{padding:10px 13px}
  body.renderTheme .navItem__label{font-size:11.5px}
  body.renderTheme .navIconSvg{width:22px;height:22px}
}

/* 4) 모든 페이지의 "// " 접두 표기 제거 */
body.renderTheme .label::before,
body.renderTheme .sectionLabel::before,
body.renderTheme .authBadge::before,
body.renderTheme .authCard__eyebrow::before,
body.renderTheme .topbar__eyebrow::before,
body.renderTheme .heroPanel__eyebrow::before,
body.renderTheme .screenHero__eyebrow::before,
body.renderTheme .portfolioHero__label::before,
body.renderTheme .statCard__label::before{
  content:"" !important;
}

/* ============================================================
   v1.0.3 — 총 자산 가독성 + 메뉴 아이콘/폰트 정돈
   ============================================================ */

/* 1) 총 자산: 흰색 → 검정, 숫자와 '원' 모두 볼드 */
body.renderTheme .portfolioHero__value{
  color:var(--ink);
  font-weight:800;
  letter-spacing:-.02em;
}
body.renderTheme .portfolioHero__value .unit{
  color:var(--ink);
  font-weight:800;
  font-size:.58em;
}
body.renderTheme .portfolioHero__label{color:#4A4A4A}
body.renderTheme .portfolioHero--featured::before{background:#0A0A0A}

/* 2) 메뉴 라벨: 모노 → Space Grotesk 로 교체해 한글이 또렷하게 */
body.renderTheme .navItem__label{
  font-family:"Space Grotesk","Noto Sans KR",system-ui,-apple-system,sans-serif;
  font-weight:600;
  letter-spacing:.01em;
}

/* 3) 아이콘: 라인 SVG 통일, 활성 시 살짝 굵게 */
body.renderTheme .navIconSvg{
  stroke:currentColor;
  stroke-width:1.7;
  transition:stroke-width .15s,transform .15s;
}
body.renderTheme .navItem.is-active .navIconSvg{
  stroke-width:2.1;
}
body.renderTheme .navItem:hover .navIconSvg{
  transform:translateY(-1px);
}
body.renderTheme .navItem__icon{
  display:flex;align-items:center;justify-content:center;
}

/* ============================================================
   v1.0.4 — 라이트 배경에서 흰색 텍스트 전수 보정
   styles.css 에 하드코딩된 흰색(#fff, rgba(255,255,255,..)) 텍스트가
   흰 배경 위에서 보이지 않던 문제를 일괄 수정합니다.
   ============================================================ */

/* --- 자산탭: 보유 자산 행 (판매 가격 / 현재 가격) --- */
body.renderTheme .holdingPrice__label{color:rgba(10,10,10,.52)}
body.renderTheme .holdingPrice__value{color:var(--ink);font-weight:700}
body.renderTheme .holdingPrice:first-child .holdingPrice__value{
  color:rgba(10,10,10,.62);font-weight:500;
}
body.renderTheme .holdingAmt{color:var(--ink);font-weight:700}
body.renderTheme .holdingSub{color:rgba(10,10,10,.5)}

/* --- 코인탭: 단가 2단 표시 --- */
body.renderTheme .unitPrice__label{color:rgba(10,10,10,.52)}
body.renderTheme .unitPrice__value{color:var(--ink)}

/* --- 관리자: 보유 코인 표 (다크 전제로 작성돼 있던 블록) --- */
body.renderTheme .adminHoldings{
  border-color:var(--line2);
  background:#FAFAF8;
}
body.renderTheme .adminHoldings__table th,
body.renderTheme .adminHoldings__table td{
  color:var(--ink);
  border-bottom-color:var(--line);
}
body.renderTheme .adminHoldings__table th{
  color:rgba(10,10,10,.62);
  border-bottom-color:var(--line2);
}

/* --- 기타 흰색 고정 텍스트 --- */
body.renderTheme .chip:hover{color:var(--ink);border-color:#0A0A0A}
body.renderTheme .modal__title{color:var(--ink)}
body.renderTheme .heroPanel__title{color:var(--ink)}
body.renderTheme .heroMiniCard strong{color:var(--ink)}
body.renderTheme .authTitle{color:var(--ink)}
body.renderTheme .portfolioHero__value{color:var(--ink)}

/* 어두운 바탕 위 요소는 흰색 유지 (가독성 정상) */
body.renderTheme .btn--primary,
body.renderTheme .navItem.is-active,
body.renderTheme .authBadge,
body.renderTheme .toast,
body.renderTheme .serviceBanner,
body.renderTheme .field__action:hover,
body.renderTheme .adminTopBtn__arrow,
body.renderTheme .adminTopBtn__label{
  color:#FFFFFF;
}

/* adminHoldings 표는 !important 없이 덮이지만, adminTopBtn 은 검정 원형 버튼이라 흰색 유지 */
body.renderTheme .adminHoldings__table th,
body.renderTheme .adminHoldings__table td{
  -webkit-text-fill-color:currentColor;
}

/* ============================================================
   v1.0.6 — 보유 자산 수량에 'coin 수량' 라벨 표기
   ============================================================ */
body.renderTheme .holdingAmt{
  display:flex;align-items:baseline;justify-content:flex-end;gap:8px;
}
body.renderTheme .holdingAmt__label{
  font:600 11.5px var(--font);
  color:rgba(10,10,10,.52);
  letter-spacing:.01em;
  white-space:nowrap;
}
body.renderTheme .holdingAmt__value{
  font:700 15px var(--mono);
  color:var(--ink);
  letter-spacing:-.01em;
}
@media(max-width:520px){
  body.renderTheme .holdingAmt{gap:6px}
  body.renderTheme .holdingAmt__label{font-size:10.5px}
  body.renderTheme .holdingAmt__value{font-size:14px}
}
