:root {
  --secondary: #64748b;
  --secondary-hover: #475569;
  --secondary-rgb: 100, 116, 139;
  --secondary-transparent: #f1f5f9;
}
:root[data-bs-theme=dark] {
  --secondary-transparent: #1e2329;
}
.btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
  color: var(--secondary);
  background-color: transparent;
  border-color: var(--secondary);
  opacity: .45;
}
.auth-logo img {
    max-width: 134px; 
}
.sidebar-logo .logo img {
    width: 98px;
    height: auto;
}
.sidebar-logo .logo-small img {
    width: 34px;
    height: 34px;
}
.text-bg-pink { color: #b02a63 !important; background-color: rgba(214, 51, 132, .12) !important; }
.text-bg-purple { color: #59359a !important; background-color: rgba(111, 66, 193, .12) !important; }
.text-bg-orange { color: #a35200 !important; background-color: rgba(253, 126, 20, .14) !important; }
.sidebar-menu li.submenu > a .menu-arrow::before {
    transition: transform .18s ease;
}
.sidebar-menu li.submenu > a.subdrop .menu-arrow::before {
    transform: translateY(-50%) rotate(180deg);
}
.badge.bg-light {
    color: #495057 !important;
    border: 1px solid #dee2e6;
}
.modal.fade,
.modal.fade .modal-dialog,
.modal-backdrop.fade {
    transition: none;
}
.modal-backdrop {
    backdrop-filter: none;
}
.tab-content > .tab-pane.fade {
    transition: none;
}
.nav-pills .nav-link.active {
    border-color: #d6d9df !important;
}
.nav-tabs.nav-bordered .nav-item .nav-link.active {
    background-color: transparent;
}
*:not(html):not(body)::-webkit-scrollbar { width: 6px; height: 6px; }
*:not(html):not(body)::-webkit-scrollbar-track { background: transparent; }
*:not(html):not(body)::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, .25); border-radius: 3px; }
*:not(html):not(body)::-webkit-scrollbar-thumb:hover { background: rgba(0, 0, 0, .45); }
*:not(html):not(body)::-webkit-scrollbar-corner { background: transparent; }
*:not(html):not(body) { scrollbar-width: thin; scrollbar-color: rgba(0, 0, 0, .25) transparent; }
.page-head { min-height: 26px; }
.navbar-header .page-title-wrap { padding-top: 2px !important; padding-bottom: 2px !important; }
.navbar-header { min-height: 57px; }
.page-head > h5 { display: flex; align-items: center; gap: .5rem; width: 100%; line-height: 1.25; min-width: 0; }
.page-head > h5 .float-end { float: none !important; margin-left: auto; display: inline-flex; align-items: center; gap: .35rem; }
.page-head > h5 .btn { --bs-btn-padding-y: .25rem; --bs-btn-font-size: .8125rem; }
.page-title-wrap { position: relative; }
.page-head > h5 .float-end { position: absolute; right: 1.25rem; top: 50%; transform: translateY(-50%); margin: 0; }
.page-head > h5:has(.float-end) { padding-right: 22rem; }
.page-head > h5 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.field-hint {
    cursor: help;
    opacity: .55;
    margin-left: 2px;
    font-size: 13px;
    vertical-align: -1px;
}
.field-hint:hover {
    opacity: 1;
}
.tooltip-hint .tooltip-inner {
    max-width: 320px;
    text-align: left;
}
.tooltip-title .tooltip-inner {
    max-width: 360px;
    white-space: pre-line;
    text-align: left;
}
.hscroll-hover {
    overflow-x: auto;
    scrollbar-width: thin;                  
    scrollbar-color: transparent transparent;
}
.hscroll-hover:hover {
    scrollbar-color: #c7ccd1 transparent;
}
.hscroll-hover::-webkit-scrollbar {
    height: 8px;
    -webkit-appearance: none;               
}
.hscroll-hover::-webkit-scrollbar-track {
    background: transparent;
}
.hscroll-hover::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 4px;
}
.hscroll-hover:hover::-webkit-scrollbar-thumb {
    background: #c7ccd1;
}
.hscroll-hover:hover::-webkit-scrollbar-thumb:hover {
    background: #a9b0b7;
}
.cham-song { display:inline-block; width:8px; height:8px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 3px rgba(34,197,94,.2); vertical-align:middle; flex-shrink:0; }
.cham-song.tat { background:#9ca3af; box-shadow:none; }
.badge:has(> .cham-song) { display:inline-flex; align-items:center; }
.cham-song { position:relative; top:1px; }
@keyframes hieu-ung-nhay { 0%,100% { opacity:1 } 50% { opacity:.3 } }
.nhay-3-lan { animation: hieu-ung-nhay .6s ease-in-out 3; }
.loe-mot-lan { box-shadow:0 0 0 2px #86efac !important; background-color:#f0fdf4 !important; transition:box-shadow .4s, background-color .4s; }
@keyframes cham-song-nhip { 0% { box-shadow:0 0 0 0 rgba(34,197,94,.55) } 100% { box-shadow:0 0 0 7px rgba(34,197,94,0) } }
.cham-song.nhip { animation: cham-song-nhip .6s ease-out 1; }
@media (prefers-reduced-motion: reduce) { .nhay-3-lan { animation:none; } .loe-mot-lan { transition:none; } .cham-song.nhip { animation:none; } }
.sua-tai-cho-hop { display: inline-flex; align-items: center; gap: 4px; min-width: 0; max-width: 100%; vertical-align: middle; }
.sua-tai-cho-hop > input { flex: 0 1 auto; width: auto !important; min-width: 3ch; max-width: 100%; field-sizing: content; }
.sua-tai-cho-hop > input, .sua-tai-cho-hop > input:focus { border: 0 !important; box-shadow: none !important; outline: none !important; background: transparent !important; border-radius: 4px !important; padding-left: 0; padding-right: 0; }
.sua-tai-cho-hop.dang-sua > input { background: #f1f5f9 !important; padding-left: 4px; padding-right: 4px; }
.sua-tai-cho-hop > input[readonly], .sua-tai-cho-hop > [contenteditable="false"] { pointer-events: none; }
.sua-tai-cho-icon { color: #94a3b8; font-size: 13px; cursor: pointer; flex-shrink: 0; }
.sua-tai-cho-icon:hover, .sua-tai-cho-hop.dang-sua .sua-tai-cho-icon { color: #3b82f6; }
.table thead tr th.border-start { border-left: 1px solid var(--table-divider-color) !important; }
@media (max-width: 991.98px) {
    .page-head { flex-wrap: wrap; }
    .page-head > h5 { flex-wrap: wrap; white-space: normal; overflow: visible; }
    .page-head > h5:has(.float-end) { padding-right: 0; }
    .page-head > h5 .float-end { position: static; transform: none; margin-left: auto; flex-wrap: wrap; }
    .navbar-header .breadcrumb { overflow-x: auto; scrollbar-width: none; }
    .navbar-header .breadcrumb::-webkit-scrollbar { display: none; }
    .navbar-header .page-title-wrap { padding-left: .5rem !important; padding-right: .5rem !important; }
    .page-wrapper .content,
    .header-collapse .page-wrapper .content { padding-left: .5rem; padding-right: .5rem; }
}
.chip-gt {
    flex-shrink: 0;
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 10px;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
    line-height: 1;
}
.chip-gt > i { line-height: 1; }
.chip-gt-quan_tam { background: #dcfce7; color: #16a34a; }
.chip-gt-tu_choi  { background: #fdeae5; color: #ee4d2d; }
.chip-gt-che_gia  { background: #fef3c7; color: #d97706; }
.chip-gt-lac_de   { background: #f1f5f9; color: #64748b; }