/*=========================================================
  ALMS2Model Theme
  AdminLTE v4
==========================================================*/

/*-----------------------
    Google Font
-----------------------*/
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');

/*-----------------------
    Theme Colors
-----------------------*/
:root{

    --alms-primary:#1565C0;
    --alms-primary-dark:#0D47A1;
    --alms-primary-light:#E3F2FD;

    --alms-success:#2E7D32;
    --alms-warning:#FB8C00;
    --alms-danger:#D32F2F;

    --alms-bg:#F5F7FA;
    --alms-sidebar:#FFFFFF;
    --alms-navbar:#FFFFFF;
    --alms-card:#FFFFFF;

    --alms-text:#374151;
    --alms-muted:#6B7280;

    --alms-border:#E5E7EB;

}

/*-----------------------
    Body
-----------------------*/

body{

    font-family:'Roboto',sans-serif;

    background:var(--alms-bg);

    color:var(--alms-text);

}

/*-----------------------
    Navbar
-----------------------*/

.app-header{

    background:#fff !important;

    border-bottom:1px solid var(--alms-border);

    box-shadow:0 2px 8px rgba(0,0,0,.04);

    z-index:1040;

}

/*-----------------------
    Sidebar
-----------------------*/

.app-sidebar{

    width:300px;

    background:#fff !important;

    border-right:1px solid var(--alms-border);

    box-shadow:2px 0 12px rgba(0,0,0,.04);

}

/* Content */

.app-main{

    /*margin-left:300px;*/

    background:var(--alms-bg);

}

/*-----------------------
    Brand
-----------------------*/

.sidebar-brand{

    height:80px;

    border-bottom:1px solid var(--alms-border);

    background:#fff;

}

.brand-link{

    display:flex;

    align-items:center;

    padding:16px;

    text-decoration:none;

}

.brand-image{

    width:44px;

    height:44px;

    margin-right:12px;

}

.brand-text .title{

    font-size:20px;

    font-weight:700;

    color:var(--alms-primary);

}

.brand-text .subtitle{

    font-size:11px;

    color:var(--alms-muted);

    margin-top:2px;

}

/*-----------------------
    Sidebar Wrapper
-----------------------*/

.sidebar-wrapper{

    padding:8px;

}

/*-----------------------
    Menu
-----------------------*/

.sidebar-menu{

    gap:2px;

}

/* Links */

.sidebar-menu .nav-link{

    display:flex;

    align-items:center;

    min-height:36px;

    border-radius:10px;

    color:var(--alms-text) !important;

    transition:.25s;

    margin-bottom:2px;

    padding:6px 10px;

    font-size:13.5px;

}

/* Hover */

.sidebar-menu .nav-link:hover{

    background:var(--alms-primary-light);

    color:var(--alms-primary) !important;

}

/*-----------------------
    Active
-----------------------*/

/* Leaf links (no children) — full solid active state */
.sidebar-menu .nav-link.active{

    background:var(--alms-primary);

    color:#7B8794 !important;

    box-shadow:0 4px 14px rgba(21,101,192,.22);

}

.sidebar-menu .nav-link.active .nav-icon{

    color:#7B8794;

}

/* Parent/toggle links — only highlight text + icon, no solid fill,
   since these represent "a child is active", not "this is the current page" */
.sidebar-menu .nav-link.active-parent{

    background:transparent;

    color:var(--alms-primary) !important;

    font-weight:600;

    box-shadow:none;

}

.sidebar-menu .nav-link.active-parent .nav-icon{

    color:var(--alms-primary);

}

/*-----------------------
    Icons
-----------------------*/

.sidebar-menu .nav-icon{

    width:18px;

    margin-right:8px;

    color:#7B8794;

    font-size:13px;

}

.sidebar-menu .nav-link.active .nav-icon{

    color:#7B8794;

}

/*-----------------------
    Treeview
-----------------------*/

.nav-treeview{

    margin-left:14px;

    border-left:2px solid #ECEFF1;

    padding-left:6px;

    margin-bottom:2px;

}

.nav-treeview .nav-link{

    min-height:32px;

    font-size:13px;

    padding:5px 10px;

}

/*-----------------------
    Arrow
-----------------------*/

.nav-arrow{

    margin-left:auto;

    font-size:12px;

}

/*-----------------------
    Cards
-----------------------*/

.card{

    border:none;

    border-radius:14px;

    box-shadow:0 3px 12px rgba(0,0,0,.05);

}

.card-header{

    background:#fff;

    border-bottom:1px solid var(--alms-border);

    font-weight:600;

}

/*-----------------------
    Buttons
-----------------------*/

.btn{

    border-radius:10px;

    font-weight:500;

}

.btn-primary{

    background:var(--alms-primary);

    border-color:var(--alms-primary);

}

.btn-primary:hover{

    background:var(--alms-primary-dark);

    border-color:var(--alms-primary-dark);

}

/*-----------------------
    Tables
-----------------------*/

.table{

    color:var(--alms-text);

}

.table thead{

    background:#F8FAFC;

}

.table th{

    font-weight:600;

    border-top:none;

}

/*-----------------------
    Forms
-----------------------*/

.form-control{

    border-radius:10px;

    border:1px solid var(--alms-border);

}

.form-control:focus{

    border-color:var(--alms-primary);

    box-shadow:0 0 0 .15rem rgba(21,101,192,.15);

}

/*-----------------------
    Content
-----------------------*/

.content-wrapper,
.app-content{

    background:var(--alms-bg);

    padding:24px;

}

/*-----------------------
    Footer
-----------------------*/

.app-footer{

    background:#fff;

    border-top:1px solid var(--alms-border);

}

/*-----------------------
    Scrollbar
-----------------------*/

::-webkit-scrollbar{

    width:10px;

}

::-webkit-scrollbar-thumb{

    background:#C9CDD2;

    border-radius:10px;

}

/*-----------------------
    Responsive
-----------------------*/

@media (max-width:991px){

    .app-sidebar{

        width:280px;

    }

    .app-main{

        margin-left:0;

    }

}