/* ================================================
 * Archive Page - Custom Styles
 * Path: assets/css/archive/styles.css
 * ================================================ */

body {
    background-color: #0a0e17;
    color: #e2e8f0;
    overflow-x: hidden;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 6px;
}
::-webkit-scrollbar-track {
    background: #0a0e17;
}
::-webkit-scrollbar-thumb {
    background: #1a2236;
}
::-webkit-scrollbar-thumb:hover {
    background: #f0a500;
}

/* Scanline Overlay */
.scanlines::before {
    content: " ";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%),
                linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
    z-index: 50;
    background-size: 100% 2px, 3px 100%;
    pointer-events: none;
}

/* Grid Background */
.bg-grid-pattern {
    background-image: linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    background-size: 40px 40px;
}

/* Drawer Transition */
.drawer-enter {
    transform: translateX(100%);
}
.drawer-enter-active {
    transform: translateX(0);
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.drawer-exit {
    transform: translateX(0);
}
.drawer-exit-active {
    transform: translateX(100%);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}