/* hiệu chỉnh css mới */

table.dataTable tbody tr {
    /*font-family: Helvetica, Arial, sans-serif;*/
    /*font-family: Arial, sans-serif;*/
    font-family: "Roboto", sans-serif;
    color: rgba(0, 0, 0, .7);
}


/* Set font family to Arial for the entire HTML document */

body {
    /*font-family: "Times New Roman", Times, serif;*/
    /*font-family: "Roboto", sans-serif;*/
}

table.dataTable td i {
    font-size: 17px;
    /* Đổi 20px thành kích thước mong muốn của bạn */
}

table.dataTable td i {
    transition: transform 0.3s ease-in-out;
}


/* Khi rê chuột vào, phóng to biểu tượng lên 2px */

table.dataTable td i:hover {
    transform: scale(1.1);
}


/* NPT */

body {
    /*font-family: "Times New Roman", Times, serif;*/
    color: #524e5f 0;
}

table.dataTable tbody tr {
    /*font-family: Helvetica, Arial, sans-serif;*/
    /*font-family: Arial, sans-serif;*/
    /*font-family: "Roboto", sans-serif;*/
    color: #524e5f 0;
}

.panel {
    /*font-family: Helvetica, Arial, sans-serif;*/
    /*font-family: Arial, sans-serif;*/
    /*font-family: "Roboto", sans-serif;*/
    color: #524e5f 0;
}

.bg-gradient-9 {
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…IgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    background: -moz-linear-gradient(-65deg, #061799 0, #221975 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, #008fe2), color-stop(100%, #00b29c));
    background: -webkit-linear-gradient(-65deg, #061799 0, #221975 100%);
    background: -o-linear-gradient(-65deg, #061799 0, #221975 100%);
    background: -ms-linear-gradient(-65deg, #061799 0, #221975 100%);
    background: linear-gradient(154deg, #061799 0, #221975 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#008fe2', endColorstr='#00b29c', GradientType=1);
}

.bg-gradient-9 {
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…IgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    background: -moz-linear-gradient(-65deg, #100574 0, #132399 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, #008fe2), color-stop(100%, #00b29c));
    background: -webkit-linear-gradient(-65deg, #100574 0, #132399 100%);
    background: -o-linear-gradient(-65deg, #100574 0, #132399 100%);
    background: -ms-linear-gradient(-65deg, #100574 0, #132399 100%);
    background: linear-gradient(154deg, #100574 0, #132399 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#008fe2', endColorstr='#00b29c', GradientType=1);
}

#sidebar-menu {
    font-family: 'Open Sans';
    font-style: normal;
}


/*
.bg-gradient-9 {
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…IgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    background: -moz-linear-gradient(-65deg, #ee0d18 0, #c02929 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, #008fe2), color-stop(100%, #00b29c));
    background: -webkit-linear-gradient(-65deg, #ee0d18 0, #c02929 100%);
    background: -o-linear-gradient(-65deg, #ee0d18 0, #c02929 100%);
    background: -ms-linear-gradient(-65deg, #ee0d18 0, #c02929 100%);
    background: linear-gradient(154deg, #ee0d18 0, #c02929 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#008fe2', endColorstr='#00b29c', GradientType=1);
}
/*

/* Chỉnh sửa giao diện ngày 21/11/2024  10:23 */

#sidebar-menu>li {
    color: #000000;
    font-size: 12px;
}

#sidebar-menu>li>a {
    padding: 0 10px 0 0;
    border-radius: 3px;
    font-size: 12px;
    border: transparent solid 1px;
    line-height: 35px;
    height: 36px;
    color: #000000;
}

#page-sidebar ul li a .glyph-icon {
    color: #000000;
}

#page-sidebar ul li.sfHover>a.sf-with-ul,
#page-sidebar ul li a:hover {
    border-color: #181484;
    background-color: #181484;
    border-radius: 10px;
    text-decoration: none;
    color: #fff;
}

#page-sidebar ul li.sfHover>a.sf-with-ul .glyph-icon,
#page-sidebar ul li a:hover .glyph-icon {
    color: #fff;
}

#sidebar-menu li .sidebar-submenu {
    border-color: #fff;
}

#sidebar-menu li .sidebar-submenu ul li {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    margin: 0;
}

#sidebar-menu li .sidebar-submenu ul li a {
    /* color: #0a98e5; */
    color: #181484;
}

#sidebar-menu li .sidebar-submenu ul li a:hover {
    border-color: #0a98e5;
    background-color: #0a98e5;
    border-radius: 10px;
    text-decoration: none;
    color: #fff;
    /* color:  #181484; */
}

#page-sidebar ul li a .glyph-icon:hover {
    color: #fff;
}

#page-header .user-account-btn {
    float: left;
    margin: 12px 0 0;
}

#header-logo,
#page-header {
    height: 51px;
}

#header-nav-right {
    float: right;
    margin: 11px 20px 0 0;
}

#header-nav-right .header-btn,
#header-nav-right .dropdown>a {
    border: transparent solid 2px;
    border-radius: 4px;
    width: 35px;
    height: 35px;
    line-height: 33px;
    display: block;
    text-align: center;
    position: relative;
}

#mobile-navigation {
    height: 51px;
}

#mobile-navigation #nav-toggle {
    height: 51px;
}

#nav-toggle span,
#nav-toggle span:before,
#nav-toggle span:after {
    height: 4px;
}


/* CHỈNH SỬA GIAO DIỆN NGÀY 03/01/2025 --> HIỆU CHỈNH TABLE VÀ CÁC NÚT */

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
:root {
    /*--button-color: #3AAFE2;
     --main-color: #005FAF;
     --anthor-color: #007DC3;*/
    --button-color: #49BAB8;
    --main-color: #49BAB8;
    --anthor-color: #49BAB8;
    --background: rgb(7, 10, 15);
}

* {
    margin: 0;
    padding: 0;
}

body {
    font-family: 'Nunito', sans-serif;
}

#page-content,
#sb-site {
    background-color: var( --background);
}

h1 {
    font-weight: 500;
    line-height: 27px;
    padding-top: 30px;
    color: var(--main-color);
}

.title-content {
    display: block;
    font-size: 14px;
    line-height: 19px;
    font-weight: 300;
    padding: 23px 0px 17px 0px;
}

.title-content i {
    display: inline-block;
    padding: 0px 10px;
}


/* search-bar */

.searchBar {
    display: flex;
    position: relative;
    margin-bottom: 13px;
}

.searchBar-search {
    display: flex;
    max-width: 1200px;
    width: 100%;
    height: 35px;
    position: relative;
}

.searchBar-input {
    flex-grow: 1;
    /* Lấp đầy khoảng chống*/
    padding: 10px 10px 10px 40px;
    border: 1px solid #ccc;
    border-radius: 25px;
    box-sizing: border-box;
    align-items: center;
}

.searchBar-search i {
    box-sizing: border-box;
    padding: 0px 5px;
    position: absolute;
    left: 10px;
    /* Vị trí icon cách mép trái */
    top: 50%;
    transform: translateY(-50%);
    /* Căn giữa theo chiều dọc */
    border-right: 1px solid #ccc;
    color: #888;
    /* Màu sắc icon */
    pointer-events: none;
    /* Đảm bảo icon không ảnh hưởng tới thao tác người dùng */
    font-size: 16px;
    /* Điều chỉnh kích thước icon */
}

.searchBar-btn {
    display: flex;
    margin-left: 25px;
}

.searchBar-btn-add {
    background-color: var(--button-color);
    color: white;
    height: 35px;
    width: 80px;
    border-radius: 25px;
    border: none;
    text-align: center;
}

.searchBar-input:focus {
    border: 1px solid var(--anthor-color);
    outline: none;
}

.searchBar-btn-add:hover {
    color: var(--anthor-color);
}


/* end */


/* table */

.tableMain {
    margin-top: 15px;
}

#dataTable thead tr th,
#tabledoituong_QLTN thead tr th {
    background-color: var(--main-color);
    /* Change background color */
    color: white;
    /* Change text color */
}

.NhapMain,
#cbo_TypeTNMain {
    background-color: #F3F3F8;
    border-radius: 15px;
}

.btn-XacNhan,
.btn-primary {
    background-color: var(--button-color);
}

textarea {
    min-height: 100px;
    resize: none;
}

table.dataTable tbody>tr.selected_tr,
table.dataTable tbody>tr>.selected_tr {
    background-color: var(--button-color);
}

.selectedrow>td {
    background-color: var(--button-color);
}

.pagination>.active>a {
    background-color: var(--button-color) !important;
}

#dataTable thead tr th {
    background-color: var(--main-color);
    color: white;
}

.dataTable thead tr th {
    background-color: var(--main-color);
    color: white;
}


/* BỔ SUNG CSS 27/12/2024 */


/* search-bar */

.searchBar {
    display: flex;
    position: relative;
    margin-bottom: 13px;
}

.searchBar-search {
    display: flex;
    max-width: 1200px;
    width: 100%;
    height: 35px;
    position: relative;
}

.searchBar-input {
    flex-grow: 1;
    /* Lấp đầy khoảng chống*/
    padding: 10px 10px 10px 40px;
    border: 1px solid #ccc;
    border-radius: 25px;
    box-sizing: border-box;
    align-items: center;
}

.searchBar-search i {
    box-sizing: border-box;
    padding: 0px 5px;
    position: absolute;
    left: 10px;
    /* Vị trí icon cách mép trái */
    top: 50%;
    transform: translateY(-50%);
    /* Căn giữa theo chiều dọc */
    border-right: 1px solid #ccc;
    color: #888;
    /* Màu sắc icon */
    pointer-events: none;
    /* Đảm bảo icon không ảnh hưởng tới thao tác người dùng */
    font-size: 16px;
    /* Điều chỉnh kích thước icon */
}

.searchBar-btn {
    display: flex;
    margin-left: 25px;
}

.searchBar-btn-add {
    background-color: var(--button-color);
    color: white;
    height: 35px;
    width: 80px;
    border-radius: 25px;
    border: none;
    text-align: center;
}

.searchBar-input:focus {
    border: 1px solid var(--anthor-color);
    outline: none;
}

.searchBar-btn-add:hover {
    color: var(--anthor-color);
}


/* end */


/* table */

.tableMain {
    margin-top: 15px;
}

#dataTable thead tr th {
    background-color: var(--main-color);
    /* Change background color */
    color: white;
    /* Change text color */
}

.NhapMain,
#cbo_TypeTNMain {
    background-color: #F3F3F8;
    border-radius: 15px;
}

.btn-XacNhan {
    background-color: var(--button-color);
}

textarea {
    min-height: 100px;
    resize: none;
}

table {
    font-size: 12px;
}


/* Style cho label ban đầu */

.form-group-material {
    position: relative;
    margin: 1rem 0;
}

.form-group-material input,
.form-group-material textarea {
    width: 100%;
    border: none;
    border-bottom: 1px solid #ccc;
    outline: none;
    font-size: 16px;
    padding: 8px 0;
    background: transparent;
}

.form-group-material label {
    position: absolute;
    top: 8px;
    left: 5px;
    font-size: 16px;
    color: #aaa;
    pointer-events: none;
    /* cho phép click vào input mà label không che phủ */
    transition: 0.2s ease all;
}

.form-group-material input:focus,
.form-group-material textarea:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
}


/* Khi input được focus hoặc có giá trị (nhờ placeholder rỗng) */

.form-group-material input:focus~label,
.form-group-material input:not(:placeholder-shown)~label,
.form-group-material textarea:focus~label,
.form-group-material textarea:not(:placeholder-shown)~label {
    top: -10px;
    font-size: 12px;
    color: #303973;
    /* màu sắc khi active, bạn có thể thay đổi theo ý thích */
    background-color: #fff;
    z-index: 999;
    /*font-weight: normal;
     đảm bảo label không bị in đậm */
}

.form-group-material input,
.form-group-material select,
.form-group-material textarea {
    width: 100%;
    padding: 8px;
    box-sizing: border-box;
    border: 1px solid #ddd;
    border-radius: 5px;
}