/* ==========================================
   T.I.M.E.S SYSTEM - MAIN STYLESHEET
   ========================================== */

* {

            margin: 0;

            padding: 0;

            box-sizing: border-box;

        }



        body {

            font-family: 'Segoe UI', Tahoma, sans-serif;

            background: linear-gradient(135deg, #1e3d2b 0%, #3e5c43 100%);

            height: 100vh;

            padding: 15px;

            overflow: hidden;

        }



        .container {

            max-width: 100%;

            height: 100%;

            margin: 0 auto;

            background: #fdfaf1;

            border-radius: 10px;

            box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);

            position: relative;

            overflow: hidden;

            display: grid;

            grid-template-columns: 65px 1fr;

            grid-template-rows: 1fr;

            transition: all 0.3s ease;

        }



        #login-overlay {

            grid-column: 1/-1;

            grid-row: 1/-1;

            z-index: 99999;

            border-radius: 10px;

            position: fixed;

            inset: 0;

            background: linear-gradient(135deg, #1e3d2b 0%, #2980b9 100%);

            display: flex;

            justify-content: center;

            align-items: center;

        }



        .login-box {

            background: white;

            padding: 40px;

            border-radius: 15px;

            box-shadow: 0 15px 50px rgba(0, 0, 0, 0.5);

            width: 400px;

            text-align: center;

        }



        .login-box h2 {

            color: #2c3e50;

            margin-bottom: 25px;

            font-family: "Times New Roman", serif;

            font-size: 24px;

        }



        .login-input {

            width: 100%;

            padding: 12px;

            margin-bottom: 15px;

            border: 1px solid #bdc3c7;

            border-radius: 8px;

            font-size: 14px;

        }



        .btn-login {

            width: 100%;

            padding: 12px;

            background: #3498db;

            color: white;

            border: none;

            border-radius: 8px;

            font-weight: bold;

            cursor: pointer;

            font-size: 15px;

            transition: 0.3s;

        }



        .btn-login:hover {

            background: #2980b9;

        }



        /* === ICON-ONLY SIDEBAR WITH JS TOOLTIP === */

        .sidebar {

            grid-column: 1/2;

            grid-row: 1/-1;

            background: #f4f6f8;

            display: flex;

            flex-direction: column;

            height: 100%;

            min-height: 0;

            overflow: hidden;

            border-right: 1px solid #e5e7eb;

            z-index: 1000;

            align-items: stretch;

            width: 65px;

        }



        .sidebar-menu {

            flex: 1;

            min-height: 0;

            width: 100%;

            overflow-y: auto !important;

            overflow-x: hidden !important;

            padding: 8px 0;

            display: flex;

            flex-direction: column;

            align-items: center;

            gap: 3px;

            scrollbar-width: thin;

            scrollbar-color: rgba(0, 0, 0, 0.15) transparent;

        }



        .sidebar-menu::-webkit-scrollbar {

            width: 3px;

        }



        .sidebar-menu::-webkit-scrollbar-track {

            background: transparent;

        }



        .sidebar-menu::-webkit-scrollbar-thumb {

            background: rgba(0, 0, 0, 0.15);

            border-radius: 3px;

        }



        .sidebar-menu::-webkit-scrollbar-thumb:hover {

            background: rgba(0, 0, 0, 0.3);

        }



        .group-title {

            display: none;

        }



        .sidebar button.nav-tab {

            width: 46px;

            height: 46px;

            border: 1px solid transparent;

            background: transparent;

            border-radius: 10px;

            padding: 0;

            color: #4b5563;

            cursor: pointer;

            display: flex;

            align-items: center;

            justify-content: center;

            box-sizing: border-box;

            transition: all 0.15s ease;

            flex-shrink: 0;

        }



        .sidebar button.nav-tab .icon {

            font-size: 21px;

            display: flex;

            align-items: center;

            justify-content: center;

            pointer-events: none;

            line-height: 1;

        }



        .sidebar button.nav-tab .text {

            display: none;

        }



        .sidebar button.nav-tab:hover {

            background: rgba(59, 130, 246, 0.08);

            border-color: rgba(59, 130, 246, 0.2);

            transform: scale(1.04);

        }



        .sidebar button.nav-tab:active {

            transform: scale(0.96);

        }



        .sidebar button.nav-tab.active {

            background: white;

            color: #1e3d2b;

            border-color: rgba(30, 61, 43, 0.15);

            box-shadow: 0 3px 10px rgba(30, 61, 43, 0.08);

            position: relative;

        }



        .sidebar button.nav-tab.active::after {

            content: '';

            position: absolute;

            left: 0;

            top: 22%;

            height: 56%;

            width: 3px;

            background: #1e3d2b;

            border-radius: 0 4px 4px 0;

        }



        /* Responsive sidebar heights for laptops and smaller screens */

        @media (max-height: 850px) {

            .sidebar button.nav-tab {

                width: 42px;

                height: 42px;

                border-radius: 9px;

            }

            .sidebar button.nav-tab .icon {

                font-size: 19px;

            }

            .sidebar-menu {

                gap: 2px;

                padding: 6px 0;

            }

        }



        @media (max-height: 750px) {

            .sidebar button.nav-tab {

                width: 38px;

                height: 38px;

                border-radius: 8px;

            }

            .sidebar button.nav-tab .icon {

                font-size: 17px;

            }

            .sidebar-menu {

                gap: 2px;

                padding: 4px 0;

            }

        }



        @media (max-height: 650px) {

            .sidebar button.nav-tab {

                width: 34px;

                height: 34px;

                border-radius: 7px;

            }

            .sidebar button.nav-tab .icon {

                font-size: 15px;

            }

            .sidebar-menu {

                gap: 1px;

                padding: 3px 0;

            }

        }



        /* Floating tooltip rendered by JS at body level */

        #sidebar-tooltip {

            position: fixed;

            left: 72px;

            padding: 6px 13px;

            background: #1f2937;

            color: white;

            border-radius: 8px;

            font-size: 13px;

            font-weight: 600;

            white-space: nowrap;

            pointer-events: none;

            opacity: 0;

            transition: opacity 0.15s;

            z-index: 99999;

            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.25);

        }

        #sidebar-tooltip::before {

            content: '';

            position: absolute;

            right: 100%;

            top: 50%;

            transform: translateY(-50%);

            border: 6px solid transparent;

            border-right-color: #1f2937;

        }



        .main-wrapper {

            grid-column: 2/3;

            grid-row: 1/-1;

            display: flex;

            flex-direction: column;

            height: 100vh;

            overflow: hidden;

        }



        .header-fixed-section {

            flex-shrink: 0;

            z-index: 100;

            background: white;

            border-bottom: 2px solid #e67e22;

        }



        .tab-scroll-content {

            flex-grow: 1;

            overflow-y: auto;

            padding: 15px;

        }



        .tab-content {

            display: none;

            animation: fadeIn 0.3s;

        }



        .tab-content.active {

            display: block;

        }



        #tab-schedule.active,
        #tab-stats.active,
        #tab-sat.active,
        #tab-utils.active,
        #tab-kiemtra.active {
            display: flex;
            flex-direction: column;
            flex: 1;
            height: 100%;
            min-height: 0;
            overflow: hidden;
        }

        /* Cho phép cuộn trang để xem Footer ở Tab Chấm Công và Thống Kê */
        .tab-scroll-content:has(#tab-chamcong.active),
        .tab-scroll-content:has(#tab-thongke.active) {
            overflow-y: auto !important;
            overflow-x: hidden !important;
            display: flex !important;
            flex-direction: column !important;
            padding: 6px 8px !important;
            height: 100% !important;
            min-height: 0 !important;
            -webkit-overflow-scrolling: touch;
        }

        #tab-chamcong.active,
        #tab-thongke.active {
            display: flex !important;
            flex-direction: column !important;
            flex: 1 0 auto !important;
            min-height: 100% !important;
            height: auto !important;
            overflow: visible !important;
        }

        #tab-chamcong.active .chamcong-card-wrapper,
        #tab-thongke.active .thongke-card-wrapper {
            flex-shrink: 0 !important;
            height: auto !important;
            min-height: 480px !important;
            margin-bottom: 20px !important;
        }

        #tab-chamcong.active .main-footer,
        #tab-thongke.active .main-footer {
            margin-top: auto !important;
            margin-bottom: 30px !important;
            flex-shrink: 0 !important;
            display: block !important;
        }

        /* Chỉ hiển thị footer ở 4 tab: Trang Chủ, Chấm Công, Thống Kê, Admin, Quản lý đơn vị */
        body:not(:has(#tab-home.active)):not(:has(#tab-chamcong.active)):not(:has(#tab-thongke.active)):not(:has(#tab-admin.active)):not(:has(#tab-tenants.active)) .main-footer {
            display: none !important;
        }

        /* Hiển thị footer trên tất cả các tab với layout an toàn không che khuất nội dung */
        .main-footer {
            margin-top: 20px !important;
            margin-bottom: 10px !important;
            border-radius: 8px !important;
            box-shadow: 0 4px 10px rgba(0,0,0,0.15) !important;
            flex-shrink: 0 !important;
        }

        /* Ép các tab chiếm đúng phần nội dung còn lại, không để tab-scroll-content cuộn ngoài */
        .tab-scroll-content:has(#tab-schedule.active),
        .tab-scroll-content:has(#tab-sat.active),
        .tab-scroll-content:has(#tab-utils.active),
        .tab-scroll-content:has(#tab-kiemtra.active) {
            overflow: hidden !important;
            display: flex !important;
            flex-direction: column !important;
            padding: 4px 6px !important;
            height: 100% !important;
            min-height: 0 !important;
        }

        /* Tab fill toàn bộ chiều cao container cha */
        #tab-schedule.active,
        #tab-sat.active,
        #tab-utils.active,
        #tab-kiemtra.active {
            flex: 1 !important;
            height: 100% !important;
            min-height: 0 !important;
        }

        /* Ghim footer sát đáy tab-tenants: chỉ cần min-height: 100% trên tab là đủ */
        #tab-tenants.active {
            display: flex !important;
            flex-direction: column !important;
            min-height: 100% !important;
        }

        #tab-tenants .main-footer {
            margin-top: auto !important;
        }



        @keyframes fadeIn {

            from {

                opacity: 0;

            }



            to {

                opacity: 1;

            }

        }



        /* ── BANNER ── */

        .hospital-banner-global {

            display: flex;

            justify-content: space-between;

            align-items: center;

            padding: 5px 15px;

        }



        .banner-left {

            display: flex;

            align-items: center;

            gap: 12px;

            flex-shrink: 0;

        }



        .banner-right {

            flex: 1;

            overflow: hidden;

            margin-left: 12px;

            display: flex;

            align-items: center;

            justify-content: flex-end;

            padding-right: 16px;

        }



        .banner-clock {

            text-align: center;

            color: #1a5fa8;

            background: transparent;

            border: none;

            padding: 5px 15px;

        }



        #clock-time {

            font-size: 22px;

            font-weight: 800;

            letter-spacing: 2px;

            line-height: 1.2;

            color: #0d47a1;

        }



        #clock-date {

            font-size: 11px;

            font-weight: 600;

            margin-top: 2px;

            color: #1a5fa8;

        }



        .banner-logo {

            width: 100px;

            height: 85px;

            object-fit: contain;

            cursor: pointer;

            transition: transform 0.2s;

        }

        .banner-logo:hover {

            transform: scale(1.05);

        }



        /* Thu gọn banner toàn bộ → lấy lại chiều cao nội dung */

        .banner-logo {

            width: 60px !important;

            height: 50px !important;

        }



        .banner-text h1 {

            font-size: 13px !important;

        }



        .banner-text h2 {

            font-size: 10px !important;

            letter-spacing: 1px !important;

        }



        .banner-text p {

            font-size: 10px !important;

        }



        #clock-time {

            font-size: 16px !important;

        }



        .hospital-banner-global {

            padding: 3px 10px !important;

        }



        .banner-text {

            text-align: center;

            display: flex;

            flex-direction: column;

            justify-content: center;

            align-items: center;

        }



        .banner-text h1 {

            font-size: 16px;

            font-weight: 800;

            margin: 0 0 2px;

            text-transform: uppercase;

            letter-spacing: 1px;

            background: linear-gradient(to right, #0d47a1, #1565c0, #1a78c2);

            -webkit-background-clip: text;

            -webkit-text-fill-color: transparent;

            background-clip: text;

        }



        .banner-text h2 {

            font-size: 12px;

            font-weight: 700;

            margin: 0 0 4px;

            padding-bottom: 4px;

            text-transform: uppercase;

            letter-spacing: 2px;

            background: linear-gradient(to right, #1a5fa8, #27ae60);

            -webkit-background-clip: text;

            -webkit-text-fill-color: transparent;

            background-clip: text;

            opacity: 0.9;

            border-bottom: none;

        }



        .banner-text p {

            color: white;

            font-size: 11px;

            font-weight: 600;

            margin: 0;

            padding: 2px 10px;

            text-transform: uppercase;

            background: linear-gradient(to right, #e67e22, #d35400);

            border-radius: 20px;

            letter-spacing: 1px;

            box-shadow: 0 2px 6px rgba(230, 126, 34, 0.4);

        }



        .global-marquee-container {

            display: flex;

            align-items: center;

            background: #f1f8e9;

            border-top: 1px solid #ddd;

            padding: 0 10px;

            gap: 10px;

        }



        .hamburger-in-marquee {

            background: none;

            border: none;

            font-size: 18px;

            color: #c0392b;

            cursor: pointer;

            flex-shrink: 0;

            padding: 2px 5px;

            transition: transform 0.2s;

        }



        .hamburger-in-marquee:hover {

            transform: scale(1.2);

        }



        #thong-bao-chay {

            flex: 1;

            font-weight: bold;

            color: #c0392b;

            font-size: 13px;

            padding: 4px 0;

        }



        .admin-btn-in-marquee {

            background: #e74c3c;

            color: white;

            border: none;

            padding: 4px 10px;

            border-radius: 20px;

            font-size: 10px;

            font-weight: bold;

            cursor: pointer;

            white-space: nowrap;

            flex-shrink: 0;

            transition: 0.3s;

        }



        .admin-btn-in-marquee:hover {

            background: #c0392b;

        }



        .logout-label {

            font-weight: normal;

            font-size: 9px;

            opacity: 0.9;

        }



        @media (max-width: 1200px) {

            .hospital-banner-global {

                padding: 3px 10px;

            }



            .banner-logo {

                width: 55px !important;

                height: 55px !important;

            }



            .banner-text h1 {

                font-size: 14px !important;

            }



            .banner-text h2 {

                font-size: 11px !important;

                letter-spacing: 1px !important;

                margin-bottom: 2px !important;

                padding-bottom: 2px !important;

            }



            .banner-text p {

                font-size: 10px !important;

                padding: 2px 8px !important;

            }



            .global-marquee-container {

                gap: 5px;

            }



            .hamburger-in-marquee {

                font-size: 16px !important;

            }



            #thong-bao-chay {

                font-size: 12px !important;

                padding: 3px 0 !important;

            }



            .admin-btn-in-marquee {

                padding: 2px 8px !important;

                font-size: 9px !important;

            }



            #clock-time {

                font-size: 18px !important;

            }



            #clock-date {

                font-size: 10px !important;

            }

        }



        /* ── DASHBOARD ── */

        .page-header {

            display: flex;

            align-items: center;

            justify-content: space-between;

            margin-bottom: 20px;

            padding-bottom: 15px;

            border-bottom: 2px solid #d4c5a9;

        }



        .page-header h2 {

            font-size: 1.3rem;

            font-weight: 700;

            margin: 0;

            color: #1e3d2b;

        }



        .dashboard-3col {
            display: grid;
            grid-template-columns: 1fr 1.3fr 1.3fr;
            gap: 15px;
        }

        .dashboard-2col {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 15px;
        }

        .dashboard-5col {
            display: grid;
            grid-template-columns: minmax(160px, 0.72fr) minmax(280px, 1.48fr) minmax(280px, 1.48fr) minmax(180px, 0.88fr) minmax(230px, 1.15fr);
            gap: 10px;
            align-items: stretch;
            width: 100%;
            max-width: 100%;
            box-sizing: border-box;
        }

        .dashboard-5col .dash-panel {
            padding: 12px 10px;
            display: flex;
            flex-direction: column;
            min-width: 0; /* Ngăn chặn triệt để con grid ép tràn khung */
            box-sizing: border-box;
            overflow: hidden;
        }

        /* Thanh cuộn siêu mảnh cho các danh sách biểu đồ trên dashboard */
        .dash-chart-scroll {
            scrollbar-width: thin;
            scrollbar-color: #cbd5e1 transparent;
        }
        .dash-chart-scroll::-webkit-scrollbar {
            width: 4px;
        }
        .dash-chart-scroll::-webkit-scrollbar-thumb {
            background-color: #cbd5e1;
            border-radius: 4px;
        }
        .dash-chart-scroll::-webkit-scrollbar-track {
            background: transparent;
        }

        /* Dòng tính Tổng số lượng dưới mỗi danh mục Dashboard */
        .dash-total-footer {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-top: 5px;
            padding-top: 5px;
            border-top: 1.5px dashed #cbd5e1;
            font-size: 0.72rem;
            font-weight: 700;
            color: #1e3d2b;
            box-sizing: border-box;
            flex-shrink: 0;
        }
        .dash-total-footer .total-label {
            display: flex;
            align-items: center;
            gap: 4px;
            color: #64748b;
            font-weight: 700;
            font-size: 0.69rem;
            text-transform: uppercase;
            letter-spacing: 0.3px;
        }
        .dash-total-footer .total-badge {
            color: #0f172a;
            font-size: 0.75rem;
            font-weight: 800;
            background: #f1f5f9;
            padding: 1px 7px;
            border-radius: 6px;
            border: 1px solid #e2e8f0;
            min-width: 24px;
            text-align: center;
        }

        /* Khi màn hình siêu rộng (>= 1500px): Dàn phẳng 5 cột rộng rãi với tỷ lệ ưu tiên 2 bảng tải trọng & thủ thuật */
        @media (min-width: 1500px) {
            .dashboard-5col {
                grid-template-columns: 0.65fr 1.65fr 1.65fr 0.8fr 1.05fr;
            }
        }

        /* Khi màn hình vừa / laptop / cửa sổ thu nhỏ (961px - 1499px) */
        @media (max-width: 1499px) and (min-width: 961px) {
            .dashboard-5col {
                grid-template-columns: repeat(6, 1fr);
                gap: 12px;
            }
            .dashboard-5col > .dash-panel:nth-child(1) {
                grid-column: span 2; /* Tổng quan: 1/3 hàng 1 */
            }
            .dashboard-5col > .dash-panel:nth-child(2) {
                grid-column: span 2; /* Tải trọng: 1/3 hàng 1 */
            }
            .dashboard-5col > .dash-panel:nth-child(3) {
                grid-column: span 2; /* Phân bố: 1/3 hàng 1 */
            }
            .dashboard-5col > .dash-panel:nth-child(4) {
                grid-column: span 3; /* Phòng bệnh: 1/2 hàng 2 */
            }
            .dashboard-5col > .dash-panel:nth-child(5) {
                grid-column: span 3; /* Sử dụng máy: 1/2 hàng 2 */
            }
        }

        /* Khi màn hình tablet và di động (<= 960px) */
        @media (max-width: 960px) {
            .dashboard-3col,
            .dashboard-2col,
            .dashboard-5col {
                grid-template-columns: 1fr !important;
                gap: 12px;
                overflow-x: visible;
            }
            .dashboard-5col > .dash-panel {
                grid-column: span 1 !important;
            }
        }



        .dash-panel {

            background: white;

            border: 1px solid rgba(22, 46, 32, 0.08);

            border-radius: 12px;

            padding: 20px;

            box-shadow: 0 4px 20px -2px rgba(22, 46, 32, 0.06);

        }



        .dash-panel-title {

            font-size: 14px;

            font-weight: 700;

            color: #1b3a24;

            border-bottom: 1px solid #f3f4f6;

            padding-bottom: 10px;

            margin: 0 0 15px;

            text-transform: uppercase;

            font-family: 'Outfit', sans-serif;

            letter-spacing: 0.5px;

        }



        .stat-mini-card {
            display: flex;
            justify-content: space-between;
            align-items: center;
            background: linear-gradient(to right, #ffffff, #f9fafb);
            padding: 14px 16px;
            border-radius: 10px;
            margin-bottom: 12px;
            border-left: 4px solid #10b981;
            box-shadow: 0 4px 12px rgba(22, 46, 32, 0.03);
            border-top: 1px solid rgba(0, 0, 0, 0.02);
            border-right: 1px solid rgba(0, 0, 0, 0.02);
            border-bottom: 1px solid rgba(0, 0, 0, 0.02);
            transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .stat-mini-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 24px rgba(22, 46, 32, 0.08);
            background: linear-gradient(to right, #ffffff, #f1f4f6);
        }



        .stat-mini-card .s-label {

            font-size: 13px;

            color: #6b7280;

            font-weight: 600;

        }



        .stat-mini-card .s-value {

            font-size: 18px;

            font-weight: 700;

            color: #111827;

            font-family: 'Outfit', sans-serif;

        }



        .stats-grid {

            display: grid;

            grid-template-columns: repeat(4, 1fr);

            gap: 15px;

            margin-bottom: 20px;

        }



        .split-view {

            display: grid;

            grid-template-columns: 1fr 1fr;

            gap: 15px;

            margin-bottom: 20px;

        }



        .card {

            background: white;

            border: 1px solid rgba(22, 46, 32, 0.08);

            border-radius: 12px;

            padding: 20px;

            box-shadow: 0 4px 20px -2px rgba(22, 46, 32, 0.06);

        }



        .card-header {

            display: flex;

            align-items: center;

            justify-content: space-between;

            margin-bottom: 15px;

            padding-bottom: 10px;

            border-bottom: 1px solid #f3f4f6;

        }



        .card-title {

            font-size: 1rem;

            font-weight: 700;

            color: #1b3a24;

            text-transform: uppercase;

            font-family: 'Outfit', sans-serif;

            letter-spacing: 0.5px;

        }



        @media (max-width: 1000px) {



            .dashboard-3col,

            .stats-grid,

            .split-view {

                grid-template-columns: 1fr;

            }

        }



        /* ── FORM & BUTTONS ── */

        .form-section {

            background: #f8fafc;

            padding: 20px;

            border-radius: 12px;

            margin-bottom: 20px;

            border-left: 4px solid #3b82f6;

            border-top: 1px solid rgba(0, 0, 0, 0.01);

            border-right: 1px solid rgba(0, 0, 0, 0.01);

            border-bottom: 1px solid rgba(0, 0, 0, 0.01);

        }



        .form-group {

            margin-bottom: 12px;

            display: flex;

            gap: 10px;

            align-items: center;

        }



        .form-group label {

            min-width: 110px;

            font-weight: 600;

            color: #374151;

            font-size: 12px;

        }



        .form-group input,

        .form-group select,

        .form-group textarea {

            flex: 1;

            padding: 8px 12px;

            border: 1px solid #d1d5db;

            border-radius: 6px;

            font-size: 12px;

            transition: all 0.2s ease;

            outline: none;

            background: white;

            color: #1f2937;

        }



        .form-group input:focus,

        .form-group select:focus,

        .form-group textarea:focus {

            border-color: #10b981;

            box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.15);

        }



        .form-group textarea {

            resize: vertical;

            min-height: 50px;

        }



        .button-group {

            display: flex;

            gap: 8px;

            margin-top: 8px;

            flex-wrap: wrap;

        }



        button {

            padding: 6px 12px;

            border: none;

            border-radius: 6px;

            cursor: pointer;

            font-size: 12px;

            font-weight: 600;

            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);

            color: white;

            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);

        }



        button:hover {

            transform: translateY(-1px);

            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);

        }



        button:active {

            transform: translateY(1px) scale(0.98);

            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);

        }



        .btn-primary {
            background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
            box-shadow: 0 2px 6px rgba(59, 130, 246, 0.3);
        }

        .btn-primary:hover {
            background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
            box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
        }

        .btn-success {
            background: linear-gradient(135deg, #10b981 0%, #047857 100%);
            box-shadow: 0 2px 6px rgba(16, 185, 129, 0.3);
        }

        .btn-success:hover {
            background: linear-gradient(135deg, #059669 0%, #065f46 100%);
            box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4);
        }

        .btn-danger {
            background: linear-gradient(135deg, #ef4444 0%, #b91c1c 100%);
            box-shadow: 0 2px 6px rgba(239, 68, 68, 0.3);
        }

        .btn-danger:hover {
            background: linear-gradient(135deg, #dc2626 0%, #991b1b 100%);
            box-shadow: 0 4px 12px rgba(239, 68, 68, 0.4);
        }

        .btn-warning {
            background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
            color: white;
            box-shadow: 0 2px 6px rgba(245, 158, 11, 0.3);
        }

        .btn-warning:hover {
            background: linear-gradient(135deg, #d97706 0%, #b45309 100%);
            color: white;
            box-shadow: 0 4px 12px rgba(245, 158, 11, 0.4);
        }

        .btn-secondary {
            background: linear-gradient(135deg, #6b7280 0%, #4b5563 100%);
            box-shadow: 0 2px 6px rgba(107, 114, 128, 0.2);
        }

        .btn-secondary:hover {
            background: linear-gradient(135deg, #4b5563 0%, #374151 100%);
            box-shadow: 0 4px 12px rgba(107, 114, 128, 0.3);
        }

        .btn-purple {
            background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%);
            box-shadow: 0 2px 6px rgba(139, 92, 246, 0.3);
        }

        .btn-purple:hover {
            background: linear-gradient(135deg, #7c3aed 0%, #5b21b6 100%);
            box-shadow: 0 4px 12px rgba(139, 92, 246, 0.4);
        }



        /* ── TABLE DEFAULT (ULTRA-COMPACT TOÀN HỆ THỐNG) ── */
        table {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0;
            margin-top: 4px;
            box-shadow: 0 1px 4px rgba(22, 46, 32, 0.05);
            border-radius: 4px;
            font-size: 11.5px;
        }

        table thead tr:first-child th:first-child {
            border-top-left-radius: 4px;
        }

        table thead tr:first-child th:last-child {
            border-top-right-radius: 4px;
        }

        th {
            padding: 2px 6px !important;
            height: 22px !important;
            min-height: 22px !important;
            font-size: 11px !important;
            line-height: 18px !important;
            font-weight: 700 !important;
            text-transform: uppercase !important;
            background-color: #275d38 !important;
            color: #ffffff !important;
            border-bottom: 1.5px solid #cbd5e1 !important;
            box-sizing: border-box !important;
        }

        td {
            padding: 1px 6px !important;
            height: 20px !important;
            min-height: 20px !important;
            text-align: left;
            border-bottom: 1.5px solid #cbd5e1 !important;
            border-right: 1px solid #f1f5f9 !important;
            font-size: 11.5px !important;
            line-height: 18px !important;
            font-variant-numeric: tabular-nums;
            box-sizing: border-box !important;
        }

        td button,
        td .btn,
        td .btn-action,
        td .btn-danger,
        td .btn-sm,
        td .btn-warning,
        td .btn-primary,
        td .btn-success {
            margin: 0 1px !important;
            padding: 0 5px !important;
            height: 18px !important;
            line-height: 18px !important;
            font-size: 10.5px !important;
            border-radius: 3px !important;
        }



        tbody tr:nth-child(even) {

            background: #f9fafb;

        }



        tbody tr:first-child td {

            border-top: none !important;

        }



        tbody tr.editable-row,
        td.editable-row {
            transition: background-color 0.2s ease, transform 0.15s ease;
        }

        tbody tr.editable-row:hover,
        td.editable-row:hover {
            background: #f0f4f1 !important;
            cursor: pointer;
        }



        .action-buttons {

            display: flex;

            gap: 5px;

            flex-direction: column;

        }



        .action-buttons button {

            padding: 5px 8px;

            font-size: 11px;

        }



        /* ── SPLIT LAYOUT & SCROLLBAR ── */

        .split-layout {
            display: flex;
            gap: 15px;
            align-items: stretch;
            max-width: 100%;
        }

        .sidebar-form {
            flex: 0 0 340px;
            background: #f1f2f6;
            padding: 15px;
            border-radius: 8px;
            border: 1px solid #dcdde1;
            position: sticky;
            top: 0;
            max-height: calc(100vh - 240px) !important;
            overflow-y: auto !important;
            box-sizing: border-box;
        }

        .sidebar-form .form-group {
            display: flex;
            flex-direction: row;
            align-items: center;
            margin-bottom: 6px;
            min-height: auto;
        }

        .sidebar-form .form-group input:not([type="checkbox"]):not([type="radio"]),
        .sidebar-form .form-group select,
        .sidebar-form .form-group textarea {
            flex: 1;
            padding: 4px 8px;
            min-height: 28px;
            border: 1px solid #d1d5db;
            border-radius: 6px;
            font-size: 12px;
            background: #ffffff;
            color: #1f2937;
        }

        .sidebar-form .form-group input[type="checkbox"],
        .sidebar-form .form-group input[type="radio"] {
            width: 17px !important;
            height: 17px !important;
            min-height: unset !important;
            flex: none !important;
            padding: 0 !important;
            margin: 0 !important;
            border-radius: 3px !important;
            cursor: pointer !important;
        }

        .main-table {
            flex: 1;
            overflow: auto !important;
            max-height: calc(100vh - 240px) !important;
            min-width: 0 !important;
        }

        #tab-utils .main-table {

            max-height: 70vh !important;

            border: 1px solid #ddd;

            border-radius: 8px;

        }



        #tab-utils .split-layout>div>div:last-child {

            max-height: calc(100vh - 240px) !important;

            overflow-y: auto !important;

            border-radius: 0 0 6px 6px;

        }



        .busy-container {

            flex: 1 1 auto;

            height: 0;

            min-height: 150px;

            overflow: auto !important;

            background: white;

            border: 1px solid #bdc3c7;

            border-radius: 5px;

        }



        ::-webkit-scrollbar {

            width: 6px;

            height: 6px;

        }



        ::-webkit-scrollbar-thumb {

            background: #bdc3c7;

            border-radius: 5px;

        }



        ::-webkit-scrollbar-track {

            background: #f1f1f1;

        }



        .sidebar-form .form-group {

            flex-direction: row;

            align-items: center;

            margin-bottom: 2px;

        }

        .sidebar-form .form-group input:not([type="checkbox"]):not([type="radio"]),
        .sidebar-form .form-group select,
        .sidebar-form .form-group textarea {
            padding: 2px 4px;
            min-height: 24px;
        }




        .sidebar-form .form-group label {

            min-width: 100px;

            font-size: 12px;

            margin-bottom: 0;

        }



        .time-range {

            display: flex;

            gap: 5px;

            align-items: center;

            flex: 1;

        }



        .time-range input {

            width: 100%;

            text-align: center;

            font-weight: bold;

            color: #2c3e50;

        }



        .skills-box {

            background: #dfe4ea;

            border-radius: 5px;

            padding: 10px;

            margin-top: 10px;

        }



        .skills-header {

            text-align: center;

            font-size: 12px;

            font-weight: bold;

            color: #2f3640;

            margin-bottom: 10px;

            padding-bottom: 5px;

            border-bottom: 1px solid #bdc3c7;

        }



        .skills-grid {

            display: flex;

            gap: 10px;

        }



        .skills-col {

            flex: 1;

        }



        .skills-col h4 {

            font-size: 11px;

            margin-bottom: 8px;

            display: flex;

            align-items: center;

            gap: 5px;

            border-bottom: 1px solid #ccc;

            padding-bottom: 3px;

        }



        .checkbox-item {

            display: flex;

            align-items: center;

            gap: 8px;

            margin-bottom: 6px;

            font-size: 12px;

            color: #2c3e50;

            cursor: pointer;

        }



        .scrollable-checkbox-list {

            max-height: 140px;

            overflow-y: auto;

            border: 1px solid #bdc3c7;

            padding: 8px;

            background: white;

            border-radius: 3px;

        }



        .tab-header-title {

            display: none;

            background: #ecf0f1;

            color: #2c3e50;

            padding: 10px;

            text-align: center;

            font-weight: bold;

            border-radius: 5px;

            margin-bottom: 15px;

            border: 1px solid #bdc3c7;

        }

        #todaySchedulePreview table thead th {

            top: 0px !important;

        }



        #rooms-table {
            width: 100% !important;
            table-layout: fixed !important;
        }

        #rooms-table th,
        #rooms-table td {
            white-space: normal !important;
            word-break: normal !important;
            overflow-wrap: break-word !important;
            height: auto !important;
            line-height: 1.4 !important;
            vertical-align: middle !important;
            padding: 8px 6px !important;
        }

        /* 1. STT */
        #rooms-table th:nth-child(1),
        #rooms-table td:nth-child(1) {
            width: 48px !important;
            min-width: 45px !important;
            white-space: nowrap !important;
            text-align: center !important;
        }

        /* 2. Tên Phòng */
        #rooms-table th:nth-child(2),
        #rooms-table td:nth-child(2) {
            width: 110px !important;
            min-width: 95px !important;
            font-weight: 700 !important;
        }

        /* 3. BS Chính */
        #rooms-table th:nth-child(3),
        #rooms-table td:nth-child(3) {
            width: 110px !important;
            min-width: 95px !important;
        }

        /* 4. BS Phụ */
        #rooms-table th:nth-child(4),
        #rooms-table td:nth-child(4) {
            width: 105px !important;
            min-width: 90px !important;
        }

        /* 5. KTV Chính */
        #rooms-table th:nth-child(5),
        #rooms-table td:nth-child(5) {
            width: 115px !important;
            min-width: 100px !important;
        }

        /* 6. KTV Phụ */
        #rooms-table th:nth-child(6),
        #rooms-table td:nth-child(6) {
            width: 110px !important;
            min-width: 95px !important;
        }

        /* 7. Điều dưỡng */
        #rooms-table th:nth-child(7),
        #rooms-table td:nth-child(7) {
            width: 130px !important;
            min-width: 110px !important;
        }

        /* 8. Các máy (Giảm độ rộng, tự động xuống dòng mềm mại) */
        #rooms-table th:nth-child(8),
        #rooms-table td:nth-child(8) {
            width: 250px !important;
            max-width: 280px !important;
            font-size: 11.5px !important;
            line-height: 1.45 !important;
            color: #334155 !important;
            word-break: break-word !important;
        }

        /* 9. Số giường */
        #rooms-table th:nth-child(9),
        #rooms-table td:nth-child(9) {
            width: 65px !important;
            min-width: 55px !important;
            white-space: nowrap !important;
            text-align: center !important;
        }

        /* 10. Thao tác */
        #rooms-table th:nth-child(10),
        #rooms-table td:nth-child(10) {
            width: 65px !important;
            min-width: 55px !important;
            white-space: nowrap !important;
            text-align: center !important;
        }



        .dashboard-table-card {

            position: relative;

            padding: 0;

            border-radius: 8px;

            margin-bottom: 40px;

        }



        .dashboard-search-bar {

            position: sticky;

            top: 0;

            z-index: 920 !important;

            background: #fdfaf1;

            padding: 12px 15px;

            border-bottom: 2px solid #2d5a27;

            display: flex;

            align-items: center;

            gap: 10px;

        }



        .row-scheduled {

            color: #111827 !important;

        }



        .row-scheduled td {

            color: #111827 !important;

        }



        body.read-only-user #tab-sat input:not(#sat-search-bn),

        body.read-only-user #tab-sat button,

        body.read-only-user #tab-machines .sidebar-form,

        body.read-only-user #tab-machines td button,

        body.read-only-user #tab-procedures .sidebar-form,

        body.read-only-user #tab-procedures td button,

        body.read-only-user #tab-rooms .sidebar-form,

        body.read-only-user #tab-rooms td button,

        body.read-only-user #tab-staff .sidebar-form,

        body.read-only-user #tab-staff td button {

            display: none !important;

        }



        body.read-only-user #tab-patients .editable-row,

        body.read-only-user #tab-busy .editable-row,

        body.read-only-user #tab-sat .editable-row {

            pointer-events: none !important;

        }



        body.read-only-user #tab-busy div[style*="border-bottom: 2px solid"] {

            border-bottom: none !important;

            margin: 0 !important;

            padding: 0 !important;

        }



        /* ── MISC ── */

        .alert {

            padding: 15px;

            border-radius: 5px;

            margin-bottom: 15px;

            font-size: 13px;

        }



        .alert-success {

            background: #d4edda;

            color: #155724;

            border-left: 4px solid #28a745;

        }



        .alert-info {

            background: #d1ecf1;

            color: #0c5460;

            border-left: 4px solid #bee5eb;

        }



        .alert-danger {

            background: #f8d7da;

            color: #721c24;

            border-left: 4px solid #f5c6cb;

        }



        .grid-3 {

            display: grid;

            grid-template-columns: repeat(3, 1fr);

            gap: 20px;

        }



        .spinner {

            border: 4px solid #ecf0f1;

            border-top: 4px solid #3498db;

            border-radius: 50%;

            width: 40px;

            height: 40px;

            animation: spin 1s linear infinite;

            margin: 0 auto 20px;

        }



        @keyframes spin {

            from {

                transform: rotate(0deg);

            }



            to {

                transform: rotate(360deg);

            }

        }



        .dropdown {

            flex: 1;

            position: relative;

            display: inline-block;

        }



        .dropdown .dropbtn {

            width: 100%;

            height: 100%;

            padding: 15px 20px;

            border: none;

            background: transparent;

            color: #e8f5e9;

            cursor: pointer;

            font-size: 13px;

            font-weight: bold;

            transition: all 0.3s;

            white-space: nowrap;

            text-align: center;

        }



        .dropdown:hover .dropbtn {

            background: rgba(241, 196, 15, 0.2);

        }



        .dropdown-content {

            display: none;

            position: absolute;

            background-color: #2d5a27;

            min-width: 160px;

            width: 100%;

            box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);

            z-index: 10000;

            border-radius: 0 0 8px 8px;

            overflow: hidden;

            top: 100%;

            left: 0;

        }



        .dropdown:hover .dropdown-content {

            display: block;

        }



        .dropdown-content button.nav-tab {

            width: 100%;

            text-align: left;

            padding: 12px 20px;

            border-radius: 0;

            border-bottom: 1px solid rgba(255, 255, 255, 0.1);

        }



        .dropdown-content button.nav-tab:hover {

            background: #3e5c43;

            padding-left: 25px;

        }



        .dropdown-content button.nav-tab.active {

            background: #f1c40f;

            color: #1e3d2b;

            border-left: 4px solid #d35400;

            border-bottom: none;

        }



        .dropdown-content button.nav-tab[style*="display: inline-block"] {

            display: block !important;

        }



        .dropdown-content button.nav-tab[style*="display: none"] {

            display: none !important;

        }







        @media (max-width: 1450px) {

            nav.sticky-nav button {

                padding: 12px 8px !important;

                font-size: 11.5px !important;

                letter-spacing: -0.3px;

            }

        }



        @media (max-width: 1366px) {}



        @media (max-width: 1250px) {

            nav.sticky-nav button {

                padding: 10px 4px !important;

                font-size: 10.5px !important;

            }

        }



        .input-ready-time::-webkit-calendar-picker-indicator {

            display: none !important;

            -webkit-appearance: none;

        }



        #custom-success-popup button:hover {

            background: #219653;

            transform: translateY(-2px);

        }



        @keyframes popIn {

            from {

                transform: scale(0.7);

                opacity: 0;

            }



            to {

                transform: scale(1);

                opacity: 1;

            }

        }



        /* ── FOOTER ── */

        .tab-content.active,

        .page.active {

            display: flex !important;

            flex-direction: column;

            flex: 1;

            min-height: 0;

        }



        .main-footer {

            background-color: #1e3d2b;

            color: #ecf0f1;

            padding: 10px 20px 10px !important;

            font-size: 12px;

            margin-top: auto !important;

            margin-bottom: 0 !important;

            border-top: 2px solid #e67e22;

            border-radius: 0 0 8px 8px;

            height: auto !important;

            display: flex !important;

            flex-direction: column;

            flex-shrink: 0 !important;

        }



        .footer-content {

            flex: 1 1 auto;

            min-height: 0;

            display: grid;

            grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr);

            gap: 25px;

            margin: 0;

        }



        .footer-col {

            min-width: 0;

        }



        .footer-col h4 {

            color: #f1c40f;

            margin: 0 0 8px;

            font-size: 14px;

            line-height: 1.2;

            text-transform: uppercase;

            font-weight: bold;

        }



        .footer-col p {

            margin: 4px 0;

            line-height: 1.3;

            color: #bdc3c7;

            font-size: 12px;

            min-width: 0;

        }



        .footer-col ul {

            list-style: none;

            padding: 0;

            margin: 0;

        }



        .footer-col ul li {

            margin-bottom: 4px;

            line-height: 1.22;

            min-width: 0;

        }



        .footer-col ul li a {

            color: #bdc3c7;

            text-decoration: none;

            transition: color 0.2s;

            font-size: 12px;

            min-width: 0;

        }



        .footer-col ul li a:hover {

            color: #f1c40f;

            text-decoration: underline;

        }



        .footer-col h4,

        .footer-col p,

        .footer-col ul li a {

            display: flex;

            align-items: flex-start;

            gap: 5px;

        }



        .footer-col p span:last-child,

        .footer-col ul li a span:last-child {

            min-width: 0;

        }



        .f-icon {

            width: 18px;

            min-width: 18px;

            text-align: center;

            flex-shrink: 0;

        }



        .footer-bottom {

            text-align: center;

            margin-top: 8px !important;

            padding: 5px 0 0 !important;

            border-top: 1px solid rgba(255, 255, 255, 0.2) !important;

            font-size: 12px !important;

            line-height: 1.3 !important;

            color: #bdc3c7 !important;

            display: block !important;

            width: 100% !important;

            clear: both !important;

        }



        @media (max-width: 1200px) {

            .footer-content {

                gap: 12px;

            }



            .main-footer {

                padding: 12px 15px 12px !important;

            }



            .footer-col h4 {

                margin-bottom: 6px;

                font-size: 13px;

            }

        }



        @media print {



            nav.sticky-nav,

            .tab-header-title,

            #schedule-search-input,

            .btn-primary,

            .btn-success,

            .btn-danger,

            .btn-purple,

            .btn-warning,

            .btn-secondary,

            label,

            .header-fixed-section {

                display: none !important;

            }



            body {

                background: white;

                padding: 0;

                height: auto;

                overflow: visible;

            }



            .container {

                box-shadow: none;

                max-width: 100%;

                height: auto;

                display: block;

                overflow: visible;

            }



            #schedule-table {

                box-shadow: none;

                border: 1px solid #000;

            }



            #schedule-table th {

                position: sticky !important;

                top: 0 !important;

                z-index: 20 !important;

                background: #275d38 !important;

                box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);

            }

        }



        /* ── STICKY ACTION BAR ── */

        .sticky-action-bar {

            flex-shrink: 0 !important;

            z-index: 900 !important;

            background-color: #fdfaf1 !important;

            padding: 10px 20px !important;

            border-top: 2px solid #27ae60 !important;

            border-radius: 0 0 8px 8px !important;

            box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1) !important;

            display: flex;

            align-items: center;

            justify-content: center;

            gap: 10px;

        }



        /* Thu gọn thẻ BN trong tab Thứ 7 → hiển thị được nhiều BN hơn */

        #sat-patient-list div[id^="sat-bn-"] {

            padding: 3px 8px !important;

            margin-bottom: 2px !important;

        }



        #sat-patient-list b {

            font-size: 12px !important;

        }



        #sat-patient-list label {

            font-size: 11px !important;

        }



        #sat-patient-list input[type=checkbox] {

            width: 12px !important;

            height: 12px !important;

        }



        #sat-patient-list .input-ready-time {

            font-size: 11px !important;

            padding: 1px 2px !important;

        }



        /* Thu gọn bảng ở tất cả tab → hiển thị nhiều dữ liệu hơn */
        #schedule-table th, #machines-table th, #procedures-table th, #staff-table th, #rooms-table th,
        #busy-staff-table th, #busy-pat-table th, #leave-pat-table th, #table-count th, #table-error-time th, #table-error-other th,
        #hl-table th, #table-admin-employees th, #stats-unscheduled-table th, #stats-staff-table th {
            padding: 2px 5px !important;
            font-size: 11px !important;
            height: 22px !important;
            min-height: 22px !important;
            line-height: 18px !important;
            box-sizing: border-box !important;
        }

        #schedule-table td, #machines-table td, #procedures-table td, #staff-table td, #rooms-table td,
        #busy-staff-table td, #busy-pat-table td, #leave-pat-table td, #table-count td, #table-error-time td, #table-error-other td,
        #hl-table td, #table-admin-employees td, #stats-unscheduled-table td, #stats-staff-table td {
            padding: 1px 5px !important;
            font-size: 11.5px !important;
            height: 20px !important;
            min-height: 20px !important;
            line-height: 18px !important;
            border-bottom: 1.5px solid #cbd5e1 !important;
            border-right: 1px solid #f1f5f9 !important;
            box-sizing: border-box !important;
        }

        /* ================================================================= */
        /* 🚀 GHIM CỨNG TIÊU ĐỀ BẢNG ULTRA-COMPACT */
        /* ================================================================= */

        /* 1. Tạo "Hố cuộn" có giới hạn chiều cao để bật thanh cuộn nội bộ */
        #tab-schedule div[style*="overflow-y:auto"],
        #tab-schedule div[style*="overflow-y: auto"],
        .table-sticky-container,
        .table-container-scroll {
            height: calc(100vh - 350px) !important;
            max-height: 65vh !important;
            overflow-y: auto !important;
            position: relative !important;
        }

        /* 2. Ép bảng tách viền (Cực kỳ quan trọng để dính được tiêu đề) */
        table,
        #schedule-table,
        #patients-table {
            border-collapse: separate !important;
            border-spacing: 0 !important;
            width: 100% !important;
        }

        /* 3. Ghim Tiêu Đề Siêu Gọn */
        table thead th,
        th {
            position: -webkit-sticky !important;
            position: sticky !important;
            top: 0 !important;
            z-index: 850 !important;
            background-color: #275d38 !important;
            color: white !important;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
            background-clip: padding-box !important;
            border-bottom: 1.5px solid #cbd5e1 !important;
            padding: 2px 6px !important;
            vertical-align: middle !important;
            font-size: 11px !important;
            height: 22px !important;
            min-height: 22px !important;
            line-height: 18px !important;
        }



        /* Tab Bệnh nhân: ghim thanh tìm kiếm thành một cụm với tiêu đề bảng */

        .patients-table-wrap {

            position: relative !important;

            padding-top: 0 !important;

        }



        .patients-search-bar,
        .table-search-bar {

            position: -webkit-sticky !important;

            position: sticky !important;

            top: 0 !important;

            z-index: 920 !important;

            margin-bottom: 0 !important;

            box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08) !important;

            background: #f8f9fa;

        }

        .btn-filter-pat-type {
            padding: 8px 16px;
            border-radius: 4px;
            border: 1px solid #cbd5e1;
            background: #ffffff;
            color: #475569;
            font-weight: bold;
            cursor: pointer;
            transition: all 0.2s;
            font-size: 12px;
        }

        .btn-filter-pat-type:hover {
            background: #f1f5f9;
        }

        .btn-filter-pat-type.active {
            border-color: #1e3d2b;
            background: #1e3d2b;
            color: #ffffff;
        }



        #patients-table {
            margin-top: 0 !important;
        }

        /* ── RIÊNG BẢNG BỆNH NHÂN: DÒNG THOÁNG RỘNG, DỄ NHÌN ── */
        #patients-table thead th {
            top: 56px !important;
            z-index: 890 !important;
            padding: 5px 8px !important;
            font-size: 12px !important;
            font-weight: 700 !important;
            height: 30px !important;
            min-height: 30px !important;
            line-height: 20px !important;
            box-sizing: border-box !important;
        }

        #patients-table tbody td {
            padding: 5px 8px !important;
            font-size: 12.5px !important;
            height: 32px !important;
            min-height: 32px !important;
            line-height: 20px !important;
            border-bottom: 1.5px solid #cbd5e1 !important;
            border-right: 1px solid #f1f5f9 !important;
            box-sizing: border-box !important;
        }

        #patients-table tbody td strong {
            font-size: 13px !important;
            color: #0f172a;
        }

        #patients-table tbody td button {
            height: 22px !important;
            line-height: 22px !important;
            padding: 0 8px !important;
            font-size: 11.5px !important;
            margin: 0 !important;
        }

        /* ── RIÊNG BẢNG NHÂN SỰ ADMIN: GỌN GÀNG, THẨM MỸ ── */
        #table-admin-employees thead th {
            padding: 3px 6px !important;
            font-size: 11px !important;
            font-weight: 700 !important;
            height: 24px !important;
            min-height: 24px !important;
            line-height: 20px !important;
            box-sizing: border-box !important;
        }

        #table-admin-employees tbody td {
            padding: 2px 6px !important;
            font-size: 11.5px !important;
            height: 24px !important;
            min-height: 24px !important;
            line-height: 20px !important;
            vertical-align: middle !important;
            border-bottom: 1.5px solid #cbd5e1 !important;
            border-right: 1px solid #f1f5f9 !important;
            box-sizing: border-box !important;
        }



        /* Tab Xếp lịch: toolbar gọn một dòng, nhường chiều cao cho bảng lịch trình */

        .schedule-compact-header {

            flex: 0 0 auto !important;

        }



        .schedule-compact-header>div {

            flex-wrap: nowrap !important;

            overflow: hidden;

        }



        .schedule-compact-header label,

        .schedule-compact-header button,

        .schedule-title-inline {

            white-space: nowrap !important;

        }



        .schedule-compact-header #schedule-result:empty {

            display: none !important;

        }



        #tab-schedule .schedule-table-wrap {

            height: auto !important;

            max-height: none !important;

            flex: 1 1 auto !important;

            min-height: 0 !important;

            overflow-y: auto !important;

        }



        #schedule-table {

            margin-top: 0 !important;

        }



        /* Tab Tiện ích: header + nạp file cùng dòng, bảng tự cuộn và ghim tiêu đề */

        #tab-utils.active {

            min-height: 0;

        }



        .utils-compact-header {

            position: sticky !important;

            top: -15px !important;

            z-index: 900 !important;

            flex-shrink: 0 !important;

        }



        .utils-split-layout {

            flex: 1 1 auto !important;

            min-height: 0 !important;

            align-items: stretch !important;

            margin-bottom: 0 !important;

        }



        .utils-split-layout>div {

            min-height: 0 !important;

        }



        .utils-table-scroll {

            min-height: 0 !important;

            overflow-y: auto !important;

            position: relative !important;

        }



        .utils-table-scroll table {

            margin-top: 0 !important;

        }



        .utils-table-scroll thead th {

            top: 0 !important;

            z-index: 880 !important;

        }



        /* ============================================================ */

        /* 📌 ĐÓNG ĐINH THANH PHÂN TRANG XUỐNG ĐÁY MÀN HÌNH (BẢN FIX) */

        /* ============================================================ */



        /* 1. Phá vỡ lệnh giấu nội dung của khung bảng, thả tự do cho thanh phân trang */

        .dashboard-table-card {

            overflow: visible !important;

        }



        /* 2. Phân trang - không sticky để tránh che nút action */

        #home-pagination-container,

        #sched-pagination-container,

        #sched-pagination {

            background: #fdfaf1 !important;

            border-top: 1px solid #c8d6b2 !important;

            margin: 0 !important;

        }



        /* Final header sizing: prevent the logo, unit name and clock from being clipped. */

        body {

            min-height: 100vh !important;

            height: 100vh !important;

        }



        .container {

            height: calc(100vh - 30px) !important;

            min-height: 0 !important;

        }



        .main-wrapper {

            height: 100% !important;

            min-height: 0 !important;

            overflow: hidden !important;

        }



        .header-fixed-section {

            overflow: visible !important;

            flex: 0 0 auto !important;

            min-height: 134px !important;

            background: #fff !important;

        }



        .hospital-banner-global {

            min-height: 94px !important;

            padding: 12px 18px 10px !important;

            display: grid !important;

            grid-template-columns: minmax(0, 1fr) auto !important;

            column-gap: 16px !important;

            align-items: center !important;

            overflow: visible !important;

        }



        .banner-left {

            min-width: 0 !important;

            gap: 14px !important;

            overflow: visible !important;

        }



        .banner-logo {

            width: 78px !important;

            height: 68px !important;

            object-fit: contain !important;

            flex: 0 0 78px !important;

        }



        .banner-text {
            min-width: 0 !important;
            display: flex !important;
            flex-direction: column !important;
            justify-content: center !important;
            align-items: center !important;
            text-align: center !important;
            overflow: visible !important;
        }

        .banner-text h1 {
            font-size: 16px !important;
            line-height: 1.18 !important;
            margin: 0 0 3px !important;
            white-space: normal !important;
            text-align: center !important;
            width: 100% !important;
        }

        .banner-text h2 {
            font-size: 13px !important;
            line-height: 1.18 !important;
            margin: 0 0 5px !important;
            padding-bottom: 3px !important;
            white-space: normal !important;
            text-align: center !important;
            width: 100% !important;
            border-bottom: none !important;
        }

        .banner-text p {
            font-size: 11px !important;
            line-height: 1.25 !important;
            padding: 3px 10px !important;
            white-space: normal !important;
            text-align: center !important;
            align-self: center !important;
            margin: 0 auto !important;
            display: inline-block !important;
        }

        .banner-right {

            flex: 0 0 auto !important;

            margin-left: 0 !important;

            padding-right: 12px !important;

            overflow: visible !important;

            justify-content: flex-end !important;

        }



        .banner-clock {

            min-width: 150px !important;

            padding: 4px 8px !important;

            text-align: center !important;

        }



        #clock-time {

            display: block !important;

            font-size: 20px !important;

            line-height: 1.15 !important;

            white-space: nowrap !important;

        }



        #clock-date {

            display: block !important;

            font-size: 12px !important;

            line-height: 1.25 !important;

            white-space: nowrap !important;

        }



        .global-marquee-container {

            min-height: 40px !important;

            display: grid !important;

            grid-template-columns: minmax(0, 1fr) auto !important;

            align-items: center !important;

            overflow: hidden !important;

        }



        #thong-bao-chay {

            min-width: 0 !important;

            line-height: 1.25 !important;

            padding: 4px 0 !important;

        }



        @media (max-width: 900px) {

            .hospital-banner-global {

                grid-template-columns: 1fr !important;

                row-gap: 6px !important;

            }



            .banner-right {

                justify-content: flex-start !important;

            }



            .banner-clock {

                min-width: 0 !important;

                text-align: left !important;

            }

        }

        /* ================= PREMIUM UI UPGRADES ================= */

        /* Table Row Hover & Aesthetics */

        table tbody tr {
            transition: background-color 0.2s ease;
        }

        table tbody tr:hover td {
            background-color: rgba(46, 204, 113, 0.08) !important;
            cursor: default;
        }



        /* Glassmorphism Header & Sticky Table Headers */

        .header-fixed-section {

            background: rgba(255, 255, 255, 0.85) !important;

            backdrop-filter: blur(12px);

            -webkit-backdrop-filter: blur(12px);

            border-bottom: 1px solid rgba(230, 126, 34, 0.3) !important;

            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);

        }



        table th {

            background: rgba(242, 242, 242, 0.9) !important;

            backdrop-filter: blur(8px);

            -webkit-backdrop-filter: blur(8px);

            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.02);

            z-index: 10;

        }



        /* Smooth Tab Transitions */

        .tab-content {
            animation: smoothSlideUp 0.35s cubic-bezier(0.2, 0.8, 0.2, 1) forwards !important;
        }

        @keyframes smoothSlideUp {

            from {
                opacity: 0;
                transform: translateY(12px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }

        }



        /* Forms & Inputs Depth */

        .form-section,
        .sidebar-form {

            background: rgba(255, 255, 255, 0.95);

            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05);

            border-radius: 10px;

            border: 1px solid rgba(0, 0, 0, 0.04);

            transition: box-shadow 0.3s;


            max-height: calc(100vh - 240px) !important;
            overflow-y: auto !important;
        }

        .form-section:hover,
        .sidebar-form:hover {
            box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
        }



        .form-group input,
        .form-group select,
        .form-group textarea {

            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);

            border: 1px solid #ddd;

        }

        .form-group input:focus,
        .form-group select:focus,
        .form-group textarea:focus {

            border-color: #27ae60;

            box-shadow: 0 0 0 3px rgba(39, 174, 96, 0.2);

            outline: none;

        }



        /* Ripple Buttons */

        button {
            position: relative;
            overflow: hidden;
        }

        button::after {

            content: '';
            position: absolute;
            top: 50%;
            left: 50%;

            width: 5px;
            height: 5px;
            background: rgba(255, 255, 255, 0.4);

            opacity: 0;
            border-radius: 100%;

            transform: scale(1, 1) translate(-50%, -50%);
            transform-origin: 50% 50%;

        }

        button:focus:not(:active)::after {
            animation: ripple 0.6s ease-out;
        }

        @keyframes ripple {

            0% {
                transform: scale(0, 0);
                opacity: 0.5;
            }

            100% {
                transform: scale(30, 30);
                opacity: 0;
            }

        }

        /* --- PREMIUM TOAST NOTIFICATION SYSTEM --- */
        .toast-container {
            position: fixed;
            top: 24px;
            right: 24px;
            z-index: 1000000;
            display: flex;
            flex-direction: column;
            gap: 12px;
            pointer-events: none;
        }

        .toast-card {
            background: rgba(255, 255, 255, 0.95);
            border-left: 5px solid #1abc9c;
            color: #2c3e50;
            padding: 14px 18px;
            border-radius: 8px;
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
            display: flex;
            align-items: center;
            gap: 10px;
            min-width: 280px;
            max-width: 420px;
            font-size: 13px;
            font-weight: 600;
            backdrop-filter: blur(8px);
            pointer-events: auto;
            transform: translateX(120%);
            opacity: 0;
            transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        }

        .toast-card.show {
            transform: translateX(0);
            opacity: 1;
        }

        .toast-card.hide {
            transform: translateX(120%);
            opacity: 0;
        }

        .toast-card.success {
            border-left-color: #2ecc71;
            background: linear-gradient(135deg, #ffffff, #f4fbf7);
        }

        .toast-card.error {
            border-left-color: #e74c3c;
            background: linear-gradient(135deg, #ffffff, #fdf6f5);
        }

        .toast-card.info {
            border-left-color: #3498db;
            background: linear-gradient(135deg, #ffffff, #f6faff);
        }

        .toast-icon {
            font-size: 18px;
            flex-shrink: 0;
        }

        .toast-message {
            flex-grow: 1;
            line-height: 1.4;
        }

        /* --- USER DROPDOWN MENU STYLE --- */
        #nav-btn-user:hover {
            background: #cbd5e1 !important;
            border-color: #94a3b8 !important;
        }


/* ============================================================ */
/* 💡 SMART UNSCHEDULED ADVISOR STYLES                          */
/* ============================================================ */
.rescue-card {
    background: #ffffff;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
    padding: 18px;
    margin-bottom: 16px;
    transition: all 0.2s ease-in-out;
}
.rescue-card:hover {
    border-color: #93c5fd;
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.08);
}
.rescue-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: 12px;
    border-bottom: 1px solid #f1f5f9;
    margin-bottom: 14px;
}
.rescue-pat-name {
    font-size: 15px;
    font-weight: 800;
    color: #1e293b;
    margin: 0;
}
.rescue-proc-name {
    font-size: 13.5px;
    font-weight: 700;
    color: #2563eb;
    margin-top: 2px;
}
.rescue-badge-cause {
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 11.5px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.rescue-badge-cause.cause-BOTTLENECK_MACHINE {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}
.rescue-badge-cause.cause-STAFF_UNAVAILABLE {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fcd34d;
}
.rescue-badge-cause.cause-OUTPATIENT_SESSION_LIMIT {
    background: #ffedd5;
    color: #9a3412;
    border: 1px solid #fdba74;
}
.rescue-badge-cause.cause-PATIENT_TIME_WINDOW {
    background: #dbeafe;
    color: #1e40af;
    border: 1px solid #93c5fd;
}
.rescue-badge-cause.cause-INTERNAL_PATIENT_CLASH {
    background: #f3e8ff;
    color: #6b21a8;
    border: 1px solid #d8b4fe;
}
.rescue-cause-detail {
    font-size: 13px;
    color: #475569;
    line-height: 1.5;
    background: #f8fafc;
    padding: 10px 14px;
    border-radius: 8px;
    border-left: 4px solid #3b82f6;
    margin-bottom: 14px;
}
.rescue-advices-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.rescue-advice-item {
    background: #ffffff;
    border: 1.5px solid #cbd5e1;
    border-radius: 10px;
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all 0.2s ease;
}
.rescue-advice-item:hover {
    border-color: #3b82f6;
    background: #f0f9ff;
    transform: translateY(-1px);
}
.rescue-advice-info {
    flex: 1;
    padding-right: 15px;
}
.rescue-advice-title {
    font-size: 13.5px;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 3px;
}
.rescue-advice-desc {
    font-size: 12px;
    color: #64748b;
    line-height: 1.4;
}
.btn-rescue-apply {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: #ffffff;
    border: none;
    padding: 9px 18px;
    font-size: 12.5px;
    font-weight: 700;
    border-radius: 8px;
    cursor: pointer;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(16, 185, 129, 0.3);
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.btn-rescue-apply:hover {
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4);
    transform: scale(1.02);
}

.proc-time-range-badge {
    background: #e0f2fe;
    color: #0369a1;
    border: 1px solid #bae6fd;
    padding: 2px 8px;
    border-radius: 12px;
    font-weight: 700;
    font-size: 11.5px;
    display: inline-block;
}
.proc-time-single {
    font-weight: 600;
    color: #334155;
}



        /* Tùy chỉnh giao diện cho ô nhập ngày tháng của Flatpickr */
        input.flatpickr-input[type="text"] {
            border: 1px solid #ccc;
            outline: none;
            font-weight: bold;
            color: #2c3e50;
            cursor: pointer;
            background: #fff;
            padding: 5px 10px;
            border-radius: 4px;
            font-size: 14px;
            font-family: inherit;
            width: 110px;
            text-align: center;
            transition: all 0.3s;
            box-sizing: border-box;
            height: 32px;
        }

        input.flatpickr-input[type="text"]:hover {
            border-color: #3498db;
        }

        input.flatpickr-input[type="text"]:focus {
            border-color: #27ae60;
transition: box-shadow 0.3s;


            max-height: calc(100vh - 240px) !important;
            overflow-y: auto !important;
        }

        .form-section:hover,
        .sidebar-form:hover {
            box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
        }



        .form-group input,
        .form-group select,
        .form-group textarea {

            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);

            border: 1px solid #ddd;

        }

        .form-group input:focus,
        .form-group select:focus,
        .form-group textarea:focus {

            border-color: #27ae60;

            box-shadow: 0 0 0 3px rgba(39, 174, 96, 0.2);

            outline: none;

        }



        /* Ripple Buttons */

        button {
            position: relative;
            overflow: hidden;
        }

        button::after {

            content: '';
            position: absolute;
            top: 50%;
            left: 50%;

            width: 5px;
            height: 5px;
            background: rgba(255, 255, 255, 0.4);

            opacity: 0;
            border-radius: 100%;

            transform: scale(1, 1) translate(-50%, -50%);
            transform-origin: 50% 50%;

        }

        button:focus:not(:active)::after {
            animation: ripple 0.6s ease-out;
        }

        @keyframes ripple {

            0% {
                transform: scale(0, 0);
                opacity: 0.5;
            }

            100% {
                transform: scale(30, 30);
                opacity: 0;
            }

        }

        /* --- PREMIUM TOAST NOTIFICATION SYSTEM --- */
        .toast-container {
            position: fixed;
            top: 24px;
            right: 24px;
            z-index: 1000000;
            display: flex;
            flex-direction: column;
            gap: 12px;
            pointer-events: none;
        }

        .toast-card {
            background: rgba(255, 255, 255, 0.95);
            border-left: 5px solid #1abc9c;
            color: #2c3e50;
            padding: 14px 18px;
            border-radius: 8px;
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
            display: flex;
            align-items: center;
            gap: 10px;
            min-width: 280px;
            max-width: 420px;
            font-size: 13px;
            font-weight: 600;
            backdrop-filter: blur(8px);
            pointer-events: auto;
            transform: translateX(120%);
            opacity: 0;
            transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        }

        .toast-card.show {
            transform: translateX(0);
            opacity: 1;
        }

        .toast-card.hide {
            transform: translateX(120%);
            opacity: 0;
        }

        .toast-card.success {
            border-left-color: #2ecc71;
            background: linear-gradient(135deg, #ffffff, #f4fbf7);
        }

        .toast-card.error {
            border-left-color: #e74c3c;
            background: linear-gradient(135deg, #ffffff, #fdf6f5);
        }

        .toast-card.info {
            border-left-color: #3498db;
            background: linear-gradient(135deg, #ffffff, #f6faff);
        }

        .toast-icon {
            font-size: 18px;
            flex-shrink: 0;
        }

        .toast-message {
            flex-grow: 1;
            line-height: 1.4;
        }


        /* Tùy chỉnh giao diện cho ô nhập ngày tháng của Flatpickr */
        input.flatpickr-input[type="text"] {
            border: 1px solid #ccc;
            outline: none;
            font-weight: bold;
            color: #2c3e50;
            cursor: pointer;
            background: #fff;
            padding: 5px 10px;
            border-radius: 4px;
            font-size: 14px;
            font-family: inherit;
            width: 110px;
            text-align: center;
            transition: all 0.3s;
            box-sizing: border-box;
            height: 32px;
        }

        input.flatpickr-input[type="text"]:hover {
            border-color: #3498db;
        }

        input.flatpickr-input[type="text"]:focus {
            border-color: #27ae60;
            box-shadow: 0 0 0 2px rgba(39, 174, 96, 0.2);
        }

        /* Ẩn viền chữ nhật đối với ô chọn ngày ở Dashboard (đã có wrapper bo tròn) */
        input.dashboard-date {
            border: none !important;
            background: transparent !important;
            box-shadow: none !important;
            padding: 0 4px !important;
            width: 90px !important;
        }

        input.dashboard-date:focus {
            border: none !important;
            box-shadow: none !important;
        }

        /* --- BẢNG CHẤM CÔNG & THỐNG KÊ SIÊU GỌN (ULTRA-COMPACT 19PX) --- */
        #table-chamcong, #table-thongke, #table-preview-thuthuat {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0;
            white-space: nowrap;
            font-size: 11px;
        }
        #table-chamcong th, #table-chamcong td,
        #table-thongke th, #table-thongke td,
        #table-preview-thuthuat th, #table-preview-thuthuat td {
            padding: 0 1px !important;
            text-align: center;
            vertical-align: middle;
            border-bottom: 1px solid #cbd5e1;
            border-right: 1px solid #cbd5e1;
            background-color: #ffffff;
            font-size: 11px;
            height: 19px !important;
            box-sizing: border-box;
            line-height: 18px;
        }
        #table-chamcong tbody tr,
        #table-thongke tbody tr,
        #table-preview-thuthuat tbody tr {
            height: 19px !important;
        }
        #table-chamcong tbody td,
        #table-thongke tbody td,
        #table-preview-thuthuat tbody td {
            position: static;
        }

        /* 1. THEAD BẢNG CHẤM CÔNG */
        #table-chamcong thead th {
            background-color: #275d38 !important;
            font-weight: 700 !important;
            font-size: 10.5px !important;
            text-transform: uppercase;
            letter-spacing: 0.1px;
            color: #ffffff !important;
            position: sticky !important;
            z-index: 20 !important;
            padding: 0 !important;
            margin: 0 !important;
            height: 16px !important;
            min-height: 16px !important;
            max-height: 16px !important;
            line-height: 16px !important;
            box-shadow: none !important;
            border-bottom: 1px solid #cbd5e1 !important;
            border-right: 1px solid #cbd5e1 !important;
        }
        #table-chamcong thead tr:first-child th {
            top: 0 !important;
            z-index: 30 !important;
            height: 16px !important;
            min-height: 16px !important;
            max-height: 16px !important;
            line-height: 16px !important;
            background-color: #275d38 !important;
            color: #ffffff !important;
            padding: 0 !important;
            font-size: 10.5px !important;
            border-bottom: 1px solid #1e462a !important;
        }
        #table-chamcong thead tr:nth-child(2) th {
            top: 16px !important;
            z-index: 25 !important;
            font-size: 9.5px !important;
            background-color: #1e462a !important;
            color: #ffffff !important;
            font-weight: 600 !important;
            padding: 0 !important;
            height: 14px !important;
            min-height: 14px !important;
            max-height: 14px !important;
            line-height: 14px !important;
            border-bottom: 1px solid #cbd5e1 !important;
        }
        #table-chamcong thead tr:first-child th[rowspan="2"] {
            height: 30px !important;
            min-height: 30px !important;
            max-height: 30px !important;
            line-height: 30px !important;
            padding: 0 2px !important;
            vertical-align: middle !important;
        }

        /* 2. CÁC CỘT GHIM CỐ ĐỊNH BẢNG CHẤM CÔNG */
        #table-chamcong thead tr:first-child th:first-child {
            position: sticky !important;
            top: 0 !important;
            left: 0 !important;
            z-index: 45 !important;
            background-color: #275d38 !important;
            color: #ffffff !important;
            font-weight: 800 !important;
            font-size: 11px !important;
            text-align: center;
            border-right: 2px solid #cbd5e1 !important;
            width: 190px !important;
            min-width: 190px !important;
            max-width: 190px !important;
        }
        #table-chamcong tbody td:first-child {
            position: sticky !important;
            left: 0 !important;
            z-index: 12 !important;
            text-align: left;
            padding: 0 8px !important;
            font-weight: 600;
            font-size: 11.5px !important;
            color: #1e293b !important;
            border-right: 2px solid #cbd5e1;
            background-color: #ffffff !important;
            width: 190px !important;
            min-width: 190px !important;
            max-width: 190px !important;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: clip;
            line-height: 19px;
        }

        #table-chamcong thead tr:first-child th:nth-child(2) {
            position: sticky !important;
            top: 0 !important;
            left: 190px !important;
            z-index: 45 !important;
            background-color: #275d38 !important;
            color: #ffffff !important;
            font-weight: 800 !important;
            font-size: 11px !important;
            text-align: center;
            border-right: 1.5px solid #cbd5e1 !important;
            width: 48px !important;
            min-width: 48px !important;
            max-width: 48px !important;
        }
        #table-chamcong tbody td:nth-child(2) {
            position: sticky !important;
            left: 190px !important;
            z-index: 12 !important;
            text-align: center;
            border-right: 1.5px solid #cbd5e1;
            background-color: #ffffff !important;
            width: 48px !important;
            min-width: 48px !important;
            max-width: 48px !important;
            padding: 0 !important;
        }

        #table-chamcong thead tr:first-child th:last-child {
            position: sticky !important;
            top: 0 !important;
            right: 0 !important;
            z-index: 45 !important;
            background-color: #275d38 !important;
            color: #ffffff !important;
            font-weight: 800 !important;
            font-size: 11px !important;
            text-align: center;
            border-left: 2px solid #cbd5e1 !important;
        }
        #table-chamcong tbody td:last-child {
            position: sticky !important;
            right: 0 !important;
            z-index: 12 !important;
            text-align: center;
            border-left: 2px solid #cbd5e1;
            background-color: #ffffff !important;
            width: 58px;
            min-width: 58px;
            max-width: 58px;
            font-size: 11.5px;
            font-weight: 800;
            color: #2563eb !important;
            padding: 0 1px !important;
        }

        /* 3. NGÀY NGHỈ & HÔM NAY */
        #table-chamcong thead th.bg-holiday {
            background-color: #fef08a !important;
            color: #854d0e !important;
            font-weight: 800 !important;
        }
        #table-chamcong tbody td.bg-holiday {
            background-color: #fff9c4 !important;
        }
        #table-chamcong tbody td.bg-holiday .cc-input-text {
            background-color: #fffde7;
            border-color: #fde047;
        }
        #table-chamcong tbody td.bg-holiday .cc-input-text:focus {
            background-color: #eff6ff !important;
            border-color: #2563eb !important;
            box-shadow: 0 0 0 1px rgba(37,99,235,0.4);
        }
        #table-chamcong th.col-today {
            background: #1d4ed8 !important;
            color: #ffffff !important;
            font-weight: 800 !important;
            border-left: 2px solid #3b82f6 !important;
            border-right: 2px solid #3b82f6 !important;
        }
        #table-chamcong th.th-today-sub {
            background: #1e40af !important;
            color: #eff6ff !important;
            font-weight: 700 !important;
            border-left: 2px solid #3b82f6 !important;
            border-right: 2px solid #3b82f6 !important;
        }
        #table-chamcong td.col-today {
            background-color: #eff6ff !important;
            border-left: 2px solid #93c5fd !important;
            border-right: 2px solid #93c5fd !important;
        }
        #table-chamcong td.col-today .cc-input-text {
            border: 1px solid #3b82f6 !important;
            background: #ffffff !important;
            color: #1d4ed8 !important;
            font-weight: 800 !important;
        }

        /* 4. HOVER HÀNG */
        #table-chamcong tbody tr:hover td,
        #table-thongke tbody tr:hover td,
        #table-preview-thuthuat tbody tr:hover td {
            background-color: #f1f5f9;
        }
        #table-chamcong tbody tr:hover td.bg-holiday {
            background-color: #fff0b3 !important;
        }
        #table-chamcong tbody tr:hover td.col-today {
            background-color: #dbeafe !important;
        }
        #table-chamcong tbody tr:hover td:first-child,
        #table-chamcong tbody tr:hover td:nth-child(2),
        #table-thongke tbody tr:hover td:first-child,
        #table-preview-thuthuat tbody tr:hover td:first-child {
            background-color: #f1f5f9 !important;
            color: #1e293b !important;
            z-index: 15 !important;
        }
        #table-chamcong tbody tr:hover td:last-child {
            background-color: #f1f5f9 !important;
            color: #2563eb !important;
            z-index: 15 !important;
        }

        /* 5. Ô NHẬP LIỆU ULTRA-COMPACT */
        #table-chamcong .heso-input {
            width: 42px !important;
            height: 22px !important;
            text-align: center !important;
            font-weight: 800 !important;
            font-size: 13px !important;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
            font-variant-numeric: tabular-nums !important;
            border: 1.5px solid #94a3b8 !important;
            border-radius: 4px !important;
            background: #ffffff !important;
            color: #0f172a !important;
            outline: none !important;
            padding: 0 !important;
            margin: 0 auto !important;
            display: inline-block !important;
            line-height: 20px !important;
            box-shadow: inset 0 1px 2px rgba(0,0,0,0.05) !important;
            -moz-appearance: textfield !important;
            appearance: textfield !important;
        }
        #table-chamcong .heso-input::-webkit-outer-spin-button,
        #table-chamcong .heso-input::-webkit-inner-spin-button {
            -webkit-appearance: none !important;
            margin: 0 !important;
        }
        #table-chamcong .heso-input:focus {
            border-color: #2563eb !important;
            box-shadow: 0 0 0 2px rgba(37,99,235,0.25) !important;
            background: #eff6ff !important;
            color: #1d4ed8 !important;
        }
        #table-chamcong .heso-input.heso-fraction {
            color: #b45309 !important;
            background: #fffbeb !important;
            border-color: #f59e0b !important;
        }
        #table-chamcong .cc-input-text {
            width: 26px !important;
            height: 19px !important;
            min-height: 19px !important;
            max-height: 20px !important;
            padding: 0 !important;
            margin: 0 auto !important;
            display: block !important;
            text-align: center;
            font-weight: 700;
            font-size: 10px !important;
            letter-spacing: -0.2px;
            line-height: 19px !important;
            border: 1px solid #cbd5e1;
            border-radius: 3px;
            background: #fff;
            color: #1d4ed8;
            outline: none;
            text-transform: uppercase;
            box-sizing: border-box !important;
            transition: all 0.15s ease;
        }
        #table-chamcong .cc-input-text:focus {
            border-color: #2563eb;
            box-shadow: 0 0 0 1px rgba(37,99,235,0.4);
            background: #eff6ff;
        }
        #table-chamcong .cc-input-text.cc-sunday-input {
            border-color: #fef08a !important;
            background: #fffbeb !important;
        }
        #table-chamcong .cc-input-text.cc-sunday-input::placeholder {
            color: #a16207 !important;
            font-style: italic !important;
            font-size: 9.5px !important;
            font-weight: 700 !important;
            opacity: 0.9 !important;
            text-transform: none !important;
        }
        #table-chamcong .cc-input-text.cc-sunday-input:focus {
            border-color: #d97706 !important;
            box-shadow: 0 0 0 1.5px rgba(217, 119, 6, 0.4) !important;
            background: #ffffff !important;
        }
        /* Ký hiệu Lễ, Tết (Màu đỏ tươi lễ hội) */
        #table-chamcong .cc-input-text[value="LỄ"],
        #table-chamcong .cc-input-text[value="LE"],
        #table-chamcong .cc-input-text[value="Lễ"],
        #table-chamcong .cc-input-text[value="TẾT"],
        #table-chamcong .cc-input-text[value="TET"],
        #table-chamcong .cc-input-text[value="Tết"] {
            color: #b91c1c !important;
            background-color: #fee2e2 !important;
            border-color: #fca5a5 !important;
            font-weight: 800 !important;
        }

        /* Ký hiệu Nội trú (Màu xanh dương đậm) */
        #table-chamcong .cc-input-text[value="NỘI"],
        #table-chamcong .cc-input-text[value="NOI"],
        #table-chamcong .cc-input-text[value="Nội"] {
            color: #1d4ed8 !important;
            background-color: #dbeafe !important;
            border-color: #93c5fd !important;
            font-weight: 800 !important;
        }

        /* Ký hiệu Thai sản, Dã ngoại (Màu tím) */
        #table-chamcong .cc-input-text[value="TS"],
        #table-chamcong .cc-input-text[value="ĐK"],
        #table-chamcong .cc-input-text[value="DK"] {
            color: #6d28d9 !important;
            background-color: #f3e8ff !important;
            border-color: #d8b4fe !important;
            font-weight: 800 !important;
        }

        /* Ký hiệu Nghỉ ốm Ô (Màu cam đậm) */
        #table-chamcong .cc-input-text[value="Ô"],
        #table-chamcong .cc-input-text[value="O"] {
            color: #c2410c !important;
            background-color: #ffedd5 !important;
            border-color: #fed7aa !important;
            font-weight: 800 !important;
        }

        /* Ký hiệu Học, Phép, Bù (Màu vàng hổ phách/nâu) */
        #table-chamcong .cc-input-text[value="H"],
        #table-chamcong .cc-input-text[value="F"],
        #table-chamcong .cc-input-text[value="B"] {
            color: #b45309 !important;
            background-color: #fef3c7 !important;
            border-color: #fde68a !important;
            font-weight: 700 !important;
        }

        /* Ký hiệu Nửa công X/2 (Màu xanh mòng két) */
        #table-chamcong .cc-input-text[value="X/2"],
        #table-chamcong .cc-input-text[value="1/2"] {
            color: #0f766e !important;
            background-color: #ccfbf1 !important;
            border-color: #99f6e4 !important;
            font-weight: 800 !important;
        }

        /* Ký hiệu Sáng, Chiều (Màu xanh ngọc bích) */
        #table-chamcong .cc-input-text[value="S"],
        #table-chamcong .cc-input-text[value="C"] {
            color: #047857 !important;
            background-color: #d1fae5 !important;
            border-color: #a7f3d0 !important;
            font-weight: 700 !important;
        }

        [data-theme="dark"] #table-chamcong .cc-input-text {
            background-color: #1e293b !important;
            color: #60a5fa !important;
            border-color: #334155 !important;
        }
        [data-theme="dark"] #table-chamcong .cc-input-text[value="LỄ"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="LE"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="Lễ"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="TẾT"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="TET"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="Tết"] {
            color: #fca5a5 !important;
            background-color: #450a0a !important;
            border-color: #7f1d1d !important;
        }
        [data-theme="dark"] #table-chamcong .cc-input-text[value="NỘI"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="NOI"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="Nội"] {
            color: #93c5fd !important;
            background-color: #172554 !important;
            border-color: #1e40af !important;
        }
        [data-theme="dark"] #table-chamcong .cc-input-text[value="TS"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="ĐK"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="DK"] {
            color: #d8b4fe !important;
            background-color: #3b0764 !important;
            border-color: #581c87 !important;
        }
        [data-theme="dark"] #table-chamcong .cc-input-text[value="Ô"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="O"] {
            color: #fdba74 !important;
            background-color: #431407 !important;
            border-color: #9a3412 !important;
        }
        [data-theme="dark"] #table-chamcong .cc-input-text[value="H"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="F"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="B"] {
            color: #fde68a !important;
            background-color: #451a03 !important;
            border-color: #78350f !important;
        }
        [data-theme="dark"] #table-chamcong .cc-input-text[value="X/2"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="1/2"] {
            color: #5eead4 !important;
            background-color: #042f2e !important;
            border-color: #115e59 !important;
        }
        [data-theme="dark"] #table-chamcong .cc-input-text[value="S"],
        [data-theme="dark"] #table-chamcong .cc-input-text[value="C"] {
            color: #6ee7b7 !important;
            background-color: #022c22 !important;
            border-color: #065f46 !important;
        }

        /* 5.1. BẢNG KÝ HIỆU CHẤM CÔNG DƯỚI BẢNG & TÙY BIẾN ĐỘNG */
        .chamcong-legend-wrapper {
            background-color: #f8fafc;
            border: 1px solid #e2e8f0;
            border-radius: 6px;
            transition: all 0.2s ease;
        }
        [data-theme="dark"] .chamcong-legend-wrapper {
            background-color: #1e293b !important;
            border-color: #334155 !important;
        }
        [data-theme="dark"] .chamcong-legend-wrapper .cc-leg-header,
        [data-theme="dark"] .chamcong-legend-wrapper .cc-leg-label,
        [data-theme="dark"] .chamcong-legend-wrapper .cc-leg-sub {
            color: #cbd5e1 !important;
        }
        [data-theme="dark"] .chamcong-legend-wrapper .cc-leg-divider {
            border-bottom-color: #334155 !important;
        }
        [data-theme="dark"] .chamcong-legend-wrapper b {
            color: #60a5fa !important;
        }
        .cc-symbol-chip {
            cursor: pointer;
            transition: transform 0.15s ease, box-shadow 0.15s ease;
        }
        .cc-symbol-chip:hover {
            transform: translateY(-1px);
            box-shadow: 0 2px 5px rgba(0,0,0,0.12);
        }

        /* 5.2. SUB-TAB & ĐIỀU HƯỚNG TAB CHẤM CÔNG */
        .chamcong-subnav {
            display: flex;
            gap: 4px;
            background: #f1f5f9;
            padding: 3px;
            border-radius: 6px;
            border: 1px solid #e2e8f0;
        }
        [data-theme="dark"] .chamcong-subnav {
            background: #0f172a;
            border-color: #334155;
        }
        .chamcong-subtab-btn {
            padding: 4px 12px;
            font-size: 12px;
            font-weight: 600;
            border-radius: 4px;
            border: none;
            background: transparent;
            color: #64748b;
            cursor: pointer;
            transition: all 0.2s ease;
            display: inline-flex;
            align-items: center;
            gap: 5px;
        }
        .chamcong-subtab-btn:hover {
            color: #1e293b;
            background: rgba(255,255,255,0.6);
        }
        .chamcong-subtab-btn.active {
            background: #ffffff;
            color: #2563eb;
            box-shadow: 0 1px 3px rgba(0,0,0,0.08);
        }
        [data-theme="dark"] .chamcong-subtab-btn {
            color: #94a3b8;
        }
        [data-theme="dark"] .chamcong-subtab-btn:hover {
            color: #f8fafc;
            background: rgba(51,65,85,0.5);
        }
        [data-theme="dark"] .chamcong-subtab-btn.active {
            background: #1e293b;
            color: #60a5fa;
            box-shadow: 0 1px 3px rgba(0,0,0,0.3);
        }

        /* 5.3. KÉO THẢ SẮP XẾP NHÂN SỰ CHẤM CÔNG (DRAG & DROP) */
        .drag-handle {
            cursor: grab;
            user-select: none;
            font-size: 15px;
            color: #94a3b8;
            transition: color 0.15s, transform 0.15s;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 2px 4px;
            border-radius: 3px;
        }
        .drag-handle:hover {
            color: #2563eb;
            background: #eff6ff;
            transform: scale(1.1);
        }
        .drag-handle:active {
            cursor: grabbing;
        }
        [data-theme="dark"] .drag-handle:hover {
            color: #60a5fa;
            background: #1e293b;
        }
        tr.dragging-row {
            opacity: 0.35;
            background-color: #eff6ff !important;
        }
        tr.drag-over-row {
            border-top: 3px solid #2563eb !important;
        }
        .btn-quick-move {
            border: 1px solid #cbd5e1;
            background: #f8fafc;
            color: #475569;
            border-radius: 3px;
            width: 18px;
            height: 18px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 9px;
            cursor: pointer;
            padding: 0;
            transition: all 0.15s;
        }
        .btn-quick-move:hover {
            background: #2563eb;
            color: #ffffff;
            border-color: #2563eb;
        }
        [data-theme="dark"] .btn-quick-move {
            background: #1e293b;
            border-color: #334155;
            color: #94a3b8;
        }
        [data-theme="dark"] .btn-quick-move:hover {
            background: #3b82f6;
            color: #ffffff;
            border-color: #3b82f6;
        }

        /* 6. THEAD BẢNG THỐNG KÊ & PREVIEW */
        #table-thongke thead th,
        #table-preview-thuthuat thead th {
            background-color: #275d38 !important;
            font-weight: 700 !important;
            font-size: 10.5px !important;
            text-transform: uppercase;
            letter-spacing: 0.1px;
            color: #ffffff !important;
            position: sticky !important;
            top: 0 !important;
            z-index: 20 !important;
            padding: 0 4px !important;
            margin: 0 !important;
            height: 20px !important;
            min-height: 20px !important;
            max-height: 20px !important;
            line-height: 20px !important;
            box-shadow: none !important;
            border-bottom: 1px solid #cbd5e1 !important;
            border-right: 1px solid #cbd5e1 !important;
        }
        #table-thongke thead th:first-child,
        #table-preview-thuthuat thead th:first-child {
            position: sticky !important;
            top: 0 !important;
            left: 0 !important;
            z-index: 45 !important;
            background-color: #275d38 !important;
            color: #ffffff !important;
            font-weight: 800 !important;
            font-size: 11px !important;
            text-align: center;
            border-right: 2px solid #cbd5e1 !important;
            width: 200px !important;
            min-width: 200px !important;
            max-width: 200px !important;
        }
        #table-thongke tbody td:first-child,
        #table-preview-thuthuat tbody td:first-child {
            position: sticky !important;
            left: 0 !important;
            z-index: 12 !important;
            text-align: left;
            padding: 0 8px !important;
            font-weight: 600;
            font-size: 11.5px !important;
            color: #1e293b !important;
            border-right: 2px solid #cbd5e1;
            background-color: #ffffff !important;
            width: 200px !important;
            min-width: 200px !important;
            max-width: 200px !important;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: clip;
            line-height: 19px;
        }

        /* 7. THANH CUỘN NGANG */
        #table-chamcong-container, #main-thongke-container {
            scrollbar-width: auto;
            scrollbar-color: #94a3b8 #f1f5f9;
        }
        #table-chamcong-container::-webkit-scrollbar,
        #main-thongke-container::-webkit-scrollbar {
            height: 8px !important;
            width: 8px !important;
            display: block !important;
        }
        #table-chamcong-container::-webkit-scrollbar-thumb,
        #main-thongke-container::-webkit-scrollbar-thumb {
            background: #94a3b8 !important;
            border-radius: 4px;
            border: 1px solid #f1f5f9;
        }
        #table-chamcong-container::-webkit-scrollbar-thumb:hover,
        #main-thongke-container::-webkit-scrollbar-thumb:hover {
            background: #64748b !important;
        }

        /* ── 8. DASHBOARD MONTHLY CHARTS (TRANG CHỦ) ── */
        .dashboard-monthly-charts {
            margin-bottom: 25px;
        }
        @media (max-width: 960px) {
            .dashboard-monthly-charts {
                grid-template-columns: 1fr !important;
            }
        }


        #table-chamcong tbody tr.chamcong-total-row td {
            background-color: #f1f5f9 !important;
            font-weight: 800 !important;
            border-top: 2px solid #94a3b8 !important;
            border-bottom: 2px solid #94a3b8 !important;
            height: 22px !important;
            line-height: 22px !important;
        }
        #table-chamcong tbody tr.chamcong-total-row td:first-child {
            background-color: #f1f5f9 !important;
            font-weight: 800 !important;
            color: #0f172a !important;
            text-transform: uppercase;
        }
        #table-chamcong tbody tr.chamcong-total-row td:nth-child(2) {
            background-color: #f1f5f9 !important;
            color: #64748b !important;
        }
        #table-chamcong tbody tr.chamcong-total-row td:last-child {
            background-color: #f1f5f9 !important;
            color: #1d4ed8 !important;
            font-weight: 900 !important;
            font-size: 12px !important;
        }


/* ========================================================
   SORTABLE DRAG & DROP STYLES (v3 Cloudflare)
   ======================================================== */
.sortable-ghost {
    opacity: 0.35 !important;
    background-color: #dbeafe !important;
    outline: 2px dashed #3b82f6 !important;
}

.sortable-chosen {
    background-color: #eff6ff !important;
}

.drag-handle {
    cursor: grab !important;
    user-select: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 3px 6px !important;
    border-radius: 4px !important;
    font-size: 14px !important;
    color: #64748b !important;
    transition: all 0.15s ease !important;
}

.drag-handle:hover {
    background: rgba(0, 0, 0, 0.08) !important;
    color: #1e293b !important;
}

.drag-handle:active {
    cursor: grabbing !important;
}


        /* ── BẢNG BẬN & RA VIỆN: TÊN BỆNH NHÂN TRÊN 1 DÒNG ── */
        #busy-pat-table, #leave-pat-table {
            width: 100%;
            min-width: 370px;
            table-layout: auto;
        }

        #busy-pat-table th:nth-child(1), #leave-pat-table th:nth-child(1),
        #busy-pat-table td:nth-child(1), #leave-pat-table td:nth-child(1) {
            width: 32px !important;
            min-width: 30px !important;
            max-width: 36px !important;
            text-align: center !important;
            padding: 4px 2px !important;
        }

        #busy-pat-table th:nth-child(2), #leave-pat-table th:nth-child(2),
        #busy-pat-table td:nth-child(2), #leave-pat-table td:nth-child(2) {
            white-space: nowrap !important;
            text-align: left !important;
            padding: 4px 8px !important;
            font-weight: 600 !important;
        }

        #busy-pat-table th:nth-child(3), #leave-pat-table th:nth-child(3),
        #busy-pat-table td:nth-child(3), #leave-pat-table td:nth-child(3) {
            width: 65px !important;
            min-width: 60px !important;
            max-width: 72px !important;
            text-align: center !important;
            padding: 4px 2px !important;
            white-space: nowrap !important;
            font-size: 11.5px !important;
        }

        #busy-pat-table th:nth-child(4), #leave-pat-table th:nth-child(4),
        #busy-pat-table td:nth-child(4), #leave-pat-table td:nth-child(4) {
            width: 75px !important;
            min-width: 68px !important;
            max-width: 90px !important;
            text-align: center !important;
            padding: 4px 4px !important;
            white-space: nowrap !important;
            font-size: 11.5px !important;
        }

        /* Cột Giờ Bận BN: rộng từ 100px trở lên để hiển thị đầy đủ khoảng giờ dạng HH:mm-HH:mm */
        #busy-pat-table th:nth-child(5),
        #busy-pat-table td:nth-child(5) {
            width: 110px !important;
            min-width: 100px !important;
            text-align: center !important;
            padding: 4px 6px !important;
            white-space: nowrap !important;
            font-size: 12.5px !important;
            font-weight: 700 !important;
            font-family: 'Consolas', 'Roboto Mono', monospace, sans-serif !important;
            color: #d35400 !important;
        }

        /* Cột Giờ Ra Viện */
        #leave-pat-table th:nth-child(5),
        #leave-pat-table td:nth-child(5) {
            width: 80px !important;
            min-width: 75px !important;
            text-align: center !important;
            padding: 4px 6px !important;
            white-space: nowrap !important;
            font-size: 12.5px !important;
            font-weight: 700 !important;
            font-family: 'Consolas', 'Roboto Mono', monospace, sans-serif !important;
            color: #8e44ad !important;
        }

        /* ── TAB GIỜ BẬN & RA VIỆN: GHIM FORM NHẬP VÀ TIÊU ĐỀ BẢNG ── */
        #tab-busy .split-layout {
            display: flex !important;
            gap: 15px !important;
            align-items: stretch !important;
            height: calc(100vh - 160px) !important;
            min-height: 480px !important;
            overflow-x: auto !important;
        }

        #tab-busy .busy-col-card {
            display: flex !important;
            flex-direction: column !important;
            border-radius: 8px !important;
            border: 1px solid #dcdde1 !important;
            padding: 12px 14px !important;
            height: 100% !important;
            max-height: 100% !important;
            box-sizing: border-box !important;
            overflow: hidden !important;
        }

        /* Bảng nhân sự bận luôn là TO NHẤT, co giãn tự do theo toàn bộ phần màn hình còn lại */
        #tab-busy .busy-col-card.card-staff {
            flex: 1 1 auto !important;
            min-width: 360px !important;
        }

        /* Bảng bệnh nhân bận gọn gàng vừa vặn nội dung 5 cột, không bị phình to thừa khoảng trắng */
        #tab-busy .busy-col-card.card-pat {
            flex: 0 0 395px !important;
            width: 395px !important;
            min-width: 395px !important;
            max-width: 400px !important;
        }

        /* Bảng danh sách ra viện gọn gàng vừa vặn cân xứng 395px, hiển thị trọn vẹn 100% cột Giờ Ra */
        #tab-busy .busy-col-card.card-leave {
            flex: 0 0 395px !important;
            width: 395px !important;
            min-width: 395px !important;
            max-width: 400px !important;
        }

        #tab-busy .busy-form-header {
            flex-shrink: 0 !important;
            position: sticky !important;
            top: 0 !important;
            z-index: 20 !important;
            background: inherit !important;
        }

        .busy-container {
            flex: 1 1 auto !important;
            min-height: 0 !important;
            overflow-y: auto !important;
            overflow-x: auto !important;
            position: relative !important;
            border: 1px solid #dcdde1 !important;
            border-radius: 4px !important;
            background: #ffffff !important;
            scrollbar-width: thin !important;
            scrollbar-color: #cbd5e1 #f8fafc !important;
        }

        .busy-container::-webkit-scrollbar {
            width: 6px !important;
            height: 6px !important;
        }

        .busy-container::-webkit-scrollbar-track {
            background: #f8fafc !important;
        }

        .busy-container::-webkit-scrollbar-thumb {
            background: #cbd5e1 !important;
            border-radius: 3px !important;
        }

        .busy-container::-webkit-scrollbar-thumb:hover {
            background: #94a3b8 !important;
        }

        /* Ghim cố định thead th của cả 3 bảng */
        #busy-staff-table,
        #busy-pat-table,
        #leave-pat-table {
            width: 100% !important;
            border-collapse: separate !important;
            border-spacing: 0 !important;
        }

        #busy-staff-table thead,
        #busy-pat-table thead,
        #leave-pat-table thead {
            position: sticky !important;
            top: 0 !important;
            z-index: 15 !important;
        }

        #busy-staff-table thead th,
        #busy-pat-table thead th,
        #leave-pat-table thead th {
            position: sticky !important;
            top: 0 !important;
            z-index: 15 !important;
            background-color: #1e3d2b !important;
            color: #ffffff !important;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12) !important;
        }


        /* ── GHIM NÚT CHỨC NĂNG (THÊM / SỬA / HỦY) TẠI TẤT CẢ CÁC TAB ── */
        .sidebar-form {
            flex: 0 0 350px !important;
            background: #f8fafc !important;
            padding: 12px 14px 0 14px !important;
            border-radius: 8px !important;
            border: 1px solid #dcdde1 !important;
            position: sticky !important;
            top: 0 !important;
            max-height: calc(100vh - 240px) !important;
            display: flex !important;
            flex-direction: column !important;
            box-sizing: border-box !important;
            overflow: hidden !important;
        }

        .sidebar-form-body {
            flex: 1 !important;
            overflow-y: auto !important;
            padding-right: 4px !important;
            padding-bottom: 10px !important;
            min-height: 0 !important;
        }

        .sidebar-form .form-pinned-footer,
        .form-pinned-footer {
            flex-shrink: 0 !important;
            background: #f1f2f6 !important;
            padding: 10px 14px 10px 14px !important;
            margin: 0 -14px 0 -14px !important;
            border-top: 1px solid #dcdde1 !important;
            box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.04) !important;
            position: sticky !important;
            bottom: 0 !important;
            z-index: 20 !important;
            border-radius: 0 0 8px 8px !important;
        }

        .sidebar-form .form-pinned-footer .button-group,
        .sidebar-form .button-group {
            display: flex !important;
            gap: 8px !important;
            margin-top: 0 !important;
        }

/* ============================================================
   🏥 MEDICAL RESOURCE TIMELINE (DÒNG THỜI GIAN ĐIỀU TRỊ Y TẾ)
   ============================================================ */
.medical-timeline-wrap {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.timeline-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 16px;
    background: linear-gradient(135deg, #f8fafc, #edf2f7);
    border-bottom: 1px solid #e2e8f0;
    flex-wrap: wrap;
    gap: 10px;
}

.timeline-toolbar-title {
    font-size: 14px;
    font-weight: 700;
    color: #1e3d2b;
    display: flex;
    align-items: center;
    gap: 8px;
}

.timeline-filter-group {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.timeline-btn-pill {
    padding: 5px 12px;
    border: 1px solid #cbd5e1;
    border-radius: 20px;
    background: #ffffff;
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.timeline-btn-pill:hover {
    background: #f1f5f9;
    color: #1e293b;
}

.timeline-btn-pill.active {
    background: #10b981;
    color: #ffffff;
    border-color: #10b981;
    box-shadow: 0 2px 6px rgba(16, 185, 129, 0.3);
}

.timeline-scroll-container {
    overflow-x: auto;
    overflow-y: auto;
    max-height: calc(100vh - 280px);
    background: #f8fafc;
    position: relative;
}

.timeline-board {
    display: flex;
    flex-direction: column;
    width: max-content;
    min-width: 100%;
    background: #ffffff;
}

.timeline-board-header {
    display: flex;
    position: sticky;
    top: 0;
    z-index: 50;
    background: #1e3d2b;
    color: #ffffff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

.timeline-res-col-hdr {
    width: 200px;
    min-width: 200px;
    max-width: 200px;
    padding: 10px 12px;
    font-weight: 700;
    font-size: 12.5px;
    position: sticky;
    left: 0;
    background: #1e3d2b;
    z-index: 60;
    border-right: 2px solid #27ae60;
    text-align: center;
    box-sizing: border-box;
}

.timeline-slots-hdr {
    display: flex;
    flex: 1;
}

.timeline-slot-tick {
    text-align: center;
    font-size: 11.5px;
    font-weight: 700;
    padding: 9px 0;
    border-right: 1px solid rgba(255, 255, 255, 0.15);
    user-select: none;
    box-sizing: border-box;
}

.timeline-board-row {
    display: flex;
    border-bottom: 1px solid #e2e8f0;
    background: #ffffff;
    transition: background 0.15s ease;
}

.timeline-board-row:nth-child(even) {
    background: #fdfefe;
}

.timeline-board-row:hover {
    background: #f0fdf4;
}

.timeline-res-side {
    width: 200px;
    min-width: 200px;
    max-width: 200px;
    padding: 8px 12px;
    position: sticky;
    left: 0;
    background: inherit;
    z-index: 40;
    border-right: 2px solid #cbd5e1;
    box-shadow: 2px 0 5px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-sizing: border-box;
}

.timeline-resource-name {
    font-weight: 700;
    font-size: 13px;
    color: #1e293b;
    margin-bottom: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.timeline-resource-badge {
    display: inline-block;
    padding: 2px 6px;
    background: #e2e8f0;
    color: #475569;
    border-radius: 4px;
    font-size: 10.5px;
    font-weight: 600;
}

.timeline-track-canvas {
    position: relative;
    box-sizing: border-box;
}

.timeline-grid-lines {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    pointer-events: none;
}

.timeline-grid-tick-line {
    border-right: 1px dashed #e2e8f0;
    height: 100%;
    box-sizing: border-box;
}

.timeline-lunch-divider {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 3px;
    background: #f59e0b;
    z-index: 15;
    opacity: 0.8;
}

.timeline-card {
    position: absolute;
    height: 35px;
    border-radius: 6px;
    padding: 3px 8px;
    box-sizing: border-box;
    overflow: hidden;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.4);
    transition: transform 0.15s ease, box-shadow 0.15s ease, z-index 0.15s ease;
    display: flex;
    flex-direction: column;
    justify-content: center;
    z-index: 20;
}

.timeline-card:hover {
    transform: translateY(-2px) scale(1.03);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
    z-index: 35;
}

/* Card Gradient Themes */
.timeline-card-yhct {
    background: linear-gradient(135deg, #059669, #10b981);
    color: #ffffff;
}

.timeline-card-phcn {
    background: linear-gradient(135deg, #1d4ed8, #3b82f6);
    color: #ffffff;
}

.timeline-card-rv {
    background: linear-gradient(135deg, #7c3aed, #9333ea);
    color: #ffffff;
    border: 2px solid #fbbf24;
}

.timeline-card-title {
    font-weight: 700;
    font-size: 11.5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: flex;
    align-items: center;
    gap: 4px;
}

.timeline-card-sub {
    font-size: 9.5px;
    opacity: 0.95;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 1px;
}

.rv-badge {
    background: #fbbf24;
    color: #78350f;
    font-size: 8.5px;
    font-weight: 800;
    padding: 0 3px;
    border-radius: 3px;
    text-transform: uppercase;
}

/* ==========================================================================
   📱 COMPREHENSIVE MOBILE & TABLET RESPONSIVE SUITE (iOS / Android / iPad)
   ========================================================================== */

/* ── 1. Tablet & Medium Screens (max-width: 1024px) ── */
@media (max-width: 1024px) {
    .container {
        display: flex;
        flex-direction: column !important;
        height: 100vh !important;
        overflow: hidden !important;
    }

    .sidebar {
        width: 100% !important;
        height: auto !important;
        min-height: 52px !important;
        flex: 0 0 auto !important;
        position: relative !important;
        border-right: none !important;
        border-bottom: 2px solid #cbd5e1 !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
        z-index: 100 !important;
        background: #ffffff !important;
    }

    .sidebar-menu {
        flex-direction: row !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        width: 100% !important;
        padding: 6px 10px !important;
        gap: 6px !important;
        white-space: nowrap !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }

    .sidebar-menu::-webkit-scrollbar {
        display: none !important;
    }

    .sidebar button.nav-tab {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: 110px !important;
        padding: 6px 14px !important;
        border-radius: 20px !important;
        font-size: 13px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        background: #f1f5f9 !important;
        border: 1px solid #e2e8f0 !important;
        transition: all 0.2s ease !important;
    }

    .sidebar button.nav-tab.active {
        background: linear-gradient(135deg, #1e3a8a, #2563eb) !important;
        color: #ffffff !important;
        font-weight: 700 !important;
        box-shadow: 0 3px 10px rgba(37,99,235,0.3) !important;
        border-color: transparent !important;
    }

    .sidebar button.nav-tab.active .icon,
    .sidebar button.nav-tab.active .text {
        color: #ffffff !important;
    }

    .main-content {
        flex: 1 !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding: 12px 14px !important;
    }

    .split-layout {
        flex-direction: column !important;
        gap: 14px !important;
    }

    .sidebar-form {
        flex: none !important;
        width: 100% !important;
        max-height: none !important;
        position: static !important;
    }

    .main-table {
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
}

/* ── 2. Mobile Screens (max-width: 768px) ── */
@media (max-width: 768px) {
    body {
        font-size: 13px !important;
    }

    /* Chống phóng to tự động trên iOS khi focus input */
    input[type="text"],
    input[type="number"],
    input[type="date"],
    input[type="time"],
    input[type="password"],
    select,
    textarea {
        font-size: 16px !important;
        min-height: 38px !important;
    }

    /* Hospital Banner */
    .hospital-banner-global {
        padding: 8px 12px !important;
        flex-direction: column !important;
        gap: 6px !important;
        text-align: center !important;
    }

    .banner-left, .banner-right {
        justify-content: center !important;
        width: 100% !important;
    }

    .banner-clock {
        font-size: 12px !important;
        padding: 4px 8px !important;
        text-align: center !important;
    }

    /* Navigation Bar */
    .sidebar button.nav-tab {
        min-width: 95px !important;
        padding: 6px 10px !important;
        font-size: 12px !important;
    }

    .sidebar button.nav-tab .icon {
        font-size: 14px !important;
    }

    /* Mobile Form Toggle Button */
    .mobile-toggle-form-btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        width: 100% !important;
        padding: 10px 14px !important;
        font-size: 13.5px !important;
        font-weight: 700 !important;
        color: #ffffff !important;
        background: linear-gradient(135deg, #0284c7, #0369a1) !important;
        border: none !important;
        border-radius: 8px !important;
        margin-bottom: 10px !important;
        cursor: pointer !important;
        box-shadow: 0 3px 8px rgba(2,132,199,0.3) !important;
    }

    /* Form Fields & Touch Targets */
    .form-group {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 4px !important;
        margin-bottom: 10px !important;
    }

    .form-group label {
        width: 100% !important;
        min-width: 0 !important;
        font-weight: 600 !important;
        font-size: 12.5px !important;
        margin-bottom: 2px !important;
    }

    .checkbox-item {
        padding: 8px 10px !important;
        min-height: 40px !important;
        border-radius: 6px !important;
        margin-bottom: 5px !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        background: #ffffff !important;
        border: 1px solid #e2e8f0 !important;
        box-sizing: border-box !important;
    }

    .checkbox-item input[type="checkbox"] {
        width: 18px !important;
        height: 18px !important;
        margin: 0 !important;
        cursor: pointer !important;
    }

    .checkbox-item span {
        font-size: 13px !important;
        line-height: 1.3 !important;
    }

    /* Buttons */
    .btn {
        min-height: 34px !important;
        padding: 6px 12px !important;
        font-size: 12.5px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
    }

    .btn-sm {
        min-height: 26px !important;
        height: 26px !important;
        padding: 2px 8px !important;
        font-size: 11px !important;
    }

    /* ── TỐI ƯU CÁC BẢNG DỮ LIỆU TRÊN MOBILE CHẾ ĐỘ DỌC ── */
    .main-table {
        border-radius: 8px !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
        background: #ffffff !important;
        max-height: 480px !important;
        overflow: auto !important;
        -webkit-overflow-scrolling: touch !important;
        margin-top: 6px !important;
        border: 1px solid #cbd5e1 !important;
    }

    .main-table table {
        min-width: 520px !important;
        width: 100% !important;
        font-size: 11px !important;
        border-collapse: collapse !important;
    }

    .main-table table th {
        font-size: 10.5px !important;
        padding: 5px 6px !important;
        white-space: nowrap !important;
        background: #f1f5f9 !important;
        color: #334155 !important;
        font-weight: 700 !important;
        border-bottom: 2px solid #cbd5e1 !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 10 !important;
    }

    .main-table table td {
        font-size: 11px !important;
        padding: 4px 6px !important;
        line-height: 1.3 !important;
        border-bottom: 1px solid #e2e8f0 !important;
    }

    /* Ghim cố định cột STT hoặc Tên bên trái khi cuộn ngang */
    .main-table table th:first-child,
    .main-table table td:first-child {
        position: sticky !important;
        left: 0 !important;
        z-index: 15 !important;
        background: #ffffff !important;
        box-shadow: 2px 0 5px rgba(0,0,0,0.06) !important;
    }
    .main-table table th:first-child {
        background: #f1f5f9 !important;
        z-index: 25 !important;
    }

    .badge {
        font-size: 10px !important;
        padding: 1px 5px !important;
        margin: 1px 2px !important;
        border-radius: 8px !important;
        display: inline-block !important;
        line-height: 1.3 !important;
    }

    /* ── BẢNG CHẤM CÔNG & THỐNG KÊ TRÊN MOBILE ── */
    #tab-chamcong.active,
    #tab-thongke.active {
        display: flex !important;
        flex-direction: column !important;
        height: auto !important;
        min-height: calc(100vh - 140px) !important;
        padding: 4px !important;
    }

    .chamcong-card-wrapper,
    .thongke-card-wrapper {
        min-height: calc(100vh - 150px) !important;
        height: auto !important;
        flex: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        padding: 6px !important;
    }

    #table-chamcong-container,
    .table-chamcong-scroll {
        min-height: calc(100vh - 230px) !important;
        max-height: calc(100vh - 230px) !important;
        height: calc(100vh - 230px) !important;
        overflow: auto !important;
        -webkit-overflow-scrolling: touch !important;
        border-radius: 6px !important;
        border: 1px solid #cbd5e1 !important;
        background: #ffffff !important;
        flex: 1 !important;
    }

    #table-chamcong {
        min-width: 860px !important;
        font-size: 11px !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
    }

    /* Ghim cố định cột Tên Nhân Viên cho Bảng Chấm Công trên Mobile/Tablet */
    #table-chamcong thead tr:first-child th:first-child,
    #table-chamcong tbody tr td:first-child {
        position: sticky !important;
        left: 0 !important;
        z-index: 35 !important;
        background: #ffffff !important;
        min-width: 160px !important;
        max-width: 160px !important;
        width: 160px !important;
        font-weight: 700 !important;
        font-size: 11px !important;
        text-align: left !important;
        padding: 2px 6px !important;
        box-shadow: 2px 0 6px rgba(0,0,0,0.08) !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    #table-chamcong thead tr:first-child th:first-child {
        background: #275d38 !important;
        color: #ffffff !important;
        z-index: 45 !important;
    }

    /* Ghim cột Hệ số ngay sau cột Tên (160px) */
    #table-chamcong thead tr:first-child th:nth-child(2),
    #table-chamcong tbody tr td:nth-child(2) {
        position: sticky !important;
        left: 160px !important;
        z-index: 35 !important;
        background: #ffffff !important;
        min-width: 48px !important;
        max-width: 48px !important;
        width: 48px !important;
        text-align: center !important;
        padding: 0 !important;
    }
    #table-chamcong thead tr:first-child th:nth-child(2) {
        background: #275d38 !important;
        color: #ffffff !important;
        z-index: 45 !important;
    }

    #table-chamcong thead th {
        font-size: 10px !important;
        height: 22px !important;
        padding: 0 1px !important;
    }

    #table-chamcong tbody td {
        height: 24px !important;
        padding: 0 1px !important;
    }

    #table-chamcong .cc-input-text {
        font-size: 11px !important;
        height: 22px !important;
        min-height: 20px !important;
        max-height: 24px !important;
        line-height: 22px !important;
        text-align: center !important;
        padding: 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    #table-chamcong .heso-input {
        font-size: 12.5px !important;
        font-weight: 800 !important;
        height: 22px !important;
        line-height: 20px !important;
        text-align: center !important;
        padding: 0 !important;
        width: 42px !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
        -moz-appearance: textfield !important;
        appearance: textfield !important;
    }
    #table-chamcong .heso-input::-webkit-outer-spin-button,
    #table-chamcong .heso-input::-webkit-inner-spin-button {
        -webkit-appearance: none !important;
        margin: 0 !important;
    }

    /* Timeline Canvas on Mobile */
    .timeline-res-side {
        width: 110px !important;
        min-width: 110px !important;
        max-width: 110px !important;
        padding: 4px 6px !important;
    }

    .timeline-resource-name {
        font-size: 11px !important;
    }

    .timeline-card {
        height: 34px !important;
        padding: 2px 4px !important;
    }

    .timeline-card-title {
        font-size: 10px !important;
    }

    .timeline-card-sub {
        font-size: 8.5px !important;
    }

    /* ── TAB CÀI ĐẶT HỆ THỐNG TRÊN MOBILE & TABLET ── */
    #tab-admin.active {
        display: flex !important;
        flex-direction: column !important;
        height: auto !important;
        min-height: calc(100vh - 140px) !important;
        padding: 4px !important;
    }

    .admin-main-wrapper {
        flex-direction: column !important;
        height: auto !important;
        min-height: calc(100vh - 150px) !important;
        gap: 10px !important;
    }

    .admin-sidebar-menu {
        width: 100% !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        padding: 6px 8px !important;
        gap: 6px !important;
        white-space: nowrap !important;
        -webkit-overflow-scrolling: touch !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
        border-radius: 8px !important;
        flex-shrink: 0 !important;
        background: #ffffff !important;
        border: 1px solid #cbd5e1 !important;
    }

    .admin-sidebar-heading {
        display: none !important; /* Ẩn tiêu đề Menu Quản Trị trên mobile để cuộn thanh Tab mượt mà */
    }

    .admin-nav-btn {
        padding: 7px 12px !important;
        font-size: 12px !important;
        flex-shrink: 0 !important;
        border-radius: 20px !important;
        border-left: none !important;
        border-bottom: 2px solid transparent !important;
        text-align: center !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 4px !important;
    }

    .admin-nav-btn.active {
        background: #e8f8f5 !important;
        color: #16a085 !important;
        border-bottom: 2px solid #16a085 !important;
        font-weight: 700 !important;
    }

    .admin-content-pane {
        width: 100% !important;
        height: auto !important;
        min-height: 480px !important;
        flex: 1 !important;
        border-radius: 8px !important;
        background: #ffffff !important;
        border: 1px solid #cbd5e1 !important;
        overflow: visible !important;
    }

    .admin-section {
        padding: 12px 10px !important;
        height: auto !important;
        min-height: 460px !important;
        overflow-y: visible !important;
    }

    #admin-sec-settings > div:nth-child(2) {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    /* Modals on Mobile */
    #modal-protocol-editor > div,
    #modal-admin-employee > div,
    #strategyModal > div,
    #custom-confirm-modal > div,
    #modal-hdsd-viewer > div,
    #modal-doc-lookup > div {
        width: 95% !important;
        max-width: 95% !important;
        max-height: 90vh !important;
        padding: 16px 14px !important;
        border-radius: 12px !important;
    }
}

/* ── 3. Small Mobile Devices (max-width: 480px) ── */
@media (max-width: 480px) {
    .sidebar button.nav-tab {
        min-width: 78px !important;
        padding: 5px 8px !important;
        font-size: 11px !important;
    }

    .sidebar button.nav-tab .text {
        font-size: 10.5px !important;
    }

    .tab-header-title {
        font-size: 13.5px !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 6px !important;
    }

    .tab-header-title button {
        width: 100% !important;
    }

    .filter-bar, .action-bar-group {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 5px !important;
    }

    .filter-bar select, .filter-bar input, .filter-bar button {
        width: 100% !important;
    }
}

/* ── Tab Context Menu ── */
.tab-context-item:hover {
    background: #eff6ff !important;
    color: #1d4ed8 !important;
}

/* ── STT Drag Handle ── */
.stt-order-cell {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    user-select: none !important;
}

.drag-handle-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: grab !important;
    font-size: 14px !important;
    color: #64748b !important;
    padding: 2px 4px !important;
    border-radius: 4px !important;
    transition: all 0.2s ease !important;
    line-height: 1 !important;
    touch-action: none !important;
}

.drag-handle-btn:hover {
    background: #e2e8f0 !important;
    color: #1e293b !important;
}

.drag-handle-btn:active {
    cursor: grabbing !important;
    background: #cbd5e1 !important;
}


/* ════════════════════════════════════════════════════════════
   USER DROPDOWN MENU & CHANGE PASSWORD MODAL GUARANTEED STYLES
   ════════════════════════════════════════════════════════════ */
.header-fixed-section,
.hospital-banner-global,
.banner-right,
.banner-clock {
    overflow: visible !important;
}

.user-menu-dropdown-container {
    position: relative !important;
    display: inline-block !important;
    z-index: 9999 !important;
}

.user-dropdown-menu {
    position: absolute !important;
    right: 0 !important;
    top: calc(100% + 4px) !important;
    background: #ffffff !important;
    min-width: 170px !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2), 0 2px 8px rgba(0,0,0,0.1) !important;
    border: 1px solid rgba(0,0,0,0.1) !important;
    padding: 6px 0 !important;
    z-index: 99999 !important;
    overflow: hidden !important;
}

.user-dropdown-menu a {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 10px 16px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: background 0.15s ease !important;
}

.user-dropdown-menu a:hover {
    background: #f1f5f9 !important;
}

#modal-change-password {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(15, 23, 42, 0.65) !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    z-index: 999999 !important;
    align-items: center !important;
    justify-content: center !important;
}

@keyframes modalPop {
    0% {
        opacity: 0;
        transform: scale(0.92) translateY(-8px);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

/* ==========================================================================
   🌙 THEME TOGGLE BUTTON & COMPREHENSIVE DARK MODE SYSTEM (T.I.M.E.S System v4)
   ========================================================================== */
.theme-toggle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1px solid #cbd5e1;
    background: #f8fafc;
    color: #1e293b;
    cursor: pointer;
    font-size: 13px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    outline: none;
    padding: 0;
    user-select: none;
}

.theme-toggle-btn:hover {
    background: #e2e8f0;
    transform: scale(1.08);
}

/* --------------------------------------------------------------------------
   🌙 DARK THEME ROOT & BASE LAYOUT OVERRIDES
   -------------------------------------------------------------------------- */
[data-theme="dark"] {
    --bg-app: #0b1120;
    --bg-surface: #0f172a;
    --bg-card: #1e293b;
    --bg-input: #0f172a;
    --border-color: #334155;
    --text-primary: #f8fafc;
    --text-secondary: #94a3b8;
    --text-muted: #64748b;
    color-scheme: dark;
}

[data-theme="dark"] body {
    background: linear-gradient(135deg, #090d16 0%, #111827 100%) !important;
    color: #f1f5f9 !important;
}

[data-theme="dark"] .container {
    background: #0f172a !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.8) !important;
}

[data-theme="dark"] .main-wrapper,
[data-theme="dark"] .tab-scroll-content,
[data-theme="dark"] .tab-content {
    background: #0f172a !important;
    color: #f1f5f9 !important;
}

/* --------------------------------------------------------------------------
   🌙 SIDEBAR NAVIGATION
   -------------------------------------------------------------------------- */
[data-theme="dark"] .sidebar {
    background: #0b1120 !important;
    border-right: 1px solid #1e293b !important;
}

[data-theme="dark"] .sidebar button.nav-tab {
    color: #94a3b8 !important;
}

[data-theme="dark"] .sidebar button.nav-tab:hover {
    background: rgba(51, 65, 85, 0.5) !important;
    color: #f8fafc !important;
}

[data-theme="dark"] .sidebar button.nav-tab.active {
    background: #1e293b !important;
    color: #38bdf8 !important;
    border-color: rgba(56, 189, 248, 0.3) !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.4) !important;
}

[data-theme="dark"] .sidebar button.nav-tab.active::after {
    background: #38bdf8 !important;
}

[data-theme="dark"] .theme-toggle-btn {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}

[data-theme="dark"] .theme-toggle-btn:hover {
    background: #334155 !important;
}

/* --------------------------------------------------------------------------
   🌙 HEADER BANNER & MARQUEE
   -------------------------------------------------------------------------- */
[data-theme="dark"] .header-fixed-section {
    background: #0f172a !important;
    border-bottom: 1px solid #1e293b !important;
}

[data-theme="dark"] .hospital-banner-global {
    background: #0f172a !important;
}

[data-theme="dark"] .banner-logo {
    background: transparent !important;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(56, 189, 248, 0.2);
}

[data-theme="dark"] .banner-text h1,
[data-theme="dark"] #app-hospital-name {
    background: none !important;
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: #38bdf8 !important;
    color: #38bdf8 !important;
    text-shadow: 0 0 16px rgba(56, 189, 248, 0.35);
}

[data-theme="dark"] .banner-text h2,
[data-theme="dark"] #app-sub-title {
    background: none !important;
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: #34d399 !important;
    color: #34d399 !important;
}

[data-theme="dark"] .banner-text p,
[data-theme="dark"] #app-slogan {
    background: #d97706 !important;
    color: #ffffff !important;
    box-shadow: 0 1px 4px rgba(217, 119, 6, 0.4);
}

[data-theme="dark"] #clock-time {
    color: #f8fafc !important;
}

[data-theme="dark"] #clock-date {
    color: #94a3b8 !important;
}

[data-theme="dark"] #nav-btn-user {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}

[data-theme="dark"] .user-dropdown-menu {
    background: #1e293b !important;
    border-color: #334155 !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.6) !important;
}

[data-theme="dark"] .user-dropdown-menu a {
    color: #cbd5e1 !important;
}

[data-theme="dark"] .user-dropdown-menu a:hover {
    background: #334155 !important;
    color: #f8fafc !important;
}

[data-theme="dark"] .global-marquee-container {
    background: #111827 !important;
    border-top: 1px solid #1e293b !important;
    border-bottom: 1px solid #1e293b !important;
}

[data-theme="dark"] #thong-bao-chay,
[data-theme="dark"] .hamburger-in-marquee {
    color: #fb7185 !important;
}

/* --------------------------------------------------------------------------
   🌙 DASHBOARD: HEADINGS, PANELS, STATS & CHARTS
   -------------------------------------------------------------------------- */
[data-theme="dark"] .page-header h2,
[data-theme="dark"] .tab-header-title {
    color: #38bdf8 !important;
}

[data-theme="dark"] .tab-header-title {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35) !important;
}

[data-theme="dark"] .tab-header-title span {
    color: #38bdf8 !important;
}

[data-theme="dark"] #display-date {
    color: #f8fafc !important;
}

/* Date filter container in page header */
[data-theme="dark"] .page-header > div[style*="background"],
[data-theme="dark"] .page-header div[style*="background: #fff"],
[data-theme="dark"] .page-header div[style*="background:#fff"] {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}

[data-theme="dark"] #dashboard-date-filter,
[data-theme="dark"] .dashboard-date {
    background: transparent !important;
    color: #f8fafc !important;
    color-scheme: dark !important;
}

[data-theme="dark"] .btn-refresh {
    color: #f8fafc !important;
    filter: brightness(1.4);
}

/* 3 Dashboard Columns */
[data-theme="dark"] .dash-panel {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 4px 20px -2px rgba(0, 0, 0, 0.4) !important;
    color: #f8fafc !important;
}

[data-theme="dark"] .dash-panel-title {
    color: #38bdf8 !important;
    border-bottom: 1px solid #334155 !important;
}

/* Sub-headers in panel 2 & 3 (Bác sĩ, KTV, YHCT, PHCN) */
[data-theme="dark"] .dash-panel div[style*="color:#1e3d2b"],
[data-theme="dark"] .dash-panel div[style*="color: #1e3d2b"] {
    color: #34d399 !important;
    border-bottom-color: #334155 !important;
}

[data-theme="dark"] .dash-panel div[style*="background:#e8ecee"],
[data-theme="dark"] .dash-panel div[style*="background: #e8ecee"] {
    background: #334155 !important;
}

/* Mini stat cards in Dashboard column 1 */
[data-theme="dark"] .stat-mini-card {
    background: #0f172a !important;
    border-top: 1px solid #1e293b !important;
    border-right: 1px solid #1e293b !important;
    border-bottom: 1px solid #1e293b !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .stat-mini-card:hover {
    background: #162032 !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5) !important;
}

[data-theme="dark"] .stat-mini-card .s-label {
    color: #cbd5e1 !important;
}

/* Horizontal chart rows in Dashboard panels 2 & 3 */
[data-theme="dark"] .dash-chart-row > div:nth-child(1),
[data-theme="dark"] .dash-chart-row div[style*="color:#2c3e50"],
[data-theme="dark"] .dash-chart-row div[style*="color: #2c3e50"] {
    color: #cbd5e1 !important;
}

[data-theme="dark"] .dash-chart-row > div:nth-child(2),
[data-theme="dark"] .dash-chart-row div[style*="background:#f1f3f5"],
[data-theme="dark"] .dash-chart-row div[style*="background: #f1f3f5"] {
    background: #334155 !important;
}

[data-theme="dark"] .dash-chart-row > div:nth-child(3) {
    color: #f8fafc !important;
}

[data-theme="dark"] .dash-total-footer {
    border-top-color: #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] .dash-total-footer .total-label {
    color: #94a3b8 !important;
}
[data-theme="dark"] .dash-total-footer .total-badge {
    background: #0f172a !important;
    color: #38bdf8 !important;
    border-color: #334155 !important;
}

/* Monthly chart cards */
[data-theme="dark"] .dash-chart-card {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.4) !important;
}

[data-theme="dark"] .dash-chart-card h3 {
    color: #38bdf8 !important;
}

[data-theme="dark"] #dash-chart-workdays-subtitle,
[data-theme="dark"] #dash-chart-procs-subtitle {
    color: #94a3b8 !important;
}

/* --------------------------------------------------------------------------
   🌙 SCHEDULE TAB (XẾP LỊCH)
   -------------------------------------------------------------------------- */
[data-theme="dark"] .schedule-compact-header {
    background: #0f172a !important;
    border-bottom: 2px solid #334155 !important;
    box-shadow: 0 8px 15px -10px rgba(0,0,0,0.4) !important;
}

[data-theme="dark"] .schedule-compact-header label,
[data-theme="dark"] .schedule-title-inline {
    color: #38bdf8 !important;
}

[data-theme="dark"] .schedule-compact-header div[style*="background:#f5eef8"],
[data-theme="dark"] .schedule-compact-header div[style*="background: #f5eef8"] {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
}

/* --------------------------------------------------------------------------
   🌙 UNIVERSAL DARK MODE TABLE SYSTEM (MỌI BẢNG & MỌI TAB)
   -------------------------------------------------------------------------- */
[data-theme="dark"] table,
[data-theme="dark"] .main-table,
[data-theme="dark"] .main-table table,
[data-theme="dark"] table.data-table,
[data-theme="dark"] table.table-custom,
[data-theme="dark"] .table-container,
[data-theme="dark"] .table-responsive-wrapper,
[data-theme="dark"] .utils-table-scroll,
[data-theme="dark"] .schedule-table-wrap,
[data-theme="dark"] #schedule-table,
[data-theme="dark"] #machines-table,
[data-theme="dark"] #procedures-table,
[data-theme="dark"] #rooms-table,
[data-theme="dark"] #staff-table,
[data-theme="dark"] #patients-table,
[data-theme="dark"] #protocols-table,
[data-theme="dark"] #busy-staff-table,
[data-theme="dark"] #busy-pat-table,
[data-theme="dark"] #leave-pat-table,
[data-theme="dark"] #table-count,
[data-theme="dark"] #table-error-time,
[data-theme="dark"] #table-error-other,
[data-theme="dark"] #table-admin-employees,
[data-theme="dark"] #table-chamcong,
[data-theme="dark"] #table-thongke,
[data-theme="dark"] #table-preview-thuthuat,
[data-theme="dark"] #stats-unscheduled-table,
[data-theme="dark"] #stats-staff-table,
[data-theme="dark"] #tenants-table,
[data-theme="dark"] .utils-table-scroll > table {
    background-color: #1e293b !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}

/* 1. Header Cột Bảng (th) */
[data-theme="dark"] th,
[data-theme="dark"] table th,
[data-theme="dark"] thead th,
[data-theme="dark"] thead tr,
[data-theme="dark"] thead tr th,
[data-theme="dark"] table thead tr th,
[data-theme="dark"] .main-table table th,
[data-theme="dark"] table.data-table th,
[data-theme="dark"] .main-table table th:first-child,
[data-theme="dark"] .data-table th:first-child,
[data-theme="dark"] table thead tr:first-child th:first-child,
[data-theme="dark"] table thead tr:first-child th:last-child {
    background: #0f172a !important;
    background-color: #0f172a !important;
    color: #38bdf8 !important;
    border-bottom: 2px solid #334155 !important;
    border-top: none !important;
    border-left-color: #334155 !important;
    border-right-color: #334155 !important;
    box-shadow: none !important;
}

/* 2. Dòng Lẻ (Odd Rows) */
[data-theme="dark"] tbody tr,
[data-theme="dark"] tbody tr:nth-child(odd),
[data-theme="dark"] tbody tr:nth-child(odd) td,
[data-theme="dark"] .main-table table tbody tr:nth-child(odd) td,
[data-theme="dark"] table.data-table tbody tr:nth-child(odd) td {
    background: #1e293b !important;
    background-color: #1e293b !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}

/* 3. Dòng Chẵn (Even Rows): Sắc Dark Slate dịu mắt, TRIỆT TIÊU 100% VỆT TRẮNG */
[data-theme="dark"] tbody tr:nth-child(even),
[data-theme="dark"] tbody tr:nth-child(even) td,
[data-theme="dark"] .main-table table tbody tr:nth-child(even),
[data-theme="dark"] .main-table table tbody tr:nth-child(even) td,
[data-theme="dark"] table.data-table tbody tr:nth-child(even),
[data-theme="dark"] table.data-table tbody tr:nth-child(even) td,
[data-theme="dark"] .timeline-board-row:nth-child(even) {
    background: #151f2e !important;
    background-color: #151f2e !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}

/* 4. Cột Ghim Cố Định STT / Tên bên trái */
[data-theme="dark"] .main-table table td:first-child,
[data-theme="dark"] table.data-table td:first-child {
    border-right: 1px solid #334155 !important;
    box-shadow: 2px 0 6px rgba(0,0,0,0.3) !important;
}
[data-theme="dark"] tbody tr:nth-child(odd) td:first-child {
    background: #1e293b !important;
    background-color: #1e293b !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] tbody tr:nth-child(even) td:first-child {
    background: #151f2e !important;
    background-color: #151f2e !important;
    color: #e2e8f0 !important;
}

/* 5. Hiệu Ứng Rê Chuột (Row Hover): Nổi bật sáng đẹp, TRIỆT TIÊU TRẮNG XÓA */
[data-theme="dark"] tbody tr:hover,
[data-theme="dark"] tbody tr:hover td,
[data-theme="dark"] tbody tr.editable-row:hover,
[data-theme="dark"] tbody tr.editable-row:hover td,
[data-theme="dark"] td.editable-row:hover,
[data-theme="dark"] table tbody tr:hover td,
[data-theme="dark"] .main-table table tr:hover td,
[data-theme="dark"] table.data-table tr:hover td,
[data-theme="dark"] tbody tr:hover td:first-child,
[data-theme="dark"] tbody tr.editable-row:hover td:first-child {
    background: #253347 !important;
    background-color: #253347 !important;
    color: #ffffff !important;
}

/* 6. Ô Dữ Liệu Chung & Chữ Nội Dung Bảng (High Contrast Table Content) */
[data-theme="dark"] td,
[data-theme="dark"] table td,
[data-theme="dark"] tbody td,
[data-theme="dark"] .main-table table td,
[data-theme="dark"] table.data-table td,
[data-theme="dark"] tbody td span:not(.badge):not(.status-badge):not([style*="background"]) {
    border-bottom: 1px solid #334155 !important;
    border-right: 1px solid #283548 !important;
    color: #f1f5f9 !important;
}

[data-theme="dark"] tbody td strong,
[data-theme="dark"] tbody td b,
[data-theme="dark"] .main-table table tbody td strong,
[data-theme="dark"] table.data-table tbody td strong {
    color: #38bdf8 !important;
}

/* Tab Bệnh Nhân (#patients-table): Chữ sáng rõ nét, triệt tiêu hoàn toàn chữ đen */
[data-theme="dark"] #patients-table tbody td {
    color: #f1f5f9 !important;
}
[data-theme="dark"] #patients-table tbody td strong {
    font-size: 13px !important;
    color: #38bdf8 !important;
}
[data-theme="dark"] #patients-table tbody tr[style*="background:#f8d7da"],
[data-theme="dark"] #patients-table tbody tr[style*="background: #f8d7da"] {
    background: rgba(239, 68, 68, 0.22) !important;
    color: #fca5a5 !important;
}
[data-theme="dark"] #patients-table td span[style*="color:#d35400"],
[data-theme="dark"] #patients-table td span[style*="color: #d35400"] {
    color: #fb923c !important;
}
[data-theme="dark"] #patients-table td span[style*="color:#27ae60"],
[data-theme="dark"] #patients-table td span[style*="color: #27ae60"] {
    color: #4ade80 !important;
}
[data-theme="dark"] #patients-table td strong[style*="color:#e67e22"],
[data-theme="dark"] #patients-table td strong[style*="color: #e67e22"] {
    color: #fbbf24 !important;
}
[data-theme="dark"] #patients-table td strong[style*="color:#c0392b"],
[data-theme="dark"] #patients-table td strong[style*="color: #c0392b"] {
    color: #f87171 !important;
}

/* Tab Thủ Thuật (#procedures-table): Thời gian & Viết tắt rực sáng */
[data-theme="dark"] #procedures-table tbody td {
    color: #f1f5f9 !important;
}
[data-theme="dark"] #procedures-table tbody td strong {
    color: #38bdf8 !important;
}
[data-theme="dark"] .proc-time-single {
    color: #f8fafc !important;
    font-weight: 600 !important;
}
[data-theme="dark"] .proc-time-range-badge {
    background: rgba(56, 189, 248, 0.2) !important;
    color: #38bdf8 !important;
    border: 1px solid rgba(56, 189, 248, 0.5) !important;
    font-weight: 700 !important;
}

/* Tab Phác Đồ (#protocols-table) */
[data-theme="dark"] #protocols-table tbody td strong {
    color: #38bdf8 !important;
}
[data-theme="dark"] #protocols-table .badge {
    background: rgba(37, 99, 235, 0.22) !important;
    color: #93c5fd !important;
    border: 1px solid rgba(59, 130, 246, 0.4) !important;
}

/* Tab Nhân Sự (#staff-table) */
[data-theme="dark"] #staff-table tbody td strong {
    color: #38bdf8 !important;
}
[data-theme="dark"] #staff-table tbody tr[style*="background:#f9f9f9"],
[data-theme="dark"] #staff-table tbody tr[style*="background: #f9f9f9"] {
    background: #1e293b !important;
    opacity: 0.55 !important;
}

/* Tab Phòng Điều Trị (#rooms-table) & Máy Móc (#machines-table) */
[data-theme="dark"] #rooms-table tbody td strong,
[data-theme="dark"] #machines-table tbody td b {
    color: #38bdf8 !important;
}

/* Tab Giờ Bận & Ra Viện (#busy-pat-table, #busy-staff-table, #leave-pat-table) */
[data-theme="dark"] #busy-pat-table tbody td,
[data-theme="dark"] #busy-staff-table tbody td,
[data-theme="dark"] #leave-pat-table tbody td {
    color: #e2e8f0 !important;
}
[data-theme="dark"] #busy-pat-table tbody td:nth-child(2),
[data-theme="dark"] #busy-staff-table tbody td:nth-child(2),
[data-theme="dark"] #leave-pat-table tbody td:nth-child(2) {
    color: #38bdf8 !important;
}
[data-theme="dark"] #busy-pat-table tbody td:nth-child(5) {
    color: #fb923c !important;
}
[data-theme="dark"] #busy-staff-table tbody td:nth-child(4) {
    color: #fbbf24 !important;
}
[data-theme="dark"] #leave-pat-table tbody td:nth-child(5) {
    color: #f87171 !important;
}

/* 7. Tab Xếp Lịch: .row-scheduled & .row-dropped */
[data-theme="dark"] .schedule-compact-header {
    background: #0f172a !important;
    border-bottom: 2px solid #334155 !important;
    box-shadow: 0 8px 15px -10px rgba(0,0,0,0.4) !important;
}
[data-theme="dark"] .schedule-compact-header label,
[data-theme="dark"] .schedule-title-inline {
    color: #38bdf8 !important;
}
[data-theme="dark"] .schedule-compact-header div[style*="background:#f5eef8"],
[data-theme="dark"] .schedule-compact-header div[style*="background: #f5eef8"] {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
}
[data-theme="dark"] .row-scheduled,
[data-theme="dark"] .row-scheduled td,
[data-theme="dark"] #schedule-table .row-scheduled td {
    color: #e2e8f0 !important;
}
[data-theme="dark"] .row-dropped,
[data-theme="dark"] .row-dropped td,
[data-theme="dark"] #schedule-table .row-dropped td {
    background: rgba(239, 68, 68, 0.15) !important;
    color: #fca5a5 !important;
}
[data-theme="dark"] .row-scheduled:hover td {
    background: #253347 !important;
    color: #ffffff !important;
}
[data-theme="dark"] .row-dropped:hover td {
    background: rgba(239, 68, 68, 0.25) !important;
    color: #fecaca !important;
}

/* 8. Tab Giờ Bận & Ra Viện */
[data-theme="dark"] .busy-col-card,
[data-theme="dark"] .card-staff,
[data-theme="dark"] .card-patient,
[data-theme="dark"] .card-leave,
[data-theme="dark"] .busy-card {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}
[data-theme="dark"] .busy-form-header {
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .busy-container {
    background: #0f172a !important;
}
[data-theme="dark"] #busy-pat-table td:nth-child(5) {
    color: #fb923c !important;
}
[data-theme="dark"] #leave-pat-table td:nth-child(5) {
    color: #c084fc !important;
}

/* 9. Tab Chấm Công & Thống Kê Sticky Columns */
[data-theme="dark"] .chamcong-card-wrapper,
[data-theme="dark"] .thongke-card-wrapper,
[data-theme="dark"] #table-chamcong-container,
[data-theme="dark"] #table-thongke-container {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] .chamcong-card-wrapper h2,
[data-theme="dark"] .thongke-card-wrapper h2 {
    color: #38bdf8 !important;
}
[data-theme="dark"] .chamcong-card-wrapper span,
[data-theme="dark"] .thongke-card-wrapper span {
    color: #cbd5e1 !important;
}
[data-theme="dark"] #table-chamcong thead tr th,
[data-theme="dark"] #table-thongke thead tr th {
    background-color: #0f172a !important;
    color: #38bdf8 !important;
    border-color: #334155 !important;
}
[data-theme="dark"] #table-chamcong tbody td:first-child,
[data-theme="dark"] #table-chamcong tbody td:nth-child(2),
[data-theme="dark"] #table-chamcong tbody td:last-child,
[data-theme="dark"] #table-thongke tbody td:first-child,
[data-theme="dark"] #table-thongke tbody td:nth-child(2),
[data-theme="dark"] #table-thongke tbody td:last-child {
    background-color: #1e293b !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}
[data-theme="dark"] #table-chamcong tbody tr:nth-child(even) td:first-child,
[data-theme="dark"] #table-chamcong tbody tr:nth-child(even) td:nth-child(2),
[data-theme="dark"] #table-chamcong tbody tr:nth-child(even) td:last-child,
[data-theme="dark"] #table-thongke tbody tr:nth-child(even) td:first-child,
[data-theme="dark"] #table-thongke tbody tr:nth-child(even) td:nth-child(2),
[data-theme="dark"] #table-thongke tbody tr:nth-child(even) td:last-child {
    background-color: #151f2e !important;
}
[data-theme="dark"] #table-chamcong tbody tr:hover td:first-child,
[data-theme="dark"] #table-chamcong tbody tr:hover td:nth-child(2),
[data-theme="dark"] #table-chamcong tbody tr:hover td:last-child,
[data-theme="dark"] #table-thongke tbody tr:hover td:first-child,
[data-theme="dark"] #table-thongke tbody tr:hover td:nth-child(2),
[data-theme="dark"] #table-thongke tbody tr:hover td:last-child {
    background-color: #253347 !important;
    color: #ffffff !important;
}
[data-theme="dark"] #table-chamcong thead th.bg-holiday,
[data-theme="dark"] #table-chamcong tbody td.bg-holiday {
    background-color: rgba(239, 68, 68, 0.15) !important;
    color: #fca5a5 !important;
}
[data-theme="dark"] #table-chamcong tbody td.bg-holiday .cc-input-text {
    background-color: rgba(239, 68, 68, 0.1) !important;
    border-color: rgba(239, 68, 68, 0.25) !important;
}
[data-theme="dark"] #table-chamcong tbody td.bg-holiday .cc-input-text:focus {
    background-color: #1e293b !important;
    border-color: #3b82f6 !important;
}
[data-theme="dark"] #table-chamcong th.col-today,
[data-theme="dark"] #table-chamcong td.col-today {
    background-color: rgba(37, 99, 235, 0.18) !important;
    border-left: 2px solid #3b82f6 !important;
    border-right: 2px solid #3b82f6 !important;
}
[data-theme="dark"] #table-chamcong tbody tr.chamcong-total-row td {
    background-color: #0f172a !important;
    color: #38bdf8 !important;
    font-weight: 700 !important;
    border-top: 2px solid #334155 !important;
}
[data-theme="dark"] .cc-input-text,
[data-theme="dark"] .heso-input {
    background: #0f172a !important;
    color: #f8fafc !important;
    border-color: #334155 !important;
}
[data-theme="dark"] #table-chamcong .heso-input.heso-fraction {
    color: #fbbf24 !important;
    background: #1e1b18 !important;
    border-color: #b45309 !important;
}

/* 10. Tab Kiểm Tra & Tiện Ích */
[data-theme="dark"] #tab-kiemtra .utils-split-layout > div,
[data-theme="dark"] #tab-utils .utils-split-layout > div,
[data-theme="dark"] div[style*="background: #eafaf1"],
[data-theme="dark"] div[style*="background: #fdf2e9"],
[data-theme="dark"] div[style*="background: #fef5e7"],
[data-theme="dark"] div[style*="background:#eafaf1"],
[data-theme="dark"] div[style*="background:#fdf2e9"],
[data-theme="dark"] div[style*="background:#fef5e7"] {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] #tab-kiemtra h4,
[data-theme="dark"] #tab-utils h4 {
    color: #38bdf8 !important;
}
[data-theme="dark"] tr[style*="background:#cbead9"],
[data-theme="dark"] tr[style*="background:#fadbd8"],
[data-theme="dark"] tr[style*="background:#fdebd0"],
[data-theme="dark"] tr[style*="background:#d1f2eb"],
[data-theme="dark"] tr[style*="background:#fae5d3"] {
    background: #0f172a !important;
    color: #38bdf8 !important;
}
[data-theme="dark"] tr[style*="background:#cbead9"] th,
[data-theme="dark"] tr[style*="background:#fadbd8"] th,
[data-theme="dark"] tr[style*="background:#fdebd0"] th,
[data-theme="dark"] tr[style*="background:#d1f2eb"] th,
[data-theme="dark"] tr[style*="background:#fae5d3"] th {
    background: #0f172a !important;
    color: #38bdf8 !important;
    border-color: #334155 !important;
}

/* 11. Tab Quản Lý Đơn Vị SaaS (Super Admin) */
[data-theme="dark"] #tab-tenants .card,
[data-theme="dark"] #tab-tenants div[style*="background:#fff"],
[data-theme="dark"] #tab-tenants div[style*="background: #fff"],
[data-theme="dark"] #tab-tenants div[style*="background:#f8fafc"],
[data-theme="dark"] #tab-tenants div[style*="background:#f0fdf4"],
[data-theme="dark"] #tab-tenants div[style*="background:#eff6ff"] {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] #tab-tenants .table-custom thead tr,
[data-theme="dark"] #tab-tenants .table-custom thead th {
    background: #0f172a !important;
    color: #38bdf8 !important;
    border-color: #334155 !important;
}

/* 12. Huy Hiệu (Badges), Tags & Nút Kéo Thả Thứ Tự (STT) */
[data-theme="dark"] .badge,
[data-theme="dark"] .badge-info {
    background: #1e3a5f !important;
    color: #60a5fa !important;
    border: 1px solid #2563eb !important;
}
[data-theme="dark"] .status-badge,
[data-theme="dark"] .status-ready {
    background: rgba(16, 185, 129, 0.2) !important;
    color: #34d399 !important;
    border: 1px solid rgba(52, 211, 153, 0.4) !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    font-weight: 600 !important;
}
[data-theme="dark"] .status-busy {
    background: rgba(245, 158, 11, 0.2) !important;
    color: #fbbf24 !important;
    border: 1px solid rgba(245, 158, 11, 0.4) !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    font-weight: 600 !important;
}
[data-theme="dark"] .stt-order-cell {
    color: #cbd5e1 !important;
}
[data-theme="dark"] .drag-handle-btn,
[data-theme="dark"] .drag-handle {
    color: #94a3b8 !important;
}
[data-theme="dark"] .drag-handle-btn:hover,
[data-theme="dark"] .drag-handle:hover {
    color: #38bdf8 !important;
    background: rgba(255, 255, 255, 0.1) !important;
}

/* --------------------------------------------------------------------------
   🌙 INPUTS, SELECTS, MODALS, MOBILE & FOOTER
   -------------------------------------------------------------------------- */
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="search"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] input[type="number"],
[data-theme="dark"] input[type="date"],
[data-theme="dark"] select,
[data-theme="dark"] textarea {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
    color-scheme: dark !important;
}

[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus {
    border-color: #38bdf8 !important;
    box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.25) !important;
}

[data-theme="dark"] input::placeholder {
    color: #64748b !important;
}

/* --------------------------------------------------------------------------
   🌙 HOÀN THIỆN GIAO DIỆN MODALS, POPUPS, ALERTS, CONFIRMS & OVERLAYS TRONG DARK THEME
   -------------------------------------------------------------------------- */
[data-theme="dark"] .modal-content,
[data-theme="dark"] .modal-dialog,
[data-theme="dark"] .popup-content,
[data-theme="dark"] div[id^="modal-"] > div,
[data-theme="dark"] div[id*="Modal"] > div,
[data-theme="dark"] #custom-confirm-modal > div,
[data-theme="dark"] #global-custom-alert > div,
[data-theme="dark"] #custom-success-popup > div,
[data-theme="dark"] #tab-context-menu,
[data-theme="dark"] #modal-tenant-form > div,
[data-theme="dark"] #modal-protocol-editor > div,
[data-theme="dark"] #modal-admin-employee > div,
[data-theme="dark"] #modal-hdsd-viewer > div,
[data-theme="dark"] #modal-doc-lookup > div,
[data-theme="dark"] #modal-unscheduled-advisor > div,
[data-theme="dark"] #modal-change-password > div,
[data-theme="dark"] #modal-server-status > div,
[data-theme="dark"] #modal-config-gas > div,
[data-theme="dark"] #strategyModal > div {
    background: #1e293b !important;
    color: #e2e8f0 !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.7) !important;
}

/* 1. Hộp thoại xác nhận (Custom Confirm Modal) */
[data-theme="dark"] #custom-confirm-modal > div {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
}
[data-theme="dark"] #confirm-title {
    color: #38bdf8 !important;
}
[data-theme="dark"] #confirm-message {
    color: #cbd5e1 !important;
}

/* 2. Hộp thoại thông báo toàn cục (Global Custom Alert) */
[data-theme="dark"] #global-custom-alert > div {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
}
[data-theme="dark"] #gca-title {
    color: #38bdf8 !important;
}
[data-theme="dark"] #gca-message {
    color: #cbd5e1 !important;
}

/* 3. Popup thành công xếp lịch (Custom Success Popup) */
[data-theme="dark"] #custom-success-popup > div {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
}
[data-theme="dark"] #custom-popup-content {
    background: #0f172a !important;
    color: #e2e8f0 !important;
    border: 1px solid #334155 !important;
}

/* 4. Menu ngữ cảnh chuột phải vào Tab (Tab Context Menu) */
[data-theme="dark"] #tab-context-menu {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6) !important;
}
[data-theme="dark"] #tab-context-title {
    color: #94a3b8 !important;
    border-bottom: 1px solid #334155 !important;
}
[data-theme="dark"] .tab-context-item {
    color: #e2e8f0 !important;
}
[data-theme="dark"] .tab-context-item:hover {
    background: #334155 !important;
    color: #38bdf8 !important;
}

/* 5. Cố vấn giải cứu ca rớt (Smart Unscheduled Advisor) */
[data-theme="dark"] #advisor-modal-body {
    background: #0f172a !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] .rescue-card {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}
[data-theme="dark"] .rescue-card:hover {
    border-color: #3b82f6 !important;
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.2) !important;
}
[data-theme="dark"] .rescue-card-header {
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .rescue-pat-name {
    color: #f8fafc !important;
}
[data-theme="dark"] .rescue-proc-name {
    color: #60a5fa !important;
}
[data-theme="dark"] .rescue-cause-detail {
    background: #0f172a !important;
    color: #cbd5e1 !important;
    border-left: 4px solid #3b82f6 !important;
}
[data-theme="dark"] .rescue-advice-item {
    background: #151f2e !important;
    border: 1.5px solid #334155 !important;
}
[data-theme="dark"] .rescue-advice-item:hover {
    border-color: #38bdf8 !important;
    background: #1e293b !important;
}
[data-theme="dark"] .rescue-advice-title {
    color: #38bdf8 !important;
}
[data-theme="dark"] .rescue-advice-desc {
    color: #94a3b8 !important;
}

/* 6. Modal Tra Cứu Văn Bản & BHXH (Doc Lookup) */
[data-theme="dark"] #modal-doc-lookup > div {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
}
[data-theme="dark"] #modal-doc-lookup div[style*="background: #f8fafc"],
[data-theme="dark"] #modal-doc-lookup div[style*="background:#f8fafc"] {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] #modal-doc-lookup div[style*="background: #ffffff"],
[data-theme="dark"] #modal-doc-lookup div[style*="background:#ffffff"] {
    background: #1e293b !important;
}
[data-theme="dark"] #doc-admin-editor-panel {
    background: #0f172a !important;
    border-bottom: 2px solid #1e3a8a !important;
}
[data-theme="dark"] #doc-editor-title {
    color: #38bdf8 !important;
}
[data-theme="dark"] #doc-filter-agency {
    background: #0f172a !important;
    color: #f8fafc !important;
    border-color: #334155 !important;
}
[data-theme="dark"] #modal-doc-lookup table thead tr,
[data-theme="dark"] #modal-doc-lookup table thead th {
    background: #0f172a !important;
    color: #38bdf8 !important;
    border-color: #334155 !important;
}
[data-theme="dark"] #modal-doc-lookup table tbody tr td {
    background: #1e293b !important;
    color: #e2e8f0 !important;
    border-bottom: 1px solid #334155 !important;
}
[data-theme="dark"] #modal-doc-lookup table tbody tr:hover td {
    background: #253349 !important;
    color: #ffffff !important;
}

/* 7. Modal Trình Biên Tập Phác Đồ (Protocol Editor) */
[data-theme="dark"] #modal-protocol-editor > div {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] #modal-protocol-title {
    color: #38bdf8 !important;
}
[data-theme="dark"] #modal-protocol-editor div[style*="background: #f8fafc"],
[data-theme="dark"] #modal-protocol-editor div[style*="background:#f8fafc"] {
    background: #0f172a !important;
    border-color: #334155 !important;
}
[data-theme="dark"] #modal-protocol-procs-yhct,
[data-theme="dark"] #modal-protocol-procs-phcn {
    background: #0f172a !important;
    border-color: #334155 !important;
}
[data-theme="dark"] #modal-protocol-editor label {
    color: #cbd5e1 !important;
}

/* 8. Modal Quản Lý Nhân Sự & Quản Lý Đơn Vị (Tenants) */
[data-theme="dark"] #modal-admin-employee > div,
[data-theme="dark"] #modal-tenant-form > div {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] #modal-admin-emp-title,
[data-theme="dark"] #modal-tenant-title {
    color: #38bdf8 !important;
}
[data-theme="dark"] #modal-admin-employee label,
[data-theme="dark"] #modal-tenant-form label {
    color: #cbd5e1 !important;
}

/* 9. Modal Trạng Thái Server, Đổi Mật Khẩu, Cấu Hình GAS */
[data-theme="dark"] #modal-change-password > div,
[data-theme="dark"] #modal-server-status > div,
[data-theme="dark"] #modal-config-gas > div {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] #modal-server-status h3,
[data-theme="dark"] #modal-change-password h3,
[data-theme="dark"] #modal-config-gas h3 {
    color: #38bdf8 !important;
}
[data-theme="dark"] #modal-server-status div[style*="background: #f8fafc"],
[data-theme="dark"] #modal-server-status div[style*="background:#f8fafc"],
[data-theme="dark"] #modal-config-gas div[style*="background: #f8fafc"],
[data-theme="dark"] #modal-config-gas div[style*="background:#f8fafc"] {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #cbd5e1 !important;
}

[data-theme="dark"] .modal-header {
    border-bottom: 1px solid #334155 !important;
    background: #111827 !important;
}

[data-theme="dark"] .modal-footer {
    border-top: 1px solid #334155 !important;
    background: #111827 !important;
}

[data-theme="dark"] .main-footer,
[data-theme="dark"] .app-footer-bar {
    background-color: #0b1120 !important;
    border-top: 2px solid #3b82f6 !important;
    color: #94a3b8 !important;
}

[data-theme="dark"] .main-footer h4,
[data-theme="dark"] .app-footer-bar h4 {
    color: #38bdf8 !important;
}

[data-theme="dark"] .main-footer p,
[data-theme="dark"] .main-footer span,
[data-theme="dark"] .main-footer a {
    color: #cbd5e1 !important;
}

[data-theme="dark"] .mobile-header-bar {
    background: linear-gradient(135deg, #090d16 0%, #1e293b 100%) !important;
    border-bottom: 1px solid #334155 !important;
}

[data-theme="dark"] .mobile-bottom-nav {
    background: #111827 !important;
    border-top: 1px solid #1e293b !important;
}

[data-theme="dark"] .mobile-drawer {
    background: #1e293b !important;
    border-color: #334155 !important;
}

[data-theme="dark"] .mobile-drawer-header {
    background: #111827 !important;
    border-bottom: 1px solid #334155 !important;
}

/* --------------------------------------------------------------------------
   🌙 DARK THEME: FORMS, SEARCH BARS, SKILLS BOXES, FILTERS & CONTROLS
   -------------------------------------------------------------------------- */

/* 1. Khung biểu mẫu bên trái (Sidebar Form) & Chân trang ghim (Pinned Footer) */
[data-theme="dark"] .sidebar-form {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}

[data-theme="dark"] .sidebar-form label,
[data-theme="dark"] .sidebar-form .form-group label {
    color: #cbd5e1 !important;
}

[data-theme="dark"] .sidebar-form .form-pinned-footer,
[data-theme="dark"] .form-pinned-footer,
[data-theme="dark"] div[style*="background: #f1f2f6"],
[data-theme="dark"] div[style*="background:#f1f2f6"],
[data-theme="dark"] div[style*="background: #f8f9fa"],
[data-theme="dark"] div[style*="background:#f8f9fa"] {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}

/* 2. Khung Thủ thuật / Kỹ năng (Skills Box, Headers & Checkboxes) */
[data-theme="dark"] .skills-box,
[data-theme="dark"] div[class*="skills-box"],
[data-theme="dark"] div[style*="background: #ffffff"][style*="border-radius: 6px; max-height: 300px"],
[data-theme="dark"] div[style*="background:#ffffff"][style*="border-radius: 6px; max-height: 300px"] {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] .skills-header,
[data-theme="dark"] div[class*="skills-header"],
[data-theme="dark"] div[style*="background:#dcdde1"],
[data-theme="dark"] div[style*="background: #dcdde1"] {
    background: #0b1120 !important;
    border-color: #334155 !important;
    color: #38bdf8 !important;
}

[data-theme="dark"] .scrollable-checkbox-list,
[data-theme="dark"] .skills-grid.scrollable-checkbox-list,
[data-theme="dark"] div[class*="scrollable-checkbox-list"] {
    background: #0b1120 !important;
    border: 1px solid #334155 !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] .skills-col h4 {
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] .skills-col h4.yhct {
    color: #f87171 !important;
}

[data-theme="dark"] .skills-col h4.phcn {
    color: #60a5fa !important;
}

[data-theme="dark"] .checkbox-item label,
[data-theme="dark"] .checkbox-item span,
[data-theme="dark"] .skills-col label {
    color: #cbd5e1 !important;
}

/* 3. Thanh tìm kiếm (Search Bars) trên các tab */
[data-theme="dark"] .patients-search-bar,
[data-theme="dark"] .table-search-bar,
[data-theme="dark"] .search-bar,
[data-theme="dark"] div[class*="search-bar"],
[data-theme="dark"] div[id*="search-bar"],
[data-theme="dark"] div[style*="border-bottom:none;"][style*="padding: 10px;"] {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    border-bottom: none !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] .patients-search-bar label,
[data-theme="dark"] .table-search-bar label,
[data-theme="dark"] .search-bar label,
[data-theme="dark"] div[style*="justify-content: space-between"] label,
[data-theme="dark"] .schedule-compact-header label {
    color: #38bdf8 !important;
}

/* 4. Nút lọc loại bệnh nhân (Tất cả, Nội trú, Ngoại trú) */
[data-theme="dark"] .btn-filter-pat-type {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #94a3b8 !important;
}

[data-theme="dark"] .btn-filter-pat-type:hover {
    background: #334155 !important;
    color: #f8fafc !important;
}

[data-theme="dark"] .btn-filter-pat-type.active {
    background: #2563eb !important;
    border-color: #2563eb !important;
    color: #ffffff !important;
    box-shadow: 0 0 10px rgba(37, 99, 235, 0.4) !important;
}

/* 5. Flatpickr Input & Calendar Popup */
[data-theme="dark"] input.flatpickr-input[type="text"],
[data-theme="dark"] input.flatpickr-input,
[data-theme="dark"] .flatpickr-input {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}

[data-theme="dark"] .flatpickr-calendar {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.6) !important;
    color: #f8fafc !important;
}

[data-theme="dark"] .flatpickr-calendar .flatpickr-months,
[data-theme="dark"] .flatpickr-calendar .flatpickr-month,
[data-theme="dark"] .flatpickr-calendar .flatpickr-current-month,
[data-theme="dark"] .flatpickr-calendar .flatpickr-current-month .cur-month,
[data-theme="dark"] .flatpickr-calendar span.flatpickr-weekday {
    background: #1e293b !important;
    color: #38bdf8 !important;
    fill: #38bdf8 !important;
}

[data-theme="dark"] .flatpickr-calendar .flatpickr-day {
    color: #cbd5e1 !important;
    border-color: transparent !important;
}

[data-theme="dark"] .flatpickr-calendar .flatpickr-day:hover,
[data-theme="dark"] .flatpickr-calendar .flatpickr-day.prevMonthDay:hover,
[data-theme="dark"] .flatpickr-calendar .flatpickr-day.nextMonthDay:hover {
    background: #334155 !important;
    color: #f8fafc !important;
}

[data-theme="dark"] .flatpickr-calendar .flatpickr-day.selected,
[data-theme="dark"] .flatpickr-calendar .flatpickr-day.startRange,
[data-theme="dark"] .flatpickr-calendar .flatpickr-day.endRange {
    background: #2563eb !important;
    border-color: #2563eb !important;
    color: #ffffff !important;
}

[data-theme="dark"] .flatpickr-calendar .flatpickr-day.today {
    border-color: #38bdf8 !important;
}

/* 6. Ô nhập liệu và chọn lọc ở tất cả các tab (Inputs, Selects, Textareas) */
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="search"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] input[type="number"],
[data-theme="dark"] input[type="date"],
[data-theme="dark"] input[type="url"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] select,
[data-theme="dark"] textarea,
[data-theme="dark"] .time-input,
[data-theme="dark"] #pat-search-input,
[data-theme="dark"] #machine-search-input,
[data-theme="dark"] #proc-search-input,
[data-theme="dark"] #staff-search-input,
[data-theme="dark"] #room-search-input,
[data-theme="dark"] #schedule-search-input,
[data-theme="dark"] #sat-search-bn,
[data-theme="dark"] #proto-search-proc-input,
[data-theme="dark"] #search-doc-time,
[data-theme="dark"] #search-machine-type,
[data-theme="dark"] #search-machine-time,
[data-theme="dark"] #doc-search-input {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
    color-scheme: dark !important;
}

[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus {
    border-color: #38bdf8 !important;
    box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.25) !important;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
    color: #64748b !important;
}

/* 7. Khung thông tin phụ trợ & Thống kê nhanh */
[data-theme="dark"] #schedule-upcoming-container,
[data-theme="dark"] div[style*="background: #f1f2f6; padding: 10px; border-radius: 5px"],
[data-theme="dark"] .upcoming-item {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #e2e8f0 !important;
}

/* --------------------------------------------------------------------------
   🌙 TAB THỨ 7 (XẾP LỊCH NGÀY THỨ 7) - ĐỒNG BỘ DARK THEME 100%
   -------------------------------------------------------------------------- */
.sat-col-panel {
    background: #fff;
    border: 1px solid #dcdde1;
}
#sat-staff-container.sat-col-panel {
    background: #fdfefe;
}
.sat-season-wrap {
    background: #ecf0f1;
}
.sat-patient-list {
    background: #f1f2f6;
}
.sat-footer-actions {
    background: #ecf0f1;
    border-top: 2px solid #27ae60;
}
#sat-summary-container.sat-col-panel {
    background: #f8f9fa;
}
.sat-bn-card {
    background: #fff;
    border: 1px solid #bdc3c7;
}
.sat-bn-name {
    color: #2c3e50;
}
.sat-bn-room {
    color: #e67e22;
    background: #fef5e7;
    border: 1px solid #fadbd8;
}
.sat-proc-name {
    color: #34495e;
}
.sat-ready-time-wrap {
    background: #fdf2e9;
    border: 1px dashed #e67e22;
}
.sat-ready-label {
    color: #d35400;
}
.sat-staff-name {
    color: #2980b9;
}

/* Chế độ tối Tab Thứ 7 */
[data-theme="dark"] #tab-sat {
    color: #f8fafc !important;
}

[data-theme="dark"] #tab-sat input#sat-schedule-date,
[data-theme="dark"] #tab-sat input#sat-search-bn {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
    color-scheme: dark !important;
}

[data-theme="dark"] #sat-staff-container,
[data-theme="dark"] #sat-summary-container,
[data-theme="dark"] #tab-sat div[style*="background: #fff"],
[data-theme="dark"] #tab-sat div[style*="background:#fff"],
[data-theme="dark"] #tab-sat div[style*="background: #fdfefe"],
[data-theme="dark"] #tab-sat div[style*="background:#fdfefe"],
[data-theme="dark"] #tab-sat div[style*="background: #f8f9fa"],
[data-theme="dark"] #tab-sat div[style*="background:#f8f9fa"],
[data-theme="dark"] .sat-col-panel {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
}

[data-theme="dark"] #sat-staff-container h4,
[data-theme="dark"] #sat-summary-container h4 {
    color: #38bdf8 !important;
}

[data-theme="dark"] #tab-sat div[style*="background: #ecf0f1"],
[data-theme="dark"] #tab-sat div[style*="background:#ecf0f1"],
[data-theme="dark"] .sat-season-wrap {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] #sat-staff-list > div,
[data-theme="dark"] .sat-staff-item {
    border-bottom-color: #334155 !important;
}

[data-theme="dark"] #sat-staff-list span,
[data-theme="dark"] .sat-staff-name {
    color: #38bdf8 !important;
}

[data-theme="dark"] #sat-staff-list div[id^="sat-time-"] {
    color: #cbd5e1 !important;
}

[data-theme="dark"] #sat-staff-list .time-input {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
}

/* Danh Sách Bệnh Nhân Tab Thứ 7 */
[data-theme="dark"] #sat-patient-list,
[data-theme="dark"] #tab-sat div[style*="background: #f1f2f6"],
[data-theme="dark"] #tab-sat div[style*="background:#f1f2f6"],
[data-theme="dark"] .sat-patient-list {
    background: #0b1120 !important;
    border: 1px solid #334155 !important;
}

/* Thẻ Bệnh Nhân Thứ 7 */
[data-theme="dark"] #sat-patient-list div[id^="sat-bn-"],
[data-theme="dark"] .sat-bn-card {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] #sat-patient-list div[id^="sat-bn-"]:hover,
[data-theme="dark"] .sat-bn-card:hover {
    border-color: #38bdf8 !important;
}

[data-theme="dark"] #sat-patient-list div[id^="sat-bn-"] > div:first-child,
[data-theme="dark"] .sat-bn-header {
    border-bottom-color: #334155 !important;
}

[data-theme="dark"] #sat-patient-list b,
[data-theme="dark"] .sat-bn-name {
    color: #38bdf8 !important;
}

[data-theme="dark"] #sat-patient-list div[id^="sat-bn-"] span[style*="background:#fef5e7"],
[data-theme="dark"] #sat-patient-list div[id^="sat-bn-"] span[style*="background: #fef5e7"],
[data-theme="dark"] .sat-bn-room {
    background: rgba(245, 158, 11, 0.18) !important;
    color: #fbbf24 !important;
    border: 1px solid rgba(245, 158, 11, 0.4) !important;
}

[data-theme="dark"] #sat-patient-list label span,
[data-theme="dark"] .sat-proc-name {
    color: #e2e8f0 !important;
}

[data-theme="dark"] #sat-patient-list label:hover span {
    color: #38bdf8 !important;
}

/* Khung Giờ Sẵn Sàng (⏱ Giờ SS) */
[data-theme="dark"] #sat-patient-list div[style*="background:#fdf2e9"],
[data-theme="dark"] #sat-patient-list div[style*="background: #fdf2e9"],
[data-theme="dark"] .sat-ready-time-wrap {
    background: rgba(217, 119, 6, 0.15) !important;
    border: 1px dashed rgba(245, 158, 11, 0.5) !important;
}

[data-theme="dark"] #sat-patient-list .sat-ready-label,
[data-theme="dark"] #sat-patient-list label[style*="color:#d35400"] {
    color: #fbbf24 !important;
}

[data-theme="dark"] #sat-patient-list .input-ready-time,
[data-theme="dark"] #sat-patient-list input[type="time"] {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
}

/* Khung Chân Trang Tab Thứ 7 (Nút Làm mới, Xếp lịch) */
[data-theme="dark"] .sat-footer-actions,
[data-theme="dark"] #tab-sat div[style*="border-top: 2px solid #27ae60"] {
    background: #0f172a !important;
    border-top: 2px solid #10b981 !important;
    border-left: 1px solid #334155 !important;
    border-right: 1px solid #334155 !important;
    border-bottom: 1px solid #334155 !important;
}

[data-theme="dark"] .sat-footer-actions label,
[data-theme="dark"] #tab-sat div[style*="border-top: 2px solid #27ae60"] label {
    color: #38bdf8 !important;
}

/* Khung Thống Kê Tab Thứ 7 (#sat-summary) */
[data-theme="dark"] #sat-summary div[style*="background:#2c3e50"] {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
}

[data-theme="dark"] #sat-summary div[style*="border-bottom:1px solid #ecf0f1"],
[data-theme="dark"] #sat-summary div[style*="border-bottom: 1px solid #ecf0f1"] {
    border-bottom-color: #334155 !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] #sat-summary span {
    color: #cbd5e1 !important;
}

[data-theme="dark"] #sat-summary b[style*="color:#e67e22"] {
    color: #fbbf24 !important;
}

/* --------------------------------------------------------------------------
   🌙 TOÀN DIỆN: TRIỆT TIÊU 100% KHOẢNG NỀN TRẮNG & SÁNG TRÊN MỌI TAB, MODAL, CARD
   -------------------------------------------------------------------------- */

/* 1. Header, User Dropdown & Login Box */
[data-theme="dark"] #user-dropdown-menu {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.6) !important;
}
[data-theme="dark"] #user-dropdown-menu a {
    color: #f8fafc !important;
}
[data-theme="dark"] #user-dropdown-menu a:hover {
    background: #334155 !important;
    color: #38bdf8 !important;
}
[data-theme="dark"] #nav-btn-user {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}
[data-theme="dark"] div[style*="background: #edf2f7"],
[data-theme="dark"] div[style*="background:#edf2f7"] {
    background: #334155 !important;
}
[data-theme="dark"] .login-box {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
}

/* 2. Dashboard / Trang Chủ (#tab-home) */
[data-theme="dark"] .page-header div[style*="background: #fff"],
[data-theme="dark"] .page-header div[style*="background:#fff"],
[data-theme="dark"] .page-header div[style*="border-radius: 25px"] {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
}
[data-theme="dark"] input#dashboard-date-filter {
    color: #38bdf8 !important;
    background: transparent !important;
}
[data-theme="dark"] .dash-chart-card,
[data-theme="dark"] div[style*="background: #ffffff; border-radius: 12px; padding: 18px 20px"],
[data-theme="dark"] div[style*="background:#ffffff; border-radius: 12px; padding: 18px 20px"] {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.4) !important;
}
[data-theme="dark"] #dash-chart-workdays-subtitle,
[data-theme="dark"] #dash-chart-procs-subtitle {
    color: #cbd5e1 !important;
}

/* 3. Tab Xếp Lịch (#tab-schedule) & Thanh Phân Trang */
[data-theme="dark"] .schedule-table-wrap,
[data-theme="dark"] div[style*="background:white; position:relative"],
[data-theme="dark"] div[style*="background: white; position: relative"],
[data-theme="dark"] div[style*="border:1px solid #bdc3c7; border-radius:5px; background:white"] {
    background: #0f172a !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .schedule-compact-header {
    background: #1e293b !important;
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] #sched-pagination-container,
[data-theme="dark"] .pagination-container,
[data-theme="dark"] div[style*="background:#fdfaf1"],
[data-theme="dark"] div[style*="background: #fdfaf1"] {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] .pagination-container b,
[data-theme="dark"] div[style*="background:#fdfaf1"] b {
    color: #38bdf8 !important;
}
[data-theme="dark"] span[style*="background:#e8f8f5"],
[data-theme="dark"] span[style*="background: #e8f8f5"] {
    background: rgba(16, 185, 129, 0.2) !important;
    color: #34d399 !important;
}
[data-theme="dark"] #tab-schedule div[style*="background: #ecf0f1"],
[data-theme="dark"] #tab-schedule div[style*="background:#ecf0f1"] {
    background: #0f172a !important;
    border-color: #334155 !important;
    border-top-color: #10b981 !important;
}
[data-theme="dark"] #tab-schedule div[style*="background: #ecf0f1"] label {
    color: #38bdf8 !important;
}

/* 4. Tab Giờ Bận & Ra Viện (#tab-busy) */
[data-theme="dark"] .busy-col-card,
[data-theme="dark"] .card-staff,
[data-theme="dark"] .card-pat,
[data-theme="dark"] .card-patient,
[data-theme="dark"] .card-leave {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] .busy-col-card.card-staff,
[data-theme="dark"] .busy-col-card.card-pat,
[data-theme="dark"] .busy-col-card.card-leave {
    background: #1e293b !important;
    border-color: #334155 !important;
}

/* 5. Tab Kiểm Tra (#tab-kiemtra) */
[data-theme="dark"] #tab-kiemtra .utils-compact-header,
[data-theme="dark"] #tab-kiemtra div[style*="background:#ecf0f1"],
[data-theme="dark"] #tab-kiemtra div[style*="background: #ecf0f1"] {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] #tab-kiemtra .utils-split-layout > div,
[data-theme="dark"] #tab-kiemtra div[style*="background: #eafaf1"],
[data-theme="dark"] #tab-kiemtra div[style*="background:#eafaf1"],
[data-theme="dark"] #tab-kiemtra div[style*="background: #fdf2e9"],
[data-theme="dark"] #tab-kiemtra div[style*="background:#fdf2e9"],
[data-theme="dark"] #tab-kiemtra div[style*="background: #fef5e7"],
[data-theme="dark"] #tab-kiemtra div[style*="background:#fef5e7"],
[data-theme="dark"] #tab-kiemtra div[style*="background: #e8f8f5"],
[data-theme="dark"] #tab-kiemtra div[style*="background:#e8f8f5"] {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}
[data-theme="dark"] #tab-kiemtra .utils-table-scroll,
[data-theme="dark"] #tab-kiemtra div[style*="background: white; overflow-y: auto"],
[data-theme="dark"] #tab-kiemtra div[style*="background:white; overflow-y:auto"] {
    background: #0f172a !important;
    border-color: #334155 !important;
}
[data-theme="dark"] #tab-kiemtra thead tr {
    background: #0f172a !important;
}
[data-theme="dark"] #tab-kiemtra thead th {
    background: #0f172a !important;
    color: #38bdf8 !important;
    border-bottom: 2px solid #334155 !important;
}

/* 6. Tab Tiện Ích & Quản Trị (#tab-utils, #tab-admin) */
[data-theme="dark"] .admin-sidebar-menu,
[data-theme="dark"] div[style*="background: #fff; border: 1px solid #dcdde1"],
[data-theme="dark"] div[style*="background:#fff; border:1px solid #dcdde1"] {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}
[data-theme="dark"] .admin-sidebar-heading {
    color: #38bdf8 !important;
    border-bottom-color: #334155 !important;
}
[data-theme="dark"] .admin-nav-btn {
    background: #0f172a !important;
    color: #cbd5e1 !important;
    border-color: transparent !important;
}
[data-theme="dark"] .admin-nav-btn:hover {
    background: #334155 !important;
    color: #38bdf8 !important;
}
[data-theme="dark"] .admin-nav-btn.active {
    background: #2563eb !important;
    color: #ffffff !important;
    border-left-color: #38bdf8 !important;
}
[data-theme="dark"] .admin-content-pane,
[data-theme="dark"] .admin-section {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}
[data-theme="dark"] .admin-section .tab-header-title {
    background: #0f172a !important;
    color: #38bdf8 !important;
    border: 1px solid #334155 !important;
}
[data-theme="dark"] .admin-section div[style*="background: #ffffff"],
[data-theme="dark"] .admin-section div[style*="background:#ffffff"],
[data-theme="dark"] .admin-section div[style*="background: #fff"],
[data-theme="dark"] .admin-section div[style*="background:#fff"],
[data-theme="dark"] .admin-section div[style*="background: #f8fafc"],
[data-theme="dark"] .admin-section div[style*="background:#f8fafc"],
[data-theme="dark"] .admin-section div[style*="background: #f1f2f6"],
[data-theme="dark"] .admin-section div[style*="background:#f1f2f6"],
[data-theme="dark"] .admin-section div[style*="background: white"],
[data-theme="dark"] .admin-section div[style*="background:white"] {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}
[data-theme="dark"] .admin-section div[style*="background: #fff8f0"] {
    background: rgba(234, 88, 12, 0.15) !important;
    border-color: rgba(234, 88, 12, 0.35) !important;
}
[data-theme="dark"] .admin-section div[style*="background: #f0fdf4"] {
    background: rgba(16, 185, 129, 0.12) !important;
    border-color: rgba(16, 185, 129, 0.35) !important;
}
[data-theme="dark"] .admin-section div[style*="background: #f0fdf4"] ul,
[data-theme="dark"] .admin-section div[style*="background: #f0fdf4"] li {
    color: #a7f3d0 !important;
}
[data-theme="dark"] .admin-section h3,
[data-theme="dark"] .admin-section h4,
[data-theme="dark"] .admin-section h5 {
    color: #38bdf8 !important;
}
[data-theme="dark"] .admin-section label {
    color: #e2e8f0 !important;
}
[data-theme="dark"] .admin-section small {
    color: #94a3b8 !important;
}
[data-theme="dark"] .admin-section code[style*="background: #f1f5f9"],
[data-theme="dark"] .admin-section code[style*="background:#f1f5f9"] {
    background: #1e293b !important;
    color: #f43f5e !important;
    border: 1px solid #334155 !important;
}
[data-theme="dark"] .quicklink-admin-item {
    background: #0f172a !important;
    border-color: #334155 !important;
}
[data-theme="dark"] #acc-perms-box {
    background: #0f172a !important;
    border-color: #334155 !important;
}
[data-theme="dark"] #table-admin-employees {
    background: #0f172a !important;
}

/* 7. Tab Chấm Công & Thống Kê (#tab-chamcong, #tab-thongke) */
[data-theme="dark"] div[style*="min-height: 380px; background: #ffffff"],
[data-theme="dark"] div[style*="min-height: 0; background: #ffffff"],
[data-theme="dark"] div[style*="background: #ffffff; border-radius: 6px; border: 1px solid #e2e8f0"],
[data-theme="dark"] div[style*="flex: 1; background: white; border: 1px solid #bdc3c7"],
[data-theme="dark"] div[style*="flex: 1.5; background: white; border: 1px solid #bdc3c7"] {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}
[data-theme="dark"] tr[style*="background: #f1f5f9"],
[data-theme="dark"] tr[style*="background:#f1f5f9"] {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #38bdf8 !important;
}

/* 8. Toàn Bộ Modals, Popups, Cố Vấn, Cứu Ca, Đổi Mật Khẩu, Máy Chủ */
[data-theme="dark"] div[style*="position: fixed; z-index: 100000; background: #ffffff"],
[data-theme="dark"] div[style*="position: fixed; z-index: 100000; background:#ffffff"] {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.7) !important;
}
[data-theme="dark"] div[id^="modal-"] > div,
[data-theme="dark"] div[id*="Modal"] > div,
[data-theme="dark"] #sync-progress-modal > div,
[data-theme="dark"] #modal-unscheduled-advisor > div,
[data-theme="dark"] #modal-rescue-case > div,
[data-theme="dark"] #modal-doc-lookup > div,
[data-theme="dark"] #modal-hdsd-viewer > div,
[data-theme="dark"] #modal-change-password > div,
[data-theme="dark"] #modal-server-status > div,
[data-theme="dark"] #modal-config-gas > div,
[data-theme="dark"] #modal-tenant-form > div {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
}
[data-theme="dark"] #advisor-modal-body,
[data-theme="dark"] #advisor-modal-body > div,
[data-theme="dark"] #modal-unscheduled-advisor div[style*="background: #f8fafc"],
[data-theme="dark"] #modal-unscheduled-advisor div[style*="background: #ffffff"],
[data-theme="dark"] #modal-unscheduled-advisor div[style*="background:#f8fafc"],
[data-theme="dark"] #modal-unscheduled-advisor div[style*="background:#ffffff"] {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] #modal-hdsd-viewer div[style*="background: #f8fafc"],
[data-theme="dark"] #modal-hdsd-viewer div[style*="background:#f8fafc"] {
    background: #0f172a !important;
    border-color: #334155 !important;
}
[data-theme="dark"] #modal-doc-lookup div[style*="background: #f8fafc"],
[data-theme="dark"] #modal-doc-lookup div[style*="background:#f8fafc"],
[data-theme="dark"] #modal-doc-lookup div[style*="background: #ffffff"],
[data-theme="dark"] #modal-doc-lookup div[style*="background:#ffffff"] {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] #modal-server-status div[style*="background: #f8f9fa"],
[data-theme="dark"] #modal-server-status div[style*="background:#f8f9fa"] {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
[data-theme="dark"] #modal-config-gas div[style*="background: #eff6ff"],
[data-theme="dark"] #modal-config-gas div[style*="background:#eff6ff"] {
    background: rgba(37, 99, 235, 0.15) !important;
    border-color: rgba(37, 99, 235, 0.35) !important;
    color: #93c5fd !important;
}
[data-theme="dark"] div[style*="background:#fdfaf1; padding:25px"],
[data-theme="dark"] div[style*="background: #fdfaf1; padding: 25px"] {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}
[data-theme="dark"] div[style*="background: #eaf6fb"],
[data-theme="dark"] div[style*="background:#eaf6fb"] {
    background: rgba(37, 99, 235, 0.15) !important;
    border-color: rgba(37, 99, 235, 0.35) !important;
    color: #93c5fd !important;
}

/* 9. Universal Fallback - Quét sạch mọi thẻ mang nền sáng inline còn sót lại */
[data-theme="dark"] div[style*="background: #fff"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background:#fff"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background: #ffffff"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background:#ffffff"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background: white"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background:white"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background: #f8fafc"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background:#f8fafc"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background: #f1f5f9"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background:#f1f5f9"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background: #f1f2f6"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background:#f1f2f6"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background: #f8f9fa"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background:#f8f9fa"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background: #fdfefe"]:not(.badge):not(.status-badge):not([class*="badge"]),
[data-theme="dark"] div[style*="background:#fdfefe"]:not(.badge):not(.status-badge):not([class*="badge"]) {
    background-color: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}

[data-theme="dark"] button[style*="background: #f8fafc"],
[data-theme="dark"] button[style*="background:#f8fafc"],
[data-theme="dark"] button[style*="background: #f1f5f9"],
[data-theme="dark"] button[style*="background:#f1f5f9"],
[data-theme="dark"] button[style*="background: #fff"],
[data-theme="dark"] button[style*="background:#fff"],
[data-theme="dark"] button[style*="background: white"],
[data-theme="dark"] button[style*="background:white"] {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #cbd5e1 !important;
}
[data-theme="dark"] button[style*="background: #f8fafc"]:hover,
[data-theme="dark"] button[style*="background: #f1f5f9"]:hover,
[data-theme="dark"] button[style*="background: #fff"]:hover {
    background: #334155 !important;
    color: #38bdf8 !important;
}

/* ==========================================================================
   🌙 ĐỒNG BỘ DARK THEME V4.0.6: PHÁC ĐỒ ĐIỀU TRỊ, TAB THỨ 7, KÝ HIỆU CHẤM CÔNG
   ========================================================================== */

/* ── 1. PHÁC ĐỒ ĐIỀU TRỊ (GÓI THỦ THUẬT LÂM SÀNG) ── */
[data-theme="dark"] #section-protocols {
    border-top: 2px solid #334155 !important;
}

[data-theme="dark"] #sidebar-form-proto {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
}

[data-theme="dark"] #sidebar-form-proto label,
[data-theme="dark"] .proto-skills-container span {
    color: #e2e8f0 !important;
}

[data-theme="dark"] #proto-name,
[data-theme="dark"] #proto-search-proc-input {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
    color-scheme: dark !important;
}

[data-theme="dark"] #proto-selected-count-badge {
    background: rgba(59, 130, 246, 0.2) !important;
    color: #60a5fa !important;
    border: 1px solid rgba(59, 130, 246, 0.4) !important;
}

[data-theme="dark"] .proto-skills-container .btn-secondary {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #cbd5e1 !important;
}

[data-theme="dark"] .proto-skills-container .btn-secondary:hover {
    background: #334155 !important;
    color: #38bdf8 !important;
    border-color: #60a5fa !important;
}

[data-theme="dark"] .proto-skills-container .skills-box {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
}

[data-theme="dark"] .proto-skills-container h4.yhct {
    color: #f87171 !important;
    border-bottom: 1.5px solid rgba(248, 113, 113, 0.3) !important;
}

[data-theme="dark"] .proto-skills-container h4.phcn {
    color: #60a5fa !important;
    border-bottom: 1.5px solid rgba(96, 165, 250, 0.3) !important;
}

[data-theme="dark"] .proto-proc-item,
[data-theme="dark"] label.proto-proc-item {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    color: #e2e8f0 !important;
    transition: all 0.15s ease !important;
}

[data-theme="dark"] .proto-proc-item:hover,
[data-theme="dark"] label.proto-proc-item:hover {
    background: #334155 !important;
    border-color: #60a5fa !important;
}

[data-theme="dark"] .proto-proc-item span,
[data-theme="dark"] .proto-proc-name {
    color: #e2e8f0 !important;
}

[data-theme="dark"] .proto-proc-cb {
    accent-color: #2563eb !important;
}

[data-theme="dark"] #protocols-table {
    border: 1px solid #334155 !important;
}

[data-theme="dark"] #protocols-table thead th {
    background: #0f172a !important;
    color: #94a3b8 !important;
    border-bottom: 1px solid #334155 !important;
}

[data-theme="dark"] #protocols-list tr {
    border-bottom: 1px solid #334155 !important;
    background: transparent !important;
}

[data-theme="dark"] #protocols-list tr:hover {
    background: rgba(30, 41, 59, 0.7) !important;
}

[data-theme="dark"] #protocols-list td {
    border-bottom: 1px solid #334155 !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] #protocols-list strong {
    color: #38bdf8 !important;
}

[data-theme="dark"] #protocols-list .badge,
[data-theme="dark"] #protocols-list .proto-proc-badge {
    background: rgba(30, 58, 138, 0.4) !important;
    color: #93c5fd !important;
    border: 1px solid rgba(59, 130, 246, 0.4) !important;
}

/* Modal Phác Đồ */
[data-theme="dark"] #modal-protocol-editor > div {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
}

[data-theme="dark"] #modal-protocol-title {
    color: #38bdf8 !important;
}

[data-theme="dark"] #modal-protocol-editor label {
    color: #cbd5e1 !important;
}

[data-theme="dark"] #protocol-name-input {
    background: #0f172a !important;
    border: 1.5px solid #334155 !important;
    color: #f8fafc !important;
    color-scheme: dark !important;
}

[data-theme="dark"] #modal-protocol-editor div[style*="background: #f8fafc"],
[data-theme="dark"] #modal-protocol-editor div[style*="background:#f8fafc"] {
    background: #0f172a !important;
    border-color: #334155 !important;
}

[data-theme="dark"] #modal-protocol-procs-yhct label,
[data-theme="dark"] #modal-protocol-procs-phcn label {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    color: #e2e8f0 !important;
}


/* ── 2. TAB THỨ 7 (XẾP LỊCH NGÀY THỨ 7) ── */
[data-theme="dark"] #tab-sat .tab-header-title {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35) !important;
}

[data-theme="dark"] #sat-patient-count-badge {
    background: rgba(56, 189, 248, 0.15) !important;
    color: #38bdf8 !important;
    border: 1px solid rgba(56, 189, 248, 0.4) !important;
}

[data-theme="dark"] #sat-schedule-date,
[data-theme="dark"] #sat-search-bn {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
    color-scheme: dark !important;
}

[data-theme="dark"] #sat-patient-list {
    background: #0b1120 !important;
    border: 1px solid #1e293b !important;
}

[data-theme="dark"] .sat-bn-card {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .sat-bn-card:hover {
    border-color: #38bdf8 !important;
    box-shadow: 0 4px 12px rgba(56, 189, 248, 0.15) !important;
}

[data-theme="dark"] .sat-bn-header {
    border-bottom: 1px dashed #334155 !important;
}

[data-theme="dark"] .sat-bn-name {
    color: #38bdf8 !important;
    font-weight: 700 !important;
    font-size: 12.5px !important;
}

[data-theme="dark"] .sat-bn-room {
    background: rgba(245, 158, 11, 0.18) !important;
    color: #fbbf24 !important;
    border: 1px solid rgba(245, 158, 11, 0.4) !important;
}

/* Thẻ checkbox thủ thuật Thứ 7 nổi bật, dễ nhìn trên nền tối */
[data-theme="dark"] .sat-proc-checkbox-label,
[data-theme="dark"] #sat-patient-list label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    transition: all 0.15s ease !important;
    cursor: pointer !important;
}

[data-theme="dark"] .sat-proc-checkbox-label:hover,
[data-theme="dark"] #sat-patient-list label:hover {
    background: rgba(56, 189, 248, 0.18) !important;
    border-color: rgba(56, 189, 248, 0.5) !important;
}

[data-theme="dark"] .sat-proc-name {
    color: #f8fafc !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    letter-spacing: 0.2px !important;
}

[data-theme="dark"] .sat-proc-cb {
    accent-color: #0284c7 !important;
    cursor: pointer !important;
    width: 14px !important;
    height: 14px !important;
}

[data-theme="dark"] label:has(.sat-proc-cb:checked),
[data-theme="dark"] .sat-proc-cb:checked + .sat-proc-name {
    color: #38bdf8 !important;
}

[data-theme="dark"] label:has(.sat-proc-cb:checked) {
    background: rgba(56, 189, 248, 0.2) !important;
    border-color: rgba(56, 189, 248, 0.5) !important;
}

[data-theme="dark"] .sat-ready-time-wrap {
    background: rgba(245, 158, 11, 0.12) !important;
    border: 1px dashed rgba(245, 158, 11, 0.45) !important;
    border-radius: 4px !important;
}

[data-theme="dark"] .sat-ready-label {
    color: #fbbf24 !important;
    font-weight: 700 !important;
}

[data-theme="dark"] .input-ready-time {
    background: #0f172a !important;
    border: 1px solid #475569 !important;
    color: #fbbf24 !important;
    font-weight: 700 !important;
    border-radius: 3px !important;
    color-scheme: dark !important;
}

[data-theme="dark"] .sat-footer-actions {
    background: #0f172a !important;
    border-top: 2px solid #10b981 !important;
    border: 1px solid #334155 !important;
}

[data-theme="dark"] .sat-footer-actions label {
    color: #cbd5e1 !important;
}

[data-theme="dark"] #sat-staff-container h4,
[data-theme="dark"] #sat-summary-container h4 {
    color: #38bdf8 !important;
}


/* ── 3. BẢNG KÝ HIỆU CHẤM CÔNG & QUY ƯỚC TÍNH CÔNG ── */
[data-theme="dark"] #chamcong-legend-container {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
}

[data-theme="dark"] #chamcong-legend-container .cc-leg-header {
    color: #38bdf8 !important;
}

[data-theme="dark"] #chamcong-legend-container .cc-leg-divider {
    border-bottom: 1px solid #334155 !important;
}

[data-theme="dark"] #chamcong-legend-summary {
    color: #94a3b8 !important;
}

[data-theme="dark"] #chamcong-legend-container button {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #cbd5e1 !important;
    transition: all 0.15s ease !important;
}

[data-theme="dark"] #chamcong-legend-container button:hover {
    background: #334155 !important;
    color: #38bdf8 !important;
    border-color: #60a5fa !important;
}

/* Ký hiệu chấm công (chips & badges): Tông màu tối êm dịu, chữ và viền phát sáng độ tương phản cao */
[data-theme="dark"] .cc-symbol-chip,
[data-theme="dark"] .cc-symbol-badge {
    background-color: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #e2e8f0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
    border-radius: 5px !important;
    padding: 3px 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    line-height: 1.3 !important;
}

[data-theme="dark"] .cc-symbol-chip span,
[data-theme="dark"] .cc-symbol-chip .cc-symbol-code,
[data-theme="dark"] .cc-symbol-chip .cc-symbol-desc {
    color: inherit !important;
}

[data-theme="dark"] .cc-symbol-chip[data-code="X"],
[data-theme="dark"] .cc-symbol-badge[data-code="X"] {
    background-color: #1e293b !important;
    border-color: #475569 !important;
    color: #f8fafc !important;
}

[data-theme="dark"] .cc-symbol-chip[data-code="X/2"],
[data-theme="dark"] .cc-symbol-chip[data-code="1/2"],
[data-theme="dark"] .cc-symbol-badge[data-code="X/2"],
[data-theme="dark"] .cc-symbol-badge[data-code="1/2"] {
    background-color: #042f2e !important;
    border-color: #115e59 !important;
    color: #5eead4 !important;
}

[data-theme="dark"] .cc-symbol-chip[data-code="S / C"],
[data-theme="dark"] .cc-symbol-chip[data-code="S"],
[data-theme="dark"] .cc-symbol-chip[data-code="C"],
[data-theme="dark"] .cc-symbol-badge[data-code="S / C"],
[data-theme="dark"] .cc-symbol-badge[data-code="S"],
[data-theme="dark"] .cc-symbol-badge[data-code="C"] {
    background-color: #022c22 !important;
    border-color: #065f46 !important;
    color: #6ee7b7 !important;
}

[data-theme="dark"] .cc-symbol-chip[data-code="Lễ"],
[data-theme="dark"] .cc-symbol-chip[data-code="LE"],
[data-theme="dark"] .cc-symbol-badge[data-code="Lễ"],
[data-theme="dark"] .cc-symbol-badge[data-code="LE"] {
    background-color: #450a0a !important;
    border-color: #7f1d1d !important;
    color: #fca5a5 !important;
}

[data-theme="dark"] .cc-symbol-chip[data-code="Tết"],
[data-theme="dark"] .cc-symbol-chip[data-code="TET"],
[data-theme="dark"] .cc-symbol-badge[data-code="Tết"],
[data-theme="dark"] .cc-symbol-badge[data-code="TET"] {
    background-color: #450a0a !important;
    border-color: #7f1d1d !important;
    color: #fca5a5 !important;
}

[data-theme="dark"] .cc-symbol-chip[data-code="Nội"],
[data-theme="dark"] .cc-symbol-chip[data-code="NOI"],
[data-theme="dark"] .cc-symbol-badge[data-code="Nội"],
[data-theme="dark"] .cc-symbol-badge[data-code="NOI"] {
    background-color: #172554 !important;
    border-color: #1e40af !important;
    color: #93c5fd !important;
}

[data-theme="dark"] .cc-symbol-chip[data-code="Ô"],
[data-theme="dark"] .cc-symbol-chip[data-code="O"],
[data-theme="dark"] .cc-symbol-badge[data-code="Ô"],
[data-theme="dark"] .cc-symbol-badge[data-code="O"] {
    background-color: #431407 !important;
    border-color: #9a3412 !important;
    color: #fdba74 !important;
}

[data-theme="dark"] .cc-symbol-chip[data-code="H"],
[data-theme="dark"] .cc-symbol-chip[data-code="F"],
[data-theme="dark"] .cc-symbol-chip[data-code="B"],
[data-theme="dark"] .cc-symbol-badge[data-code="H"],
[data-theme="dark"] .cc-symbol-badge[data-code="F"],
[data-theme="dark"] .cc-symbol-badge[data-code="B"] {
    background-color: #451a03 !important;
    border-color: #78350f !important;
    color: #fde68a !important;
}

[data-theme="dark"] .cc-symbol-chip[data-code="TS"],
[data-theme="dark"] .cc-symbol-badge[data-code="TS"] {
    background-color: #3b0764 !important;
    border-color: #581c87 !important;
    color: #d8b4fe !important;
}

[data-theme="dark"] .cc-symbol-chip[data-code="ĐK / DK"],
[data-theme="dark"] .cc-symbol-chip[data-code="ĐK"],
[data-theme="dark"] .cc-symbol-chip[data-code="DK"],
[data-theme="dark"] .cc-symbol-badge[data-code="ĐK / DK"],
[data-theme="dark"] .cc-symbol-badge[data-code="ĐK"],
[data-theme="dark"] .cc-symbol-badge[data-code="DK"] {
    background-color: #3b0764 !important;
    border-color: #581c87 !important;
    color: #d8b4fe !important;
}

[data-theme="dark"] .cc-symbol-chip[data-code="K / V"],
[data-theme="dark"] .cc-symbol-chip[data-code="K"],
[data-theme="dark"] .cc-symbol-chip[data-code="V"],
[data-theme="dark"] .cc-symbol-badge[data-code="K / V"],
[data-theme="dark"] .cc-symbol-badge[data-code="K"],
[data-theme="dark"] .cc-symbol-badge[data-code="V"] {
    background-color: #1e293b !important;
    border-color: #475569 !important;
    color: #94a3b8 !important;
}

/* Modal Quản Lý Ký Hiệu Chấm Công */
[data-theme="dark"] #modal-chamcong-symbol > div {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
}

[data-theme="dark"] #modal-chamcong-symbol h3 {
    color: #38bdf8 !important;
}

[data-theme="dark"] #modal-chamcong-symbol div[style*="background: #f8fafc"],
[data-theme="dark"] #modal-chamcong-symbol div[style*="background:#f8fafc"] {
    background: #0f172a !important;
    border-color: #334155 !important;
}

[data-theme="dark"] #modal-chamcong-symbol label {
    color: #cbd5e1 !important;
}

[data-theme="dark"] #symbol-input-code,
[data-theme="dark"] #symbol-input-label,
[data-theme="dark"] #symbol-input-value {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}

[data-theme="dark"] #modal-chamcong-symbol table thead {
    background: #0f172a !important;
}

[data-theme="dark"] #modal-chamcong-symbol table thead th {
    color: #94a3b8 !important;
    border-bottom: 1px solid #334155 !important;
}

[data-theme="dark"] #chamcong-symbol-tbody tr {
    border-bottom: 1px solid #334155 !important;
}

[data-theme="dark"] #chamcong-symbol-tbody td div[style*="color: #1e293b"],
[data-theme="dark"] #chamcong-symbol-tbody td div[style*="color:#1e293b"] {
    color: #f8fafc !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   ☀️❄️ SEASONAL SHIFT PRESETS & BATCH TOGGLE (MÙA HÈ / MÙA ĐÔNG)
   ═══════════════════════════════════════════════════════════════════════ */
.btn-season-preset {
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 600;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background: #ffffff;
    color: #475569;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}
.btn-season-preset:hover {
    background: #f8fafc;
    border-color: #94a3b8;
    color: #1e293b;
    transform: translateY(-1px);
}
.btn-season-preset.active {
    color: #ffffff !important;
    font-weight: 700;
}
.btn-season-preset#btn-preset-summer.active {
    background: #ea580c !important;
    border-color: #ea580c !important;
    box-shadow: 0 2px 5px rgba(234, 88, 12, 0.35);
}
.btn-season-preset#btn-preset-winter.active {
    background: #0284c7 !important;
    border-color: #0284c7 !important;
    box-shadow: 0 2px 5px rgba(2, 132, 199, 0.35);
}

.btn-season-batch {
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 600;
    border: none;
    border-radius: 4px;
    background: transparent;
    color: #64748b;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.btn-season-batch:hover {
    color: #1e293b;
    background: rgba(255, 255, 255, 0.7);
}
.btn-season-batch.active {
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}
.btn-season-batch#btn-batch-summer.active {
    color: #ea580c;
    font-weight: 700;
}
.btn-season-batch#btn-batch-winter.active {
    color: #0284c7;
    font-weight: 700;
}

/* Dark mode overrides */
[data-theme="dark"] .table-search-bar {
    background: #1e293b !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .season-batch-toggle {
    background: #0f172a !important;
    border-color: #334155 !important;
}
[data-theme="dark"] .btn-season-batch {
    color: #94a3b8;
}
[data-theme="dark"] .btn-season-batch:hover {
    color: #f8fafc;
    background: rgba(51, 65, 85, 0.6);
}
[data-theme="dark"] .btn-season-batch.active {
    background: #334155 !important;
}
[data-theme="dark"] .btn-season-batch#btn-batch-summer.active {
    color: #fb923c !important;
}
[data-theme="dark"] .btn-season-batch#btn-batch-winter.active {
    color: #38bdf8 !important;
}
[data-theme="dark"] .btn-season-preset {
    background: #1e293b;
    border-color: #334155;
    color: #cbd5e1;
}
[data-theme="dark"] .btn-season-preset:hover {
    background: #334155;
    color: #f8fafc;
    border-color: #475569;
}
[data-theme="dark"] .staff-season-radios label {
    color: #cbd5e1 !important;
}