:where([class^="ri-"])::before {
    content: "\f3c2";
}

body {
    font-family: 'Inter', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.theme-switch {
    position: relative;
    width: 60px;
    height: 30px;
}

.theme-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #2b2b2b;
    transition: .4s;
    border-radius: 30px;
}

.slider:before {
    position: absolute;
    content: "";
    height: 22px;
    width: 22px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    transition: .4s;
    border-radius: 50%;
}

input:checked + .slider {
    background-color: var(--color-primary);
}

input:checked + .slider:before {
    transform: translateX(30px);
}


.nav-active {
    font-weight: 500;
    color: var(--color-primary);
}

.markdown-body ul li {
    list-style: outside;
}

.markdown-body ol li {
    list-style: decimal;
}
.markdown-body pre {
    padding: 0 !important;
}

.markdown-body a {
    color: var(--color-primary);
}

.markdown-body pre {
    padding: 0!important;
    border-radius: 4px!important;
}

.dark .markdown-body {
    color: #d1d5db;
    color-scheme: dark;
}

.dark .markdown-body h1,
.dark .markdown-body h2,
.dark .markdown-body h3,
.dark .markdown-body h4,
.dark .markdown-body h5,
.dark .markdown-body h6,
.dark .markdown-body strong {
    color: #f8fafc;
}

.dark .markdown-body h1,
.dark .markdown-body h2 {
    border-bottom-color: #334155;
}

.dark .markdown-body p,
.dark .markdown-body li,
.dark .markdown-body dd {
    color: #d1d5db;
}

.dark .markdown-body hr {
    background-color: #334155;
    border-color: #334155;
}

.dark .markdown-body blockquote {
    color: #cbd5e1;
    background: rgba(30, 41, 59, 0.55);
    border-left-color: #3b82f6;
}

.dark .markdown-body [style*="background:#fff" i],
.dark .markdown-body [style*="background: #fff" i],
.dark .markdown-body [style*="background-color:#fff" i],
.dark .markdown-body [style*="background-color: #fff" i],
.dark .markdown-body [style*="background:#f8f9fa" i],
.dark .markdown-body [style*="background: #f8f9fa" i],
.dark .markdown-body [style*="background-color:#f8f9fa" i],
.dark .markdown-body [style*="background-color: #f8f9fa" i],
.dark .markdown-body [style*="background:#f5f5f5" i],
.dark .markdown-body [style*="background: #f5f5f5" i],
.dark .markdown-body [style*="background-color:#f5f5f5" i],
.dark .markdown-body [style*="background-color: #f5f5f5" i],
.dark .markdown-body [style*="background:#fff3e0" i],
.dark .markdown-body [style*="background: #fff3e0" i],
.dark .markdown-body [style*="background-color:#fff3e0" i],
.dark .markdown-body [style*="background-color: #fff3e0" i],
.dark .markdown-body [style*="background:#e3f2fd" i],
.dark .markdown-body [style*="background: #e3f2fd" i],
.dark .markdown-body [style*="background-color:#e3f2fd" i],
.dark .markdown-body [style*="background-color: #e3f2fd" i],
.dark .markdown-body [style*="background:#e8f5e9" i],
.dark .markdown-body [style*="background: #e8f5e9" i],
.dark .markdown-body [style*="background-color:#e8f5e9" i],
.dark .markdown-body [style*="background-color: #e8f5e9" i],
.dark .markdown-body [style*="background:#eff6ff" i],
.dark .markdown-body [style*="background: #eff6ff" i],
.dark .markdown-body [style*="background-color:#eff6ff" i],
.dark .markdown-body [style*="background-color: #eff6ff" i],
.dark .markdown-body [style*="background:#f0fdf4" i],
.dark .markdown-body [style*="background: #f0fdf4" i],
.dark .markdown-body [style*="background-color:#f0fdf4" i],
.dark .markdown-body [style*="background-color: #f0fdf4" i],
.dark .markdown-body [style*="background:#fef2f2" i],
.dark .markdown-body [style*="background: #fef2f2" i],
.dark .markdown-body [style*="background-color:#fef2f2" i],
.dark .markdown-body [style*="background-color: #fef2f2" i],
.dark .markdown-body [style*="background:#fef3c7" i],
.dark .markdown-body [style*="background: #fef3c7" i],
.dark .markdown-body [style*="background-color:#fef3c7" i],
.dark .markdown-body [style*="background-color: #fef3c7" i] {
    background: rgba(15, 23, 42, 0.86) !important;
    border-color: #334155 !important;
    color: #dbeafe !important;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.12);
}

.dark .markdown-body [style*="background:#fff" i] [style*="color:" i],
.dark .markdown-body [style*="background: #fff" i] [style*="color:" i],
.dark .markdown-body [style*="background-color:#fff" i] [style*="color:" i],
.dark .markdown-body [style*="background-color: #fff" i] [style*="color:" i],
.dark .markdown-body [style*="background:#f8f9fa" i] [style*="color:" i],
.dark .markdown-body [style*="background: #f8f9fa" i] [style*="color:" i],
.dark .markdown-body [style*="background-color:#f8f9fa" i] [style*="color:" i],
.dark .markdown-body [style*="background-color: #f8f9fa" i] [style*="color:" i],
.dark .markdown-body [style*="background:#f5f5f5" i] [style*="color:" i],
.dark .markdown-body [style*="background: #f5f5f5" i] [style*="color:" i],
.dark .markdown-body [style*="background-color:#f5f5f5" i] [style*="color:" i],
.dark .markdown-body [style*="background-color: #f5f5f5" i] [style*="color:" i],
.dark .markdown-body [style*="background:#fff3e0" i] [style*="color:" i],
.dark .markdown-body [style*="background: #fff3e0" i] [style*="color:" i],
.dark .markdown-body [style*="background-color:#fff3e0" i] [style*="color:" i],
.dark .markdown-body [style*="background-color: #fff3e0" i] [style*="color:" i],
.dark .markdown-body [style*="background:#e3f2fd" i] [style*="color:" i],
.dark .markdown-body [style*="background: #e3f2fd" i] [style*="color:" i],
.dark .markdown-body [style*="background-color:#e3f2fd" i] [style*="color:" i],
.dark .markdown-body [style*="background-color: #e3f2fd" i] [style*="color:" i],
.dark .markdown-body [style*="background:#e8f5e9" i] [style*="color:" i],
.dark .markdown-body [style*="background: #e8f5e9" i] [style*="color:" i],
.dark .markdown-body [style*="background-color:#e8f5e9" i] [style*="color:" i],
.dark .markdown-body [style*="background-color: #e8f5e9" i] [style*="color:" i],
.dark .markdown-body [style*="background:#eff6ff" i] [style*="color:" i],
.dark .markdown-body [style*="background: #eff6ff" i] [style*="color:" i],
.dark .markdown-body [style*="background-color:#eff6ff" i] [style*="color:" i],
.dark .markdown-body [style*="background-color: #eff6ff" i] [style*="color:" i],
.dark .markdown-body [style*="background:#f0fdf4" i] [style*="color:" i],
.dark .markdown-body [style*="background: #f0fdf4" i] [style*="color:" i],
.dark .markdown-body [style*="background-color:#f0fdf4" i] [style*="color:" i],
.dark .markdown-body [style*="background-color: #f0fdf4" i] [style*="color:" i],
.dark .markdown-body [style*="background:#fef2f2" i] [style*="color:" i],
.dark .markdown-body [style*="background: #fef2f2" i] [style*="color:" i],
.dark .markdown-body [style*="background-color:#fef2f2" i] [style*="color:" i],
.dark .markdown-body [style*="background-color: #fef2f2" i] [style*="color:" i],
.dark .markdown-body [style*="background:#fef3c7" i] [style*="color:" i],
.dark .markdown-body [style*="background: #fef3c7" i] [style*="color:" i],
.dark .markdown-body [style*="background-color:#fef3c7" i] [style*="color:" i],
.dark .markdown-body [style*="background-color: #fef3c7" i] [style*="color:" i] {
    color: #dbeafe !important;
}

.dark .markdown-body table {
    border-color: #334155;
}

.dark .markdown-body table th {
    background-color: #1e293b !important;
    color: #f8fafc !important;
}

.dark .markdown-body table th,
.dark .markdown-body table td {
    border-color: #334155 !important;
    color: #dbeafe !important;
}

.dark .markdown-body table tr {
    background-color: #111827 !important;
    border-top-color: #334155 !important;
}

.dark .markdown-body table tr:nth-child(2n) {
    background-color: #0f172a !important;
}

.dark .markdown-body code {
    background-color: rgba(37, 99, 235, 0.18);
    color: #bfdbfe;
}

.dark .markdown-body pre,
.dark .markdown-body .highlight pre {
    background-color: #020617 !important;
    border: 1px solid #1e293b;
}

.dark .markdown-body kbd {
    background-color: #111827;
    border-color: #334155;
    color: #f8fafc;
    box-shadow: inset 0 -1px 0 #334155;
}

@media (max-width: 768px) {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }

    .container {
        max-width: 100%;
    }

    .markdown-body {
        overflow-wrap: anywhere;
    }

    .markdown-body table {
        display: block;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .markdown-body pre {
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .markdown-body img,
    .markdown-body video,
    .markdown-body iframe,
    img,
    video,
    iframe {
        max-width: 100%;
    }

    .markdown-body img,
    .markdown-body video,
    img,
    video {
        height: auto;
    }

    #sidebar {
        max-width: calc(100vw - 32px);
    }

    .theme-switch {
        flex: 0 0 auto;
    }
}