﻿@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,300;1,400;1,500&display=swap');

*,
html,
body,
:root {
    font-family: 'Roboto', sans-serif !important;
}

/* Loại trừ FA pseudo-elements khỏi Roboto override */
.fas::before,
.far::before,
.fal::before,
.fab::before,
.fa::before {
    font-family: "Font Awesome 5 Free" !important;
}

.fab::before {
    font-family: "Font Awesome 5 Brands" !important;
}

/* ===== MOBILE SIDEBAR ===== */
@media (max-width: 767.98px) {
    /* Ẩn sidebar mặc định trên mobile */
    .app-menu {
        left: -100% !important;
        transition: left 0.3s ease !important;
        position: fixed !important;
        top: 0 !important;
        bottom: 0 !important;
        z-index: 1050 !important;
    }

    /* Hiện sidebar khi body có class vertical-sidebar-enable */
    body.vertical-sidebar-enable .app-menu {
        left: 0 !important;
    }

    /* Overlay: ẩn mặc định, hiện khi sidebar mở */
    .vertical-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.5);
        z-index: 1040;
        cursor: pointer;
    }

    body.vertical-sidebar-enable .vertical-overlay {
        display: block;
    }

    /* Đảm bảo main content không bị đẩy */
    .main-content {
        margin-left: 0 !important;
    }

    /* Topbar mobile: đảm bảo hiển thị đầy đủ */
    #page-topbar .navbar-header {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
    }

    /* Logo trong topbar mobile */
    #page-topbar .navbar-header .d-md-none img {
        display: block !important;
        height: 32px !important;
        width: auto !important;
        object-fit: contain !important;
    }

    .topbar-logo-mobile {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/*# sourceMappingURL=custom.min.css.map */
