/*
 * site.css — BitDaegil_Blog 공통 스타일
 * 디자인 토큰/톤은 BitDeagil_WebJs(파트너스)와 동일 계열.
 * --bp-primary 는 테넌트(회사) 브랜드색으로 레이아웃에서 주입됨.
 */
:root {
  --bp-font: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui,
    "Segoe UI", sans-serif;
  --bp-primary: #5867aa;
  --bp-primary-hover: #48568f;
  --bp-primary-soft: #eceef7;
  --bp-bg: #f1f5f9;
  --bp-surface: #ffffff;
  --bp-border: rgba(15, 23, 42, 0.08);
  --bp-text: #0f172a;
  --bp-text-muted: #64748b;
  --bp-radius: 1rem;
  --bp-radius-sm: 0.75rem;
  --bp-shadow: 0 1px 2px rgba(15, 23, 42, 0.06),
    0 8px 24px rgba(15, 23, 42, 0.06);
  --bp-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.08);
}

html { font-size: 15px; min-height: 100%; }
@media (min-width: 768px) { html { font-size: 16px; } }

body {
  font-family: var(--bp-font);
  color: var(--bp-text);
  background: linear-gradient(165deg, #e8eaf4 0%, var(--bp-bg) 42%, #ecf0f6 100%);
  background-attachment: fixed;
}

.bd-app-shell { max-width: 72rem; margin-left: auto; margin-right: auto; }

/* 네비게이션 */
.app-navbar {
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: saturate(140%) blur(10px);
  border: none !important;
  border-bottom: 1px solid var(--bp-border) !important;
}
.app-navbar .navbar-brand {
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--bp-primary) !important;
}
.app-navbar .nav-link {
  color: var(--bp-text-muted) !important;
  font-weight: 500;
  border-radius: 999px;
  padding: 0.4rem 0.85rem !important;
  transition: color 0.15s ease, background 0.15s ease;
}
.app-navbar .nav-link:hover,
.app-navbar .nav-link.active {
  color: var(--bp-primary) !important;
  background: var(--bp-primary-soft);
}

/* 푸터 */
.app-footer {
  border-top: 1px solid var(--bp-border);
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(8px);
  color: var(--bp-text-muted);
}
.app-footer a { color: var(--bp-text-muted); text-decoration: none; }
.app-footer a:hover { color: var(--bp-primary); }

/* 카드 */
.app-card {
  background: var(--bp-surface);
  border-radius: var(--bp-radius);
  border: 1px solid var(--bp-border);
  box-shadow: var(--bp-shadow);
}
.app-card--pad { padding: 1.25rem; }
@media (min-width: 768px) { .app-card--pad { padding: 1.5rem; } }

.app-section-title {
  font-size: 0.8125rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.06em; color: var(--bp-text-muted); margin-bottom: 0.5rem;
}
.app-page-heading { font-weight: 700; letter-spacing: -0.03em; margin-bottom: 0.35rem; }
.app-page-sub { color: var(--bp-text-muted); font-size: 0.95rem; margin-bottom: 0; }

/* 히어로 */
.app-hero-card {
  background: linear-gradient(145deg, var(--bp-primary) 0%, #4e5d98 42%, #3f4b78 100%);
  border-radius: var(--bp-radius); color: #fff; padding: 2rem 1.5rem;
  box-shadow: var(--bp-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.15);
}
@media (min-width: 768px) { .app-hero-card { padding: 2.5rem 2.25rem; } }
.app-hero-badge {
  display: inline-block; font-size: 0.75rem; font-weight: 600;
  padding: 0.35rem 0.75rem; border-radius: 999px;
  background: rgba(255, 255, 255, 0.18); margin-bottom: 1rem;
}
.app-hero-title { font-weight: 700; letter-spacing: -0.035em; font-size: 1.65rem; line-height: 1.25; margin-bottom: 0.75rem; }
@media (min-width: 768px) { .app-hero-title { font-size: 2rem; } }
.app-btn-hero-outline {
  background: transparent; color: #fff; border: 2px solid rgba(255, 255, 255, 0.55);
  font-weight: 600; padding: 0.45rem 1.1rem; border-radius: 999px;
  text-decoration: none; display: inline-block;
}
.app-btn-hero-outline:hover { background: rgba(255, 255, 255, 0.12); color: #fff; border-color: #fff; }

/* 타일 */
.app-tile { display: flex; align-items: flex-start; gap: 1rem; transition: transform 0.18s ease, box-shadow 0.18s ease; color: var(--bp-text); }
.app-tile:hover { transform: translateY(-2px); box-shadow: var(--bp-shadow-sm), 0 12px 32px rgba(88, 103, 170, 0.14); }
.app-tile-icon {
  flex-shrink: 0; width: 3rem; height: 3rem; border-radius: var(--bp-radius-sm);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.35rem; font-weight: 700; background: var(--bp-primary-soft); color: var(--bp-primary);
}
.app-tile-title { font-weight: 600; margin-bottom: 0.35rem; font-size: 1rem; }
.app-tile-text { font-size: 0.875rem; color: var(--bp-text-muted); margin: 0; }

/* 칩 */
.app-dash-chip {
  display: inline-block; padding: 0.2rem 0.55rem; border-radius: 999px;
  font-size: 0.6875rem; font-weight: 600;
  background: var(--bp-primary-soft); color: var(--bp-primary-hover);
}

/* 버튼 */
.btn-primary { background-color: var(--bp-primary); border-color: var(--bp-primary); font-weight: 600; }
.btn-primary:hover { background-color: var(--bp-primary-hover); border-color: var(--bp-primary-hover); }
.btn-outline-primary { color: var(--bp-primary); border-color: var(--bp-primary); }
.btn-outline-primary:hover { background-color: var(--bp-primary); border-color: var(--bp-primary); }

img, video, canvas, svg { max-width: 100%; height: auto; }

/* 관리자 대시보드 통계 */
.admin-stat-card { height: 100%; }
.admin-stat-label { font-size: 0.8125rem; color: var(--bp-text-muted); font-weight: 600; }
.admin-stat-value { font-size: 1.75rem; font-weight: 700; letter-spacing: -0.02em; color: var(--bp-primary); line-height: 1.2; margin-top: 0.25rem; }
.admin-visit-chart {
  display: flex; align-items: flex-end; gap: 0.35rem;
  height: 5.5rem; padding-top: 0.25rem;
}
.admin-visit-bar-wrap {
  flex: 1 1 0; display: flex; flex-direction: column; align-items: center;
  justify-content: flex-end; height: 100%; min-width: 0;
}
.admin-visit-bar {
  width: 100%; max-width: 2rem; min-height: 4px;
  background: linear-gradient(180deg, var(--bp-primary) 0%, #7b8bc4 100%);
  border-radius: 0.25rem 0.25rem 0 0;
}
.admin-visit-bar-label { font-size: 0.6875rem; color: var(--bp-text-muted); margin-top: 0.25rem; }
.admin-traffic-list { list-style: none; padding: 0; margin: 0; }
.admin-traffic-list li {
  display: flex; align-items: center; justify-content: space-between; gap: 0.75rem;
  padding: 0.45rem 0; border-bottom: 1px solid var(--bp-border);
}
.admin-traffic-list li:last-child { border-bottom: none; }
.admin-traffic-label { font-size: 0.875rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-traffic-value { font-size: 0.875rem; font-weight: 700; color: var(--bp-primary); flex-shrink: 0; }
.admin-traffic-list--urls li { align-items: flex-start; }
.admin-traffic-url-row {
  display: flex; align-items: flex-start; gap: 0.5rem; width: 100%; min-width: 0;
}
.admin-traffic-badge { flex-shrink: 0; margin-top: 0.1rem; font-weight: 600; }
.admin-traffic-url {
  flex: 1 1 auto; min-width: 0; font-size: 0.8125rem; color: var(--bp-text);
  text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.admin-traffic-url:hover { color: var(--bp-primary); text-decoration: underline; }
.admin-ip-table code { font-size: 0.75rem; color: #334155; }
.admin-ip-table thead th { font-size: 0.75rem; color: var(--bp-text-muted); font-weight: 600; }
