/* Prevent horizontal scrollbar globally */
html,
body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

/* Mobile drawer base styles */
#mobile-drawer {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    height: 100vh !important;
    width: 320px !important;
    z-index: 9999 !important;
    transform: translateX(100%) !important;
    visibility: hidden !important;
    opacity: 0 !important;
    transition: all 0.3s ease-in-out !important;
    pointer-events: none !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
}

#mobile-drawer.translate-x-0 {
    transform: translateX(0) !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

#mobile-drawer.translate-x-full {
    transform: translateX(100%) !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Ensure drawer is completely off-screen when closed */
@media (max-width: 1023px) {
    #mobile-drawer {
        right: -320px !important;
        position: fixed !important;
        top: 0 !important;
        height: 100vh !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    #mobile-drawer.translate-x-0 {
        right: 0 !important;
        position: fixed !important;
        top: 0 !important;
        height: 100vh !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
}

/* Hide drawer on desktop */
@media (min-width: 1024px) {
    #mobile-drawer {
        display: none !important;
    }
}

/* Ensure no layout shift */
.lg\\:hidden {
    display: none;
}

@media (max-width: 1023px) {
    .lg\\:hidden {
        display: block;
    }
}


/* Typed.js cursor styling */
.typed-cursor{
    font-weight: 400 !important;
    opacity: 0.85 !important;
}