/* ==========================================================================
   Menu scrollbars enhancement — bigger & easier to grab on hover/focus
   Applies to main mobile menu, sidebar, aside, beta vertical menu,
   and filemgr sidebars (comptabilite, paie, espace, admin menus)
   ========================================================================== */

/* Default: keep Perfect Scrollbar hidden until user interacts with the menu */
.navbar-menu-wrapper.ps.ps--active-y > .ps__rail-y,
#navbarMenu.ps.ps--active-y > .ps__rail-y,
#sidebarMenu.ps.ps--active-y > .ps__rail-y,
.aside-body.ps.ps--active-y > .ps__rail-y,
.aside.ps.ps--active-y > .ps__rail-y,
.sidebar-fixed > .ps__rail-y,
.layout-menu.menu-vertical.ps.ps--active-y > .ps__rail-y,
.filemgr-sidebar.ps.ps--active-y > .ps__rail-y,
.filemgr-sidebar-body.ps.ps--active-y > .ps__rail-y,
.mail-sidebar-body.ps.ps--active-y > .ps__rail-y,
.mail-group-body.ps.ps--active-y > .ps__rail-y,
.contact-sidebar-body.ps.ps--active-y > .ps__rail-y,
.contact-content-sidebar.ps.ps--active-y > .ps__rail-y,
.chat-sidebar-body.ps.ps--active-y > .ps__rail-y,
.chat-sidebar-right.ps.ps--active-y > .ps__rail-y,
.calendar-sidebar-body.ps.ps--active-y > .ps__rail-y {
    width: 8px;
    opacity: 0;
    display: block;
    transition: width 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
                opacity 0.2s ease,
                background-color 0.2s ease;
}

.navbar-menu-wrapper.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
#navbarMenu.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
#sidebarMenu.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
.aside-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
.aside.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
.sidebar-fixed > .ps__rail-y > .ps__thumb-y,
.layout-menu.menu-vertical.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
.filemgr-sidebar.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
.filemgr-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
.mail-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
.mail-group-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
.contact-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
.contact-content-sidebar.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
.chat-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
.chat-sidebar-right.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
.calendar-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y {
    width: 8px;
    border-radius: 4px;
    background-color: #97a3b9;
    transition: width 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
                background-color 0.2s ease,
                transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Hover/focus-within the menu => reveal, thicker scrollbar, primary color, subtle bounce */
.navbar-menu-wrapper.ps:hover > .ps__rail-y,
.navbar-menu-wrapper.ps:focus-within > .ps__rail-y,
#navbarMenu.ps:hover > .ps__rail-y,
#navbarMenu.ps:focus-within > .ps__rail-y,
#sidebarMenu.ps:hover > .ps__rail-y,
#sidebarMenu.ps:focus-within > .ps__rail-y,
.aside-body.ps:hover > .ps__rail-y,
.aside-body.ps:focus-within > .ps__rail-y,
.aside.ps:hover > .ps__rail-y,
.aside.ps:focus-within > .ps__rail-y,
.sidebar-fixed:hover > .ps__rail-y,
.layout-menu.menu-vertical.ps:hover > .ps__rail-y,
.layout-menu.menu-vertical.ps:focus-within > .ps__rail-y,
.filemgr-sidebar.ps:hover > .ps__rail-y,
.filemgr-sidebar.ps:focus-within > .ps__rail-y,
.filemgr-sidebar-body.ps:hover > .ps__rail-y,
.filemgr-sidebar-body.ps:focus-within > .ps__rail-y,
.mail-sidebar-body.ps:hover > .ps__rail-y,
.mail-sidebar-body.ps:focus-within > .ps__rail-y,
.mail-group-body.ps:hover > .ps__rail-y,
.mail-group-body.ps:focus-within > .ps__rail-y,
.contact-sidebar-body.ps:hover > .ps__rail-y,
.contact-sidebar-body.ps:focus-within > .ps__rail-y,
.contact-content-sidebar.ps:hover > .ps__rail-y,
.contact-content-sidebar.ps:focus-within > .ps__rail-y,
.chat-sidebar-body.ps:hover > .ps__rail-y,
.chat-sidebar-body.ps:focus-within > .ps__rail-y,
.chat-sidebar-right.ps:hover > .ps__rail-y,
.chat-sidebar-right.ps:focus-within > .ps__rail-y,
.calendar-sidebar-body.ps:hover > .ps__rail-y,
.calendar-sidebar-body.ps:focus-within > .ps__rail-y {
    width: 12px;
    opacity: 1;
    background-color: rgba(238, 14, 81, 0.12);
}

.navbar-menu-wrapper.ps:hover > .ps__rail-y > .ps__thumb-y,
.navbar-menu-wrapper.ps:focus-within > .ps__rail-y > .ps__thumb-y,
#navbarMenu.ps:hover > .ps__rail-y > .ps__thumb-y,
#navbarMenu.ps:focus-within > .ps__rail-y > .ps__thumb-y,
#sidebarMenu.ps:hover > .ps__rail-y > .ps__thumb-y,
#sidebarMenu.ps:focus-within > .ps__rail-y > .ps__thumb-y,
.aside-body.ps:hover > .ps__rail-y > .ps__thumb-y,
.aside-body.ps:focus-within > .ps__rail-y > .ps__thumb-y,
.aside.ps:hover > .ps__rail-y > .ps__thumb-y,
.aside.ps:focus-within > .ps__rail-y > .ps__thumb-y,
.sidebar-fixed:hover > .ps__rail-y > .ps__thumb-y,
.layout-menu.menu-vertical.ps:hover > .ps__rail-y > .ps__thumb-y,
.layout-menu.menu-vertical.ps:focus-within > .ps__rail-y > .ps__thumb-y,
.filemgr-sidebar.ps:hover > .ps__rail-y > .ps__thumb-y,
.filemgr-sidebar.ps:focus-within > .ps__rail-y > .ps__thumb-y,
.filemgr-sidebar-body.ps:hover > .ps__rail-y > .ps__thumb-y,
.filemgr-sidebar-body.ps:focus-within > .ps__rail-y > .ps__thumb-y,
.mail-sidebar-body.ps:hover > .ps__rail-y > .ps__thumb-y,
.mail-sidebar-body.ps:focus-within > .ps__rail-y > .ps__thumb-y,
.mail-group-body.ps:hover > .ps__rail-y > .ps__thumb-y,
.mail-group-body.ps:focus-within > .ps__rail-y > .ps__thumb-y,
.contact-sidebar-body.ps:hover > .ps__rail-y > .ps__thumb-y,
.contact-sidebar-body.ps:focus-within > .ps__rail-y > .ps__thumb-y,
.contact-content-sidebar.ps:hover > .ps__rail-y > .ps__thumb-y,
.contact-content-sidebar.ps:focus-within > .ps__rail-y > .ps__thumb-y,
.chat-sidebar-body.ps:hover > .ps__rail-y > .ps__thumb-y,
.chat-sidebar-body.ps:focus-within > .ps__rail-y > .ps__thumb-y,
.chat-sidebar-right.ps:hover > .ps__rail-y > .ps__thumb-y,
.chat-sidebar-right.ps:focus-within > .ps__rail-y > .ps__thumb-y,
.calendar-sidebar-body.ps:hover > .ps__rail-y > .ps__thumb-y,
.calendar-sidebar-body.ps:focus-within > .ps__rail-y > .ps__thumb-y {
    width: 12px;
    background-color: #ee0e51;
    box-shadow: 0 0 6px rgba(238, 14, 81, 0.45);
    animation: menuScrollbarBounce 0.55s ease both;
}

@keyframes menuScrollbarBounce {
    0%   { transform: scaleY(1) translateY(0); }
    25%  { transform: scaleY(1.12) translateY(-4px); }
    50%  { transform: scaleY(0.95) translateY(2px); }
    75%  { transform: scaleY(1.05) translateY(-1px); }
    100% { transform: scaleY(1) translateY(0); }
}

/* When a drawer/sidebar is explicitly shown, keep scrollbar visible */
body.navbar-nav-show .navbar-menu-wrapper.ps > .ps__rail-y,
body.navbar-nav-show #navbarMenu.ps > .ps__rail-y,
body.sidebar-show #sidebarMenu.ps > .ps__rail-y,
body.show-aside .aside-body.ps > .ps__rail-y,
body.show-aside .aside.ps > .ps__rail-y,
body.filemgr-sidebar-show .filemgr-sidebar.ps > .ps__rail-y,
body.filemgr-sidebar-show .filemgr-sidebar-body.ps > .ps__rail-y,
body.mail-sidebar-show .mail-sidebar-body.ps > .ps__rail-y,
body.chat-content-show .chat-sidebar-body.ps > .ps__rail-y,
body.show-sidebar-right .chat-sidebar-right.ps > .ps__rail-y {
    opacity: 1;
}

/* Hide filemgr sidebar scrollbar when the mobile sidebar is not explicitly shown */
@media (max-width: 991px) {
    body:not(.filemgr-sidebar-show) .filemgr-sidebar.ps.ps--active-y > .ps__rail-y,
    body:not(.filemgr-sidebar-show) .filemgr-sidebar-body.ps.ps--active-y > .ps__rail-y,
    body:not(.filemgr-sidebar-show) .filemgr-sidebar.ps:hover > .ps__rail-y,
    body:not(.filemgr-sidebar-show) .filemgr-sidebar.ps:focus-within > .ps__rail-y,
    body:not(.filemgr-sidebar-show) .filemgr-sidebar-body.ps:hover > .ps__rail-y,
    body:not(.filemgr-sidebar-show) .filemgr-sidebar-body.ps:focus-within > .ps__rail-y {
        opacity: 0 !important;
    }
}

/* Operation/facturation pages: the sidebar menu is hidden behind the content
   until the burger adds body.filemgr-sidebar-show — never show its scrollbar
   while the menu itself is hidden, whatever the viewport width. */
body.page-facturation:not(.filemgr-sidebar-show) .filemgr-sidebar.ps > .ps__rail-y,
body.page-facturation:not(.filemgr-sidebar-show) .filemgr-sidebar-body.ps > .ps__rail-y,
body.page-facturation:not(.filemgr-sidebar-show) .filemgr-sidebar.ps:hover > .ps__rail-y,
body.page-facturation:not(.filemgr-sidebar-show) .filemgr-sidebar.ps:focus-within > .ps__rail-y,
body.page-facturation:not(.filemgr-sidebar-show) .filemgr-sidebar-body.ps:hover > .ps__rail-y,
body.page-facturation:not(.filemgr-sidebar-show) .filemgr-sidebar-body.ps:focus-within > .ps__rail-y {
    opacity: 0 !important;
}

@media (min-width: 992px) {
    body:not(.page-facturation) .filemgr-sidebar.ps.ps--active-y > .ps__rail-y,
    body:not(.page-facturation) .filemgr-sidebar-body.ps.ps--active-y > .ps__rail-y {
        width: 10px;
        opacity: 0.9 !important;
        background-color: rgba(238, 14, 81, 0.08);
    }

    body:not(.page-facturation) .filemgr-sidebar.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    body:not(.page-facturation) .filemgr-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y {
        width: 10px;
        background-color: #ee0e51;
    }
}

html[dir="rtl"] body:not(.page-facturation) .filemgr-sidebar.ps > .ps__rail-y,
html[dir="rtl"] body:not(.page-facturation) .filemgr-sidebar-body.ps > .ps__rail-y {
    left: 0 !important;
    right: auto !important;
    margin-left: 2px;
    margin-right: 0;
    background-color: rgba(238, 14, 81, 0.14);
}

html[dir="rtl"] body:not(.page-facturation) .filemgr-sidebar.ps > .ps__rail-y > .ps__thumb-y,
html[dir="rtl"] body:not(.page-facturation) .filemgr-sidebar-body.ps > .ps__rail-y > .ps__thumb-y {
    left: 0;
    right: auto;
    background-color: #ee0e51;
    box-shadow: 0 0 5px rgba(238, 14, 81, 0.5);
}

/* Mobile / PWA / app: no hover, keep scrollbar wide and visible */
@media (hover: none) and (pointer: coarse) {
    .navbar-menu-wrapper.ps.ps--active-y > .ps__rail-y,
    #navbarMenu.ps.ps--active-y > .ps__rail-y,
    #sidebarMenu.ps.ps--active-y > .ps__rail-y,
    .aside-body.ps.ps--active-y > .ps__rail-y,
    .aside.ps.ps--active-y > .ps__rail-y,
    .sidebar-fixed > .ps__rail-y,
    .layout-menu.menu-vertical.ps.ps--active-y > .ps__rail-y,
    .filemgr-sidebar.ps.ps--active-y > .ps__rail-y,
    .filemgr-sidebar-body.ps.ps--active-y > .ps__rail-y,
    .mail-sidebar-body.ps.ps--active-y > .ps__rail-y,
    .mail-group-body.ps.ps--active-y > .ps__rail-y,
    .contact-sidebar-body.ps.ps--active-y > .ps__rail-y,
    .contact-content-sidebar.ps.ps--active-y > .ps__rail-y,
    .chat-sidebar-body.ps.ps--active-y > .ps__rail-y,
    .chat-sidebar-right.ps.ps--active-y > .ps__rail-y,
    .calendar-sidebar-body.ps.ps--active-y > .ps__rail-y {
        width: 10px;
        opacity: 0.9;
    }
    .navbar-menu-wrapper.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    #navbarMenu.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    #sidebarMenu.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .aside-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .aside.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .sidebar-fixed > .ps__rail-y > .ps__thumb-y,
    .layout-menu.menu-vertical.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .filemgr-sidebar.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .filemgr-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .mail-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .mail-group-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .contact-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .contact-content-sidebar.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .chat-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .chat-sidebar-right.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .calendar-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y {
        width: 10px;
        background-color: #ee0e51;
    }
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
    .navbar-menu-wrapper.ps.ps--active-y > .ps__rail-y,
    #navbarMenu.ps.ps--active-y > .ps__rail-y,
    #sidebarMenu.ps.ps--active-y > .ps__rail-y,
    .aside-body.ps.ps--active-y > .ps__rail-y,
    .aside.ps.ps--active-y > .ps__rail-y,
    .sidebar-fixed > .ps__rail-y,
    .layout-menu.menu-vertical.ps.ps--active-y > .ps__rail-y,
    .filemgr-sidebar.ps.ps--active-y > .ps__rail-y,
    .filemgr-sidebar-body.ps.ps--active-y > .ps__rail-y,
    .mail-sidebar-body.ps.ps--active-y > .ps__rail-y,
    .mail-group-body.ps.ps--active-y > .ps__rail-y,
    .contact-sidebar-body.ps.ps--active-y > .ps__rail-y,
    .contact-content-sidebar.ps.ps--active-y > .ps__rail-y,
    .chat-sidebar-body.ps.ps--active-y > .ps__rail-y,
    .chat-sidebar-right.ps.ps--active-y > .ps__rail-y,
    .calendar-sidebar-body.ps.ps--active-y > .ps__rail-y,
    .navbar-menu-wrapper.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    #navbarMenu.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    #sidebarMenu.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .aside-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .aside.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .sidebar-fixed > .ps__rail-y > .ps__thumb-y,
    .layout-menu.menu-vertical.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .filemgr-sidebar.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .filemgr-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .mail-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .mail-group-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .contact-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .contact-content-sidebar.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .chat-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .chat-sidebar-right.ps.ps--active-y > .ps__rail-y > .ps__thumb-y,
    .calendar-sidebar-body.ps.ps--active-y > .ps__rail-y > .ps__thumb-y {
        transition: none;
        animation: none;
    }
}