/*
  Hedge unified style.css
  - NH Bank-like (white + green) tone
  - Consolidated from previous nh.css + legacy dark UI components
  - Goal: one CSS file only
*/

:root{
  --hedgeGreen:#1aa14a;
  --hedgeGreenDeep:#11823a;
  --hedgeBg:#f5f6f8;
  --hedgeText:#111827;
  --hedgeMuted:#6b7280;
  --hedgeLine:#e5e7eb;
  --hedgeCard:#ffffff;
  --hedgeShadow: 0 10px 30px rgba(0,0,0,.06);
  --hedgeRadius: 16px;
  --hedgeDanger:#dc2626;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body.nhBody{
  margin:0;
  background:var(--hedgeBg);
  color:var(--hedgeText);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, "Noto Sans KR", Arial, "Apple SD Gothic Neo", sans-serif;
}

a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:none; }

/* ─────────────────────────────────────────────────────────────
   Layout
───────────────────────────────────────────────────────────── */

.nhContainer{
  width:min(1200px, calc(100% - 48px));
  margin:0 auto;
}

/* Top utility bar */
.nhTopbar{
  background:#fff;
  border-bottom:1px solid var(--hedgeLine);
}
.nhTopbarInner{
  height:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.nhTopbarLeft,
.nhTopbarRight{
  display:flex;
  align-items:center;
  gap:14px;
}
.nhTopbarLink{
  font-size:12px;
  color:var(--hedgeMuted);
}
.nhTopbarLink:hover{ color:var(--hedgeText); }

/* Header */
.nhHeader{
  background:#fff;
  border-bottom:1px solid var(--hedgeLine);
  position:sticky;
  top:0;
  z-index:50;
}
.nhHeaderInner{
  height:72px;
  display:flex;
  align-items:center;
  gap:18px;
}
.nhBrand{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:220px;
}
.nhBrandMark{
  width:38px; height:38px;
  border-radius:12px;
  background:rgba(26,161,74,.12);
  display:flex; align-items:center; justify-content:center;
  color:var(--hedgeGreenDeep);
  font-weight:900;
}
.nhBrandName{ font-weight:900; line-height:1.1; }
.nhBrandSub{ font-size:12px; color:var(--hedgeMuted); margin-top:2px; }

/* ✅ Brand image logo (top-left) */
.nhBrand--img{
  min-width:auto;
}

.nhBrandLogo{
  height:34px;     /* 필요 시 30~40 사이로 조절 */
  width:auto;
  display:block;
  object-fit:contain;
}

/* 접근성용 숨김 텍스트가 필요할 때 사용 */
.nhSrOnly{
  position:absolute;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

@media (max-width: 560px){
  .nhBrandLogo{ height:30px; }
}


.nhNav{
  display:flex;
  gap:18px;
  font-size:14px;
  color:#374151;
}
.nhNav a,
.nhNavLink{
  padding:8px 6px;
  border-radius:10px;
}
.nhNav a:hover,
.nhNavLink:hover{
  background:#f3f4f6;
}

.nhHeaderActions{
  margin-left:auto;
  display:flex;
  gap:10px;
}

/* Buttons (NH tone) */
.nhBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:36px;
  padding:0 14px;
  border-radius:12px;
  font-size:13px;
  border:1px solid var(--hedgeLine);
  background:#fff;
  color:#111827;
  cursor:pointer;
  user-select:none;
  white-space:nowrap;
}
.nhBtn:hover{ background:#f9fafb; }

.nhBtnPrimary{
  background:var(--hedgeGreen);
  color:#fff;
  border-color:var(--hedgeGreen);
}
.nhBtnPrimary:hover{ background:var(--hedgeGreenDeep); border-color:var(--hedgeGreenDeep); }

.nhBtnLine{
  background:#fff;
  color:var(--hedgeGreenDeep);
  border-color:rgba(26,161,74,.35);
}
.nhBtnLine:hover{ border-color:rgba(26,161,74,.6); background:rgba(26,161,74,.05); }

.nhBtnGhost{
  background:#fff;
  color:#111827;
  border-color:var(--hedgeLine);
}

/* Main */
.nhMain{ padding:22px 0 34px; }

/* ─────────────────────────────────────────────────────────────
   Home
───────────────────────────────────────────────────────────── */

.nhHero{
  background:var(--hedgeCard);
  border:1px solid var(--hedgeLine);
  box-shadow:var(--hedgeShadow);
  border-radius:var(--hedgeRadius);
  padding:24px;
  display:grid;
  grid-template-columns: 1.35fr .85fr;
  gap:18px;
}

.nhHeroTitle{
  font-size:28px;
  font-weight:900;
  letter-spacing:-.02em;
  margin:0;
}
.nhHeroDesc{
  margin-top:8px;
  color:var(--hedgeMuted);
  line-height:1.6;
  font-size:14px;
}

/* Template compatibility: nhHeroButtons / nhHeroBtns */
.nhHeroButtons,
.nhHeroBtns{
  margin-top:14px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.nhHeroSide{
  border:1px solid var(--hedgeLine);
  border-radius:14px;
  padding:16px;
  background:#fbfbfc;
}
.nhQuickTitle{ font-weight:900; }
.nhQuickSub{ margin-top:4px; font-size:12px; color:var(--hedgeMuted); }
.nhQuickButtons{ margin-top:12px; display:flex; gap:10px; flex-wrap:wrap; }
.nhQuickHint{ margin-top:12px; font-size:12px; color:var(--hedgeMuted); line-height:1.55; }

/* Sections */
.nhSection{ margin-top:20px; }
.nhSectionTitle{
  font-size:18px;
  font-weight:900;
  letter-spacing:-.01em;
  margin:10px 2px 12px;
}

/* Cards */
.nhCardGrid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:14px;
}
.nhCard{
  background:var(--hedgeCard);
  border:1px solid var(--hedgeLine);
  border-radius:14px;
  box-shadow: 0 6px 18px rgba(0,0,0,.04);
  padding:16px;
}

/* Template compatibility: nhKicker / nhCardKicker */
.nhKicker,
.nhCardKicker{
  font-size:11px;
  color:#2563eb;
  font-weight:900;
}

/* Template compatibility: nhCardTitle / nhCardName */
.nhCardTitle,
.nhCardName{
  margin-top:6px;
  font-size:15px;
  font-weight:900;
}

.nhCardDesc{
  margin-top:6px;
  color:var(--hedgeMuted);
  font-size:12px;
  line-height:1.55;
}

.nhCardActions{
  margin-top:12px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

/* Home bottom */
.nhHomeBottom{ padding-bottom:10px; }

.nhCsGrid{
  display:grid;
  grid-template-columns: repeat(6, 1fr);
  gap:10px;
}
.nhCsItem{
  background:#fff;
  border:1px solid var(--hedgeLine);
  border-radius:14px;
  padding:14px 12px;
  display:flex;
  align-items:center;
  gap:10px;
  box-shadow: 0 6px 16px rgba(0,0,0,.04);
}
.nhCsItem:hover{ background:#fafafa; }
.nhCsIcon{
  width:34px; height:34px;
  border-radius:12px;
  background:rgba(26,161,74,.10);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
}
.nhCsLabel{
  font-size:12px;
  font-weight:900;
  color:#374151;
}

/* News */
.nhNewsGrid{
  margin-top:14px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
}

/* Template compatibility: nhNewsCard / nhNewsBox */
.nhNewsCard,
.nhNewsBox{
  background:#fff;
  border:1px solid var(--hedgeLine);
  border-radius:14px;
  padding:16px;
  box-shadow: 0 8px 22px rgba(0,0,0,.05);
}

/* Template compatibility: nhNewsHeader / nhNewsHead */
.nhNewsHeader,
.nhNewsHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:10px;
}

.nhNewsTitle{ font-weight:900; font-size:16px; }

/* Template compatibility: nhNewsMore / nhMore */
.nhNewsMore,
.nhMore{
  font-size:12px;
  color:var(--hedgeMuted);
}
.nhNewsMore:hover,
.nhMore:hover{ color:var(--hedgeText); }

.nhNewsList{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.nhNewsList li{
  padding-bottom:10px;
  border-bottom:1px solid #f1f2f4;
}
.nhNewsList li:last-child{ border-bottom:none; padding-bottom:0; }

.nhNewsItem{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.nhNewsItemLeft{
  font-size:13px;
  color:#111827;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:calc(100% - 70px);
}
.nhNewsDate{ font-size:12px; color:var(--hedgeMuted); flex:0 0 auto; }

.nhBadgeN{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px; height:18px;
  border-radius:6px;
  background:rgba(26,161,74,.12);
  color:var(--hedgeGreenDeep);
  font-size:11px;
  font-weight:900;
  margin-left:6px;
}

/* ─────────────────────────────────────────────────────────────
   Footer + Back to top
───────────────────────────────────────────────────────────── */

.nhFooter{
  margin-top:30px;
  background:#fff;
  border-top:1px solid var(--hedgeLine);
  padding:26px 0 22px;
}
.nhFooterAppsTitle{ font-weight:900; color:#111827; }
.nhFooterAppsSub{ margin-top:4px; font-size:12px; color:var(--hedgeMuted); }
.nhFooterAppBadges{ margin-top:12px; display:flex; gap:10px; flex-wrap:wrap; }
.nhAppBadge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:34px;
  padding:0 12px;
  border-radius:12px;
  border:1px solid var(--hedgeLine);
  background:#f9fafb;
  font-weight:900;
  font-size:12px;
}

.nhFooterLinks{
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid #f1f2f4;
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  color:#374151;
  font-size:12px;
}
.nhFooterLinks a:hover{ color:#111827; }

.nhFooterMeta{ margin-top:16px; color:var(--hedgeMuted); font-size:12px; }
.nhFooterMetaRow{ display:flex; gap:14px; flex-wrap:wrap; }
.nhFooterCopy{ margin-top:10px; }

.nhBackToTop{
  position:fixed;
  right:22px;
  bottom:22px;
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid var(--hedgeLine);
  background:#fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
  display:none;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.nhBackToTop.isVisible{ display:flex; }
.nhBackToTop:hover{ background:#f9fafb; }

/* ─────────────────────────────────────────────────────────────
   Legacy components (kept for current templates)
   - Styled in the same light NH tone
───────────────────────────────────────────────────────────── */

.panel{
  background:var(--hedgeCard);
  border:1px solid var(--hedgeLine);
  border-radius:18px;
  padding:18px;
  box-shadow:var(--hedgeShadow);
}
.panel.narrow{ max-width: 460px; margin: 0 auto; }

.grid2{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:12px;
  margin-top:14px;
}

.card{
  border:1px solid var(--hedgeLine);
  border-radius: 16px;
  padding:14px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0,0,0,.04);
}

.muted{ color: var(--hedgeMuted); }
.list{ margin:0; padding-left: 18px; color: var(--hedgeMuted); }

.form{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:10px;
}
label{ font-size: 13px; color: var(--hedgeMuted); }

input,
.input{
  width:100%;
  padding:10px 12px;
  border-radius: 12px;
  border:1px solid var(--hedgeLine);
  background: #fff;
  color: var(--hedgeText);
  outline:none;
}
input:focus,
.input:focus{
  border-color: rgba(26,161,74,.55);
  box-shadow: 0 0 0 4px rgba(26,161,74,.10);
}

.btnRow{ display:flex; gap:10px; margin-top:10px; }

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius: 12px;
  background:#fff;
  color:#111827;
  text-decoration:none;
  border:1px solid var(--hedgeLine);
  cursor:pointer;
  font-weight:900;
  font-size: 14px;
}
.btn:hover{ background:#f9fafb; }
.btn.ghost{ background: transparent; }

.btn-primary,
.btnPrimary{
  background: var(--hedgeGreen);
  border-color: var(--hedgeGreen);
  color:#fff;
}
.btn-primary:hover,
.btnPrimary:hover{
  background: var(--hedgeGreenDeep);
  border-color: var(--hedgeGreenDeep);
}

.alert{
  background: rgba(220,38,38,0.08);
  border:1px solid rgba(220,38,38,0.25);
  color: #991b1b;
  padding:10px 12px;
  border-radius: 12px;
  margin-top:10px;
}

/* admin/login.html helper classes */
.auth-wrap{ display:flex; justify-content:center; padding:10px 0; }
.form-card{
  width:min(520px, 100%);
  background:var(--hedgeCard);
  border:1px solid var(--hedgeLine);
  border-radius:18px;
  padding:20px;
  box-shadow:var(--hedgeShadow);
}
.field{ margin-top:10px; }

/* Responsive */
@media (max-width: 1020px){
  .nhHero{ grid-template-columns: 1fr; }
  .nhCardGrid{ grid-template-columns: repeat(2, 1fr); }
  .nhCsGrid{ grid-template-columns: repeat(3, 1fr); }
  .nhNewsGrid{ grid-template-columns: 1fr; }
  .nhNav{ display:none; }
  .nhBrand{ min-width:auto; }
}
@media (max-width: 820px){
  .grid2{ grid-template-columns: 1fr; }
}
@media (max-width: 560px){
  .nhContainer{ width:min(1200px, calc(100% - 28px)); }
  .nhCardGrid{ grid-template-columns: 1fr; }
  .nhCsGrid{ grid-template-columns: repeat(2, 1fr); }
}

/* (추가) templates에서 쓰는 btnGhost 호환 */
.btnGhost{ background: transparent; }


/* ─────────────────────────────────────────────────────────────
   User dashboard: PointStation UI
───────────────────────────────────────────────────────────── */

.stationHeroWrap{
  width:100%;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(15,23,42,0.08);
  background:#f8fafc;
}
.stationHeroImg{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
}
@media (max-width: 560px){
  .stationHeroImg{ height:150px; }
}

.icoStation { color:#0f7b3a; vertical-align:-3px; flex:0 0 auto; }

/* ─────────────────────────────────────────────────────────────
   Station badges: 1~2개 조합 표시
───────────────────────────────────────────────────────────── */
.stationBadges{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
}

.stationBadge{
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 10px; border-radius:999px;
  font-size:12px; font-weight:900; white-space:nowrap;
  border:1px solid transparent;
}

/* 기본 */
.stationBadge.isNone{ background:#EEF2F6; color:#334155; }

/* 수신중(정상) */
.stationBadge.isActive{ background:#E9F7EF; color:#0f7b3a; border-color:rgba(15,123,58,.12); }

/* 승인대기(개설/증설 공통) */
.stationBadge.isPending{ background:#EEF2FF; color:#3730A3; border-color:rgba(55,48,163,.12); }

/* 반려(개설/증설 공통) */
.stationBadge.isRejected{ background:#FFF1F2; color:#BE123C; border-color:rgba(190,18,60,.14); }

/* 용량초과(수신불가) */
.stationBadge.isOver{ background:#FEF2F2; color:#B91C1C; border-color:rgba(185,28,28,.14); }

/* 정지 */
.stationBadge.isSuspended{ background:#FFF7ED; color:#9A3412; border-color:rgba(154,52,18,.14); }

/* 승인대기 멘트(접수일시 칩) */
.stationReqMsg{
  margin-top:10px;
  font-size:12.5px;
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}
.stationReqAt{
  display:inline-flex;
  align-items:center;
  padding:2px 10px;
  border-radius:999px;
  background:#f1f5f9;
  color:#334155;
  font-weight:900;
  border:1px solid rgba(15,23,42,.08);
}

.stationMetrics{
  margin-top:12px;
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:10px;
}
@media (max-width: 820px){
  .stationMetrics{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.stationMetric{
  background:#fbfbfc;
  border:1px solid rgba(15,23,42,0.08);
  border-radius:12px;
  padding:10px 12px;
}
.stationMetric .label{
  font-size:12px;
  color:var(--hedgeMuted);
  font-weight:800;
}
.stationMetric .val{
  margin-top:4px;
  font-weight:900;
  color:var(--hedgeText);
}

.stationBar{
  margin-top:10px;
  height:10px;
  background:#EEF2F6;
  border-radius:999px;
  overflow:hidden;
  position:relative;
}
.stationBar i{
  position:absolute;
  left:0; top:0;
  height:100%;
  width:var(--p, 0%);
  display:block;
}
.stationBarReceived{
  background: var(--hedgeGreen);
  opacity:0.95;
}
.stationBarWithdraw{
  background: var(--hedgeGreenDeep);
  opacity:0.50;
}

.stationLegend{
  margin-top:8px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  font-size:12px;
  color:var(--hedgeMuted);
  font-weight:700;
}
.stationLegendItem{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.stationDot{
  width:10px;
  height:10px;
  border-radius:4px;
  display:inline-block;
}
.stationDotReceived{ background: var(--hedgeGreen); }
.stationDotWithdraw{ background: var(--hedgeGreenDeep); opacity:0.55; }

/* ─────────────────────────────────────────────────────────────
   Station: Primary metric (A안 - 출금 가능 강조)
───────────────────────────────────────────────────────────── */
.stationPrimaryMetric{
  margin-top:12px;
  padding:14px 16px;
  border-radius:14px;
  border:1px solid rgba(26,161,74,.22);
  background: rgba(26,161,74,.07);
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
}
.stationPrimaryMetric .label{
  font-size:13px;
  font-weight:900;
  color: var(--hedgeGreenDeep);
}
.stationPrimaryMetric .val{
  font-size:22px;
  font-weight:900;
  color: var(--hedgeGreenDeep);
  letter-spacing:-.02em;
  line-height:1.1;
}
@media (max-width: 560px){
  .stationPrimaryMetric{
    padding:12px 14px;
  }
  .stationPrimaryMetric .val{
    font-size:20px;
  }
}


/* dashboard copy buttons */
.btnIcon{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid #d1d5db;
  background:#fff;
  color:#111827;
  cursor:pointer;
  font-weight:600;
  line-height:1;
  white-space:nowrap;
  transition: background .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.btnIcon:hover{ background:#f8fafc; border-color:#cbd5e1; }
.btnIcon:active{ background:#f1f5f9; }
.btnIcon .icon{ width:18px; height:18px; fill:#0f7b3a; flex:0 0 auto; }

/* member list */
.memberWrap{ margin-top:10px; display:flex; flex-direction:column; gap:10px; }
.memberRow{ display:flex; gap:12px; align-items:flex-start; }
.memberDepth{ width:44px; flex:0 0 44px; font-weight:700; color:#0f7b3a; }
.memberList{ flex:1; display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.memberChip{
  display:inline-flex; flex-direction:column; gap:4px;
  padding:8px 10px; border-radius:12px; border:1px solid #d1d5db;
  background:#fff; font-weight:600; font-size:13px; line-height:1.1; white-space:nowrap;
}
.memberName{ font-weight:700; }
.memberDate{ font-size:12px; color:#6b7280; font-weight:600; }


/* ─────────────────────────────────────────────────────────────
   Admin/UI consistency additions
───────────────────────────────────────────────────────────── */

/* ✅ nav active 표시 */
.nhNavLink.isActive{
  background: rgba(26,161,74,.10);
  color: var(--hedgeGreenDeep);
  font-weight: 900;
}

/* ✅ panel 내부 타이틀/설명 톤 통일 */
.panel > h2{
  margin: 0;
  font-size: 20px;
  font-weight: 900;
  letter-spacing: -.01em;
}
.panel > p.muted{
  margin: 8px 0 0;
  font-size: 14px;
  line-height: 1.6;
}

/* ✅ 성공/오류 메시지 (포인트 배분 관리에서 사용) */
.noticeOk{
  padding:10px 12px;
  border-radius:12px;
  background: rgba(26,161,74,.10);
  border: 1px solid rgba(26,161,74,.25);
  color:#0f7b3a;
  font-weight:800;
  font-size:13px;
}
.noticeErr{
  padding:10px 12px;
  border-radius:12px;
  background: rgba(220,38,38,.08);
  border: 1px solid rgba(220,38,38,.25);
  color:#991b1b;
  font-weight:800;
  font-size:13px;
}

/* ✅ 요약 pill */
.pillRow{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,0.10);
  background:rgba(2,6,23,0.02);
  font-weight:900;
  font-size:12px;
  color:#0f172a;
}
.pill strong{ color: var(--hedgeGreenDeep); }

/* ✅ table 공통 (station_requests 스타일과 동일 톤) */
.tableWrap{
  width:100%;
  overflow:auto;
  border-radius:14px;
  border:1px solid #eef2f6;
  background:#fff;
}
.dataTable{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width: 820px;
  background:#fff;
}
.dataTable thead th{
  position:sticky;
  top:0;
  background:#f8fafc;
  border-bottom:1px solid #e5e7eb;
  text-align:left;
  padding:10px 12px;
  font-size:12px;
  color:#334155;
  font-weight:900;
  white-space:nowrap;
}
.dataTable tbody td{
  border-bottom:1px solid #f1f5f9;
  padding:10px 12px;
  vertical-align:middle;
  font-size:13px;
}
.dataTable tbody tr:hover td{ background:#fbfdff; }

/* ✅ point_distribution table input */
.pdCheck{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:800;
}
.pdAmountInput{
  width:180px;
  max-width:100%;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid #e5e7eb;
  outline:none;
}
.pdAmountInput:focus{
  border-color: rgba(26,161,74,.55);
  box-shadow: 0 0 0 4px rgba(26,161,74,.10);
}

/* ✅ point_distribution: 이메일 실시간 힌트 */
.inlineHint{
  margin-top:8px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,0.08);
  background:rgba(2,6,23,0.02);
  color:#334155;
  font-weight:800;
  font-size:12px;
  line-height:1.5;
  display:flex;
  align-items:flex-start;
  gap:8px;
}
.inlineHint .dot{
  width:8px; height:8px; border-radius:999px; margin-top:5px;
  background: rgba(100,116,139,.6);
  flex:0 0 auto;
}
.inlineHint.isOk{
  border-color: rgba(26,161,74,.25);
  background: rgba(26,161,74,.08);
  color:#0f7b3a;
}
.inlineHint.isOk .dot{ background: rgba(26,161,74,.8); }
.inlineHint.isBad{
  border-color: rgba(220,38,38,.25);
  background: rgba(220,38,38,.07);
  color:#991b1b;
}
.inlineHint.isBad .dot{ background: rgba(220,38,38,.75); }
.inlineHint.isWait{
  border-color: rgba(59,130,246,.25);
  background: rgba(59,130,246,.07);
  color:#1e40af;
}
.inlineHint.isWait .dot{ background: rgba(59,130,246,.75); }

/* ✅ form input status */
input.isOk{
  border-color: rgba(26,161,74,.70) !important;
  box-shadow: 0 0 0 4px rgba(26,161,74,.10) !important;
}
input.isBad{
  border-color: rgba(220,38,38,.65) !important;
  box-shadow: 0 0 0 4px rgba(220,38,38,.10) !important;
}

/* ✅ 버튼 정렬 */
.btnRow.isEnd{ justify-content:flex-end; }


/* ===== Notifications (Header icon + badge) ===== */
.hedgeNotifyBtn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.08);
  background: #fff;
  cursor: pointer;
}
.hedgeNotifyBtn:hover {
  background: rgba(0,0,0,0.02);
}
.hedgeNotifyBadge {
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  border: 1px solid rgba(0,0,0,0.08);
  background: #19a15f;
  color: #fff;
  display: none;
}
.hedgeNotifyBadge.isVisible { display: inline-block; }

/* ===== Modal ===== */
.hedgeModalOverlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 70px 18px 18px 18px;
  z-index: 9999;
}
.hedgeModalPanel {
  width: min(420px, 100%);
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: 0 12px 30px rgba(0,0,0,0.15);
  overflow: hidden;
}

/* ===== Popup contents ===== */
.hedgeNotifyPopup { padding: 14px; }
.hedgeNotifyPopupHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.hedgeNotifyPopupTitle {
  font-size: 16px;
  font-weight: 700;
}
.hedgeNotifyPopupActions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.hedgeBtnSmall {
  height: 30px;
  padding: 0 10px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.08);
  background: #fff;
  font-size: 13px;
  cursor: pointer;
}
.hedgeBtnSmall:hover { background: rgba(0,0,0,0.02); }
.hedgeBtnSmall.isLink {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  color: inherit;
}

.hedgeBtnIcon {
  width: 30px;
  height: 30px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.08);
  background: #fff;
  cursor: pointer;
}

.hedgeNotifyList { padding-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.hedgeNotifyItem {
  width: 100%;
  text-align: left;
  border: 1px solid rgba(0,0,0,0.06);
  background: #fff;
  border-radius: 14px;
  padding: 10px;
  cursor: pointer;
}
.hedgeNotifyItem.isUnread { border-color: rgba(25,161,95,0.35); background: rgba(25,161,95,0.04); }
.hedgeNotifyItemTop { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.hedgeNotifyTitle { font-weight: 700; font-size: 14px; }
.hedgeNotifyDate { font-size: 12px; opacity: 0.65; }
.hedgeNotifyBody { margin-top: 6px; font-size: 13px; opacity: 0.9; white-space: pre-wrap; }
.hedgeNotifyEmpty { padding: 18px 4px; font-size: 13px; opacity: 0.75; }

/* ===== Page list ===== */
.hedgePage { padding: 18px 0; }
.hedgePageHeader { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.hedgePageTitle { margin: 0; font-size: 18px; font-weight: 800; }
.hedgeBtn {
  height: 36px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.08);
  background: #fff;
  cursor: pointer;
}
.hedgeNotifyPageList { margin-top: 12px; display: flex; flex-direction: column; gap: 10px; }
.hedgeNotifyRow { border: 1px solid rgba(0,0,0,0.06); border-radius: 16px; padding: 12px; background: #fff; }
.hedgeNotifyRow.isUnread { border-color: rgba(25,161,95,0.35); background: rgba(25,161,95,0.03); }
.hedgeNotifyRowTop { display: flex; justify-content: space-between; gap: 10px; }
.hedgeNotifyRowActions { margin-top: 10px; display: flex; gap: 8px; align-items: center; }
.hedgePager { margin-top: 16px; display: flex; align-items: center; justify-content: center; gap: 10px; }
.hedgePagerBtn { text-decoration: none; padding: 6px 10px; border: 1px solid rgba(0,0,0,0.08); border-radius: 10px; color: inherit; }
.hedgePagerInfo { font-size: 13px; opacity: 0.75; }
.hedgeEmpty { padding: 18px 0; opacity: 0.75; }


/* ─────────────────────────────────────────────
   Avatar Section (Dashboard)
───────────────────────────────────────────── */
.avatarHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:2px;
}

.avatarGrid{
  margin-top:10px;
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:10px;
}

@media (min-width: 860px){
  .avatarGrid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.avatarCard{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px;
  border:1px solid #e5e7eb;
  border-radius:14px;
  background:#fff;
}

.avatarBadge{
  width:36px;
  height:36px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  border:1px solid #d1d5db;
  background:#f9fafb;
  flex:0 0 auto;
}

.avatarInfo{
  min-width:0;
}

.avatarName{
  font-weight:700;
  line-height:1.2;
}

.avatarNext{
  margin-top:12px;
  padding:12px;
  border:1px dashed #d1d5db;
  border-radius:14px;
  background:#fbfbfb;
}

.avatarNextTitle{
  font-weight:700;
  margin-bottom:4px;
}

.avatarNextBody{
  font-size:13px;
}

/* ─────────────────────────────────────────
   USDT 결제 페이지(아바타)
   폰트/입력 규칙 통일
───────────────────────────────────────── */
.payUsdtPage {
  --pay-font: 14px;
  --pay-font-sm: 12.5px;
  --pay-font-label: 13px;
}

/* 제목/설명 */
.payUsdtPage h2 { font-size: 20px; }
.payUsdtPage .muted { font-size: var(--pay-font-sm); }

/* 표시영역(입금처/네트워크/결제정보 등) 통일 */
.payUsdtPage .payInfo,
.payUsdtPage .payInfo * {
  font-size: var(--pay-font);
  line-height: 1.45;
}

/* 라벨 */
.payUsdtPage .label,
.payUsdtPage label,
.payUsdtPage .formLabel {
  font-size: var(--pay-font-label);
  font-weight: 700;
}

/* 입력 요소 */
.payUsdtPage input[type="text"],
.payUsdtPage input[type="number"],
.payUsdtPage input,
.payUsdtPage select,
.payUsdtPage textarea {
  font-size: var(--pay-font);
  line-height: 1.45;
}

/* placeholder도 통일 */
.payUsdtPage input::placeholder,
.payUsdtPage textarea::placeholder {
  font-size: var(--pay-font-sm);
}

/* 입금처/네트워크 표시를 2열 그리드로 정리 */
.payUsdtPage .payInfoGrid {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 6px 12px;
  margin-top: 6px;
}
.payUsdtPage .payInfoGrid .k {
  font-size: var(--pay-font-label);
  font-weight: 700;
  opacity: .85;
}
.payUsdtPage .payInfoGrid .v {
  font-size: var(--pay-font);
  font-weight: 600;
  word-break: break-all;
}

/* ─────────────────────────────────────────────
   Wallet Section (Dashboard)
   - 한 박스, 우측정렬, 캐시 강조, 배경이미지
   - ✅ 타원형(라운드) 테두리: 은은한 회색(var(--hedgeLine))
───────────────────────────────────────────── */

.walletCard{
  position:relative;
  overflow:hidden;
  padding:0;
  background: transparent; /* 혹시 카드 기본 흰 배경 영향 최소화 */
}


/* 배경이미지(투명도 낮추면 흰 베일처럼 보임) */
.walletCard::before{
  content:"";
  position:absolute;
  inset:0;
  background: url("../img/walletBg.jpg") center/cover no-repeat;

  opacity: 1;            /* ✅ 0.35 → 1 로 올리세요 */
  /* 필요하면 이미지 톤만 살짝 부드럽게 (흰 오버레이 아님) */
  filter: saturate(1.05) contrast(1.02);

  z-index:0;
}


/* 오버레이 제거는 유지 */
.walletCard::after{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(255,255,255,0);
  z-index:1;
}

.walletCardInner{
  position:relative;
  z-index:2;
  padding:14px;
  min-height:110px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
}

.walletLeft{
  min-width:0;
}
.walletTitle{
  font-weight:900;
  letter-spacing:-.01em;
}
.walletSub{
  margin-top:4px;
  font-size:12px;
}

/* ✅ “하나의 박스” (우측정렬) */
.walletPill{
  margin-left:auto;
  width:min(340px, 100%);
  padding:12px 14px;
  border-radius:18px;

  /* ✅ 은은한 회색 테두리 */
  border:1px solid var(--hedgeLine);

  /* ✅ 흰 박스 유지 (여기가 핵심) */
  background: rgba(255,255,255,0.92);

  /* (선택) 살짝만 유리 느낌 */
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);

  text-align:right;
}

.walletCashLabel{
  font-size:12px;
  color:var(--hedgeMuted);
  font-weight:800;
}

/* ✅ 캐시 포인트 크게 */
.walletCashValue{
  margin-top:2px;
  font-size:30px;
  font-weight:900;
  color:var(--hedgeGreenDeep);
  letter-spacing:-.02em;
  line-height:1.05;
}

/* ✅ 마일리지 포인트는 부가(작게) */
.walletMileageLine{
  margin-top:6px;
  font-size:12px;
  color:var(--hedgeMuted);
  font-weight:700;
}
.walletMileageLine strong{
  color:var(--hedgeText);
  font-weight:900;
}

.walletPillActions{
  margin-top:10px;
  display:flex;
  gap:8px;
  justify-content:flex-end;
  flex-wrap:wrap;
}

/* 버튼을 살짝 타원 느낌으로 */
.walletPillActions .btn{
  padding:8px 10px;
  font-size:13px;
  border-radius:999px;
}

/* history/charge 페이지에서 쓰는 미니 박스(옵션) */
.walletMini{
  position:relative;
  overflow:hidden;
}
.walletMiniRight{
  text-align:right;
}

/* ─────────────────────────────────────────────
   Avatar Hero (Dashboard)
───────────────────────────────────────────── */
.avatarHeroWrap{
  width:100%;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(15,23,42,0.08);
  background:#f8fafc;
  margin-bottom:12px;
}

.avatarHeroImg{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
}

@media (max-width: 560px){
  .avatarHeroImg{ height:150px; }
}

/* ─────────────────────────────────────────────
   Mycode Hero (Dashboard)
───────────────────────────────────────────── */
.mycodeHeroWrap{
  width:100%;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(15,23,42,0.08);
  background:#f8fafc;
  margin-bottom:12px;
}

.mycodeHeroImg{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
}

@media (max-width: 560px){
  .mycodeHeroImg{ height:150px; }
}

/* ─────────────────────────────────────────────
   Member Hero (Dashboard)
───────────────────────────────────────────── */
.memberHeroWrap{
  width:100%;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(15,23,42,0.08);
  background:#f8fafc;
  margin-bottom:12px;
}

.memberHeroImg{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
}

@media (max-width: 560px){
  .memberHeroImg{ height:150px; }
}

/* ─────────────────────────────────────────────
   Drawer (Hamburger menu)
───────────────────────────────────────────── */

/* 헤더 내 햄버거 버튼 */
.hedgeBurgerBtn{
  width:40px;
  height:40px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,0.10);
  background:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.hedgeBurgerBtn:hover{ background: rgba(2,6,23,0.02); }
.hedgeBurgerBtn:active{ background: rgba(2,6,23,0.04); }
.hedgeBurgerBtn:focus{ outline:none; }
.hedgeBurgerBtn:focus-visible{
  outline: 3px solid rgba(26,161,74,.22);
  outline-offset: 2px;
}

/* Drawer open 시 바디 스크롤 잠금 */
body.isDrawerOpen{
  overflow:hidden;
}

/* 오버레이 */
.hedgeDrawerOverlay{
  position:fixed;
  inset:0;
  background: rgba(0,0,0,0.35);
  opacity:0;
  pointer-events:none;
  transition: opacity 160ms ease;
  z-index: 9998;
}
body.isDrawerOpen .hedgeDrawerOverlay{
  opacity:1;
  pointer-events:auto;
}

/* 패널 */
.hedgeDrawer{
  position:fixed;
  top:0;
  left:0;
  height:100vh;
  width: min(320px, 86vw);
  background:#fff;
  border-right: 1px solid rgba(15,23,42,0.08);
  box-shadow: 0 18px 40px rgba(0,0,0,0.18);
  transform: translateX(-105%);
  transition: transform 180ms ease;
  z-index: 9999;
  display:flex;
  flex-direction:column;
}
body.isDrawerOpen .hedgeDrawer{
  transform: translateX(0);
}

/* 헤더 */
.hedgeDrawerHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 14px;
  border-bottom: 1px solid rgba(15,23,42,0.08);
}
.hedgeDrawerBrand{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.hedgeDrawerLogo{
  height:28px;
  width:auto;
  display:block;
  object-fit:contain;
}

.hedgeDrawerClose{
  width:36px;
  height:36px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,0.10);
  background:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.hedgeDrawerClose:hover{ background: rgba(2,6,23,0.02); }
.hedgeDrawerClose:focus{ outline:none; }
.hedgeDrawerClose:focus-visible{
  outline: 3px solid rgba(26,161,74,.22);
  outline-offset: 2px;
}

/* 바디 */
.hedgeDrawerBody{
  padding: 14px;
  overflow:auto;
}

/* 섹션 */
.hedgeDrawerSection{
  padding: 10px 0;
  border-bottom: 1px solid rgba(15,23,42,0.06);
}
.hedgeDrawerSection:last-child{ border-bottom:none; }
.hedgeDrawerSectionTitle{
  font-size:12px;
  font-weight:900;
  color:#64748b;
  margin: 0 0 10px;
}

/* 링크 공통(a/button) */
.hedgeDrawerLink{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 10px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,0.08);
  background:#fff;
  font-weight:900;
  font-size:14px;
  color:#0f172a;
  margin-bottom:8px;
}
a.hedgeDrawerLink{ text-decoration:none; }
button.hedgeDrawerLink{
  cursor:pointer;
  text-align:left;
}
.hedgeDrawerLink:hover{
  background: rgba(2,6,23,0.02);
}
.hedgeDrawerLink.isActive{
  background: rgba(26,161,74,.10);
  border-color: rgba(26,161,74,.22);
  color: var(--hedgeGreenDeep);
}

/* 서브메뉴 */
.hedgeDrawerSub{
  margin: 6px 0 10px;
  padding-left: 10px;
  border-left: 2px solid rgba(26,161,74,.18);
  max-height: 0;
  overflow:hidden;
  transition: max-height 180ms ease;
}
.hedgeDrawerSub.isOpen{
  max-height: 520px; /* 서비스 목록 높이 여유 */
}
.hedgeDrawerSubLink{
  display:block;
  padding:9px 10px;
  margin: 0 0 8px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,0.08);
  background: #fff;
  font-weight:800;
  font-size:13px;
  color:#0f172a;
  text-decoration:none;
}
.hedgeDrawerSubLink:hover{
  background: rgba(2,6,23,0.02);
}

/* 모션 줄이기 */
@media (prefers-reduced-motion: reduce){
  .hedgeDrawerOverlay,
  .hedgeDrawer,
  .hedgeDrawerSub{
    transition:none !important;
  }
}


/* ─────────────────────────────────────────────
   상단 배너 공통 스타일
───────────────────────────────────────────── */
.AdBanner {
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: #fff;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.05);
}

.AdImg{
  width: 100%;
  height: 220px;
  object-fit: cover;

  /* ✅ 상단 기준으로 크롭 (타이틀/문구가 위에 있으면 잘 안 잘림) */
  object-position: top center;

  display: block;
}

/* ✅ PC에서 배너 높이를 살짝 늘려 상단 텍스트 여유 확보(선택) */
@media (min-width: 1024px) {
  .AdImg { height: 260px; }
}

/* ─────────────────────────────
   포인트 로그 배지(칩) UI
───────────────────────────── */
.pdLogTitleInline{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.pdChip{
  padding:6px 10px !important;
  border-radius:999px !important;
  font-size:12px !important;
  line-height:1 !important;
  font-weight:900 !important;
  white-space:nowrap;
}

.pdAmtInline{
  font-weight:900;
  white-space:nowrap;
}

/* 왼쪽 배지 타입 */
.pdChip.isAvatar{
  border-color: rgba(15,123,58,0.25) !important;
}
.pdChip.isRecommend{
  border-color: rgba(2,132,199,0.25) !important;
}

/* 오른쪽 상태 배지 */
.pdChipStatus.isDone{
  border-color: rgba(15,123,58,0.30) !important;
  color: #0f7b3a !important;
}
.pdChipStatus.isPartial{
  border-color: rgba(245,158,11,0.35) !important;
  color: #b45309 !important;
}
.pdChipStatus.isPending{
  border-color: rgba(100,116,139,0.35) !important;
  color: #334155 !important;
}