@media (max-width: 1024px) {
    /* Use data attributes and IDs for ultra-high specificity so Elementor inline/widget styles are overridden */
    .elementor-element.elementor-element-container_31dpvrq0a,
    div[data-id="container_31dpvrq0a"] {
        position: fixed !important;
        top: 0 !important;
        right: -320px !important;
        width: 300px !important;
        height: 100vh !important;
        background-color: #192109 !important;
        z-index: 999999 !important;
        transition: right 0.3s ease-in-out !important;
        box-shadow: -5px 0 15px rgba(0,0,0,0.5) !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-start !important;
        align-items: flex-start !important;
        padding: 40px 20px !important;
    }

    .elementor-element.elementor-element-container_31dpvrq0a.off-canvas-active,
    div[data-id="container_31dpvrq0a"].off-canvas-active {
        right: 0 !important;
    }

    /* Keep the children layout clear in off-canvas */
    div[data-id="container_31dpvrq0a"] > * {
        margin-bottom: 20px !important;
        width: 100% !important;
    }

    body.admin-bar .elementor-element.elementor-element-container_31dpvrq0a,
    body.admin-bar div[data-id="container_31dpvrq0a"] {
        top: var(--wp-admin--admin-bar--height, 32px) !important;
        height: calc(100vh - var(--wp-admin--admin-bar--height, 32px)) !important;
    }

    @media screen and (max-width: 782px) {
        body.admin-bar .elementor-element.elementor-element-container_31dpvrq0a,
        body.admin-bar div[data-id="container_31dpvrq0a"] {
            top: 46px !important;
            height: calc(100vh - 46px) !important;
        }
    }
}
