/* スクロールバーカスタマイズ */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* スムーズスクロール */
html { scroll-behavior: smooth; }

/* ヘッダー */
.header-rich {
    background: linear-gradient(135deg, #0369a1 0%, #0ea5e9 50%, #38bdf8 100%);
}

/* コードブロック */
.code-block-wrapper { position: relative; }
.copy-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    opacity: 0;
    transition: opacity 0.2s;
}
.code-block-wrapper:hover .copy-btn { opacity: 1; }

/* ダークモード切替ボタン */
#dark-mode-toggle {
    transition: all 0.3s ease;
}
#dark-mode-toggle:hover {
    transform: scale(1.05);
}

/* ダークモード - 基本 */
html.dark body {
    background-color: #0f172a;
    color: #f1f5f9;
}
html.dark .bg-slate-50 {
    background-color: #1e293b !important;
}
html.dark .bg-white {
    background-color: #1e293b !important;
}
html.dark .text-slate-800,
html.dark .text-slate-900 {
    color: #f1f5f9 !important;
}
html.dark .text-slate-600,
html.dark .text-slate-700 {
    color: #cbd5e1 !important;
}
html.dark .text-slate-500 {
    color: #94a3b8 !important;
}
html.dark .border-slate-200 {
    border-color: #334155 !important;
}

/* ダークモード - スクロールバー */
html.dark ::-webkit-scrollbar-track { background: #1e293b; }
html.dark ::-webkit-scrollbar-thumb { background: #475569; }
html.dark ::-webkit-scrollbar-thumb:hover { background: #64748b; }

/* ダークモード - カラーボックス */
html.dark .bg-primary-50 { background-color: #0c4a6e !important; }
html.dark .bg-primary-100 { background-color: #075985 !important; }
html.dark .text-primary-700 { color: #7dd3fc !important; }
html.dark .text-primary-800 { color: #bae6fd !important; }
html.dark .border-primary-200 { border-color: #0369a1 !important; }

html.dark .bg-amber-50 { background-color: #451a03 !important; }
html.dark .bg-amber-100 { background-color: #78350f !important; }
html.dark .text-amber-700 { color: #fcd34d !important; }
html.dark .text-amber-800 { color: #fde68a !important; }
html.dark .border-amber-200 { border-color: #92400e !important; }

html.dark .bg-purple-50 { background-color: #3b0764 !important; }
html.dark .bg-purple-100 { background-color: #581c87 !important; }
html.dark .text-purple-800 { color: #e9d5ff !important; }
html.dark .border-purple-200 { border-color: #7e22ce !important; }

html.dark .bg-emerald-50 { background-color: #022c22 !important; }
html.dark .bg-emerald-100 { background-color: #064e3b !important; }
html.dark .text-emerald-700 { color: #6ee7b7 !important; }
html.dark .text-emerald-800 { color: #a7f3d0 !important; }
html.dark .border-emerald-200 { border-color: #047857 !important; }

html.dark .bg-rose-50 { background-color: #4c0519 !important; }
html.dark .bg-rose-100 { background-color: #881337 !important; }
html.dark .text-rose-600 { color: #fb7185 !important; }
html.dark .text-rose-800 { color: #fda4af !important; }
html.dark .border-rose-100 { border-color: #9f1239 !important; }
html.dark .border-rose-200 { border-color: #be123c !important; }

html.dark .bg-indigo-50 { background-color: #1e1b4b !important; }
html.dark .text-indigo-800 { color: #c7d2fe !important; }
html.dark .border-indigo-200 { border-color: #4338ca !important; }

html.dark .bg-orange-50 { background-color: #431407 !important; }
html.dark .text-orange-800 { color: #fed7aa !important; }
html.dark .border-orange-200 { border-color: #c2410c !important; }

html.dark .bg-red-50 { background-color: #450a0a !important; }
html.dark .text-red-700 { color: #fca5a5 !important; }
html.dark .text-red-800 { color: #fecaca !important; }
html.dark .border-red-200 { border-color: #b91c1c !important; }

.bg-teal-50 { background-color: #f0fdfa !important; }
.text-teal-800 { color: #115e59 !important; }
.border-teal-200 { border-color: #99f6e4 !important; }
html.dark .bg-teal-50 { background-color: #134e4a !important; }
html.dark .bg-teal-100 { background-color: #134e4a !important; }
html.dark .text-teal-800 { color: #5eead4 !important; }
html.dark .border-teal-200 { border-color: #0f766e !important; }

html.dark .bg-violet-50 { background-color: #2e1065 !important; }
html.dark .text-violet-800 { color: #ddd6fe !important; }
html.dark .border-violet-200 { border-color: #6d28d9 !important; }

html.dark .bg-blue-50 { background-color: #1e3a8a !important; }
html.dark .bg-blue-100 { background-color: #1e3a8a !important; }
html.dark .text-blue-700 { color: #93c5fd !important; }
html.dark .text-blue-800 { color: #93c5fd !important; }
html.dark .border-blue-200 { border-color: #1d4ed8 !important; }

html.dark .bg-slate-100 { background-color: #334155 !important; }

/* ダークモード - フッター */
html.dark footer.bg-slate-800 {
    background-color: #020617 !important;
}

/* コードブロック内コメント可読性改善 */
.hljs-comment {
    color: #9ca3af !important;
}
html.dark .hljs-comment {
    color: #9ca3af !important;
}

/* 印刷用 */
@media print {
    .no-print { display: none !important; }
    body { font-size: 11pt; }
    .page-break { page-break-before: always; }
}