/* Main styles */
.docs-sidebar::-webkit-scrollbar {
    width: 8px;
}

.docs-sidebar::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.docs-sidebar::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.docs-sidebar::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Sidebar navigation styles */
.sidebar-link {
    position: relative;
}

.sidebar-link.active {
    color: #4f46e5;
    background-color: #eef2ff;
    font-weight: 500;
}

.sidebar-link.active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background-color: #4f46e5;
    border-radius: 0 4px 4px 0;
}

/* Search styles */
.search-input {
    @apply block w-full rounded-md border-gray-300 pl-10 pr-10 py-2 text-sm focus:ring-indigo-500 focus:border-indigo-500;
}

/* Code block styles */
.code-block {
    @apply relative bg-gray-900 rounded-lg overflow-hidden;
}

.code-block pre {
    @apply p-4 text-gray-300 overflow-x-auto;
}

.copy-button {
    @apply absolute right-2 top-2 p-2 text-gray-400 hover:text-white bg-gray-800 rounded transition-colors;
}

/* Navigation styles */
.nav-link {
    @apply text-gray-700 hover:text-indigo-600 transition-colors;
}

/* Footer styles */
.footer-heading {
    @apply text-lg font-semibold mb-4;
}

.footer-link {
    @apply text-gray-400 hover:text-white;
}

.newsletter-input {
    @apply flex-grow px-4 py-2 rounded-l-md focus:outline-none focus:ring-2 focus:ring-indigo-600;
}

.newsletter-button {
    @apply bg-indigo-600 text-white px-4 py-2 rounded-r-md hover:bg-indigo-700 transition-colors;
}

/* Responsive styles */
@media (max-width: 768px) {
    .docs-sidebar {
        @apply fixed inset-0 z-40 transform transition-transform duration-300;
    }

    .docs-sidebar.hidden {
        @apply -translate-x-full;
    }
}