/* =============================================
   핀쇼 — PINSHOW THEME OVERRIDE
   기반: style.css / 브랜드 컬러 완전 교체
   Sky Blue + Violet 팔레트
   ============================================= */

/* ── 색상 변수 전면 교체 ── */
:root {
  --p1: #0ea5e9;
  --p2: #0284c7;
  --p3: #7c3aed;
  --grad-brand:  linear-gradient(135deg, #0ea5e9 0%, #0284c7 55%, #7c3aed 100%);
  --grad-brand2: linear-gradient(135deg, #38bdf8 0%, #818cf8 100%);
  --grad-hero:   linear-gradient(160deg, #020617 0%, #0c1445 55%, #0a1628 100%);
  --grad-purple: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
  --grad-orange: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%);
  --grad-green:  linear-gradient(135deg, #10b981 0%, #34d399 100%);
  --grad-red:    linear-gradient(135deg, #ef4444 0%, #f97316 100%);
  --grad-blue:   linear-gradient(135deg, #3b82f6 0%, #06b6d4 100%);
  --grad-coral:  linear-gradient(135deg, #f43f5e 0%, #fb923c 100%);

  --primary:       #0284c7;
  --primary-light: #f0f9ff;
  --accent:        #0ea5e9;
  --accent2:       #f59e0b;
  --success:       #10b981;
  --bg:            #f8faff;

  /* 중립 그레이 (보라 틴트 → 슬레이트 계열로) */
  --gray-50:  #f8fafc;
  --gray-100: #f1f5f9;
  --gray-200: #e2e8f0;
  --gray-300: #cbd5e1;
  --gray-400: #94a3b8;
  --gray-500: #64748b;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-800: #1e293b;
  --gray-900: #0f172a;

  --shadow-sm: 0 2px 12px rgba(2,132,199,.1);
  --shadow-md: 0 8px 32px rgba(2,132,199,.15);
  --shadow-lg: 0 16px 56px rgba(2,132,199,.2);
  --shadow-xl: 0 28px 80px rgba(2,132,199,.25);
  --glow:  0 0 32px rgba(14,165,233,.45);
  --glow2: 0 0 28px rgba(2,132,199,.5);
}

/* ── 하드코딩 박스섀도 재정의 ── */
.logo-mark          { box-shadow: 0 4px 16px rgba(14,165,233,.35) !important; }
.article-num        { box-shadow: 0 4px 12px rgba(14,165,233,.3)  !important; }
.btn-primary        { box-shadow: 0 4px 18px rgba(14,165,233,.35) !important; }
.btn-primary:hover  { box-shadow: 0 10px 32px rgba(14,165,233,.5) !important; }
.btn-winpin         { box-shadow: 0 4px 18px rgba(14,165,233,.35) !important; }
.btn-winpin:hover   { box-shadow: 0 8px 28px rgba(14,165,233,.5)  !important; }
.page-btn.active    { box-shadow: 0 4px 14px rgba(14,165,233,.35) !important; }
.form-submit        { box-shadow: 0 4px 18px rgba(14,165,233,.35) !important; }
.form-submit:hover  { box-shadow: 0 8px 28px rgba(14,165,233,.5)  !important; }
.rate-row:hover     { border-color: rgba(14,165,233,.4)           !important; }

/* 아티클 summary 배경색 (보라 → 스카이) */
.article-summary {
  background: linear-gradient(135deg, #f0f9ff 0%, #eff6ff 100%) !important;
}

/* 히어로 em 강조 텍스트 */
.home-hero h1 em {
  background: linear-gradient(135deg, #38bdf8, #7c3aed) !important;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* 사이트 헤더 보더 */
.site-header { border-bottom-color: rgba(2,132,199,.1) !important; }
.site-header.scrolled { box-shadow: 0 4px 24px rgba(2,132,199,.12) !important; }

/* ── TICKER 완전 제거 ── */
.ticker { display: none !important; }

/* ═══════════════════════════════════════════════
   TOPBAR — 티커 대체 (모던 카테고리 바)
   ═══════════════════════════════════════════════ */
.topbar {
  background: #020617;
  border-bottom: 1px solid rgba(255,255,255,.06);
  position: relative;
  z-index: 101;
}
.topbar-inner {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.topbar-links {
  display: flex;
  align-items: center;
}
.topbar-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0 15px;
  height: 40px;
  font-size: 12px;
  font-weight: 600;
  color: rgba(255,255,255,.4);
  white-space: nowrap;
  transition: all .18s ease;
  border-right: 1px solid rgba(255,255,255,.06);
}
.topbar-link:first-child { padding-left: 0; }
.topbar-link:last-child  { border-right: none; }
.topbar-link:hover {
  color: rgba(255,255,255,.88);
  background: rgba(255,255,255,.05);
}
.topbar-status {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 11px;
  font-weight: 500;
  color: rgba(255,255,255,.25);
  white-space: nowrap;
  flex-shrink: 0;
}
.topbar-live {
  width: 6px;
  height: 6px;
  background: #10b981;
  border-radius: 50%;
  box-shadow: 0 0 6px #10b981;
  animation: pulse-dot 2s infinite;
  flex-shrink: 0;
}

/* 뱃지 기본색 (보라→스카이) */
.badge-primary { background: #f0f9ff; color: #0284c7; border-color: rgba(2,132,199,.15) !important; }

/* 모바일 */
@media (max-width: 768px) {
  .topbar-link    { display: none; }
  .topbar-inner   { justify-content: center; }
  .topbar-status  { color: rgba(255,255,255,.35); }
}
