/* CSS Document */
/* ==========================================
   ATTITUDE PVT LTD THEME
   ========================================== */

:root{
    --att-blue:#1E3A8A;
    --att-blue-light:#2948A6;
    --att-orange:#F47C20;
    --att-gold:#F5A623;
    --att-dark:#1f2937;
    --att-light:#f8fafc;
}

/* Navbar */
.main-header.navbar{
    background: var(--att-blue) !important;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.main-header .nav-link{
    color:#fff !important;
}

.main-header .nav-link:hover{
    color:var(--att-gold) !important;
}

/* Sidebar */
.main-sidebar{
    background: linear-gradient(
        180deg,
        #152b66 0%,
        #1E3A8A 50%,
        #14224e 100%
    ) !important;
}

.brand-link{
    background:rgba(0,0,0,.15);
    border-bottom:1px solid rgba(255,255,255,.08);
}

.brand-text{
    color:#fff !important;
    font-weight:600;
}

/* Sidebar menu */
.nav-sidebar .nav-item>.nav-link{
    color:#dbe4ff !important;
    border-radius:8px 0 0  8px;
    
    margin:2px 8px;
}

.nav-sidebar .nav-item>.nav-link:hover{
    background:rgba(244,124,32,.15) !important;
    color:#fff !important;
}

.nav-sidebar .nav-item>.nav-link.active{
    background:var(--att-orange) !important;
    color:#fff !important;
    box-shadow:0 3px 10px rgba(244,124,32,.3);
}

.nav-sidebar .nav-treeview>.nav-item>.nav-link.active{
    background:rgba(244,124,32,.15) !important;
    color:var(--att-orange) !important;
}

/* Submenus */
.nav-treeview{
    background:rgba(0,0,0,.15);
    border-radius:8px;
    margin:4px 8px;
}

.nav-treeview .nav-link{
    color:#d6defa !important;
}

.nav-treeview .nav-link:hover{
    color:#fff !important;
}

/* Cards */
.card{
    border:none;
    border-radius:12px;
    box-shadow:0 4px 20px rgba(0,0,0,.08);
}

.card-primary .card-header{
    background:var(--att-blue) !important;
    color:#fff !important;
}

.card-outline.card-primary{
    border-top:3px solid var(--att-orange) !important;
}

/* Buttons */
.btn-primary{
    background:var(--att-orange) !important;
    border-color:var(--att-orange) !important;
}

.btn-primary:hover{
    background:#dd6b12 !important;
    border-color:#dd6b12 !important;
}

.btn-success{
    background:var(--att-blue) !important;
    border-color:var(--att-blue) !important;
}

/* Links */
a{
    color:var(--att-blue);
}

a:hover{
    color:var(--att-orange);
}

/* Tables */
.table thead th{
    background:var(--att-blue);
    color:#fff;
    border:none;
}

.table-hover tbody tr:hover{
    background:rgba(244,124,32,.05);
}

/* Form controls */
.form-control:focus,
.custom-select:focus,
.select2-container--default.select2-container--focus .select2-selection--single{
    border-color:var(--att-orange) !important;
    box-shadow:0 0 0 .2rem rgba(244,124,32,.15) !important;
}

/* Badges */
.badge-primary{
    background:var(--att-orange);
}

.badge-success{
    background:var(--att-blue);
}

/* Dashboard small boxes */
.small-box.bg-info{
    background:var(--att-blue) !important;
}

.small-box.bg-success{
    background:var(--att-orange) !important;
}

.small-box.bg-warning{
    background:var(--att-gold) !important;
}

.small-box.bg-danger{
    background:#dc3545 !important;
}

/* Footer */
.main-footer{
    border-top:2px solid var(--att-orange);
}

/* Active page indicator */
.nav-sidebar .nav-item.menu-open>.nav-link{
    background:rgba(244,124,32,.15) !important;
    color:#fff !important;
}


/* ====================================
   ATTITUDE LOGIN PAGE THEME
   ==================================== */

.login-page{
    background: linear-gradient(
        135deg,
        #14224e 0%,
        #1E3A8A 50%,
        #2948A6 100%
    ) !important;
}

/* floating glow */
.login-page:before{
    content:'';
    position:fixed;
    width:500px;
    height:500px;
    background:rgba(244,124,32,.15);
    border-radius:50%;
    top:-150px;
    right:-150px;
    filter:blur(100px);
    z-index:0;
}

.login-page:after{
    content:'';
    position:fixed;
    width:500px;
    height:500px;
    background:rgba(255,255,255,.05);
    border-radius:50%;
    bottom:-150px;
    left:-150px;
    filter:blur(100px);
    z-index:0;
}

/* login box */
.login-box{
    position:relative;
    z-index:10;
}

.card{
    border:none !important;
    border-radius:20px !important;
    overflow:hidden;
    background:#ffffff;
    box-shadow:
        0 20px 50px rgba(0,0,0,.25),
        0 0 0 2px rgba(244,124,32,.2);
}

/* logo area */
.card-header{
/*    background:#fff !important;*/
    border-bottom:3px solid #F47C20 !important;
/*    padding:30px 20px !important;*/
}

.card-header img{
    max-height:120px;
}

/* sign in text */
.login-card-body p{
    color:#1E3A8A;
    font-size:18px;
    font-weight:600;
    margin-bottom:25px;
}

/* inputs */
.input-group .form-control{
    height:48px;
    border:2px solid #d7def0;
    border-right:none;
    border-radius:10px 0 0 10px;
}

.input-group-text{
    background:#f3f6ff;
    border:2px solid #d7def0;
    border-left:none;
    color:#1E3A8A;
    border-radius:0 10px 10px 0;
}

.form-control:focus{
    border-color:#F47C20 !important;
    box-shadow:0 0 0 .2rem rgba(244,124,32,.15);
}

/* login button */
.btn-primary{
    background:linear-gradient(
        135deg,
        #F47C20,
        #F5A623
    ) !important;

    border:none !important;
    color:#fff !important;

    font-weight:600;
    border-radius:10px;
    padding:12px 30px;
    transition:.3s;
}

.btn-primary:hover{
    transform:translateY(-2px);
    box-shadow:0 8px 20px rgba(244,124,32,.35);
}

/* checkbox */
.icheck-primary input:checked~label::before{
    background:#F47C20 !important;
    border-color:#F47C20 !important;
}

/* footer links */
.login-card-body a{
    color:#1E3A8A;
}

.login-card-body a:hover{
    color:#F47C20;
}

/* mobile */
@media(max-width:576px){

    .login-box{
        width:95%;
        margin:auto;
    }

    .card-header img{
        max-height:90px;
    }
}