/* ============================================================
   블덱스 라이터 홈 — 비주얼 폴리시 (운영 적용, layout.tsx 전역 로드)
   2026-05-31 · 대표님 승인 범위 A+B+C+D
   - 모든 규칙 #bdx-root 스코프 + !important → 기존 CSS/인라인 이김
   - 운영 index-style.css / index-body.html 불변 (별도 CSS 레이어).
   - 롤백: layout.tsx 의 home-polish.css link 한 줄 제거.
   ============================================================ */

/* ---- 공통 토큰 override (#bdx-root 자식 전체 상속) ---- */
#bdx-root {
  --border: #e5e7eb !important;          /* B: 가는 보더 1종 통일 */
  --border-strong: #e5e7eb !important;   /* B: input/btn resting 보더 가볍게 */
}

/* ============================================================
   A. 타이포 — 본체 음수 자간 복원 + 위계
   (body *{letter-spacing:0!important} 를 #bdx-root specificity 로 이김)
   ============================================================ */
#bdx-root .bw-hero-logo,
#bdx-root .bw-hero-logo-writer { letter-spacing: -0.03em !important; }
#bdx-root .bw-hero-tagline { letter-spacing: -0.015em !important; }

#bdx-root h1,
#bdx-root h2,
#bdx-root h3,
#bdx-root .card h2,
#bdx-root .plan-name,
#bdx-root .pricing-title { letter-spacing: -0.02em !important; }

#bdx-root label.field-label,
#bdx-root .field-label { letter-spacing: -0.01em !important; line-height: 1.4 !important; }

/* A: 카드 제목 위계 (본문 15px 와 분리) */
#bdx-root .card h2 {
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

/* A: 브랜드 wordmark weight 800 통일 (900 → 800) */
#bdx-root .brand-link,
#bdx-root .brand-link b { font-weight: 800 !important; }

/* A: 헤딩 weight 2단계 (pricing 900 → 800) */
#bdx-root .pricing-title { font-weight: 800 !important; }

/* A: 읽기 surface line-height 1.7 통일 */
#bdx-root .result-box,
#bdx-root #articleViewModal #avBody { line-height: 1.7 !important; }

/* A: 동적 제목 한글 단어 안 쪼개짐 */
#bdx-root #avTitle { word-break: keep-all !important; }

/* ============================================================
   B. 표면 · 카드 · 컴포넌트 디테일
   ============================================================ */
/* B+C: 메인 카드 — radius 16 + 옅은 그림자 + padding 28 */
#bdx-root .card {
  border-radius: 16px !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04) !important;
  padding: 28px !important;
  transition: border-color .15s ease, box-shadow .15s ease !important;
}

/* B: 보더색 통일 (변수 안 쓰는 하드코드 카드) */
#bdx-root .plan-card,
#bdx-root .mp-card { border-color: #e5e7eb !important; }

/* B+C: 플랜 카드 — radius 16(ring과 동심) + padding 28 */
#bdx-root .plan-card {
  border-radius: 16px !important;
  padding: 28px !important;
  transition: transform .2s ease, box-shadow .2s ease !important;
}
#bdx-root .plan-card:hover {
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.07) !important;
  transform: translateY(-2px) !important;
}

/* B: pill 완전 둥글게 + C: padding 6/12 */
#bdx-root .pill {
  border-radius: 999px !important;
  padding: 6px 12px !important;
  transition: all .15s ease !important;
}

/* B: focus ring 브랜드 accent 색 (non-brand rgba(41,98,255) 제거) */
#bdx-root input:focus,
#bdx-root select:focus,
#bdx-root textarea:focus {
  box-shadow: 0 0 0 3px rgba(42, 98, 184, 0.12) !important;
}

/* B: input/btn transition 통일 */
#bdx-root input,
#bdx-root select,
#bdx-root textarea,
#bdx-root .btn,
#bdx-root .nav-menu button { transition: all .15s ease !important; }

/* B: 드롭다운/팝오버 그림자 — 옅은 slate 통일 (black 0 4px 12px/.12 제거) */
#bdx-root #testInlineSubMenu,
#bdx-root #coupangInlineSubMenu,
#bdx-root #coupangPersonaMenu,
#bdx-root #adminPlanDropdown {
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06) !important;
}

/* B: 쿠파스 발행채널 카드 — 단일 accent #2A62B8 (플랫폼 로고색은 유지) */
#bdx-root [data-coupang-length] { border-color: #2A62B8 !important; }
#bdx-root [data-coupang-length].active,
#bdx-root [data-coupang-length][aria-selected="true"] {
  border-color: #2A62B8 !important;
  box-shadow: 0 2px 10px rgba(42, 98, 184, 0.14) !important;
}

/* B: result empty 아이콘 — 가벼운 placeholder */
#bdx-root .result-empty-icon {
  border: 2px solid #e5e7eb !important;
  border-radius: 12px !important;
}

/* B+C: stat 타일 — radius 12 + padding 14/16 */
#bdx-root .stat {
  border-radius: 12px !important;
  padding: 14px 16px !important;
}

/* ============================================================
   C. 간격 — 4배수 리듬
   ============================================================ */
#bdx-root .stats { gap: 12px !important; margin-bottom: 16px !important; }
#bdx-root .field { margin-bottom: 16px !important; }
#bdx-root footer { margin-top: 64px !important; }

/* C: 생성 결과 하위 박스 padding 16 통일 */
#bdx-root #reviewResultBox,
#bdx-root #refineProgressBox,
#bdx-root #refineChangesBox { padding: 16px !important; }

/* ============================================================
   D. 모바일 폴리시 (≤768px) — PC 룰 불변
   ============================================================ */
@media (max-width: 768px) {
  /* D: 터치 44px — result action 버튼 */
  #bdx-root .result-actions .btn {
    padding: 11px 6px !important;
    min-height: 44px !important;
  }
  /* D: 설정 카테고리 pill 40px */
  #bdx-root .mobile-settings-actions .pill {
    min-height: 40px !important;
    padding: 9px 4px !important;
  }
  /* D: footer 링크 터치 44px */
  #bdx-root footer a {
    min-height: 44px !important;
    padding: 0 8px !important;
    display: inline-flex !important;
    align-items: center !important;
  }
  /* D: hero 도움말(?) hit box 32px */
  #bdx-root .bw-beta-help summary {
    width: 32px !important;
    height: 32px !important;
  }
  /* D: nav drawer email/badge 중복 룰 → 의도값 강제 */
  #bdx-root .nav-right .email {
    padding: 10px 22px 4px !important;
    color: #94a3b8 !important;
    font-weight: 500 !important;
  }
  #bdx-root .nav-right .badge { margin: 0 22px 6px !important; }
  /* D: drawer 메뉴 폰트 16 (stale 15 제거) */
  #bdx-root .nav.mobile-open .nav-menu button { font-size: 16px !important; }
  /* D: 모바일 카드 radius 16 + gap 12 통일 */
  #bdx-root .card,
  #bdx-root .writer-settings-card { border-radius: 16px !important; }
  #bdx-root .card { margin-bottom: 12px !important; }
}