@view-transition {
    navigation: auto;
}

.icon {
    svg, g {
        stroke-width: 1.75 !important;
    }
}

.docs-content {
    h1, h2, h3, h4 { margin-top: 1.5rem; margin-bottom: .5rem; }
    h1:first-child { margin-top: 0; }
    table { width: 100%; border-collapse: collapse; margin-bottom: 1rem; }
    table th, table td { padding: .5rem .75rem; border: 1px solid var(--tblr-border-color); }
    table thead th { background: var(--tblr-bg-surface-secondary); }
    pre { background: var(--tblr-bg-surface-secondary); color: var(--tblr-body-color); padding: 1rem; border-radius: var(--tblr-border-radius); overflow-x: auto; }
    code { font-size: .875em; color: var(--tblr-body-color); }
    img { max-width: 100%; }
    hr { margin: 1.5rem 0; }
    blockquote { border-left: 4px solid var(--tblr-border-color); padding-left: 1rem; color: var(--tblr-muted); }
}

.nav-item {
    .nav-link {
        i {
            font-size: 1.25rem;
        }

        svg {
            max-width: 1.25rem;
            max-height: 1.25rem;
        }
    }

    &.active {
        .nav-link[data-bs-theme=dark] {
            background-color: rgba(255, 255, 255, .1) !important;
        }

        .nav-link[data-bs-theme=light] {
            background-color: rgba(0, 0, 0, .1) !important;
        }

        .nav-link-icon {
            color: var(--tblr-primary);
        }
    }
}
