﻿/*# sourceMappingURL=custom.min.css.map */

/*xử lý phần loading toàn màn hình và khóa màn hình*/
.loading-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    /* Đảm bảo overlay nằm trên các thành phần khác */
    /* nằm trên modal backdrop */
}

.loading-overlay.fullscreen {
    position: fixed;
}

#ajaxloadingelementid {
    display: none;
}

.overlayall {
    opacity: 1;
    /*background-color:transparent;*/
    background-color: rgba(192, 192, 192, 0.2);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 999999;
}

.overlayall>.fa,
.overlayall>.loader {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -15px;
    margin-top: -15px;
    color: #000;
    font-size: 30px;
}

.loader {
    border: 4px solid #fff;
    border-radius: 50%;
    border-top: 4px solid #3498db;
    width: 48px;
    height: 48px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    position: absolute;
    margin-left: 8px;
    margin-top: 8px;
}

.loader-circle {
    border-radius: 50%;
    background-color: #fff;
    width: 64px;
    height: 64px;
    position: absolute;
    top: 10%;
    left: 50%;
    margin-left: -24px;
}

/*end - xử lý phần loading toàn màn hình và khóa màn hình*/

/*load khu vực card*/
.card>.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.card .overlay {
    z-index: 2000;
    /*50;*/
    background: rgba(255, 255, 255, 0.7);
    border-radius: 3px;
}

.card .overlay>.spinner-grow {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -15px;
    margin-top: -15px;
    color: #000;
    font-size: 30px;
}

.card .overlay.dark {
    background: rgba(0, 0, 0, 0.5);
}

/*end - load khu vực card*/



/*ẩn*/
.hide {
    display: none !important;
}

/*end - ẩn*/

/*//an nut help strong header bang*/
a.header-help {
    display: none;
}

th:hover a.header-help {
    display: inline-block;
}

/*//end an nut help strong header bang*/

/*//an nut help strong header title */
.card-title a.title-help,
label a.label-help {
    display: none;
}

.card-title:hover a.title-help,
label:hover a.label-help {
    display: inline-block;
}

/*//end an nut help strong header title */


/*phần lưới*/
/*loadmore block*/
.row-data-more-button {
    display: block;
}

.no-padding {
    padding: 0px !important;
}

thead>tr>th.has-error,
tbody>tr>th.has-error,
tfoot>tr>th.has-error,
thead>tr>td.has-error,
tbody>tr>td.has-error,
tfoot>tr>td.has-error {
    /*outline-style: solid;
    outline-color: #f06548;
    outline-width: 1px;
    color: #f06548;*/
    border-bottom: 1px solid rgb(221, 75, 57);
}


td:focus {
    outline-style: solid;
    outline-color: #d2d6de;
    outline-width: 1px;
    outline-offset: -0.1rem;
    /*outline: #d2d6de auto 1px;*/
}

td.cell-edit:focus {
    outline-style: solid;
    outline-color: #5b9dd9;
    outline-width: 1px;
    outline-offset: -0.1rem;
    /*outline: #5b9dd9 auto 1px;*/
}

/*hiển thị dạng focus khi ở chế độ edit*/
td.cell-edit.active-edit {
    outline-style: solid;
    outline-color: #5b9dd9;
    outline-width: 1px;
    outline-offset: -0.1rem;
    /*outline: #5b9dd9 auto 1px;*/
}



tr.row-update {
    height: 0;
    position: absolute;
    left: -999999px;
}

tr.row-split {
    border-bottom: 0px solid #dedede;
}

tr.row-split td {
    padding: 0px !important;
    border: none;
}

tr.row-group {
    background-color: #f5f5f5;
}

tr.row-group td {
    font-weight: bold;
}

/*xu li cho grid hien thi nhap lieu*/
.table-display-edit {
    border: none;
}

.table-display-edit>tbody>tr>td,
.table-display-edit>tbody>tr>th {
    /*padding: 0;
        margin: 0;*/
    vertical-align: inherit;
    border: none;
}

.table-display-edit>tbody>tr>td .selectize-input {
    min-height: 34px !important;
    padding: 6px 12px !important;
    margin: 0;
}

.table-display-edit>tbody>tr>td .selectize-control {
    min-height: 34px;
}

tr.row-split-new {
    border-bottom: 0px solid #dedede;
}

.row-split-new>td {
    padding: 0 !important;
    border: none;
}

tr.row-data-new,
tr.row-new-data {
    border-bottom-color: #25a0e2;
    /*border-top: 1px solid #25a0e2;
    border-bottom: 1px solid #25a0e2;*/
}


/*dòng thêm mới*/
tr.row-new,
tr.row-add {
    outline: 1px solid #25a0e2;
    /*border-top-color: #25a0e2;*/
    /*border-bottom-color: #25a0e2;*/
    /*border-top: 1px solid #25a0e2;
    border-bottom: 1px solid #25a0e2;*/
}


/*end-phần lưới*/


/*callout*/

/*.bs-callout {
padding: 20px;
margin: 20px 0;
border: 1px solid #eee;
border-left-width: 5px;
border-radius: 3px;
}*/

.bs-callout {
    padding: 2px;
    margin: 4px 0;
    border: 1px solid #eee;
    border-left-width: 2px;
    border-radius: 1px;
}


*.bs-callout:empty {
    padding: 20px;
    margin: 0px;
    border: none;
}


.bs-callout h4 {
    margin-top: 0;
    margin-bottom: 5px;
}

.bs-callout p:last-child {
    margin-bottom: 0;
}

.bs-callout code {
    border-radius: 3px;
}

.bs-callout+.bs-callout {
    margin-top: -5px;
}

.bs-callout-default {
    border-left-color: #777;
}

.bs-callout-default h4 {
    color: #777;
}

.bs-callout-primary {
    border-left-color: #428bca;
}

.bs-callout-primary h4 {
    color: #428bca;
}

.bs-callout-success {
    border-left-color: #5cb85c;
}

.bs-callout-success h4 {
    color: #5cb85c;
}

.bs-callout-danger {
    border-left-color: #d9534f;
}

.bs-callout-danger h4 {
    color: #d9534f;
}

.bs-callout-warning {
    border-left-color: #f0ad4e;
}

.bs-callout-warning h4 {
    color: #f0ad4e;
}

.bs-callout-info {
    border-left-color: #5bc0de;
}

.bs-callout-info h4 {
    color: #5bc0de;
}

/*end-callout*/


/*phần form*/
.has-success label {
    color: #00a65a;
}

.has-success .form-control,
.has-success .input-group-addon {
    border-color: #00a65a !important;
    card-shadow: none;
}

.has-warning label {
    color: #f39c12;
}

.has-warning .form-control,
.has-warning .input-group-addon {
    border-color: #f39c12 !important;
    card-shadow: none;
}

.has-error label {
    color: #f06548;
}

.has-error .form-control,
.has-error .input-group-addon {
    border-color: #f06548 !important;
    card-shadow: none;
}

/*end-phần form*/


/*không cho select nội dung của label*/
.form-check-label {
    user-select: none;
}

/*end - không cho select nội dung của label*/

/*không hiển thị mũi tên phía dưới*/
.datepicker-dropdown.datepicker-orient-bottom::after,
.datepicker-dropdown.datepicker-orient-bottom::before {
    border-top: none !important;
}

.datepicker-dropdown::after,
.datepicker-dropdown::before {
    content: none;
}

/*end - không hiển thị mũi tên phía dưới*/


/*đánh giá sao cho phép nữa sao*/
/* Ratings widget edit*/
.rating-half-stars {
    display: inline-block;
    border: none;
    color: #ccc;
    margin-top: -4px;
    margin-left: 4px;
}

/* Hide radio */
.rating-half-stars>span {
    display: none;
}

/* Order correctly by floating highest to the right */
.rating-half-stars>label {
    float: right;
    font-weight: normal;
    margin-bottom: 0px;
}

/* The star of the show */
.rating-half-stars>label:before {
    display: inline-block;
    font-size: 20px;
    padding: 0px 0.2rem 0px .2rem;
    /*.3rem .2rem;*/
    margin: 0;
    cursor: pointer;
    font-family: "Material Design Icons";
    content: "\F04CE";
    /*"\f005 "; full star */
}

/* Half star trick */
.rating-half-stars .half:before {
    content: "\F0246";
    /*"\f089 "; half star no outline */
    position: absolute;
    padding-right: 0;
}

/* Click + hover color */
.rating-half-stars>span.selected~label,
/* color current and previous stars on checked */
.rating-half-stars>label:hover,
.rating-half-stars>label:hover~label {
    color: #FF912C;
    /*#FFCC36;*/
}

/* color previous stars on hover */

/* Hover highlights */
.rating-half-stars>span.selected+label:hover,
.rating-half-stars>span.selected~label:hover,
/* highlight current and previous stars */
.rating-half-stars>span.selected~label:hover~label,
/* highlight previous selected stars for new rating */
.rating-half-stars>label:hover~span.selected~label

/* highlight previous selected stars */
    {
    color: #FFCC36;
    /*#FF912C;*/
}

/* Ratings widget view*/
.rating-half-stars-view {
    display: inline-block;
    border: none;
    color: #ccc;
    margin-top: -4px;
    margin-left: 4px;
}

/* Hide radio */
.rating-half-stars-view>span {
    display: none;
}

/* Order correctly by floating highest to the right */
.rating-half-stars-view>label {
    float: right;
    font-weight: normal;
    margin-bottom: 0px;
}

/* The star of the show */
.rating-half-stars-view>label:before {
    display: inline-block;
    font-size: 20px;
    padding: 0px 0.2rem 0px .2rem;
    /*.3rem .2rem;*/
    margin: 0;
    /*cursor: pointer;*/
    font-family: "Material Design Icons";
    content: "\F04CE";
    /*"\f005 "; full star */
}

/* Half star trick */
.rating-half-stars-view .half:before {
    content: "\F0246";
    /*"\f089 "; half star no outline */
    position: absolute;
    padding-right: 0;
}

/* Click + hover color */
.rating-half-stars-view>span.selected~label

/* color current and previous stars on checked */
    {
    color: #FF912C;
    /*#FFCC36;*/
}



/*kết thúc đánh giá sao cho phép nữa sao*/


/* Rating Star Widgets Style */

/* Rating Star Widgets Style */
.rating-stars ul {
    list-style-type: none;
    padding: 0;
    -moz-user-select: none;
    -webkit-user-select: none;
}

.rating-stars ul>li.star {
    display: inline-block;
}

/* Idle State of the stars */
.rating-stars ul>li.star>i.ri-star-fill {
    font-size: 14px;
    /* Change the size of the stars */
    color: #ccc;
    /* Color on idle state */
}

/* Hover state of the stars */
.rating-stars ul>li.star.hover>i.ri-star-fill {
    color: #FFCC36;
}

/* Selected state of the stars */
.rating-stars ul>li.star.selected>i.ri-star-fill {
    color: #FF912C;
}

/* End Rating Star Widgets Style */

/*chỉnh lại vị trí page-title-box khi show strong modal nếu không nó bị tràn*/
.modal .page-title-box {
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: -1px;
}


/*chỉnh lại senvietautocomplete*/
.senvietautocomplete>.active>a,
.senvietautocomplete>.active>a:focus,
.senvietautocomplete>.active>a:hover {
    /*color:#fff;*/
    text-decoration: none;
    background-color: #e9ebec;
    /*#337ab7;*/
    outline: 0;
}

/*end chỉnh lại senvietautocomplete*/


/*chỉnh lại độ mờ background màn hình tài khoản*/
.auth-one-bg .bg-overlay {
    opacity: 0.8;
}

/*end chỉnh lại độ mờ background màn hình tài khoản*/
/*ẩn hiện nút mũi tên lên xuống strong chế độ collapse*/
.not-collapsed.collapsed>.ri-arrow-up-double-line,
.not-collapsed>.ri-arrow-down-double-line {
    display: none;
}

.not-collapsed.collapsed>.ri-arrow-down-double-line {
    display: inline;
}

/*end ẩn hiện nút mũi tên lên xuống strong chế độ collapse*/


/*canh lại thanh resize của jquery-ui nếu không nó sẽ đẩy tạo tạo thanh scroll bar ngang bị ảnh hưởng trong header của table*/
/*.ui-resizable-e {
        margin-right: 7px;
    }*/
.ui-resizable-e {
    width: 4px;
    margin-right: 4px;
    border: 1px solid #f2f2f2;
    border-radius: 4px;
    display: none !important;
}

tr.row-header:hover .ui-resizable-e {
    display: block !important;
}

/*kết thúc canh lại thanh resize của jquery-ui nếu không nó sẽ đẩy tạo tạo thanh scroll bar ngang*/


/*resizable column*/
th.resizable {
    position: relative;
}

th.resizable .resizer {
    position: absolute;
    top: 0;
    right: 0;
    width: 5px;
    height: 100%;
    cursor: col-resize;
    user-select: none;
}

.resizer {
    width: 4px;
    /* margin-right: 4px; */
    border: 1px solid #f2f2f2;
    border-radius: 4px;
    display: none !important;
}

tr.row-header:hover .resizer {
    display: block !important;
}

/*kết thúc resizable column*/

/*ghim tiêu đề bảng*/
/*tr.row-header>th {
  background: #ffffff;
  position: sticky;
  top: 0px;
  z-index:10;
}*/

.table>tbody>tr.row-header,
.table>thead>tr.row-header {
    background: #ffffff;
    /*position: sticky;*/
    top: 1px;
    z-index: 10;
    /*nếu muốn border*/
    outline: 0.1rem solid #e9ebec;
}

.table>tbody>tr.row-header.pin-header,
.table>thead>tr.row-header.pin-header {
    position: sticky;
}

/*ẩn nút pin header*/


/*.table > tbody > tr > th a.header-pin {
    display: none;
}

.table > tbody > tr > th:hover a.header-pin {
    display: inline-block;
}

.table > tbody > tr > th a.header-pin.text-warning {
    display: inline-block;
}*/

/*ghim tiêu đề cột (tứ cột 1 trở về trước)*/
/*.table > tbody > tr > th:nth-child(-n+1){*/
/*position: sticky;
    background-color:white;
    top: 0px;
    left:0px;
    z-index: 9;*/
/*nếu muốn border*/
/*outline: 0.1rem solid #e9ebec;*/
/*}*/
/*.table > tbody > tr > td:nth-child(-n+1) {
    position: sticky;
    background-color:white;
    left: 0px;
    z-index: 9;*/
/*nếu muốn border*/
/*outline: 0.1rem solid #e9ebec;*/
/*}*/

/*chỉnh lại cho phép dropdown đè lên đối tượng td mà có sticky vì stick td khi xét có cùng z-index*/
/*.table > tbody > tr > td:has(.dropdown-menu.show) {
    z-index: 10;
}*/


/*cố định mức tối thiểu chiều rộng cột của bảng loại ngày tháng năm*/
.table>tbody>tr>th.header.datetime {
    min-width: 140px;
}

/*cố định mức tối thiểu chiều rộng cột của bảng loại ngày tháng năm giờ phút*/
.table>tbody>tr>th.header.datetime-g {
    min-width: 150px;
}



/*//lớp bình thường là ẩn chỉ hiện khi rà chuột lại*/
.hower-show {
    display: none;
}

.container-hower-show:hover .hower-show {
    display: inline-block;
}

/*dùng bổ sung thêm cho lịch*/
.fc-daygrid-event-harness:hover .hower-show {
    display: inline-block;
}


/*//end an nut help strong header bang*/
/*định dạng lại fullcalendar bdo bị mất nội dung khi ở chế độ 30 phút*/
/*.fc-event {
  margin: 0px 7px !important;
  padding: 0px 5px !important;
}*/

/*.fc-event-today {
  margin: 0px 7px !important;
  padding: 0px 5px !important;
}*/
.fc-timegrid-event {
    margin: 0px 7px !important;
    padding: 0px 5px !important;
}


/*định dạng làm đẹp scrollbar*/
/*định dạng chữ đầu viết hoa*/
.first-letter-uppercase:first-letter {
    text-transform: uppercase;
}



/*nâng cấp fullscreen grid 20241011*/
/* Fullscreen dialog */
.fullscreen-dialog {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background-color: rgba(0, 0, 0, 0.8) !important;
    /* Nền đen trong suốt */
    z-index: 1039 !important;
    display: flex !important;
    justify-content: center !important;
    /*align-items: center;*/
}

/* Nội dung dialog */
.dialog-content {
    background-color: white !important;
    /*padding: 20px;*/
    /*border-radius: 8px;*/
    padding-left: 24px !important;
    padding-right: 24px !important;
    width: 100vw !important;
    height: 100vh !important;
    max-width: 100vw !important;
    max-height: 100vh !important;
    overflow-y: auto !important;
    position: relative !important;
}

/*kết thúc - nâng cấp fullscreen grid 20241011*/


/*định dạng số canh phải cho đẹp  bao gồm lưới hiển thị edit và form edit*/
/**/
td.numeric,
td.float,
td.decimal,
td.int,
td.smallint,
td.bigint,
th.numeric,
th.float,
th.decimal,
th.int,
th.smallint,
th.bigint,
input.numeric,
input.float,
input.decimal,
input.int,
input.smallint,
input.bigint {
    text-align: right;
}

/*kết thúc định dạng số canh phải cho đẹp*/
/*canh giữa cho trường hợp bit,bool*/
td.bit,
td.bool,
td.boolean,
th.bit,
th.bool,
th.boolean,
td.type-bit,
td.type-bool,
td.type-boolean,
th.type-bit,
th.type-bool,
th.type-boolean {
    text-align: center;
}

/*kết thúc canh giữa cho trường hợp bit,bool*/

/*làm mờ để cho tiệp màu xám*/
.ui-icon,
.ui-widget-content .ui-icon {
    opacity: 0.5;
}

/*bật chế độ cho phép code giãn cột trong bảng*/
/*.table {table-layout:fixed;}*/
/*.table td {*/
/* Ngăn chặn chọn văn bản (bật lên sẽ không thể copy dán được)*/
/*user-select: none;*/

/*pointer-events: none;*/
/* Vô hiệu hóa click chuột */
/*}*/

.dragging table tbody tr.row-data,
.drag-scroll-active table {
    /* Ngăn chặn chọn văn bản*/
    user-select: none;
    /*pointer-events: none;*/
    /* Vô hiệu hóa click chuột */
}

/*nếu bảng không có kẻ dòng thì ẩn focus luôn*/
.table-borderless td:focus {
    outline-width: 0px !important;
}

/*đẩy thông báo lên stop đè tất cả (nếu không sẽ bị nằm dưới offcanvas hoặc modal)*/
.swal2-container {
    z-index: 8000 !important;
}

/*ẩn nút tìm menu khi chế độ mobile vì trên mobile không biết bị gì mà khi click vào o tìm kiếm thì nó lại ẩn cả thanh sidebar. nghi là khi mở bàn phím ảo lên nó xung đột gì đó*/
/*html[data-sidebar-size="sm"] .search-menu-container,.twocolumn-panel .search-menu-container {
    display:none!important;
}*/




/* Kéo thả đổi vị trí cột */
.th-draggable {
    cursor: grab
}

.th-dragging {
    opacity: .6;
    cursor: grabbing;
    /* background: #ffe69c !important; */
    border: #e3e6ed 1px solid !important;
}

/* .drop-indicator {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #0d6efd;
  opacity: .8;
  z-index: 3;
  display: none;
} */

.drop-target-highlight::before {
    content: "";
    position: absolute;
    left: -2px;
    top: 1px;
    bottom: 1px;
    width: 4px;
    border-radius: 4px;
    background: #1f88c0;
}

table>tbody.row-new-datas>tr:last-child {
    border-block-end: 1px solid #cbd0dd;
}

/* Cột tay cầm kéo */
.drag-cell {
    width: 44px;
    padding: 0.25rem 0.5rem;
}

/* Nút 3 chấm chỉ hiện khi hover dòng */
.drag-handle {
    opacity: 0;
    transition: opacity .15s ease-in-out, transform .1s ease-in-out;
    cursor: grab;
    /* border-radius: 9999px; */
    position: absolute;
    left: 16px;
}

tr:hover .drag-handle {
    opacity: 1;
}

.drag-handle:active {
    cursor: grabbing;
    transform: scale(0.95);
}

/* Trong lúc đang kéo, làm mờ dòng để dễ nhìn */
tr.dragging {
    opacity: .6;
}

/* Gợi ý vị trí chèn (drop indicator) */
tbody tr.drop-before {
    box-shadow: 0 -2px 0 0 var(--bs-primary) inset;
}

tbody tr.drop-after {
    box-shadow: 0 2px 0 0 var(--bs-primary) inset;
}

/* //tắt chế độ select của tr header của th khi kéo thả */
thead>tr.row-header th {
    user-select: none;
}

/* Kết thúc kéo thả đổi vị trí cột */

/*chỉnh lại độ rộng tối thiểu của dropdown choices*/
/* .choices__list--dropdown {
    min-width: 300px !important;
} */


/* Cấu trúc chung cho callout */
.callout {
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    border-left: 4px solid;
    border-radius: 0.25rem;
    background-color: var(--bs-callout-bg, #f8f9fa);
    color: var(--bs-callout-color, inherit);
    border-left-color: var(--bs-callout-border, #ccc);
}

.callout-primary {
    --bs-callout-bg: var(--bs-primary-bg-subtle, #e7f1ff);
    --bs-callout-border: var(--bs-primary, #0d6efd);
    --bs-callout-color: var(--bs-primary, #0d6efd);
}

.callout-success {
    --bs-callout-bg: var(--bs-success-bg-subtle, #e6f4ea);
    --bs-callout-border: var(--bs-success, #198754);
    --bs-callout-color: var(--bs-success, #198754);
}

.callout-danger {
    --bs-callout-bg: var(--bs-danger-bg-subtle, #fcebea);
    --bs-callout-border: var(--bs-danger, #dc3545);
    --bs-callout-color: var(--bs-danger, #dc3545);
}

.callout-warning {
    --bs-callout-bg: var(--bs-warning-bg-subtle, #fff8e5);
    --bs-callout-border: var(--bs-warning, #ffc107);
    --bs-callout-color: var(--bs-warning, #d39e00);
}

.callout-info {
    --bs-callout-bg: var(--bs-info-bg-subtle, #e7faff);
    --bs-callout-border: var(--bs-info, #0dcaf0);
    --bs-callout-color: var(--bs-info, #0dcaf0);
}

.callout-light {
    --bs-callout-bg: var(--bs-light, #f8f9fa);
    --bs-callout-border: var(--bs-gray-400, #dee2e6);
    --bs-callout-color: var(--bs-gray-800, #343a40);
}

.callout-dark {
    --bs-callout-bg: var(--bs-gray-800, #343a40);
    --bs-callout-border: var(--bs-dark, #212529);
    --bs-callout-color: var(--bs-light, #f8f9fa);
}


/* Kết thúc cấu trúc chung cho callout */

/* canh lề kiểu dữ liệu cho cột */
th.type-number,
td.type-number,
th.type-int,
td.type-int,
th.type-decimal,
td.type-decimal {
    text-align: right;
}

th.type-integer,
td.type-integer {
    text-align: right;
}

/* định dạng dòng đã chọn trong bảng */
/* td.selected {
    background-color: #cce5ff !important;
} */

/* border vùng chọn giống Excel */
td.sel-top {
    border-top: 2px solid #5b9dd9;
}

td.sel-bottom {
    border-bottom: 2px solid #5b9dd9;
}

td.sel-left {
    border-left: 2px solid #5b9dd9;
}

td.sel-right {
    border-right: 2px solid #5b9dd9;
}

/* chỉnh cột đâu tiên của bảng dạng thẻ cho đẹp hơn */
.table-card td:first-child,
.table-card th:first-child {
    padding-right: 4px;
}

/* phần toast thông báo*/
/* ===== CONTAINER ===== */
.sen-toast-container {

    position: fixed;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    /* pointer-events: none; */
    /* z-index: 9999; */
    z-index: 2147483647;
    width: auto !important;
}

/* Top */
.sen-toast-container.top {
    top: 16px;
    flex-direction: column-reverse;
}

/* Bottom */
.sen-toast-container.bottom {
    bottom: 16px;
    flex-direction: column;
}


/* ===== TOAST ===== */
.sen-toast {
    padding: 12px 20px;
    color: #ffffff;
    box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(77, 96, 232, 0.3);
    background: -webkit-linear-gradient(315deg, #73a5ff, #5477f5);
    background: linear-gradient(135deg, #73a5ff, #5477f5);
    border-radius: 2px;
    cursor: pointer;
    text-decoration: none;
    /* transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); */
    max-width: calc(50% - 20px);

    /* background: #0f3443; */
    /* border-radius: 6px; */
    /* font-size: 14px; */
    /* box-shadow: 0 6px 16px rgba(0, 0, 0, .25); */
    /* max-width: 80%; */
    white-space: nowrap;
    /* cursor: pointer; */
    /* pointer-events: auto; */

    animation-duration: .35s;
    animation-fill-mode: both;
}

.sen-toast.success {
    background: #00bd9d;
}

.sen-toast.danger {
    background: #f06548;
}


/* ===== TOASTIFY-LIKE KEYFRAMES ===== */

/* slide from top */
@keyframes toast-slide-down {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* slide from bottom */
@keyframes toast-slide-up {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* hide */
@keyframes toast-hide {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 0;
        transform: translateY(10px);
    }
}

/* ===== APPLY ANIMATION ===== */
.sen-toast-container.top .sen-toast.show {
    animation-name: toast-slide-down;
}

.sen-toast-container.bottom .sen-toast.show {
    animation-name: toast-slide-up;
}

.sen-toast.hide {
    animation-name: toast-hide;
}


.is-invalid~.input-group-addon,
.is-invalid~.input-group-text {
    border-color: #f06548 !important;
    /*card-shadow: none;*/
}

.toastify {
    display: flex;
    align-items: flex-start;
    gap: 4px;
}

.toast-close {
    float: none !important;
    margin-left: auto;
    align-self: flex-start;
}

/* ẩn hiển nút collapse khi hover */
.collapse.show .collapse-hide {
  opacity: 0;
  transition: opacity 0.2s ease;
}

.collapse.show:hover .collapse-hide {
  opacity: 1;
}