/*
 * 형광 초록 강조 층 (<html data-accent="neon">, index.html)
 * 형광 초록은 흰 바탕 대비가 1.4:1 이라 흰 바탕 위 글자색으로 쓸 수 없다. 남색 바탕 위에서는 11.7:1 이라 글자로 써도 된다.
 * - 흰 바탕: 면(버튼·진행 막대·칩·배지)은 형광 초록 + 짙은 글자, 핵심 숫자는 짙은 글자 + 형광펜 밑줄, 나머지 초록 글자는 짙은 색
 * - 남색 상단 띠(theme-icons.css 의 data-hero="navy"): 라벨을 형광 초록 글자로
 * 짙은 글자는 --navy-900 (theme-green.css 에서 #1B1D1F)
 */
:root[data-accent='neon'] {
  --neon: #3DF56B;
  --neon-hover: #2BE55A;
  --neon-ink: var(--navy-900);
  --neon-mark: linear-gradient(transparent 58%, rgba(61, 245, 107, 0.6) 58%, rgba(61, 245, 107, 0.6) 94%, transparent 94%);

  --logo-bg: var(--neon);
}

/* =========================================================
   공통 (두 시안 모두 흰 바탕인 곳)
   ========================================================= */

/* ---------- 면: 형광 초록 + 짙은 글자 ---------- */
[data-accent='neon'] .btn--primary:not(:disabled) {
  background: var(--neon);
  color: var(--neon-ink);
}

[data-accent='neon'] .btn--primary:hover:not(:disabled) {
  background: var(--neon-hover);
}

[data-accent='neon'] .tag--recruiting {
  background: var(--neon);
  color: var(--neon-ink);
  box-shadow: none;
}

[data-accent='neon'] .promo__bar span,
[data-accent='neon'] .promo-tab__dot,
[data-accent='neon'] .promo-tab[aria-selected='true']::after {
  background: var(--neon);
}

[data-accent='neon'] .range::-webkit-slider-runnable-track {
  background: linear-gradient(to right, var(--neon) 0 var(--p, 0%), var(--gray-300) var(--p, 0%) 100%);
}

[data-accent='neon'] .range::-moz-range-progress {
  background: var(--neon);
}

/* 흰 바탕에서 형광 테두리만으로는 손잡이가 안 보여서 짙은 테두리 */
[data-accent='neon'] .range::-webkit-slider-thumb {
  background: var(--neon);
  border-color: var(--neon-ink);
}

[data-accent='neon'] .range::-moz-range-thumb {
  background: var(--neon);
  border-color: var(--neon-ink);
}

/* ---------- 핵심 숫자: 짙은 글자 + 형광펜 ---------- */
[data-accent='neon'] .calc__result-value span,
[data-accent='neon'] .depositor__code,
[data-theme='green'][data-accent='neon'] .promo__facts div:first-child dd,
[data-theme='green'][data-accent='neon'] .split-card--green .split-card__value {
  width: fit-content;
  padding-inline: 2px;
  background: var(--neon-mark);
  color: var(--neon-ink);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

[data-accent='neon'] .calc__result-value {
  color: var(--neon-ink);
}

/* ---------- 나머지 초록 글자 → 짙은 색 ---------- */
[data-accent='neon'] .gnb__link.is-active,
[data-accent='neon'] .calc__result-label,
[data-accent='neon'] .depositor__title strong,
[data-accent='neon'] .step__num,
[data-accent='neon'] .footer__sample,
[data-accent='neon'] .text-green {
  color: var(--neon-ink);
}

/* =========================================================
   그린 시안: 띠·배너·선택 상태까지 모두 밝은 바탕
   ========================================================= */
[data-theme='green'][data-accent='neon'] .seg button[aria-checked='true'] {
  background: var(--neon);
  color: var(--neon-ink);
}

/* 흰 바탕에서 형광 2px 밑줄은 약해서 조금 두껍게 */
[data-theme='green'][data-accent='neon'] .promo-tab[aria-selected='true']::after {
  height: 3px;
}

[data-theme='green'][data-accent='neon'] .calc__coop.is-flash {
  animation-name: coop-flash-neon-line;
}

@keyframes coop-flash-neon-line {
  0% { box-shadow: inset 0 0 0 2px var(--neon); }
  100% { box-shadow: inset 0 0 0 2px rgba(61, 245, 107, 0); }
}

[data-theme='green'][data-accent='neon'] .hero__label,
[data-theme='green'][data-accent='neon'] .promo__label {
  color: var(--neon-ink);
}

/* 형광 초록 포커스 테두리는 흰 바탕에서 안 보여서 짙은 색 */
[data-theme='green'][data-accent='neon'] :focus-visible {
  outline-color: var(--neon-ink);
}

/* 가입 신청 팝업: 완료 표시도 버튼과 같은 형광 면 */
[data-accent='neon'] .join__done-icon {
  background: var(--neon);
  color: var(--neon-ink);
}

[data-accent='neon'] .check input {
  accent-color: var(--neon-ink);
}
