/* --- FIX 1: Σταματάει το "πήδημα" της σελίδας (Layout Shift) --- */
html {
    overflow-y: scroll !important; /* Η μπάρα θα φαίνεται ΠΑΝΤΑ (έστω και γκρι), άρα δεν θα κουνιέται τίποτα */
    margin-right: 0 !important;
}

body {
    padding-right: 0 !important; /* Ακυρώνει το κενό που βάζει το Bootstrap */
    overflow-y: visible !important; /* Επιτρέπει το scroll ακόμα και με ανοιχτό μενού */
}

/* --- FIX 2: Εξαφάνιση Μπαρών ΜΕΣΑ στο μενού (The Invisible Scrollbars) --- */

/* Βήμα 1: Κόβουμε αυστηρά την οριζόντια κύλιση */
#offcanvas-menu .offcanvas-inner {
    overflow-x: hidden !important; 
}

/* Βήμα 2: Κάνουμε τις μπάρες ΑΟΡΑΤΕΣ (για Chrome, Safari, Opera, Edge) */
#offcanvas-menu .offcanvas-inner::-webkit-scrollbar {
    display: none !important; /* Εξαφανίζει τελείως την μπάρα */
    width: 0px !important;    /* Μηδενίζει το πλάτος */
    height: 0px !important;   /* Μηδενίζει το ύψος (για την οριζόντια) */
    background: transparent !important;
}

/* Βήμα 3: Κάνουμε τις μπάρες ΑΟΡΑΤΕΣ (για Firefox) */
#offcanvas-menu .offcanvas-inner {
    scrollbar-width: none !important;
}

/* Βήμα 4: Κάνουμε τις μπάρες ΑΟΡΑΤΕΣ (για παλιούς IE/Edge) */
#offcanvas-menu .offcanvas-inner {
    -ms-overflow-style: none !important;
}

#modal-menu-toggler {
    margin: 0px;
    padding: 0px;
    padding: 30px 13px 10px 13px;
    left: 2px;
    border-radius: 2px;
}

@media (max-width: 767px) {
    #sp-header {
        position: fixed;
        top: 0px;!important;
        left: 0px;
        right: 0px;
        box-shadow: 0px 0px 54px 0px rgba(210, 210, 210, .2509803922);
    }
}

#modal-menu {
    left: 65px;
}

@media (max-width: 767px) {
    #modal-menu {
        top: 65px;!important;
        left: 0px;
        right: 0px;
        position: fixed !important;
        width: 100%;
    }
}