/* ===================================================== */
/* BASE HTML / BODY                                      */
/* ===================================================== */
html, body {
    margin: 0;
    padding: 0;
    overflow-y: auto; /* SCROLL GLOBAL */

scrollbar-width: none; /* Firefox */
-ms-overflow-style: none; /* IE/Edge antigo */
}

/* Chrome, Edge, Safari */
html::-webkit-scrollbar,
body::-webkit-scrollbar {
    display: none;
}
@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

body {
    background-color: #f8f9fa;
    padding-top: 57px; /* compensação do header fixo */
}

/* ================================= */
/* BRAND HEADER INDUSTRIAL */
/* ================================= */

.industrial-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: white !important;
}

.brand-icon {
    font-size: 34px;
    color: #3b82f6;
}

.brand-text {
    display: flex;
    flex-direction: column;
    line-height: 1;
}

    .brand-text small {
        font-size: 11px;
        letter-spacing: 1.8px;
        font-weight: 500;
        color: rgba(255,255,255,.75);
    }

    .brand-text strong {
        font-size: 28px;
        font-weight: 800;
        color: #ffffff;
        letter-spacing: -.5px;
    }

/* ===================================================== */
/* LAYOUT PRINCIPAL                                      */
/* ===================================================== */

#app-layout {
    display: flex;
    align-items: stretch;
    width: 100%;
    min-height: calc(100vh - 57px); /* só referência mínima */
}

/* ===================================================== */
/* FOCO (BOOTSTRAP ACCESSIBILITY)                        */
/* ===================================================== */

.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 0.1rem #ffffff, 0 0 0 0.25rem #258cfb;
}

/* ===================================================== */
/* TOP NAVBAR (FIXO)                                     */
/* ===================================================== */

.navbar-top {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 57px;
    z-index: 1050;
    background-color: midnightblue;
}

    .navbar-top .navbar-brand {
        font-weight: 700;
        color: #f8f9fa !important;
    }

    .navbar-top .nav-link {
        color: #f8f9fa;
        font-weight: 500;
    }

        .navbar-top .nav-link:hover {
            color: #3498db;
        }

/* ===================================================== */
/* SIDEBAR NOVA ERP                                      */
/* ===================================================== */

.sidebar {
    width: 295px;
    flex-shrink: 0;
    min-height: calc(100vh - 57px);
    background: linear-gradient(180deg,#203548,#294258);
    box-shadow: 8px 0 25px rgba(0,0,0,.12);
    padding-top: 20px;
}

.sidebar-header {
    padding: 0 24px 22px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    margin-bottom: 16px;
}

    .sidebar-header h5 {
        color: #fff;
        font-size: 22px;
        font-weight: 700;
        letter-spacing: .5px;
    }

/* MENU */

.sidebar-menu {
    padding: 0 14px;
}

    .sidebar-menu .nav-item {
        margin-bottom: 8px;
    }

    .sidebar-menu .nav-link {
        display: flex;
        align-items: center;
        gap: 12px;
        color: #ffffff !important;
        font-size: 24px;
        font-weight: 600;
        padding: 16px 28px;
        border-radius: 16px;
        transition: .2s ease;
    }

        /* ÍCONES */

        .sidebar-menu .nav-link i {
            color: #ffffff !important;
            font-size: 34px;
            width: 28px;
            margin-right: 12px;
            text-align: center;
        }

        /* HOVER */

        .sidebar-menu .nav-link:hover {
            background: rgba(255,255,255,.10);
            color: #fff !important;
            transform: translateX(4px);
        }

        /* ITEM ATIVO */

        .sidebar-menu .nav-link.active,
        .sidebar-menu .nav-link[aria-current="page"] {
            background: rgba(255,255,255,.12);
            color: #fff !important;
            box-shadow: inset 4px 0 0 #4ea3ff;
        }

/* CONTEÚDO */

.main-content {
    flex: 1;
    min-width: 0;
    padding: 28px;
    background: #eef3f8;
    overflow: visible;
}

/* ===================================================== */
/* MOBILE MENU                                           */
/* ===================================================== */

@media(max-width:991px) {

    .sidebar {
        position: fixed;
        top: 57px;
        left: -295px;
        width: 295px;
        height: calc(100vh - 57px);
        z-index: 1050;
        overflow-y: auto;
        transition: left .30s ease;
    }

        /* MENU ABERTO */

        .sidebar.show {
            left: 0;
        }

    /* OVERLAY */

    .sidebar-overlay {
        position: fixed;
        top: 57px;
        left: 0;
        width: 100%;
        height: calc(100vh - 57px);
        background: rgba(0,0,0,.45);
        z-index: 1040;
        opacity: 0;
        visibility: hidden;
        transition: .25s ease;
    }

        .sidebar-overlay.show {
            opacity: 1;
            visibility: visible;
        }

    .main-content {
        width: 100%;
        padding: 15px;
    }
}

/* ======================================== */
/* LOGIN MOBILE LADO DIREITO                */
/* ======================================== */

@media (max-width: 991px) {

    /* MENU MOBILE */

    .mobile-navbar-right {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

        /* LOGIN */

        .mobile-navbar-right .dropdown {
            width: auto;
            margin-left: auto;
        }

        .mobile-navbar-right .dropdown-toggle {
            justify-content: flex-end;
            text-align: right;
        }

        /* DROPDOWN ABRIR DIREITA */

        .mobile-navbar-right .dropdown-menu {
            position: absolute !important;
            right: 0 !important;
            left: auto !important;
            min-width: 220px;
            border-radius: 14px;
            box-shadow: 0 10px 30px rgba(0,0,0,.15);
        }
}

/* ===================================================== */
/* CONTEÚDO PRINCIPAL                                    */
/* ===================================================== */

.main-content {
    flex: 1;
    min-width: 0;
    padding: 20px;
    background: #f8f9fa;
    /*SEM scroll próprio */
    overflow: visible;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

    .main-content::-webkit-scrollbar {
        display: none;
    }

/* ===================================================== */
/* FOOTER                                                */
/* ===================================================== */

footer {
    background-color: #ffffff;
    border-top: 1px solid #dee2e6;
}

    footer .container-fluid {
        padding: 12px 0;
    }

    footer .small {
        color: #6c757d;
        letter-spacing: 0.5px;
    }

@media (max-width: 768px) {
    footer {
        display: none;
    }
}

/* ===================================================== */
/* TABLE                                                 */
/* ===================================================== */

.table-responsive {
    overflow-x: auto;
}
 
/* LInha clicavel Modal */
.linha-cliente {
    cursor: pointer;
}

    .linha-cliente:hover {
        background-color: #f8f9fa;
    }


  /*TOAST*/


.toast-container-custom {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 99999;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.toast-custom {
    min-width: 360px;
    max-width: 430px;
    border: none;
    border-radius: 22px;
    overflow: hidden;
    backdrop-filter: blur(8px);
    animation: slideIn .35s ease;
}

.toast-content {
    display: flex;
    align-items: center;
    padding: 18px; 
    gap: 14px;
}

.toast-icon {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    background: rgba(255,255,255,.15);
}

.toast-text {
    flex: 1;
}

.toast-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 2px;
}

.toast-message {
    font-size: 14px;
    opacity: .95;
}

.toast-success {
    background: linear-gradient( 135deg, #16a34a, #22c55e );
    color: white;
}

.toast-error {
    background: linear-gradient( 135deg, #dc2626, #ef4444 );
    color: white;
}

.toast-warning {
    background: linear-gradient( 135deg, #f59e0b, #fbbf24 );
    color: #111827;
}

@keyframes slideIn {

    from {
        opacity: 0;
        transform: translateX(80px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/*ACESSO RAPIDO */


<style >

.quick-card {
    background: #fff;
    border-radius: 26px;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: .25s ease;
    box-shadow: 0 8px 28px rgba(15,23,42,.06);
    border: 1px solid rgba(15,23,42,.04);
}

.quick-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(15,23,42,.10);
}

.quick-icon {
    font-size: 52px;
    color: #2563eb;
    margin-bottom: 18px;
}

.quick-title {
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
    text-align: center;
}

/* MOBILE */

@media(max - width:768px) {

    .quick-card {
        min-height: 140px;
    }

    .quick-icon {
        font-size: 38px;
    }

    .quick-title {
        font-size: 15px;
    }
}

</style >