/* public/css/mac-scrollbar-firefox.css */

/* ============================================
   MAC STYLE SCROLLBAR - WORKS IN ALL BROWSERS
   Firefox + Chrome + Safari + Edge
============================================ */

/* ========== FIREFOX SPECIFIC ========== */
/* These ONLY work in Firefox */
.fi-sidebar-nav {
    scrollbar-width: thin !important;
    scrollbar-color: rgba(120, 120, 120, 0.3) transparent !important;
}

.dark .fi-sidebar-nav {
    scrollbar-color: rgba(180, 180, 180, 0.3) transparent !important;
}

/* ========== WEBKIT BROWSERS ========== */
/* These ONLY work in Chrome, Safari, Edge */
.fi-sidebar-nav::-webkit-scrollbar {
    width: 8px !important;
    height: 8px !important;
    background: transparent !important;
}

.fi-sidebar-nav::-webkit-scrollbar-track {
    background: transparent !important;
    border-radius: 8px !important;
    margin: 4px !important;
}

.fi-sidebar-nav::-webkit-scrollbar-thumb {
    background: rgba(120, 120, 120, 0.3) !important;
    border-radius: 8px !important;
    border: 2px solid transparent !important;
    background-clip: content-box !important;
    opacity: 0 !important;
    transition: opacity 0.3s ease !important;
}

.fi-sidebar-nav:hover::-webkit-scrollbar-thumb {
    opacity: 1 !important;
}

.fi-sidebar-nav::-webkit-scrollbar-thumb:hover {
    background: rgba(120, 120, 120, 0.5) !important;
}

/* Dark mode for WebKit */
.dark .fi-sidebar-nav::-webkit-scrollbar-thumb {
    background: rgba(180, 180, 180, 0.3) !important;
}

.dark .fi-sidebar-nav::-webkit-scrollbar-thumb:hover {
    background: rgba(180, 180, 180, 0.5) !important;
}

/* ========== COMMON STYLES ========== */
/* These work in all browsers */
.fi-sidebar-nav {
    scroll-behavior: smooth !important;
    overflow-y: auto !important;
}

/* Optional: Fade edges effect */
.fi-sidebar-nav {
    mask-image: linear-gradient(
        to bottom,
        transparent 0%,
        black 20px,
        black calc(100% - 20px),
        transparent 100%
    ) !important;
    -webkit-mask-image: linear-gradient(
        to bottom,
        transparent 0%,
        black 20px,
        black calc(100% - 20px),
        transparent 100%
    ) !important;
}

.fixed-height-table-widget {
    height: 460px;
}

.fixed-height-table-widget .fi-ta-ctn {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.fixed-height-table-widget .fi-ta-content-ctn {
    overflow-y: auto;
	/*min-height:300px;*/
}
.navbar_app_name{
	position: absolute;
    left: 26.3%;
	font-weight:600;
}
@media only screen and (max-width: 600px) {
   .navbar_app_name{ display: none !important; }
}
.topbar_username{
	font-size:13px;
	margin-left:10px;
}
.signin_brand_name{
	text-align:center;
	font-weight:700;
	font-size:15px;
}