﻿
.left-sidebar {
    background: #8A8B4F !important;
}

.sidebar-nav ul li a {
    color: #fff;
}

.sidebar-nav > ul > li > a i {
    color: #fff;
}

.sidebar-nav .has-arrow::after {
    color: #fff;
    border-color: #fff;
}

.sidebar-nav ul li.nav-small-cap {
    color: #fff;
}

.topbar .navbar-header {
    background: #8A8B4F !important;
}

.topbar .navbar-collapse {
    background: #fcb13a !important;
}

.topbar {
    background: #fcb13a !important;
}

    .topbar .top-navbar .navbar-header {
        line-height: 66px;
    }

    .topbar .navbar-collapse {
        margin-left: 220px;
    }

@media (min-width: 768px) {
    .mini-sidebar .topbar .navbar-collapse {
        margin-left: 70px;
    }
}

@media (max-width: 767px) {
    .mini-sidebar .topbar .navbar-collapse {
        margin-left: 0px;
    }
}

.btn-reset-passwowrd {
    background-color: #8A8B4F;
}

.btn-info1 {
    background-color: #8A8B4F;
    border-color: #8A8B4F;
}

.btn-red, .btn-primary {
    background-color: #b30914;
    border-color: #b30914;
    color: #fff;
}

.user-profile img {
    width: 60px;
    height: 60px;
    display: block;
}

.user-profile .d-flex {
    display: flex !important;
}

.topbar .top-navbar .profile-pic img {
    height: 30px;
}

.left-sidebar {
    z-index: 55;
    padding-top: 20px;
}

@media (min-width: 768px) {
    .navbar-header {
        width: 220px;
        flex-shrink: 0;
    }
}

@media (min-width: 1024px) {
    .footer, .page-wrapper {
        margin-left: 220px;
    }
}

.btn-info {
    background-color: #b30914;
    border-color: #b30914;
}

.btn-info:hover {
    background-color: #b30914;
    border-color: #b30914;
}


.box-error > ul > li {
    list-style: none;
    color: #e46a76;
    float: left;
    margin-bottom: 12px;
}

.box-error {
    width: 100%;
    text-align: center;
    flex: 0 0 80%;
    max-width: 90%;
    /*margin-left: 10%;*/
}

    .box-error > ul {
        padding-top: 15px;
        padding-left: 0px;
    }

.field-validation-error{
    float: left;
}

@media (max-width: 575px) {
    .box-error > ul {
        padding-top: 15px;
        width: 100%;
        padding-left: 0;
    }
}

.fa-trash-alt {
    color: #b30914;
}

.input-group-text{
    height:100%;
}

#main-list .table-responsive {
    position: relative;
}

    #main-list #main1-table_filter{
        margin-right: 30px;
        max-width: 250px;
        position: absolute;
        right: 0px;
    }

    #main-list #main-table {
        width: 100% !important;
    }

.table th, .table thead th {
    background-color: #00c292 !important;
    color: #fff;
}

@media (max-width: 768px) {
    #main-list .table-responsive table {
        display: block;
        width: 100%;
        overflow-x: auto;
        -ms-overflow-style: -ms-autohiding-scrollbar !important;
    }

    #main-list #main1-table_filter {
        padding-right: 30px;
        max-width: 250px;
        position: relative;
        margin-left: 15px;
    }
}

    /* CSS cho page-titles */
    .page-titles {
        display: flex;
        justify-content: space-between; /* Đẩy các phần tử sang hai bên */
        align-items: center; /* Căn giữa theo chiều dọc */
    }

    .page-titles .title{
        font-size: 18px;
    }

        .page-titles .btn {
            margin-left: auto; /* Đẩy button sang bên phải */
        }

        /* CSS cho các button trong page-titles */
        .page-titles .btn {
            width: 100%; /* Đảm bảo button chiếm toàn bộ chiều rộng của thẻ div cha */
            max-width: 110px; /* Giới hạn kích thước tối đa của button */
            padding: 10px; /* Điều chỉnh padding để button không quá to */
        }

    /* Media query cho màn hình nhỏ */
    @media (max-width: 768px) {
        .page-titles .btn {
            padding: 8px; /* Giảm padding trên màn hình nhỏ */
        }
    }