/* ============================================
   마케팅랩 v2 디자인 업그레이드
   i-boss / popomon 스타일 참고
   기존 style.css를 깨뜨리지 않는 확장 CSS
   ============================================ */

/* Pretendard 폰트 적용 */
body {
    font-family: 'Pretendard Variable', 'Pretendard', 'Noto Sans KR', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ============================================
   네비게이션 바 업그레이드
   ============================================ */
.nav-main {
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    position: sticky;
    top: 0;
    z-index: 100;
}
.nav-menu {
    display: flex;
    align-items: center;
    gap: 0;
}
.nav-item {
    position: relative;
}
.nav-link {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 15px 16px !important;
    font-size: 14px !important;
    font-weight: 600;
    color: #374151;
    text-decoration: none;
    transition: color 0.2s;
    white-space: nowrap;
    position: relative;
}
.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2.5px;
    background: linear-gradient(90deg, #6366f1, #8b5cf6);
    border-radius: 2px;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    transform: translateX(-50%);
}
.nav-item:hover .nav-link,
.nav-item.active .nav-link {
    color: #6366f1;
}
.nav-item:hover .nav-link::after,
.nav-item.active .nav-link::after {
    width: 70%;
}
.nav-link i.fa-chevron-down {
    font-size: 10px;
    margin-left: 2px;
    transition: transform 0.25s;
    opacity: 0.5;
}
.nav-item.has-dropdown:hover .nav-link i.fa-chevron-down {
    transform: rotate(180deg);
    opacity: 1;
}

/* 네비 드롭다운 */
.nav-item.has-dropdown { position: relative; }
.nav-dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    min-width: 220px;
    background: #fff;
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 14px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.12), 0 4px 12px rgba(0,0,0,0.06);
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1000;
    padding: 8px 0;
    list-style: none;
    backdrop-filter: blur(20px);
}
.nav-item.has-dropdown:hover > .nav-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.nav-dropdown li a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 20px;
    font-size: 13.5px;
    font-weight: 500;
    color: #4b5563;
    transition: all 0.15s;
    text-decoration: none;
}
.nav-dropdown li a:hover {
    background: linear-gradient(90deg, #eef2ff, #f0f0ff);
    color: #6366f1;
    padding-left: 24px;
}
.nav-dropdown li a i {
    width: 20px;
    text-align: center;
    color: #9ca3af;
    font-size: 14px;
    transition: color 0.15s;
}
.nav-dropdown li a:hover i {
    color: #6366f1;
}

/* ============================================
   헤더 상단 업그레이드
   ============================================ */
.header-top {
    background: linear-gradient(90deg, #1e1b4b, #312e81);
    color: rgba(255,255,255,0.8);
    font-size: 12.5px;
    padding: 6px 0;
}
.header-top a {
    color: rgba(255,255,255,0.85);
    transition: color 0.15s;
}
.header-top a:hover {
    color: #fff;
}
.header-main {
    background: #fff;
    border-bottom: 1px solid #f3f4f6;
    padding: 12px 0;
}

/* 검색바 업그레이드 */
.header-search .search-form {
    border-radius: 12px;
    overflow: hidden;
    border: 2px solid #e5e7eb;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.header-search .search-form:focus-within {
    border-color: #6366f1;
    box-shadow: 0 0 0 3px rgba(99,102,241,0.1);
}
.header-search .search-input {
    font-size: 14px;
    font-weight: 400;
}
.header-search .search-btn {
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    color: #fff;
    border: none;
    transition: opacity 0.2s;
}
.header-search .search-btn:hover {
    opacity: 0.9;
}

/* ============================================
   모바일 네비 라벨
   ============================================ */
.mobile-nav-label {
    padding: 14px 20px 6px;
    font-size: 11px;
    font-weight: 700;
    color: #6366f1;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-top: 1px solid #f3f4f6;
    margin-top: 4px;
}

/* ============================================
   도구 쇼케이스 (메인 페이지)
   ============================================ */
.tools-showcase {
    margin: 36px 0;
    padding: 40px 0;
    background: linear-gradient(180deg, #f8faff 0%, #fff 100%);
    border-radius: 20px;
    position: relative;
}
.tools-showcase .section-header {
    text-align: center;
    margin-bottom: 32px;
}
.tools-showcase .section-header h2 {
    font-size: 26px;
    font-weight: 800;
    color: #111827;
    margin-bottom: 10px;
    letter-spacing: -0.5px;
}
.tools-showcase .section-header p {
    font-size: 15px;
    color: #6b7280;
    font-weight: 400;
}
.tools-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.tool-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 36px 24px 32px;
    background: #fff;
    border-radius: 20px;
    border: 1px solid rgba(0,0,0,0.05);
    box-shadow: 0 2px 12px rgba(0,0,0,0.04);
    text-decoration: none;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}
.tool-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #6366f1, #8b5cf6, #a855f7);
    opacity: 0;
    transition: opacity 0.3s;
}
.tool-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(99,102,241,0.15), 0 8px 16px rgba(99,102,241,0.08);
    border-color: rgba(99,102,241,0.15);
}
.tool-card:hover::before {
    opacity: 1;
}
.tool-icon {
    width: 68px;
    height: 68px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    color: #fff;
    margin-bottom: 18px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    transition: transform 0.3s;
}
.tool-card:hover .tool-icon {
    transform: scale(1.08) rotate(-2deg);
}
.tool-card h3 {
    font-size: 16px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 8px;
    letter-spacing: -0.3px;
}
.tool-card p {
    font-size: 13px;
    color: #6b7280;
    line-height: 1.6;
}
.tool-badge {
    position: absolute;
    top: 14px;
    right: 14px;
    padding: 4px 12px;
    background: linear-gradient(135deg, #ef4444, #f87171);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    border-radius: 20px;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(239,68,68,0.3);
}

/* ============================================
   콘텐츠 하이라이트 (메인 페이지)
   ============================================ */
.content-highlight {
    margin: 36px 0;
}
.content-highlight .section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}
.content-highlight .section-header h2 {
    font-size: 22px;
    font-weight: 800;
    color: #111827;
    letter-spacing: -0.3px;
}
.content-highlight .more-link {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 600;
    color: #6366f1;
    text-decoration: none;
    transition: gap 0.2s;
}
.content-highlight .more-link:hover {
    gap: 8px;
}
.content-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.content-card {
    background: #fff;
    border-radius: 16px;
    border: 1px solid rgba(0,0,0,0.05);
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none;
    display: block;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.content-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 32px rgba(99,102,241,0.12);
}
.content-card-thumb {
    height: 170px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 48px;
    color: #fff;
    position: relative;
    overflow: hidden;
}
.content-card-body {
    padding: 22px;
}
.content-card-badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 700;
    background: #eef2ff;
    color: #6366f1;
    margin-bottom: 10px;
    letter-spacing: 0.3px;
}
.content-card-body h3 {
    font-size: 16px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 8px;
    line-height: 1.45;
    letter-spacing: -0.2px;
}
.content-card-body p {
    font-size: 13px;
    color: #6b7280;
    line-height: 1.6;
}
.content-card-meta {
    font-size: 12px;
    color: #9ca3af;
    margin-top: 12px;
    display: flex;
    gap: 12px;
}

/* ============================================
   용어사전 미리보기 (메인 페이지)
   ============================================ */
.dictionary-preview {
    margin: 36px 0;
}
.dictionary-preview .section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}
.dictionary-preview .section-header h2 {
    font-size: 22px;
    font-weight: 800;
    color: #111827;
    letter-spacing: -0.3px;
}
.dictionary-carousel {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 12px;
    scrollbar-width: thin;
}
.dictionary-carousel::-webkit-scrollbar {
    height: 4px;
}
.dictionary-carousel::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 4px;
}
.dict-card {
    flex: 0 0 240px;
    scroll-snap-align: start;
    background: #fff;
    border-radius: 16px;
    padding: 22px;
    border: 1px solid rgba(0,0,0,0.06);
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.dict-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(99,102,241,0.12);
    border-color: rgba(99,102,241,0.2);
}
.dict-card-term {
    font-size: 17px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 4px;
    letter-spacing: -0.3px;
}
.dict-card-en {
    font-size: 12px;
    color: #9ca3af;
    margin-bottom: 12px;
}
.dict-card-def {
    font-size: 13px;
    color: #6b7280;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.dict-card-category {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 600;
    background: #ecfdf5;
    color: #059669;
    margin-top: 12px;
}

/* ============================================
   사이드바 도구 위젯
   ============================================ */
.tools-widget {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    overflow: hidden;
    margin-bottom: 20px;
}
.tools-widget .widget-header {
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    padding: 16px 20px;
    color: #fff;
}
.tools-widget .widget-header h3 {
    font-size: 14px;
    font-weight: 700;
    color: #fff;
}
.tools-list-sm {
    padding: 8px 0;
    list-style: none;
}
.tools-list-sm li a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 20px;
    font-size: 14px;
    color: #374151;
    text-decoration: none;
    transition: all 0.15s;
}
.tools-list-sm li a:hover {
    background: linear-gradient(90deg, #eef2ff, #f8f8ff);
    color: #6366f1;
    padding-left: 24px;
}
.tool-sm-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #fff;
    flex-shrink: 0;
}

/* ============================================
   위젯 & 카드 전반 업그레이드
   ============================================ */
.sidebar-widget {
    border-radius: 16px;
    border: 1px solid rgba(0,0,0,0.04);
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
    overflow: hidden;
}
.widget-header h3 {
    font-weight: 700;
    letter-spacing: -0.2px;
}

/* 인기글 순위 스타일 */
.popular-list .popular-item .rank.top {
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    color: #fff;
    border-radius: 6px;
    font-weight: 700;
}

/* 버튼 업그레이드 */
.btn-primary {
    background: linear-gradient(135deg, #6366f1, #7c3aed) !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(99,102,241,0.25);
    transition: all 0.2s !important;
    font-weight: 600 !important;
}
.btn-primary:hover {
    box-shadow: 0 6px 20px rgba(99,102,241,0.35) !important;
    transform: translateY(-1px);
}

/* 글쓰기 버튼 */
.header-quick .btn-primary {
    border-radius: 10px !important;
    padding: 9px 18px !important;
    font-size: 13px !important;
}

/* ============================================
   메인 페이지 세부 개선
   ============================================ */

/* 히어로 슬라이더 테두리 */
.hero-slider {
    border-radius: 20px !important;
    overflow: hidden;
}

/* 퀵 링크 카드 */
.quick-link-card {
    border-radius: 14px;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.quick-link-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0,0,0,0.08);
}

/* 실시간 현황 바 */
.live-status-bar {
    border-radius: 14px;
    background: linear-gradient(135deg, #fff, #fafaff);
}

/* 게시판 테이블 */
.board-table th {
    background: #f8f9fb;
    font-weight: 700;
    font-size: 13px;
    color: #6b7280;
    text-transform: none;
    letter-spacing: 0;
}

/* ============================================
   페이지 타이틀 & 브레드크럼
   ============================================ */
.breadcrumb-wrapper {
    background: #f9fafb;
    border-bottom: 1px solid #f3f4f6;
}
.breadcrumb a {
    color: #6b7280;
    font-size: 13px;
}
.breadcrumb .current {
    color: #6366f1;
    font-weight: 600;
}

/* ============================================
   스크롤바 커스텀
   ============================================ */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
    background: #c5c5c5;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* ============================================
   퀵링크 아이콘 색상 보완
   ============================================ */
.ql-icon-gray {
    background: linear-gradient(135deg, #6b7280 0%, #9ca3af 100%);
    color: #fff;
}

/* ============================================
   콘텐츠 카드 동일 높이 정렬
   ============================================ */
.content-cards-grid {
    align-items: stretch;
}
.content-card {
    display: flex;
    flex-direction: column;
}
.content-card-body {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.content-card-body p {
    flex: 1;
}
.content-card-meta {
    margin-top: auto;
    padding: 14px 22px;
    border-top: 1px solid rgba(0,0,0,0.04);
}

/* ============================================
   도구 인덱스 페이지 개선
   ============================================ */
.tools-header {
    margin-bottom: 30px;
    text-align: center;
    padding: 32px 20px;
    background: linear-gradient(135deg, #eef2ff 0%, #f5f3ff 50%, #faf5ff 100%);
    border-radius: 20px;
}
.tools-header h2 {
    font-size: 26px;
    font-weight: 800;
    color: #111827;
    margin-bottom: 8px;
}
.tools-header p {
    color: #6b7280;
    font-size: 15px;
}

/* ============================================
   다크모드 v2 종합 보완
   ============================================ */

/* --- CSS 변수 다크모드 오버라이드 (도구 페이지 등에서 var() 사용) --- */
[data-theme="dark"] {
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #94a3b8;
    --text-light: #64748b;
    --bg-white: #1e293b;
    --bg-light: #0f172a;
    --border-color: #334155;
    --border-light: #1e293b;
    --primary-light: #312e81;
    --shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
    --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5);
}

/* --- 네비게이션 --- */
[data-theme="dark"] .nav-main {
    background: #1e293b;
    border-bottom-color: #334155;
}
[data-theme="dark"] .nav-link {
    color: #cbd5e1 !important;
}
[data-theme="dark"] .nav-item:hover .nav-link,
[data-theme="dark"] .nav-item.active .nav-link {
    color: #818cf8 !important;
}
[data-theme="dark"] .nav-dropdown {
    background: #1e293b;
    border-color: #334155;
    box-shadow: 0 20px 50px rgba(0,0,0,0.5);
}
[data-theme="dark"] .nav-dropdown li a {
    color: #cbd5e1;
}
[data-theme="dark"] .nav-dropdown li a:hover {
    background: #334155;
    color: #818cf8;
}

/* --- 헤더 --- */
[data-theme="dark"] .header-top {
    background: linear-gradient(90deg, #0f172a, #1e1b4b);
}
[data-theme="dark"] .header-main {
    background: #1e293b !important;
    border-bottom-color: #334155 !important;
}

/* --- 메인 페이지 쇼케이스/카드 --- */
[data-theme="dark"] .tools-showcase {
    background: linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
}
[data-theme="dark"] .tool-card {
    background: #1e293b;
    border-color: #334155;
}
[data-theme="dark"] .tool-card h3 {
    color: #f1f5f9;
}
[data-theme="dark"] .tool-card p {
    color: #94a3b8;
}
[data-theme="dark"] .tool-card:hover {
    box-shadow: 0 20px 40px rgba(99,102,241,0.2), 0 8px 16px rgba(0,0,0,0.3);
}

/* --- 콘텐츠 카드 --- */
[data-theme="dark"] .content-card {
    background: #1e293b;
    border-color: #334155;
}
[data-theme="dark"] .content-card-body h3 {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .content-card-body p {
    color: #94a3b8 !important;
}
[data-theme="dark"] .content-card-meta {
    color: #64748b !important;
    border-top-color: #334155 !important;
}
[data-theme="dark"] .content-highlight .section-header h2 {
    color: #f1f5f9 !important;
}

/* --- 용어사전 카드 --- */
[data-theme="dark"] .dict-card {
    background: #1e293b;
    border-color: #334155;
}
[data-theme="dark"] .dict-card-term {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .dict-card-en {
    color: #64748b !important;
}
[data-theme="dark"] .dict-card-def {
    color: #94a3b8 !important;
}
[data-theme="dark"] .dict-card-category {
    background: #1e3a5f !important;
    color: #38bdf8 !important;
}
[data-theme="dark"] .dictionary-preview .section-header h2 {
    color: #f1f5f9 !important;
}

/* --- 도구 페이지 (keyword-analyzer, instagram, cost-calculator, hashtag) --- */
[data-theme="dark"] .tool-page-header {
    background: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%) !important;
}
[data-theme="dark"] .tool-page-header h2 {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .tool-page-header p {
    color: #94a3b8 !important;
}
[data-theme="dark"] .keyword-search-form {
    background: #1e293b !important;
    border-color: #475569 !important;
}
[data-theme="dark"] .keyword-search-form input[type="text"] {
    color: #e2e8f0 !important;
    background: transparent !important;
}
[data-theme="dark"] .result-card {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .result-card-header {
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .result-card-header h3 {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .result-card-header i {
    background: #312e81 !important;
    color: #818cf8 !important;
}
[data-theme="dark"] .info-grid .info-item,
[data-theme="dark"] .stat-box {
    background: #0f172a !important;
}
[data-theme="dark"] .info-item .label,
[data-theme="dark"] .stat-box .stat-label {
    color: #94a3b8 !important;
}
[data-theme="dark"] .info-item .value,
[data-theme="dark"] .stat-box .stat-value {
    color: #e2e8f0 !important;
}
[data-theme="dark"] .gauge-bar-wrap {
    background: #334155 !important;
}
[data-theme="dark"] .gauge-labels {
    color: #64748b !important;
}
[data-theme="dark"] .keyword-tag {
    background: #334155 !important;
    color: #cbd5e1 !important;
    border-color: #475569 !important;
}
[data-theme="dark"] .keyword-tag:hover {
    background: #312e81 !important;
    color: #818cf8 !important;
    border-color: #818cf8 !important;
}
[data-theme="dark"] .strategy-item {
    background: #0f172a !important;
    border-left-color: #818cf8 !important;
}
[data-theme="dark"] .strategy-item .strategy-title {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .strategy-item .strategy-desc {
    color: #94a3b8 !important;
}
[data-theme="dark"] .strategy-item .strategy-example {
    background: #1e293b !important;
    color: #818cf8 !important;
}
[data-theme="dark"] .search-link {
    border-color: #475569 !important;
    color: #94a3b8 !important;
}
[data-theme="dark"] .search-link.naver {
    background: #0f2922 !important;
    border-color: #03c75a !important;
    color: #03c75a !important;
}
[data-theme="dark"] .search-link.google {
    background: #0f1d33 !important;
    border-color: #4285f4 !important;
    color: #4285f4 !important;
}

/* --- 인스타그램 계산기 다크모드 --- */
[data-theme="dark"] .calc-form-card {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .calc-form-card h3 {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .form-group label {
    color: #94a3b8 !important;
}
[data-theme="dark"] .form-group input,
[data-theme="dark"] .form-group select {
    background: #0f172a !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] .engagement-main {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .donut-chart .inner {
    background: #1e293b !important;
}
[data-theme="dark"] .badge.influencer {
    background: #334155 !important;
    color: #e2e8f0 !important;
    border-color: #475569 !important;
}
[data-theme="dark"] .ad-cost-table th {
    background: #334155 !important;
    color: #94a3b8 !important;
    border-bottom-color: #475569 !important;
}
[data-theme="dark"] .ad-cost-table td {
    color: #e2e8f0 !important;
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .ad-cost-table {
    border-color: #334155 !important;
}
[data-theme="dark"] .ad-cost-table tr.highlight {
    background: #1e1b4b !important;
}
[data-theme="dark"] .ad-cost-table tr.highlight td {
    color: #c084fc !important;
}
[data-theme="dark"] .improvement-item {
    background: #0f172a !important;
    border-left-color: #818cf8 !important;
}
[data-theme="dark"] .improvement-item .text {
    color: #94a3b8 !important;
}
[data-theme="dark"] .improvement-item .text strong {
    color: #e2e8f0 !important;
}
[data-theme="dark"] .compare-label .name {
    color: #94a3b8 !important;
}
[data-theme="dark"] .compare-label .val {
    color: #e2e8f0 !important;
}
[data-theme="dark"] .compare-bar {
    background: #334155 !important;
}
[data-theme="dark"] .compare-bar .marker {
    background: #e2e8f0 !important;
}

/* --- 마케팅 비용 계산기 다크모드 --- */
[data-theme="dark"] .calc-card {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .calc-card h3 {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .tab-buttons {
    background: #0f172a !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .tab-btn {
    color: #94a3b8 !important;
}
[data-theme="dark"] .tab-btn:hover {
    background: #1e293b !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] .tab-btn.active {
    color: #fff !important;
}
[data-theme="dark"] .input-with-unit .unit {
    color: #64748b !important;
}
[data-theme="dark"] .result-main-value {
    background: linear-gradient(135deg, #0f2922, #1a3a2f) !important;
}
[data-theme="dark"] .result-main-value .label {
    color: #94a3b8 !important;
}
[data-theme="dark"] .result-main-value .sub {
    color: #64748b !important;
}
[data-theme="dark"] .result-item {
    background: #0f172a !important;
}
[data-theme="dark"] .result-item .rl {
    color: #94a3b8 !important;
}
[data-theme="dark"] .result-item .rv {
    color: #e2e8f0 !important;
}
[data-theme="dark"] .ref-table {
    border-color: #334155 !important;
}
[data-theme="dark"] .ref-table th {
    background: #334155 !important;
    color: #94a3b8 !important;
    border-bottom-color: #475569 !important;
}
[data-theme="dark"] .ref-table td {
    color: #e2e8f0 !important;
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .ref-table .highlight-row {
    background: #0f2922 !important;
}
[data-theme="dark"] .ref-table .highlight-row td {
    color: #34d399 !important;
}

/* --- 해시태그 생성기 다크모드 --- */
[data-theme="dark"] .filter-panel {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .filter-panel h3 {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .filter-group label {
    color: #94a3b8 !important;
}
[data-theme="dark"] .filter-group select,
[data-theme="dark"] .filter-group input {
    background: #0f172a !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] .hashtag-item {
    background: #334155 !important;
    color: #cbd5e1 !important;
}
[data-theme="dark"] .hashtag-item:hover {
    background: #3d2f0d !important;
    color: #fbbf24 !important;
}
[data-theme="dark"] .hashtag-item.selected {
    background: #3d2f0d !important;
    color: #fbbf24 !important;
    border-color: #f59e0b !important;
}
[data-theme="dark"] .hashtag-item .popularity-bar {
    background: #475569 !important;
}
[data-theme="dark"] .empty-state {
    color: #64748b !important;
}
[data-theme="dark"] .selected-tags {
    background: #0f172a !important;
    border-color: #475569 !important;
}
[data-theme="dark"] .copy-text {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #94a3b8 !important;
}
[data-theme="dark"] .tip-card {
    background: #1e1b0f !important;
    border-color: #78350f !important;
}
[data-theme="dark"] .tip-card h4 {
    color: #fbbf24 !important;
}
[data-theme="dark"] .tip-card ul li {
    color: #d4a017 !important;
}
[data-theme="dark"] .count-badge {
    background: #3d2f0d !important;
    color: #fbbf24 !important;
}

/* --- 콘텐츠 페이지 (dictionary, guides, news, cases) 다크모드 --- */
[data-theme="dark"] .dict-page,
[data-theme="dark"] .content-page {
    color: #e2e8f0 !important;
}
[data-theme="dark"] .dict-header h2,
[data-theme="dark"] .content-page h2 {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .dict-header p {
    color: #94a3b8 !important;
}
[data-theme="dark"] .dict-search-bar input {
    background: #1e293b !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] .dict-filter-btn {
    background: #1e293b !important;
    border-color: #475569 !important;
    color: #94a3b8 !important;
}
[data-theme="dark"] .dict-filter-btn:hover {
    border-color: #818cf8 !important;
    color: #818cf8 !important;
}
[data-theme="dark"] .dict-filter-btn.active {
    background: #6366f1 !important;
    color: #fff !important;
    border-color: #6366f1 !important;
}
[data-theme="dark"] .dict-sort-bar {
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .dict-count {
    color: #94a3b8 !important;
}
[data-theme="dark"] .dict-sort a {
    color: #64748b !important;
}
[data-theme="dark"] .dict-sort a.active {
    background: #312e81 !important;
    color: #818cf8 !important;
}
[data-theme="dark"] .dict-item {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .dict-item:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.3) !important;
}
[data-theme="dark"] .dict-item-header .term-name {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .dict-item-header .term-en {
    color: #64748b !important;
}
[data-theme="dark"] .dict-item-header .views {
    color: #64748b !important;
}
[data-theme="dark"] .dict-item-header .toggle-icon {
    color: #64748b !important;
}
[data-theme="dark"] .dict-item-body {
    background: #0f172a !important;
}
[data-theme="dark"] .dict-item.open .dict-item-body {
    border-top-color: #334155 !important;
}
[data-theme="dark"] .dict-definition {
    color: #cbd5e1 !important;
}
[data-theme="dark"] .dict-example {
    background: #1e293b !important;
    border-left-color: #818cf8 !important;
    color: #94a3b8 !important;
}
[data-theme="dark"] .dict-related a {
    background: #312e81 !important;
    color: #818cf8 !important;
}
[data-theme="dark"] .dict-empty {
    color: #64748b !important;
}

/* --- 도구 인덱스 페이지 다크모드 --- */
[data-theme="dark"] .tools-header {
    background: linear-gradient(135deg, #1e1b4b 0%, #312e81 50%, #1e1b4b 100%) !important;
}
[data-theme="dark"] .tools-header h2 {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .tools-header p {
    color: #94a3b8 !important;
}

/* --- 공통 섹션 헤더 다크모드 --- */
[data-theme="dark"] .section-header h2 {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .section-header p {
    color: #94a3b8 !important;
}
[data-theme="dark"] .more-link {
    color: #818cf8 !important;
}

/* --- 부스트/광고 섹션 다크모드 --- */
[data-theme="dark"] .boost-card {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .boost-card:hover {
    background: #334155 !important;
}
[data-theme="dark"] .boost-card-title {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .boost-card-meta {
    color: #94a3b8 !important;
}
[data-theme="dark"] .boost-empty {
    color: #64748b !important;
}
[data-theme="dark"] .boost-empty h3 {
    color: #94a3b8 !important;
}

/* --- 카테고리 보드 다크모드 --- */
[data-theme="dark"] .category-card {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .category-header {
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .category-header h3 {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .category-list li a {
    color: #cbd5e1 !important;
}
[data-theme="dark"] .category-list li a:hover {
    color: #818cf8 !important;
}
[data-theme="dark"] .category-list .date {
    color: #64748b !important;
}

/* --- 탭 섹션 다크모드 --- */
[data-theme="dark"] .combined-section {
    background: #0f172a !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .combined-header {
    background: #1e293b !important;
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .combined-section .tab-btn {
    color: #94a3b8 !important;
}
[data-theme="dark"] .combined-section .tab-btn.active {
    color: #818cf8 !important;
    background: transparent !important;
}
[data-theme="dark"] .combined-body {
    background: #1e293b !important;
}
[data-theme="dark"] .ranked-list li a {
    color: #cbd5e1 !important;
}
[data-theme="dark"] .ranked-list li a:hover {
    color: #818cf8 !important;
}

/* --- 사이드바 다크모드 보완 --- */
[data-theme="dark"] .tools-widget {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .tools-list-sm li a {
    color: #cbd5e1 !important;
}
[data-theme="dark"] .tools-list-sm li a:hover {
    background: #334155 !important;
    color: #818cf8 !important;
}

/* --- 콘텐츠 배너 다크모드 --- */
[data-theme="dark"] .content-banner {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .banner-placeholder-wide {
    background: #1e293b !important;
    color: #64748b !important;
}

/* --- 페이지네이션 다크모드 --- */
[data-theme="dark"] .pagination a,
[data-theme="dark"] .pagination span {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] .pagination .active {
    background: #6366f1 !important;
    border-color: #6366f1 !important;
    color: #fff !important;
}

/* --- 콘텐츠 허브 다크모드 --- */
[data-theme="dark"] .content-hub-hero {
    background: linear-gradient(135deg, #312e81 0%, #3730a3 50%, #4338ca 100%) !important;
}
[data-theme="dark"] .hub-section {
    background: #1e293b !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.3) !important;
}
[data-theme="dark"] .hub-section-header {
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .hub-section-title h3 {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .hub-section-title span {
    color: #64748b !important;
}
[data-theme="dark"] .hub-more {
    color: #818cf8 !important;
}
[data-theme="dark"] .hub-more:hover {
    background: #312e81 !important;
}
[data-theme="dark"] .hub-item {
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .hub-item-num {
    background: #334155 !important;
    color: #818cf8 !important;
}
[data-theme="dark"] .hub-item-title {
    color: #e2e8f0 !important;
}
[data-theme="dark"] .hub-item-title:hover {
    color: #818cf8 !important;
}
[data-theme="dark"] .hub-item-meta {
    color: #64748b !important;
}
[data-theme="dark"] .hub-item-badge {
    background: #312e81 !important;
    color: #818cf8 !important;
}
[data-theme="dark"] .hub-empty {
    color: #64748b !important;
}

/* --- 가이드/뉴스/케이스 목록 페이지 다크모드 --- */
[data-theme="dark"] .guides-page,
[data-theme="dark"] .news-page,
[data-theme="dark"] .cases-page {
    color: #e2e8f0 !important;
}
[data-theme="dark"] .guides-header h2,
[data-theme="dark"] .news-header h2,
[data-theme="dark"] .cases-header h2 {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .guides-header p,
[data-theme="dark"] .news-header p,
[data-theme="dark"] .cases-header p {
    color: #94a3b8 !important;
}
[data-theme="dark"] .guide-card,
[data-theme="dark"] .news-card,
[data-theme="dark"] .case-card {
    background: #1e293b !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3) !important;
}
[data-theme="dark"] .guide-title,
[data-theme="dark"] .news-card-title,
[data-theme="dark"] .case-title {
    color: #f1f5f9 !important;
}
[data-theme="dark"] .guide-excerpt,
[data-theme="dark"] .news-card-body,
[data-theme="dark"] .case-desc {
    color: #94a3b8 !important;
}
[data-theme="dark"] .guide-footer,
[data-theme="dark"] .news-card-meta,
[data-theme="dark"] .case-meta {
    color: #64748b !important;
    border-top-color: #334155 !important;
}
[data-theme="dark"] .guide-cat,
[data-theme="dark"] .news-card-cat,
[data-theme="dark"] .case-badge {
    background: #312e81 !important;
    color: #818cf8 !important;
}
[data-theme="dark"] .guide-body {
    color: #e2e8f0 !important;
}
[data-theme="dark"] .guide-thumb-placeholder {
    background: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%) !important;
}
[data-theme="dark"] .guides-search input,
[data-theme="dark"] .news-search input {
    background: #1e293b !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] .gf-btn,
[data-theme="dark"] .nf-btn {
    background: #1e293b !important;
    border-color: #475569 !important;
    color: #94a3b8 !important;
}
[data-theme="dark"] .gf-btn:hover,
[data-theme="dark"] .nf-btn:hover {
    border-color: #818cf8 !important;
    color: #818cf8 !important;
}
[data-theme="dark"] .gf-btn.active,
[data-theme="dark"] .nf-btn.active {
    background: #6366f1 !important;
    color: #fff !important;
    border-color: #6366f1 !important;
}
[data-theme="dark"] .guides-sort-bar,
[data-theme="dark"] .news-sort-bar {
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .guides-sort-bar .count,
[data-theme="dark"] .news-sort-bar .count {
    color: #94a3b8 !important;
}
[data-theme="dark"] .guides-sort a,
[data-theme="dark"] .news-sort a {
    color: #64748b !important;
}
[data-theme="dark"] .guides-sort a.active,
[data-theme="dark"] .news-sort a.active {
    background: #312e81 !important;
    color: #818cf8 !important;
}
[data-theme="dark"] .news-card-thumb {
    background: #334155 !important;
}

/* --- 가이드/뉴스/케이스 상세 페이지 다크모드 --- */
[data-theme="dark"] .guide-view,
[data-theme="dark"] .news-view,
[data-theme="dark"] .case-view,
[data-theme="dark"] .dict-view {
    color: #e2e8f0 !important;
}
[data-theme="dark"] .guide-view .content-area,
[data-theme="dark"] .news-view .content-area,
[data-theme="dark"] .case-view .content-area,
[data-theme="dark"] .dict-view .content-area {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}

/* --- 왼쪽 배너 다크모드 --- */
[data-theme="dark"] .left-banners {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .left-banner-item {
    background: #0f172a !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .left-banner-item.banner-empty {
    border-color: #334155 !important;
    background: transparent !important;
}
[data-theme="dark"] .left-banner-item.banner-empty:hover {
    border-color: #818cf8 !important;
    background: #1e1b4b !important;
}
[data-theme="dark"] .banner-inquiry-box {
    color: #64748b !important;
}
[data-theme="dark"] .banner-inquiry-box i {
    color: #475569 !important;
}
[data-theme="dark"] .left-banner-item.banner-empty:hover .banner-inquiry-box i {
    color: #818cf8 !important;
}
[data-theme="dark"] .banner-inquiry-box .inquiry-text {
    color: #64748b !important;
}
[data-theme="dark"] .left-banner-item.banner-empty:hover .inquiry-text {
    color: #818cf8 !important;
}

/* --- 모바일 메뉴 다크모드 --- */
[data-theme="dark"] .mobile-nav {
    background: #0f172a !important;
}
[data-theme="dark"] .mobile-nav a {
    color: #cbd5e1 !important;
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .mobile-nav a:hover {
    background: #1e293b !important;
    color: #818cf8 !important;
}
[data-theme="dark"] .mobile-nav-label {
    color: #818cf8 !important;
    border-top-color: #334155 !important;
}

/* --- 알림/드롭다운 다크모드 --- */
[data-theme="dark"] .notification-dropdown {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .notification-item {
    border-bottom-color: #334155 !important;
    color: #cbd5e1 !important;
}
[data-theme="dark"] .notification-item:hover {
    background: #334155 !important;
}

/* ============================================
   반응형 업그레이드
   ============================================ */
@media (max-width: 1280px) {
    .nav-link {
        padding: 14px 12px !important;
        font-size: 13px !important;
    }
}
@media (max-width: 1024px) {
    .tools-grid { grid-template-columns: repeat(2, 1fr); }
    .content-cards-grid { grid-template-columns: repeat(2, 1fr); }
    .nav-link {
        padding: 12px 8px !important;
        font-size: 12.5px !important;
    }
}
@media (max-width: 768px) {
    .tools-grid { grid-template-columns: 1fr; }
    .content-cards-grid { grid-template-columns: 1fr; }
    .tools-showcase {
        padding: 28px 16px;
        border-radius: 16px;
    }
    .tools-showcase .section-header h2 { font-size: 20px; }
    .tool-card { padding: 28px 20px; }
    /* 도구 인덱스 그리드 반응형 */
    .tools-grid-page { grid-template-columns: 1fr !important; }
}
@media (max-width: 480px) {
    .dict-card { flex: 0 0 200px; }
    .tools-showcase .section-header h2 { font-size: 18px; }
    .tool-card h3 { font-size: 15px; }
}

/* 매칭 시스템 다크모드 보완 */
[data-theme="dark"] .matching-hero {
    border-color: rgba(255,255,255,0.04);
}
[data-theme="dark"] .filter-bar,
[data-theme="dark"] .match-page-header,
[data-theme="dark"] .register-header,
[data-theme="dark"] .register-form,
[data-theme="dark"] .req-page-header,
[data-theme="dark"] .agency-page-header,
[data-theme="dark"] .contact-card,
[data-theme="dark"] .apply-card,
[data-theme="dark"] .detail-section,
[data-theme="dark"] .profile-card,
[data-theme="dark"] .req-detail-card,
[data-theme="dark"] .ag-detail-card {
    background: var(--bg-white) !important;
    border-color: var(--border-color) !important;
}
[data-theme="dark"] .platform-card,
[data-theme="dark"] .influencer-card,
[data-theme="dark"] .inf-card,
[data-theme="dark"] .request-card,
[data-theme="dark"] .req-item,
[data-theme="dark"] .agency-card,
[data-theme="dark"] .ag-card,
[data-theme="dark"] .feature-card {
    background: var(--bg-white) !important;
    border-color: var(--border-color) !important;
}
[data-theme="dark"] .filter-bar .platform-tab,
[data-theme="dark"] .filter-chip,
[data-theme="dark"] .cat-tab {
    background: #1e293b !important;
    color: #94a3b8 !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .filter-bar .platform-tab:hover,
[data-theme="dark"] .filter-bar .platform-tab.active,
[data-theme="dark"] .filter-chip:hover,
[data-theme="dark"] .filter-chip.active,
[data-theme="dark"] .cat-tab:hover,
[data-theme="dark"] .cat-tab.active {
    background: rgba(99,102,241,0.2) !important;
    color: #818cf8 !important;
    border-color: rgba(99,102,241,0.3) !important;
}
[data-theme="dark"] .category-tag {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #94a3b8 !important;
}
[data-theme="dark"] .match-pagination a,
[data-theme="dark"] .match-pagination span {
    background: var(--bg-white) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
}
[data-theme="dark"] .match-pagination .current {
    background: #6366f1 !important;
    color: #fff !important;
    border-color: #6366f1 !important;
}
[data-theme="dark"] .form-group input,
[data-theme="dark"] .form-group select,
[data-theme="dark"] .form-group textarea,
[data-theme="dark"] .contact-card textarea,
[data-theme="dark"] .apply-card select,
[data-theme="dark"] .apply-card textarea,
[data-theme="dark"] .contact-card input,
[data-theme="dark"] .filter-right select,
[data-theme="dark"] .filter-right input,
[data-theme="dark"] .agency-search input {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] .tip-box {
    background: rgba(99,102,241,0.08) !important;
    border-color: rgba(99,102,241,0.2) !important;
}
[data-theme="dark"] .inf-price {
    background: rgba(99,102,241,0.15) !important;
}
[data-theme="dark"] .inf-tags span,
[data-theme="dark"] .tag-item,
[data-theme="dark"] .ag-specialties span {
    background: #1e293b !important;
    color: #94a3b8 !important;
}
[data-theme="dark"] .profile-banner {
    background: linear-gradient(135deg, #0f172a, #1e293b) !important;
}
[data-theme="dark"] .similar-card {
    background: #0f172a !important;
}
/* 매칭 index 플랫폼 섹션 다크모드 */
[data-theme="dark"] .platform-section {
    background: var(--bg-white) !important;
    border-color: var(--border-color) !important;
}
[data-theme="dark"] .ps-header {
    border-bottom-color: var(--border-color) !important;
}
[data-theme="dark"] .ps-cat {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #94a3b8 !important;
}
[data-theme="dark"] .ps-cat:hover {
    background: rgba(99,102,241,0.15) !important;
    color: #818cf8 !important;
    border-color: rgba(99,102,241,0.3) !important;
}
[data-theme="dark"] .ps-inf-card {
    background: #0f172a !important;
    color: var(--text-primary) !important;
}
[data-theme="dark"] .ps-inf-card:hover {
    background: #1e293b !important;
}
[data-theme="dark"] .ps-req-item {
    background: #0f172a !important;
    color: var(--text-primary) !important;
}
[data-theme="dark"] .ps-req-item:hover {
    background: #1e293b !important;
}
[data-theme="dark"] .alert-box,
[data-theme="dark"] .contact-alert,
[data-theme="dark"] .apply-alert {
    border-color: transparent !important;
}

/* 히어로 슬라이더 반응형 보강 */
@media (max-width: 768px) {
    .slider-wrapper { height: 360px !important; }
    .slide-text h2 { font-size: 18px !important; }
    .slide-text h2 strong { font-size: 26px !important; }
    .slide-text p { font-size: 13px !important; }
    .slide-buttons .btn { padding: 10px 22px !important; font-size: 12px !important; border-radius: 8px !important; }
    .slider-arrow { width: 34px !important; height: 34px !important; border-radius: 8px !important; }
    .slider-dots .dot { width: 18px !important; height: 3px !important; }
    .slider-dots .dot.active { width: 28px !important; }
}