/* ============================================
           SMART GROUP CRM - ENHANCED UI/UX
           Optimized for readability and eye comfort
           ============================================ */
        
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        /* Improved base typography */
        html {
            font-size: 15px;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }
        
        body {
            font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
            background: linear-gradient(135deg, #0d1a3d 0%, #15204a 50%, #0d1a3d 100%);
            min-height: 100vh;
            color: #e8eaf6;
            overflow-x: hidden;
            line-height: 1.6;
            isolation: isolate;
        }
        
        /* Improved animated background - softer gradients */
        .bg-gradient-animated {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -1;
            background: 
                radial-gradient(ellipse at 20% 20%, rgba(67, 24, 255, 0.08) 0%, transparent 50%),
                radial-gradient(ellipse at 80% 80%, rgba(159, 122, 234, 0.06) 0%, transparent 50%),
                radial-gradient(ellipse at 50% 50%, rgba(255, 140, 66, 0.03) 0%, transparent 50%),
                linear-gradient(180deg, #0d1a3d 0%, #131d42 100%);
        }
        
        /* Enhanced Glass Card - better contrast */
        .glass-card {
            background: rgba(255, 255, 255, 0.045);
            backdrop-filter: blur(24px);
            -webkit-backdrop-filter: blur(24px);
            border: 1px solid rgba(255, 255, 255, 0.1);
        }
        
        /* Select and Option styling for dark theme */
        select, select option {
            background-color: #1e2340 !important;
            color: white !important;
        }
        
        select:focus {
            outline: none;
            border-color: #3B82F6;
        }
        
        select option:hover, select option:checked {
            background-color: #2d3655 !important;
        }
            border-radius: 16px;
            box-shadow: 
                0 4px 24px rgba(0, 0, 0, 0.25),
                inset 0 1px 0 rgba(255, 255, 255, 0.06);
            transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .glass-card:hover {
            background: rgba(255, 255, 255, 0.055);
            border-color: rgba(255, 255, 255, 0.15);
            box-shadow: 
                0 8px 32px rgba(0, 0, 0, 0.35),
                inset 0 1px 0 rgba(255, 255, 255, 0.08);
            transform: translateY(-1px);
        }
        
        /* Enhanced Gradient Button */
        .btn-gradient {
            background: linear-gradient(135deg, #4f2bff 0%, #a78bfa 100%);
            border: none;
            border-radius: 10px;
            color: #ffffff;
            font-weight: 600;
            font-size: 0.95rem;
            padding: 12px 28px;
            cursor: pointer;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 4px 16px rgba(79, 43, 255, 0.35);
            letter-spacing: 0.01em;
        }
        
        .btn-gradient:hover {
            background: linear-gradient(135deg, #5a38ff 0%, #b49cfd 100%);
            transform: translateY(-2px);
            box-shadow: 0 6px 24px rgba(79, 43, 255, 0.45);
        }
        
        .btn-gradient:active {
            transform: translateY(0);
            box-shadow: 0 2px 12px rgba(79, 43, 255, 0.35);
        }
        
        /* Enhanced Secondary Button */
        .btn-secondary {
            background: rgba(255, 255, 255, 0.06);
            border: 1px solid rgba(255, 255, 255, 0.12);
            border-radius: 10px;
            color: #e8eaf6;
            font-weight: 500;
            font-size: 0.95rem;
            padding: 12px 28px;
            cursor: pointer;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .btn-secondary:hover {
            background: rgba(255, 255, 255, 0.1);
            border-color: rgba(255, 255, 255, 0.2);
            color: #ffffff;
        }
        
        /* Enhanced Input Field - better readability */
        .vision-input {
            background: rgba(255, 255, 255, 0.05);
            border: 1px solid rgba(255, 255, 255, 0.12);
            border-radius: 10px;
            color: #ffffff;
            padding: 14px 18px;
            font-size: 0.95rem;
            font-weight: 400;
            width: 100%;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
            line-height: 1.5;
        }
        
        .vision-input:focus {
            outline: none;
            border-color: #6366f1;
            box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
            background: rgba(255, 255, 255, 0.08);
        }
        
        .vision-input::placeholder {
            color: rgba(200, 200, 220, 0.5);
            font-weight: 400;
        }
        
        /* Select dropdown styling */
        select.vision-input {
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff80' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: right 16px center;
            padding-right: 40px;
            cursor: pointer;
        }
        
        select.vision-input::-ms-expand {
            display: none;
        }
        
        /* Dropdown options styling */
        select.vision-input option {
            background: #1B254B;
            color: #fff;
            padding: 12px 16px;
            font-size: 14px;
            border: none;
        }
        
        select.vision-input option:hover,
        select.vision-input option:focus,
        select.vision-input option:checked {
            background: rgba(67, 24, 255, 0.3);
            color: #fff;
        }
        
        /* Firefox dropdown styling */
        select.vision-input:-moz-focusring {
            color: transparent;
            text-shadow: 0 0 0 #fff;
        }
        
        /* Webkit browsers dropdown styling */
        select.vision-input optgroup {
            background: #1B254B;
            color: #fff;
        }
        
        /* Enhanced Sidebar */
        .sidebar {
            background: rgba(19, 26, 58, 0.85);
            backdrop-filter: blur(24px);
            -webkit-backdrop-filter: blur(24px);
            border-right: 1px solid rgba(255, 255, 255, 0.06);
        }
        
        /* Company Logo in Sidebar */
        #companyLogoContainer {
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            overflow: hidden;
        }
        
        #companyLogoImg {
            width: 100%;
            height: 100%;
            object-fit: contain;
            object-position: center center;
            position: absolute;
            top: 0;
            left: 0;
        }
        
        #companyLogoIcon {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
        }
        
        .sidebar-item {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 12px 16px;
            border-radius: 10px;
            color: rgba(220, 220, 240, 0.7);
            font-size: 0.92rem;
            font-weight: 500;
            cursor: pointer;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
            margin-bottom: 4px;
            letter-spacing: 0.01em;
        }
        
        .sidebar-item:hover {
            background: rgba(255, 255, 255, 0.06);
            color: #ffffff;
        }
        
        .sidebar-item.active {
            background: linear-gradient(135deg, rgba(99, 102, 241, 0.25) 0%, rgba(139, 92, 246, 0.18) 100%);
            color: #ffffff;
            border: 1px solid rgba(99, 102, 241, 0.35);
            box-shadow: 0 2px 12px rgba(99, 102, 241, 0.15);
        }
        
        /* Enhanced Section Header */
        .section-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 14px 16px;
            color: rgba(200, 200, 230, 0.85);
            font-size: 0.8rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.08em;
            cursor: pointer;
            transition: color 0.2s ease;
        }
        
        .section-header:hover {
            color: rgba(255, 255, 255, 0.95);
        }
        
        /* Enhanced Stat Card */
        .stat-card {
            background: rgba(255, 255, 255, 0.045);
            backdrop-filter: blur(24px);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 16px;
            padding: 22px;
            position: relative;
            overflow: hidden;
            transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .stat-card:hover {
            background: rgba(255, 255, 255, 0.055);
            border-color: rgba(255, 255, 255, 0.15);
            transform: translateY(-2px);
        }
        
        .stat-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg, #6366f1, #8b5cf6, #f59e0b);
        }
        
        .stat-icon {
            width: 44px;
            height: 44px;
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 18px;
            margin-bottom: 14px;
        }
        
        .stat-icon.blue {
            background: linear-gradient(135deg, rgba(99, 102, 241, 0.25) 0%, rgba(99, 102, 241, 0.08) 100%);
            color: #a5b4fc;
        }
        
        .stat-icon.purple {
            background: linear-gradient(135deg, rgba(139, 92, 246, 0.25) 0%, rgba(139, 92, 246, 0.08) 100%);
            color: #c4b5fd;
        }
        
        .stat-icon.orange {
            background: linear-gradient(135deg, rgba(245, 158, 11, 0.25) 0%, rgba(245, 158, 11, 0.08) 100%);
            color: #fcd34d;
        }
        
        .stat-icon.green {
            background: linear-gradient(135deg, rgba(16, 185, 129, 0.25) 0%, rgba(16, 185, 129, 0.08) 100%);
            color: #6ee7b7;
        }
        
        /* Enhanced Welcome Card */
        .welcome-card {
            background: linear-gradient(135deg, rgba(79, 43, 255, 0.35) 0%, rgba(139, 92, 246, 0.25) 50%, rgba(245, 158, 11, 0.15) 100%);
            border-radius: 20px;
            padding: 28px;
            position: relative;
            overflow: hidden;
            border: 1px solid rgba(255, 255, 255, 0.08);
        }
        
        .welcome-card::before {
            content: '';
            position: absolute;
            top: -40%;
            right: -5%;
            width: 350px;
            height: 350px;
            background: radial-gradient(circle, rgba(255, 255, 255, 0.08) 0%, transparent 70%);
            border-radius: 50%;
        }
        
        /* Enhanced Kanban */
        .kanban-column {
            background: rgba(255, 255, 255, 0.03);
            border: 1px solid rgba(255, 255, 255, 0.06);
            border-radius: 14px;
            min-height: 500px;
            padding: 16px;
        }
        
        .kanban-card {
            background: rgba(255, 255, 255, 0.06);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 12px;
            padding: 16px;
            margin-bottom: 12px;
            cursor: grab;
            transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .kanban-card:hover {
            background: rgba(255, 255, 255, 0.1);
            border-color: rgba(255, 255, 255, 0.18);
            transform: translateY(-2px);
            box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
        }
        
        .kanban-card.dragging {
            opacity: 0.6;
            cursor: grabbing;
            box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
        }
        
        /* Enhanced Table - better readability */
        .vision-table {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0;
        }
        
        .vision-table th {
            color: rgba(180, 180, 210, 0.7);
            font-size: 0.75rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.06em;
            padding: 14px 16px;
            text-align: left;
            border-bottom: 1px solid rgba(255, 255, 255, 0.08);
            cursor: pointer;
            user-select: none;
            transition: color 0.2s ease;
        }
        
        .vision-table th:hover {
            color: rgba(230, 230, 250, 0.95);
        }
        
        .vision-table td {
            padding: 14px 16px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.04);
            color: rgba(220, 220, 240, 0.9);
            font-size: 0.92rem;
            font-weight: 400;
            line-height: 1.5;
        }
        
        .vision-table tr:hover td {
            background: rgba(255, 255, 255, 0.035);
        }
        
        /* Enhanced Badge */
        .badge {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 5px 12px;
            border-radius: 20px;
            font-size: 0.78rem;
            font-weight: 500;
            letter-spacing: 0.01em;
        }
        
        .badge-blue {
            background: rgba(99, 102, 241, 0.18);
            color: #a5b4fc;
            border: 1px solid rgba(99, 102, 241, 0.2);
        }
        
        .badge-green {
            background: rgba(16, 185, 129, 0.18);
            color: #6ee7b7;
            border: 1px solid rgba(16, 185, 129, 0.2);
        }
        
        .badge-orange {
            background: rgba(245, 158, 11, 0.18);
            color: #fcd34d;
            border: 1px solid rgba(245, 158, 11, 0.2);
        }
        
        .badge-red {
            background: rgba(239, 68, 68, 0.18);
            color: #fca5a5;
            border: 1px solid rgba(239, 68, 68, 0.2);
        }
        
        .badge-purple {
            background: rgba(139, 92, 246, 0.18);
            color: #c4b5fd;
            border: 1px solid rgba(139, 92, 246, 0.2);
        }
        
        .badge-yellow {
            background: rgba(250, 204, 21, 0.18);
            color: #fde047;
            border: 1px solid rgba(250, 204, 21, 0.2);
        }
        
        .badge-cyan {
            background: rgba(6, 182, 212, 0.18);
            color: #67e8f9;
            border: 1px solid rgba(6, 182, 212, 0.2);
        }
        
        /* Progress Bar Styles */
        .progress-bar-container {
            background: rgba(255, 255, 255, 0.1);
            border-radius: 9999px;
            overflow: hidden;
            height: 8px;
        }
        
        .progress-bar-fill {
            height: 100%;
            border-radius: 9999px;
            background: linear-gradient(90deg, #4318FF, #9F7AEA);
            transition: width 0.5s ease;
        }
        
        .progress-steps {
            display: flex;
            justify-content: space-between;
            margin-top: 8px;
        }
        
        .progress-step {
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 16.66%;
        }
        
        .progress-step-dot {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.2);
            transition: all 0.3s ease;
        }
        
        .progress-step-dot.active {
            background: linear-gradient(135deg, #4318FF, #9F7AEA);
        }
        
        .progress-step-dot.current {
            box-shadow: 0 0 0 3px rgba(67, 24, 255, 0.3);
        }
        
        .progress-step-label {
            font-size: 9px;
            color: rgba(255, 255, 255, 0.4);
            margin-top: 4px;
            text-align: center;
            white-space: nowrap;
        }
        
        /* Enhanced Modal */
        .modal-overlay {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0, 0, 0, 0.65);
            backdrop-filter: blur(12px);
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 1000;
            padding: 20px;
        }
        
        .modal-content {
            background: linear-gradient(135deg, #131d42 0%, #1a254f 100%);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 12px;
            width: auto;
            min-width: 240px;
            max-width: 90vw;
            max-height: 90vh;
            overflow-y: auto;
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
        }
        
        /* Responsive modal adjustments */
        @media (max-width: 1024px) {
            .modal-content {
                max-width: 95vw;
                max-height: 95vh;
                border-radius: 16px;
            }
            
            #modal {
                padding: 16px;
            }
        }
        
        @media (max-width: 768px) {
            .modal-content {
                max-width: 100%;
                max-height: 100%;
                border-radius: 0;
                min-height: 100vh;
            }
            
            #modal {
                padding: 0;
                align-items: flex-start;
            }
            
            #modalContent {
                width: 100%;
                max-width: 100%;
                min-height: 100vh;
                border-radius: 0;
            }
        }
        
        @media (max-width: 480px) {
            .modal-content {
                padding: 16px;
            }
            
            .modal-content h2 {
                font-size: 18px;
            }
        }
        
        /* Enhanced Progress Bar */
        .progress-bar {
            height: 6px;
            background: rgba(255, 255, 255, 0.08);
            border-radius: 3px;
            overflow: hidden;
        }
        
        .progress-fill {
            height: 100%;
            border-radius: 3px;
            transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        /* Enhanced Scrollbar */
        ::-webkit-scrollbar {
            width: 6px;
            height: 6px;
        }
        
        ::-webkit-scrollbar-track {
            background: rgba(255, 255, 255, 0.02);
            border-radius: 3px;
        }
        
        ::-webkit-scrollbar-thumb {
            background: rgba(255, 255, 255, 0.12);
            border-radius: 3px;
        }
        
        ::-webkit-scrollbar-thumb:hover {
            background: rgba(255, 255, 255, 0.2);
        }
        
        /* Enhanced Notification */
        .notification {
            position: fixed;
            top: 20px;
            right: 20px;
            background: rgba(19, 29, 66, 0.96);
            backdrop-filter: blur(24px);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 14px;
            padding: 14px 18px;
            display: flex;
            align-items: center;
            gap: 12px;
            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
            z-index: 2000;
            animation: slideIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            max-width: 380px;
        }
        
        @keyframes slideIn {
            from {
                transform: translateX(100%);
                opacity: 0;
            }
            to {
                transform: translateX(0);
                opacity: 1;
            }
        }
        
        /* Enhanced Login Page */
        .login-container {
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 20px;
            position: relative;
        }
        
        .login-card {
            background: rgba(255, 255, 255, 0.045);
            backdrop-filter: blur(40px);
            -webkit-backdrop-filter: blur(40px);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 24px;
            padding: 42px;
            width: 100%;
            max-width: 420px;
            position: relative;
            overflow: hidden;
        }
        
        .login-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg, #6366f1, #8b5cf6, #f59e0b);
        }
        
        .login-glow {
            position: absolute;
            width: 280px;
            height: 280px;
            background: radial-gradient(circle, rgba(99, 102, 241, 0.25) 0%, transparent 70%);
            border-radius: 50%;
            top: -140px;
            right: -140px;
            pointer-events: none;
        }
        
        /* Enhanced View Toggle */
        .view-toggle {
            display: flex;
            background: rgba(255, 255, 255, 0.04);
            border: 1px solid rgba(255, 255, 255, 0.08);
            border-radius: 10px;
            padding: 4px;
        }
        
        .view-toggle button {
            padding: 9px 18px;
            border-radius: 8px;
            font-size: 0.88rem;
            font-weight: 500;
            color: rgba(180, 180, 200, 0.6);
            background: transparent;
            border: none;
            cursor: pointer;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .view-toggle button:hover {
            color: rgba(220, 220, 240, 0.85);
        }
        
        .view-toggle button.active {
            background: rgba(99, 102, 241, 0.25);
            color: #ffffff;
            box-shadow: 0 2px 8px rgba(99, 102, 241, 0.2);
        }
        
        /* Enhanced Calendar */
        .calendar-grid {
            display: grid;
            grid-template-columns: repeat(7, 1fr);
            gap: 8px;
        }
        
        .calendar-day {
            min-height: 130px;
            background: rgba(255, 255, 255, 0.035);
            border: 1px solid rgba(255, 255, 255, 0.06);
            border-radius: 12px;
            padding: 10px;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            cursor: pointer;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
            position: relative;
        }
        
        .calendar-day:hover {
            background: rgba(255, 255, 255, 0.06);
            border-color: rgba(255, 255, 255, 0.12);
        }
        
        .calendar-day.today {
            border-color: #6366f1;
            background: rgba(99, 102, 241, 0.12);
            box-shadow: 0 0 16px rgba(99, 102, 241, 0.2);
        }
        
        .calendar-day.drag-over {
            border-color: #10b981;
            background: rgba(16, 185, 129, 0.12);
            box-shadow: 0 0 16px rgba(16, 185, 129, 0.2);
        }
        
        .calendar-objects {
            width: 100%;
            margin-top: 8px;
            display: flex;
            flex-direction: column;
            gap: 5px;
            overflow-y: auto;
            max-height: 85px;
        }
        
        .calendar-object-item {
            background: linear-gradient(135deg, rgba(99, 102, 241, 0.25) 0%, rgba(139, 92, 246, 0.18) 100%);
            border: 1px solid rgba(99, 102, 241, 0.25);
            border-radius: 8px;
            padding: 7px 10px;
            cursor: grab;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
            font-size: 0.8rem;
            display: flex;
            flex-direction: column;
            gap: 2px;
        }
        
        .calendar-object-item:hover {
            background: linear-gradient(135deg, rgba(99, 102, 241, 0.4) 0%, rgba(139, 92, 246, 0.3) 100%);
            border-color: rgba(99, 102, 241, 0.4);
            transform: translateY(-1px);
            box-shadow: 0 3px 10px rgba(99, 102, 241, 0.25);
        }
        
        .calendar-object-item.dragging {
            opacity: 0.6;
            cursor: grabbing;
        }
        
        .calendar-object-item .object-address {
            color: #f1f5f9;
            font-weight: 500;
            line-height: 1.3;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        
        .calendar-object-item .object-price {
            color: #6ee7b7;
            font-size: 0.7rem;
            font-weight: 600;
        }
        
        .calendar-event {
            background: linear-gradient(135deg, #6366f1, #8b5cf6);
            border-radius: 6px;
            padding: 5px 10px;
            font-size: 0.78rem;
            color: #ffffff;
            margin-top: 4px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            max-width: 100%;
            font-weight: 500;
            letter-spacing: 0.01em;
        }
        
        /* Enhanced File Upload */
        .file-upload-zone {
            border: 2px dashed rgba(255, 255, 255, 0.12);
            border-radius: 14px;
            padding: 28px;
            text-align: center;
            cursor: pointer;
            transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
            background: rgba(255, 255, 255, 0.02);
        }
        
        .file-upload-zone:hover {
            border-color: #6366f1;
            background: rgba(99, 102, 241, 0.06);
        }
        
        .file-upload-zone.dragover {
            border-color: #6366f1;
            background: rgba(99, 102, 241, 0.1);
            border-style: solid;
        }
        
        /* Enhanced Checkbox */
        input[type="checkbox"] {
            appearance: none;
            width: 20px;
            height: 20px;
            border: 2px solid rgba(200, 200, 220, 0.25);
            border-radius: 5px;
            background: rgba(255, 255, 255, 0.05);
            cursor: pointer;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
            position: relative;
            flex-shrink: 0;
        }
        
        input[type="checkbox"]:hover {
            border-color: #6366f1;
            background: rgba(99, 102, 241, 0.08);
        }
        
        input[type="checkbox"]:checked {
            background: linear-gradient(135deg, #6366f1, #8b5cf6);
            border-color: transparent;
        }
        
        input[type="checkbox"]:checked::after {
            content: '\f00c';
            font-family: 'Font Awesome 6 Free';
            font-weight: 900;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            color: white;
            font-size: 11px;
        }
        
        body.light-theme input[type="checkbox"] {
            border-color: rgba(0, 0, 0, 0.2);
            background: rgba(0, 0, 0, 0.05);
        }
        
        body.light-theme input[type="checkbox"]:hover {
            border-color: #6366f1;
        }
        
        /* Enhanced Chart Container */
        .chart-container {
            position: relative;
            height: 280px;
        }
        
        /* Glow effect for analytics charts */
        .h-96 canvas {
            filter: drop-shadow(0 0 20px rgba(99, 102, 241, 0.15));
        }
        
        /* Glow effect for pie chart */
        #analyticsChartGeneralPie_${objectId} {
            filter: drop-shadow(0 0 30px rgba(236, 72, 153, 0.25));
        }
        
        /* Enhanced Activity Timeline */
        .timeline-item {
            position: relative;
            padding-left: 26px;
            padding-bottom: 18px;
        }
        
        .timeline-item::before {
            content: '';
            position: absolute;
            left: 5px;
            top: 8px;
            bottom: 0;
            width: 2px;
            background: linear-gradient(180deg, rgba(99, 102, 241, 0.45) 0%, transparent 100%);
        }
        
        .timeline-item:last-child::before {
            display: none;
        }
        
        .timeline-dot {
            position: absolute;
            left: 0;
            top: 0;
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background: linear-gradient(135deg, #6366f1, #8b5cf6);
            border: 2px solid #0d1a3d;
        }
        
        /* Enhanced Filter Panel */
        .filter-panel {
            background: rgba(255, 255, 255, 0.035);
            border: 1px solid rgba(255, 255, 255, 0.08);
            border-radius: 14px;
            padding: 18px;
        }
        
        /* Enhanced Header Dropdown - Fixed z-index issue */
        .header-dropdown {
            position: fixed;
            top: 70px;
            right: 20px;
            min-width: 320px;
            max-width: 400px;
            background: linear-gradient(135deg, #131d42 0%, #1a254f 100%);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 16px;
            box-shadow: 0 20px 50px rgba(0, 0, 0, 0.45);
            z-index: 2147483647 !important;
            overflow: hidden;
            isolation: isolate;
            transform: translateZ(0);
        }
        
        .header-dropdown-header {
            padding: 14px 18px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.06);
            display: flex;
            align-items: center;
            justify-content: space-between;
        }
        
        .header-dropdown-content {
            max-height: 380px;
            overflow-y: auto;
        }
        
        .header-dropdown-item {
            padding: 12px 18px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.03);
            cursor: pointer;
            transition: all 0.2s ease;
        }
        
        .header-dropdown-item:hover {
            background: rgba(255, 255, 255, 0.045);
        }
        
        .header-dropdown-item:last-child {
            border-bottom: none;
        }
        
        .header-dropdown-empty {
            padding: 36px 20px;
            text-align: center;
            color: rgba(180, 180, 200, 0.5);
        }
        
        .header-dropdown-footer {
            padding: 12px 18px;
            border-top: 1px solid rgba(255, 255, 255, 0.06);
        }
        
        /* Enhanced Search Overlay */
        .search-overlay {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0, 0, 0, 0.75);
            backdrop-filter: blur(12px);
            z-index: 2000;
            display: flex;
            align-items: flex-start;
            justify-content: center;
            padding-top: 90px;
        }
        
        .search-container {
            width: 100%;
            max-width: 640px;
            margin: 0 20px;
        }
        
        .search-input-wrapper {
            position: relative;
            margin-bottom: 16px;
        }
        
        .search-input-wrapper i {
            position: absolute;
            left: 18px;
            top: 50%;
            transform: translateY(-50%);
            color: rgba(180, 180, 200, 0.5);
            font-size: 18px;
        }
        
        .search-input-wrapper input {
            width: 100%;
            padding: 18px 56px;
            font-size: 1rem;
            background: rgba(255, 255, 255, 0.06);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 14px;
            color: #ffffff;
            outline: none;
            transition: all 0.2s ease;
        }
        
        .search-input-wrapper input:focus {
            border-color: #6366f1;
            box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
            background: rgba(255, 255, 255, 0.08);
        }
        
        .search-input-wrapper input::placeholder {
            color: rgba(160, 160, 180, 0.45);
        }
        
        .search-close {
            position: absolute;
            right: 16px;
            top: 50%;
            transform: translateY(-50%);
            width: 36px;
            height: 36px;
            border-radius: 10px;
            background: rgba(255, 255, 255, 0.08);
            border: none;
            color: rgba(180, 180, 200, 0.6);
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.2s ease;
            padding: 0;
            line-height: 1;
        }
        
        .search-close i {
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 14px;
            line-height: 1;
        }
        
        .search-close:hover {
            background: rgba(255, 255, 255, 0.15);
            color: #ffffff;
        }
        
        .search-results {
            background: linear-gradient(135deg, #131d42 0%, #1a254f 100%);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 16px;
            max-height: 460px;
            overflow-y: auto;
        }
        
        .search-result-item {
            padding: 14px 18px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.04);
            cursor: pointer;
            transition: all 0.2s ease;
            display: flex;
            align-items: center;
            gap: 14px;
        }
        
        .search-result-item:hover {
            background: rgba(255, 255, 255, 0.04);
        }
        
        .search-result-icon {
            width: 40px;
            height: 40px;
            border-radius: 10px;
            background: rgba(99, 102, 241, 0.18);
            display: flex;
            align-items: center;
            justify-content: center;
            color: #a5b4fc;
            font-size: 16px;
            flex-shrink: 0;
        }
        
        .search-result-info h4 {
            color: #f1f5f9;
            font-weight: 500;
            font-size: 0.95rem;
            margin-bottom: 3px;
        }
        
        .search-result-info p {
            color: rgba(160, 160, 180, 0.65);
            font-size: 0.8rem;
        }
        
        .search-result-type {
            margin-left: auto;
            padding: 4px 12px;
            background: rgba(255, 255, 255, 0.06);
            border-radius: 20px;
            font-size: 0.72rem;
            color: rgba(160, 160, 180, 0.7);
            font-weight: 500;
        }
        
        /* Enhanced Theme Toggle */
        .theme-toggle {
            position: relative;
            width: 52px;
            height: 26px;
            background: rgba(255, 255, 255, 0.1);
            border-radius: 13px;
            cursor: pointer;
            transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .theme-toggle.active {
            background: linear-gradient(135deg, #6366f1, #8b5cf6);
        }
        
        .theme-toggle-slider {
            position: absolute;
            top: 3px;
            left: 3px;
            width: 20px;
            height: 20px;
            background: #ffffff;
            border-radius: 50%;
            transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 9px;
            color: #0d1a3d;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
        }
        
        .theme-toggle.active .theme-toggle-slider {
            left: 29px;
        }
        
        /* Light Theme - HR Platform Style */
        body.light-theme {
            background: #FFF9E6;
            color: #1a1a1a;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
        }
        
        body.light-theme .bg-gradient-animated {
            background: #FFF9E6;
        }
        
        /* Typography - Clean sans-serif */
        body.light-theme h1 {
            font-weight: 700;
            letter-spacing: -0.02em;
        }
        
        body.light-theme h2,
        body.light-theme h3 {
            font-weight: 600;
            letter-spacing: -0.01em;
        }
        
        body.light-theme .text-3xl {
            font-size: 1.875rem;
            font-weight: 700;
        }
        
        body.light-theme .text-2xl {
            font-size: 1.5rem;
            font-weight: 600;
        }
        
        /* Cards - White with soft shadow */
        body.light-theme .glass-card,
        body.light-theme .sidebar,
        body.light-theme .kanban-column,
        body.light-theme .stat-card,
        body.light-theme .header-dropdown,
        body.light-theme .search-results,
        body.light-theme .filter-panel,
        body.light-theme .view-toggle {
            background: #FFFFFF !important;
            border: 1px solid rgba(0, 0, 0, 0.08) !important;
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important;
            border-radius: 16px;
        }
        
        body.light-theme .glass-card:hover {
            background: #FFFFFF !important;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
        }
        
        /* Inputs */
        body.light-theme .vision-input,
        body.light-theme select.vision-input {
            background: #FFFFFF;
            border: 1px solid rgba(0, 0, 0, 0.1);
            color: #1a1a1a;
            border-radius: 12px;
        }
        
        body.light-theme .vision-input:focus {
            border-color: #FFD700;
            box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.2);
        }
        
        body.light-theme .vision-input::placeholder {
            color: rgba(0, 0, 0, 0.35);
        }
        
        /* Force all selects to light background */
        body.light-theme select {
            background-color: #FFFFFF !important;
            color: #1a1a2e !important;
            border-color: rgba(0,0,0,0.12) !important;
        }
        
        /* Labels in filter panels */
        body.light-theme label[class*="text-white/"] { color: rgba(26,26,46,0.5) !important; }
        
        /* ========== SEMI-TRANSPARENT WHITE BG (dark theme base) ========== */
        body.light-theme [class*="bg-white/5"] {
            background: rgba(0,0,0,0.04) !important;
        }
        body.light-theme [class*="bg-white/10"] {
            background: rgba(0,0,0,0.07) !important;
        }
        body.light-theme [class*="bg-white/15"] {
            background: rgba(0,0,0,0.10) !important;
        }
        body.light-theme [class*="bg-white/20"] {
            background: rgba(0,0,0,0.12) !important;
        }
        body.light-theme [class*="bg-white/30"] {
            background: rgba(0,0,0,0.18) !important;
        }
        body.light-theme [class*="bg-white/40"] {
            background: rgba(0,0,0,0.22) !important;
        }
        body.light-theme [class*="bg-white/50"] {
            background: rgba(0,0,0,0.28) !important;
        }
        
        /* Hover on bg-white/5 elements */
        body.light-theme [class*="hover:bg-white/10"] {
            background: rgba(0,0,0,0.04) !important;
        }
        body.light-theme [class*="hover:bg-white/10"]:hover {
            background: rgba(0,0,0,0.08) !important;
        }
        
        /* ========== BLUE / INDIGO ACCENTS ========== */
        body.light-theme [class*="bg-blue-500/30"] {
            background: rgba(59,130,246,0.15) !important;
            border-color: rgba(59,130,246,0.3) !important;
        }
        body.light-theme [class*="bg-blue-500/20"] {
            background: rgba(59,130,246,0.12) !important;
        }
        body.light-theme [class*="bg-blue-500/10"] {
            background: rgba(59,130,246,0.08) !important;
        }
        body.light-theme [class*="bg-blue-500/5"] {
            background: rgba(59,130,246,0.05) !important;
        }
        
        /* Text blue */
        body.light-theme [class*="text-blue-400"] { color: #2563EB !important; }
        body.light-theme [class*="text-blue-500"] { color: #3B82F6 !important; }
        
        /* ========== STATUS BADGES ========== */
        body.light-theme [class*="bg-emerald-500/20"] { background: rgba(16,185,129,0.15) !important; }
        body.light-theme [class*="bg-emerald-500/10"] { background: rgba(16,185,129,0.08) !important; }
        body.light-theme [class*="text-emerald-400"] { color: #059669 !important; }
        
        body.light-theme [class*="bg-red-500/20"] { background: rgba(239,68,68,0.15) !important; }
        body.light-theme [class*="bg-red-500/10"] { background: rgba(239,68,68,0.08) !important; }
        body.light-theme [class*="text-red-400"] { color: #DC2626 !important; }
        
        body.light-theme [class*="bg-amber-500/20"] { background: rgba(245,158,11,0.15) !important; }
        body.light-theme [class*="bg-amber-500/10"] { background: rgba(245,158,11,0.08) !important; }
        body.light-theme [class*="text-amber-400"] { color: #D97706 !important; }
        
        body.light-theme [class*="bg-purple-500/20"] { background: rgba(139,92,246,0.15) !important; }
        body.light-theme [class*="text-purple-400"] { color: #7C3AED !important; }
        
        body.light-theme [class*="bg-cyan-500/20"] { background: rgba(6,182,212,0.15) !important; }
        body.light-theme [class*="text-cyan-400"] { color: #0891B2 !important; }
        
        body.light-theme [class*="bg-yellow-500/20"] { background: rgba(250,204,21,0.2) !important; }
        body.light-theme [class*="text-yellow-400"] { color: #CA8A04 !important; }
        
        body.light-theme [class*="bg-orange-500/20"] { background: rgba(249,115,22,0.15) !important; }
        body.light-theme [class*="text-orange-400"] { color: #EA580C !important; }
        
        body.light-theme [class*="bg-pink-500/20"] { background: rgba(236,72,153,0.15) !important; }
        body.light-theme [class*="text-pink-400"] { color: #DB2777 !important; }
        
        body.light-theme [class*="bg-gray-500/20"] { background: rgba(107,114,128,0.15) !important; }
        body.light-theme [class*="text-gray-400"] { color: #6B7280 !important; }
        
        /* ========== TABS ========== */
        body.light-theme [class*="bg-white/20"][class*="text-white"] {
            background: rgba(0,0,0,0.06) !important;
            color: #1a1a2e !important;
        }
        
        /* Active tab in light theme */
        body.light-theme [class*="bg-white/20"][class*="text-white"] * {
            color: #1a1a2e !important;
        }
        
        /* ========== BUTTONS ========== */
        body.light-theme .btn-gradient {
            background: linear-gradient(135deg, #3B82F6 0%, #2563EB 100%) !important;
            color: #FFFFFF !important;
        }
        
        body.light-theme .btn-secondary {
            background: rgba(0,0,0,0.05) !important;
            color: #1a1a2e !important;
            border-color: rgba(0,0,0,0.1) !important;
        }
        
        body.light-theme .btn-secondary:hover {
            background: rgba(0,0,0,0.1) !important;
        }
        
        /* ========== KANBAN ========== */
        body.light-theme .kanban-column {
            background: rgba(0,0,0,0.03) !important;
            border-color: rgba(0,0,0,0.06) !important;
        }
        
        body.light-theme .kanban-column-header {
            background: rgba(255,255,255,0.9) !important;
            border-color: rgba(0,0,0,0.08) !important;
        }
        
        body.light-theme .kanban-card {
            background: #FFFFFF !important;
            border-color: rgba(0,0,0,0.08) !important;
            box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
        }
        
        /* ========== GLASS CARD ========== */
        body.light-theme .glass-card {
            background: rgba(255,255,255,0.85) !important;
            border-color: rgba(0,0,0,0.06) !important;
            box-shadow: 0 4px 24px rgba(0,0,0,0.06) !important;
        }
        
        /* ========== TEXT WHITE OVERRIDES ========== */
        body.light-theme [class*="text-white/50"] { color: rgba(26,26,46,0.45) !important; }
        body.light-theme [class*="text-white/60"] { color: rgba(26,26,46,0.55) !important; }
        body.light-theme [class*="text-white/70"] { color: rgba(26,26,46,0.65) !important; }
        body.light-theme [class*="text-white/80"] { color: rgba(26,26,46,0.75) !important; }
        body.light-theme [class*="text-white/90"] { color: rgba(26,26,46,0.85) !important; }
        body.light-theme .text-white { color: #1a1a2e !important; }
        
        /* ========== INLINE STYLES WITH DARK BACKGROUNDS ========== */
        body.light-theme [style*="background-color: rgb(27, 37, 75)"],
        body.light-theme [style*="background-color: #1B254B"],
        body.light-theme [style*="background-color: #0B1437"],
        body.light-theme [style*="background-color: #1e2340"],
        body.light-theme [style*="background-color: #1a1f3a"] {
            background-color: #FFFFFF !important;
            color: #1a1a2e !important;
        }
        
        body.light-theme [style*="background: rgb(27, 37, 75)"],
        body.light-theme [style*="background: #1B254B"],
        body.light-theme [style*="background: #0B1437"],
        body.light-theme [style*="background: #1e2340"],
        body.light-theme [style*="background: #1a1f3a"] {
            background: #FFFFFF !important;
            color: #1a1a2e !important;
        }
        
        /* Override inline white text */
        body.light-theme [style*="color: rgb(255, 255, 255)"],
        body.light-theme [style*="color: #FFFFFF"],
        body.light-theme [style*="color: #ffffff"] {
            color: #1a1a2e !important;
        }
        
        /* Dropdown options for light theme */
        body.light-theme select.vision-input option {
            background: #FFFFFF;
            color: #1a1a1a;
        }
        
        body.light-theme select.vision-input option:hover,
        body.light-theme select.vision-input option:focus,
        body.light-theme select.vision-input option:checked {
            background: rgba(255, 215, 0, 0.15);
            color: #1a1a1a;
        }
        
        /* Text colors */
        body.light-theme .text-white,
        body.light-theme h1, 
        body.light-theme h2, 
        body.light-theme h3,
        body.light-theme .text-xl,
        body.light-theme .text-2xl,
        body.light-theme .text-3xl {
            color: #1a1a1a !important;
        }
        
        body.light-theme .text-white\/90,
        body.light-theme .text-white\/80 {
            color: rgba(26, 26, 26, 0.85) !important;
        }
        
        body.light-theme .text-white\/70 {
            color: rgba(26, 26, 26, 0.65) !important;
        }
        
        body.light-theme .text-white\/60,
        body.light-theme .text-white\/50 {
            color: rgba(26, 26, 26, 0.5) !important;
        }
        
        body.light-theme .text-white\/40,
        body.light-theme .text-white\/30 {
            color: rgba(26, 26, 26, 0.4) !important;
        }
        
        /* Header */
        body.light-theme header {
            background: #FFFFFF !important;
            border-bottom: 1px solid rgba(0, 0, 0, 0.06);
        }
        
        body.light-theme header button {
            background: rgba(0, 0, 0, 0.04);
            color: rgba(26, 26, 26, 0.6);
            border-radius: 10px;
        }
        
        body.light-theme header button:hover {
            background: rgba(255, 215, 0, 0.15);
            color: #1a1a1a;
        }
        
        /* Sidebar */
        body.light-theme .sidebar {
            background: #FFFFFF;
            border-right: 1px solid rgba(0, 0, 0, 0.06);
        }
        
        body.light-theme .sidebar-item {
            color: rgba(26, 26, 26, 0.65);
            border-radius: 12px;
        }
        
        body.light-theme .sidebar-item:hover {
            background: rgba(255, 215, 0, 0.1);
            color: #1a1a1a;
        }
        
        body.light-theme .sidebar-item.active {
            background: #FFD700;
            color: #1a1a1a;
            border: none;
            font-weight: 600;
        }
        
        body.light-theme .section-header {
            color: rgba(26, 26, 26, 0.5);
            font-weight: 600;
        }
        
        /* Kanban */
        body.light-theme .kanban-column {
            background: rgba(255, 255, 255, 0.6);
            border: 1px solid rgba(0, 0, 0, 0.04);
        }
        
        body.light-theme .kanban-card {
            background: #FFFFFF;
            border: 1px solid rgba(0, 0, 0, 0.06);
            color: #1a1a1a;
            border-radius: 12px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
        }
        
        body.light-theme .kanban-card:hover {
            box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
        }
        
        body.light-theme .kanban-card h4 {
            color: #1a1a1a !important;
        }
        
        body.light-theme .kanban-card p {
            color: rgba(26, 26, 26, 0.55) !important;
        }
        
        /* Calendar */
        body.light-theme .calendar-day {
            background: #FFFFFF;
            border: 1px solid rgba(0, 0, 0, 0.04);
        }
        
        body.light-theme .calendar-day.today {
            background: #FFD700;
            border-color: #FFD700;
        }
        
        body.light-theme .calendar-day span {
            color: rgba(26, 26, 26, 0.7);
        }
        
        body.light-theme .calendar-day.today span {
            color: #1a1a1a;
            font-weight: 600;
        }
        
        /* Table */
        body.light-theme .vision-table th {
            color: rgba(26, 26, 26, 0.5);
            border-color: rgba(0, 0, 0, 0.06);
            font-weight: 600;
        }
        
        body.light-theme .vision-table td {
            color: rgba(26, 26, 26, 0.8);
            border-color: rgba(0, 0, 0, 0.04);
        }
        
        body.light-theme .vision-table tr:hover td {
            background: rgba(255, 215, 0, 0.08);
        }
        
        /* Modal */
        body.light-theme .modal-content {
            background: #FFFFFF;
            border: 1px solid rgba(0, 0, 0, 0.06);
            border-radius: 20px;
        }
        
        body.light-theme .modal-overlay {
            background: rgba(0, 0, 0, 0.4);
        }
        
        /* Login */
        body.light-theme .login-card {
            background: #FFFFFF;
            border: 1px solid rgba(0, 0, 0, 0.06);
        }
        
        body.light-theme .login-card h1,
        body.light-theme .login-card p {
            color: #1a1a1a;
        }
        
        body.light-theme .login-card label {
            color: rgba(26, 26, 26, 0.6);
        }
        
        /* Stat cards - Yellow accent */
        body.light-theme .stat-card::before {
            background: #FFD700;
            opacity: 1;
        }
        
        body.light-theme .stat-card p:first-of-type {
            color: rgba(26, 26, 26, 0.5);
        }
        
        body.light-theme .stat-card p:last-of-type {
            color: rgba(26, 26, 26, 0.4);
        }
        
        body.light-theme .stat-icon.blue,
        body.light-theme .stat-icon.purple,
        body.light-theme .stat-icon.orange,
        body.light-theme .stat-icon.green {
            background: rgba(255, 215, 0, 0.15);
            color: #1a1a1a;
        }
        
        /* Badges */
        body.light-theme .badge-blue {
            background: rgba(255, 215, 0, 0.15);
            color: #1a1a1a;
        }
        
        body.light-theme .badge-green {
            background: rgba(16, 185, 129, 0.12);
            color: #059669;
        }
        
        body.light-theme .badge-orange {
            background: rgba(245, 158, 11, 0.12);
            color: #D97706;
        }
        
        body.light-theme .badge-red {
            background: rgba(239, 68, 68, 0.12);
            color: #DC2626;
        }
        
        /* Buttons */
        body.light-theme .btn-secondary {
            background: rgba(0, 0, 0, 0.04);
            border: 1px solid rgba(0, 0, 0, 0.08);
            color: #1a1a1a;
            border-radius: 12px;
        }
        
        body.light-theme .btn-secondary:hover {
            background: rgba(255, 215, 0, 0.15);
            border-color: rgba(255, 215, 0, 0.3);
        }
        
        body.light-theme .btn-gradient {
            background: #FFD700;
            color: #1a1a1a;
            border-radius: 12px;
            font-weight: 600;
        }
        
        body.light-theme .btn-gradient:hover {
            background: #FFC107;
        }
        
        /* Welcome card */
        body.light-theme .welcome-card {
            background: #FFD700;
            border-radius: 20px;
        }
        
        body.light-theme .welcome-card p,
        body.light-theme .welcome-card h2 {
            color: #1a1a1a !important;
        }
        
        body.light-theme .welcome-card span {
            background: rgba(255, 255, 255, 0.4);
            color: #1a1a1a;
        }
        
        /* Scrollbar */
        body.light-theme ::-webkit-scrollbar-track {
            background: rgba(0, 0, 0, 0.03);
        }
        
        body.light-theme ::-webkit-scrollbar-thumb {
            background: rgba(0, 0, 0, 0.15);
            border-radius: 4px;
        }
        
        body.light-theme ::-webkit-scrollbar-thumb:hover {
            background: rgba(0, 0, 0, 0.25);
        }
        
        /* Search overlay */
        body.light-theme .search-overlay {
            background: rgba(255, 249, 230, 0.98);
        }
        
        body.light-theme .search-input-wrapper input {
            background: #FFFFFF;
            border-color: rgba(0, 0, 0, 0.08);
            color: #1a1a1a;
        }
        
        body.light-theme .search-input-wrapper i {
            color: rgba(0, 0, 0, 0.35);
        }
        
        body.light-theme .search-close {
            background: rgba(0, 0, 0, 0.04);
            color: rgba(26, 26, 26, 0.5);
        }
        
        body.light-theme .search-result-info h4 {
            color: #1a1a1a;
        }
        
        body.light-theme .search-result-info p {
            color: rgba(26, 26, 26, 0.5);
        }
        
        body.light-theme .search-result-type {
            background: rgba(0, 0, 0, 0.04);
            color: rgba(26, 26, 26, 0.5);
        }
        
        /* File upload */
        body.light-theme .file-upload-zone {
            border-color: rgba(0, 0, 0, 0.1);
            border-radius: 16px;
        }
        
        body.light-theme .file-upload-zone:hover {
            border-color: #FFD700;
            background: rgba(255, 215, 0, 0.05);
        }
        
        /* Notification */
        body.light-theme .notification {
            background: #FFFFFF;
            border: 1px solid rgba(0, 0, 0, 0.06);
            box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
            border-radius: 16px;
        }
        
        body.light-theme .notification p {
            color: #1a1a2e;
        }
        
        body.light-theme .notification p:last-child {
            color: rgba(26, 26, 46, 0.6);
        }
        
        /* Timeline */
        body.light-theme .timeline-item p:first-of-type {
            color: #1a1a2e;
        }
        
        body.light-theme .timeline-item p:last-of-type {
            color: rgba(26, 26, 46, 0.5);
        }
        
        /* Header dropdown */
        body.light-theme .header-dropdown-header h3 {
            color: #1a1a2e;
        }
        
        body.light-theme .header-dropdown-item:hover {
            background: rgba(67, 24, 255, 0.05);
        }
        
        body.light-theme .header-dropdown-item p:first-of-type {
            color: #1a1a2e;
        }
        
        body.light-theme .header-dropdown-empty {
            color: rgba(26, 26, 46, 0.4);
        }
        
        /* View toggle */
        body.light-theme .view-toggle button {
            color: rgba(26, 26, 46, 0.5);
        }
        
        body.light-theme .view-toggle button.active {
            background: rgba(67, 24, 255, 0.15);
            color: #4318FF;
        }
        
        /* Calendar object items */
        body.light-theme .calendar-object-item .object-address {
            color: #1a1a2e;
        }
        
        /* Theme toggle */
        body.light-theme .theme-toggle {
            background: rgba(0, 0, 0, 0.1);
        }
        
        /* Light theme for chart containers */
        body.light-theme .chart-container canvas {
            filter: none;
        }
        
        /* Light theme for glass cards - text colors */
        body.light-theme .glass-card h3,
        body.light-theme .glass-card .text-lg,
        body.light-theme .glass-card h2,
        body.light-theme .glass-card .font-bold {
            color: #1a1a2e !important;
        }
        
        body.light-theme .glass-card .text-white,
        body.light-theme .glass-card [class*="text-white"] {
            color: #1a1a2e !important;
        }
        
        body.light-theme .glass-card .text-white\/50,
        body.light-theme .glass-card .text-white\/40,
        body.light-theme .glass-card .text-white\/60,
        body.light-theme .glass-card .text-white\/70 {
            color: rgba(26, 26, 46, 0.6) !important;
        }
        
        body.light-theme .glass-card .text-emerald-400 {
            color: #059669 !important;
        }
        
        body.light-theme .glass-card .text-blue-400 {
            color: #2563EB !important;
        }
        
        body.light-theme .glass-card .text-purple-400 {
            color: #7C3AED !important;
        }
        
        body.light-theme .glass-card .text-orange-400 {
            color: #D97706 !important;
        }
        
        body.light-theme .glass-card .text-pink-400 {
            color: #DB2777 !important;
        }
        
        body.light-theme .glass-card .text-red-400 {
            color: #DC2626 !important;
        }
        
        body.light-theme .glass-card .text-yellow-400 {
            color: #D97706 !important;
        }
        
        /* Light theme for gradient cards inside glass-card */
        body.light-theme .glass-card [class*="bg-gradient-to-br"],
        body.light-theme .glass-card [class*="bg-gradient-to-r"] {
            background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%) !important;
            border: 1px solid rgba(0, 0, 0, 0.06) !important;
        }
        
        body.light-theme .glass-card [class*="bg-gradient-to-br"] .text-white,
        body.light-theme .glass-card [class*="bg-gradient-to-r"] .text-white {
            color: #1a1a2e !important;
        }
        
        body.light-theme .glass-card [class*="bg-gradient-to-br"] [class*="text-white/"],
        body.light-theme .glass-card [class*="bg-gradient-to-r"] [class*="text-white/"] {
            color: rgba(26, 26, 46, 0.6) !important;
        }
        
        /* Light theme for kanban columns */
        body.light-theme .kanban-column {
            background: rgba(255, 255, 255, 0.6);
        }
        
        body.light-theme .kanban-column .text-white\\/40,
        body.light-theme .kanban-column .text-white\\/60 {
            color: rgba(26, 26, 46, 0.5) !important;
        }
        
        /* Light theme for calendar */
        body.light-theme .calendar-day {
            background: rgba(255, 255, 255, 0.7);
        }
        
        body.light-theme .calendar-day span {
            color: rgba(26, 26, 46, 0.7);
        }
        
        body.light-theme .calendar-day.today span {
            color: #4318FF;
            font-weight: 700;
        }
        
        /* Light theme for stat cards */
        body.light-theme .stat-card .text-2xl {
            color: #1a1a2e !important;
        }
        
        /* Light theme for filter panel */
        body.light-theme .filter-panel label {
            color: rgba(26, 26, 46, 0.6);
        }
        
        /* Calculator light theme */
        body.light-theme input[type="checkbox"] {
            border-color: rgba(0, 0, 0, 0.2);
            background: rgba(0, 0, 0, 0.05);
        }
        
        body.light-theme input[type="checkbox"]:hover {
            border-color: #4318FF;
        }
        
        /* Light theme for fixed dropdown */
        body.light-theme .header-dropdown {
            background: rgba(255, 255, 255, 0.98);
            border-color: rgba(0, 0, 0, 0.1);
            box-shadow: 0 25px 50px rgba(0, 0, 0, 0.2);
            z-index: 2147483647 !important;
        }
        
        body.light-theme .header-dropdown h3 {
            color: #1a1a2e;
        }
        
        body.light-theme .header-dropdown .text-white\/50 {
            color: rgba(26, 26, 46, 0.5) !important;
        }
        
        body.light-theme .header-dropdown-item p:first-of-type {
            color: #1a1a2e;
        }
        
        body.light-theme .header-dropdown-empty {
            color: rgba(26, 26, 46, 0.4);
        }
        
        /* Mobile sidebar light theme */
        body.light-theme .sidebar {
            background: rgba(255, 255, 255, 0.98);
            border-color: rgba(0, 0, 0, 0.08);
        }
        
        body.light-theme .sidebar h2,
        body.light-theme .sidebar p {
            color: #1a1a2e;
        }
        
        body.light-theme .sidebar > div:last-child {
            border-color: rgba(0, 0, 0, 0.08);
        }
        
        body.light-theme .sidebar > div:last-child p {
            color: #1a1a2e;
        }
        
        body.light-theme .sidebar > div:last-child p:last-child {
            color: rgba(26, 26, 46, 0.5);
        }
        
        /* ============ LIGHT THEME ANALYTICS & OBJECT CARDS ============ */
        
        /* Light theme for analytics dashboard cards */
        body.light-theme [class*="from-[#1e2340]"],
        body.light-theme [class*="to-[#252b4a]"] {
            background: linear-gradient(135deg, #FFFFFF 0%, #F8FAFC 100%) !important;
            border: 1px solid rgba(0, 0, 0, 0.08) !important;
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
        }
        
        /* Light theme for chart containers */
        body.light-theme .chart-container {
            background: transparent !important;
        }
        
        body.light-theme canvas[id$="Chart"] {
            filter: none !important;
        }
        
        /* Light theme for dashboard tab buttons container */
        body.light-theme .bg-[#1a1f3a].rounded-full {
            background: #FFFFFF !important;
            border: 1px solid rgba(0, 0, 0, 0.08);
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
        }
        
        body.light-theme .bg-[#1a1f3a].rounded-full button {
            color: rgba(26, 26, 46, 0.6);
        }
        
        body.light-theme .bg-[#1a1f3a].rounded-full button:hover {
            color: #1a1a2e;
        }
        
        body.light-theme .bg-[#1a1f3a].rounded-full button[class*="bg-white"] {
            background: #FFD700 !important;
            color: #1a1a2e !important;
        }
        
        /* Light theme for KPI cards text */
        body.light-theme [class*="from-[#1e2340]"] p,
        body.light-theme [class*="to-[#252b4a]"] p {
            color: #1a1a2e !important;
        }
        
        body.light-theme [class*="from-[#1e2340]"] .text-white\/50,
        body.light-theme [class*="to-[#252b4a]"] .text-white\/50,
        body.light-theme [class*="from-[#1e2340]"] .text-white\/40,
        body.light-theme [class*="to-[#252b4a]"] .text-white\/40 {
            color: rgba(26, 26, 46, 0.55) !important;
        }
        
        body.light-theme [class*="from-[#1e2340]"] h3,
        body.light-theme [class*="to-[#252b4a]"] h3 {
            color: #1a1a2e !important;
        }
        
        /* Light theme for object detail cards - visual field separation */
        body.light-theme .object-detail-card {
            background: #FFFFFF;
            border: 1px solid rgba(0, 0, 0, 0.08);
            border-radius: 16px;
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
        }
        
        body.light-theme .object-detail-field {
            background: #F8FAFC;
            border: 1px solid rgba(0, 0, 0, 0.06);
            border-radius: 12px;
            padding: 12px 16px;
            margin-bottom: 8px;
        }
        
        body.light-theme .object-detail-field-label {
            color: rgba(26, 26, 46, 0.55);
            font-size: 0.75rem;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.025em;
            margin-bottom: 4px;
        }
        
        body.light-theme .object-detail-field-value {
            color: #1a1a2e;
            font-size: 0.9375rem;
            font-weight: 500;
        }
        
        /* Light theme for object info grid */
        body.light-theme .object-info-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 12px;
        }
        
        body.light-theme .object-info-item {
            background: #FFFFFF;
            border: 1px solid rgba(0, 0, 0, 0.08);
            border-radius: 12px;
            padding: 16px;
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
        }
        
        body.light-theme .object-info-item:hover {
            border-color: rgba(255, 215, 0, 0.4);
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
        }
        
        body.light-theme .object-info-item-label {
            color: rgba(26, 26, 46, 0.5);
            font-size: 0.75rem;
            font-weight: 500;
            margin-bottom: 6px;
            display: flex;
            align-items: center;
            gap: 6px;
        }
        
        body.light-theme .object-info-item-label i {
            color: rgba(26, 26, 46, 0.35);
        }
        
        body.light-theme .object-info-item-value {
            color: #1a1a2e;
            font-size: 0.9375rem;
            font-weight: 500;
        }
        
        /* Light theme for section dividers */
        body.light-theme .section-divider {
            border-top: 1px solid rgba(0, 0, 0, 0.08);
            margin: 20px 0;
        }
        
        /* Light theme for document upload zones */
        body.light-theme .file-upload-zone {
            background: #F8FAFC;
            border: 2px dashed rgba(0, 0, 0, 0.12);
            border-radius: 12px;
        }
        
        body.light-theme .file-upload-zone:hover {
            border-color: #FFD700;
            background: rgba(255, 215, 0, 0.05);
        }
        
        /* Light theme for MODAL WINDOWS - critical fix */
        body.light-theme #modal,
        body.light-theme .modal-overlay,
        body.light-theme [class*="fixed inset-0"] .bg-\[\#1a1f3a\],
        body.light-theme .bg-\[\#1a1f3a\].rounded-2xl,
        body.light-theme .bg-\[\#1a1f3a\].rounded-xl {
            background: #FFFFFF !important;
        }
        
        body.light-theme .bg-black\/50,
        body.light-theme .bg-black\/60 {
            background: rgba(0, 0, 0, 0.4) !important;
        }
        
        body.light-theme .modal-content,
        body.light-theme #modalContent > div {
            background: #FFFFFF !important;
            color: #1a1a2e !important;
        }
        
        body.light-theme .modal-content h2,
        body.light-theme .modal-content h3,
        body.light-theme .modal-content .text-white,
        body.light-theme #modalContent h2,
        body.light-theme #modalContent h3 {
            color: #1a1a2e !important;
        }
        
        body.light-theme .modal-content .text-white\/50,
        body.light-theme .modal-content .text-white\/60,
        body.light-theme .modal-content .text-white\/70,
        body.light-theme #modalContent .text-white\/50,
        body.light-theme #modalContent .text-white\/60,
        body.light-theme #modalContent .text-white\/70 {
            color: rgba(26, 26, 46, 0.55) !important;
        }
        
        body.light-theme .modal-content .border-white\/10,
        body.light-theme #modalContent .border-white\/10 {
            border-color: rgba(0, 0, 0, 0.08) !important;
        }
        
        /* Light theme for form inputs in modals */
        body.light-theme .modal-content .vision-input,
        body.light-theme #modalContent .vision-input,
        body.light-theme .modal-content input,
        body.light-theme .modal-content select,
        body.light-theme .modal-content textarea {
            background: #F8FAFC !important;
            border-color: rgba(0, 0, 0, 0.12) !important;
            color: #1a1a2e !important;
        }
        
        body.light-theme .modal-content .vision-input::placeholder,
        body.light-theme #modalContent .vision-input::placeholder {
            color: rgba(26, 26, 46, 0.4) !important;
        }
        
        /* Light theme for buttons in modals */
        body.light-theme .modal-content .btn-secondary {
            background: #F1F5F9 !important;
            color: #1a1a2e !important;
            border: 1px solid rgba(0, 0, 0, 0.1) !important;
        }
        
        body.light-theme .modal-content .btn-secondary:hover {
            background: #E2E8F0 !important;
        }
        
        /* Light theme for file upload in modals */
        body.light-theme .modal-content .bg-white\/5,
        body.light-theme #modalContent .bg-white\/5 {
            background: #F8FAFC !important;
            border: 1px solid rgba(0, 0, 0, 0.08) !important;
        }
        
        /* Light theme for CALENDAR MODAL */
        body.light-theme .calendar-modal,
        body.light-theme #calendarModal,
        body.light-theme [id*="calendar"] .bg-\[\#1a1f3a\] {
            background: #FFFFFF !important;
        }
        
        body.light-theme .calendar-grid .calendar-day {
            background: #F8FAFC !important;
            border-color: rgba(0, 0, 0, 0.06) !important;
        }
        
        body.light-theme .calendar-grid .calendar-day:hover {
            background: #F1F5F9 !important;
        }
        
        body.light-theme .calendar-grid .calendar-day.active {
            background: #FFD700 !important;
            color: #1a1a2e !important;
        }
        
        body.light-theme .calendar-header {
            color: #1a1a2e !important;
        }
        
        body.light-theme .calendar-nav button {
            color: rgba(26, 26, 46, 0.6) !important;
        }
        
        body.light-theme .calendar-nav button:hover {
            color: #1a1a2e !important;
            background: #F1F5F9 !important;
        }
        
        /* Light theme for day tasks modal */
        body.light-theme #dayTasksModal .bg-\[\#1a1f3a\],
        body.light-theme [id*="dayTasks"] .bg-\[\#1a1f3a\] {
            background: #FFFFFF !important;
        }
        
        body.light-theme #dayTasksModal .text-white,
        body.light-theme [id*="dayTasks"] .text-white {
            color: #1a1a2e !important;
        }
        
        body.light-theme #dayTasksModal .text-white\/60,
        body.light-theme [id*="dayTasks"] .text-white\/60 {
            color: rgba(26, 26, 46, 0.55) !important;
        }
        
        /* Light theme for empty state icon in day tasks modal */
        body.light-theme #dayTasksModal .fa-inbox,
        body.light-theme [id*="dayTasks"] .fa-inbox {
            color: rgba(26, 26, 46, 0.3) !important;
        }
        
        /* Light theme for ANALYTICS TOP PANELS (period selector) */
        body.light-theme .bg-\[\#1a1f3a\].rounded-xl.p-4,
        body.light-theme .bg-\[\#1a1f3a\].rounded-xl.p-6,
        body.light-theme .analytics-panel,
        body.light-theme [class*="analytics"] .bg-\[\#1a1f3a\] {
            background: #FFFFFF !important;
            border: 1px solid rgba(0, 0, 0, 0.08) !important;
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
        }
        
        body.light-theme .bg-\[\#1a1f3a\].rounded-xl .text-white,
        body.light-theme .analytics-panel .text-white {
            color: #1a1a2e !important;
        }
        
        body.light-theme .bg-\[\#1a1f3a\].rounded-xl .text-white\/60,
        body.light-theme .bg-\[\#1a1f3a\].rounded-xl .text-white\/50,
        body.light-theme .analytics-panel .text-white\/60 {
            color: rgba(26, 26, 46, 0.55) !important;
        }
        
        /* Light theme for PERIOD SELECTOR (renderPeriodSelector function) */
        body.light-theme .bg-\[\#1e2340\],
        body.light-theme [class*="bg-[#1e2340]"] {
            background: #FFFFFF !important;
            border: 1px solid rgba(0, 0, 0, 0.08) !important;
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
        }
        
        body.light-theme .bg-\[\#1e2340\] h3,
        body.light-theme [class*="bg-[#1e2340]"] h3 {
            color: #1a1a2e !important;
        }
        
        body.light-theme .bg-\[\#1e2340\] .text-white\/40,
        body.light-theme .bg-\[\#1e2340\] .text-white\/50,
        body.light-theme .bg-\[\#1e2340\] .text-white\/60,
        body.light-theme [class*="bg-[#1e2340]"] .text-white\/40,
        body.light-theme [class*="bg-[#1e2340]"] .text-white\/50,
        body.light-theme [class*="bg-[#1e2340]"] .text-white\/60 {
            color: rgba(26, 26, 46, 0.55) !important;
        }
        
        body.light-theme .bg-\[\#1e2340\] .border-white\/10,
        body.light-theme [class*="bg-[#1e2340]"] .border-white\/10 {
            border-color: rgba(0, 0, 0, 0.08) !important;
        }
        
        /* Light theme for period buttons in analytics */
        body.light-theme .bg-\[\#1a1f3a\].rounded-xl button,
        body.light-theme .analytics-panel button,
        body.light-theme .bg-\[\#1e2340\] button {
            color: rgba(26, 26, 46, 0.7) !important;
            background: #F1F5F9 !important;
            border: 1px solid rgba(0, 0, 0, 0.08) !important;
        }
        
        body.light-theme .bg-\[\#1a1f3a\].rounded-xl button:hover,
        body.light-theme .analytics-panel button:hover,
        body.light-theme .bg-\[\#1e2340\] button:hover {
            background: #E2E8F0 !important;
        }
        
        body.light-theme .bg-\[\#1a1f3a\].rounded-xl button.bg-blue-500,
        body.light-theme .analytics-panel button.bg-blue-500,
        body.light-theme .bg-\[\#1e2340\] button.bg-blue-500,
        body.light-theme .bg-\[\#1a1f3a\].rounded-xl button[class*="bg-blue"],
        body.light-theme .analytics-panel button[class*="bg-blue"],
        body.light-theme .bg-\[\#1e2340\] button[class*="bg-blue"] {
            background: #3B82F6 !important;
            color: #FFFFFF !important;
            border-color: #3B82F6 !important;
        }
        
        /* Light theme for date inputs in period selector */
        body.light-theme .bg-\[\#1e2340\] input[type="date"],
        body.light-theme [class*="bg-[#1e2340]"] input[type="date"] {
            background: #FFFFFF !important;
            border: 1px solid rgba(0, 0, 0, 0.12) !important;
            color: #1a1a2e !important;
        }
        
        /* Light theme for inactive period buttons (bg-white/5 inside bg-[#1e2340]) */
        body.light-theme .bg-\[\#1e2340\] .bg-white\/5,
        body.light-theme [class*="bg-[#1e2340]"] .bg-white\/5 {
            background: #F1F5F9 !important;
            color: rgba(26, 26, 46, 0.7) !important;
            border: 1px solid rgba(0, 0, 0, 0.08) !important;
        }
        
        body.light-theme .bg-\[\#1e2340\] .bg-white\/5:hover,
        body.light-theme [class*="bg-[#1e2340]"] .bg-white\/5:hover {
            background: #E2E8F0 !important;
            color: #1a1a2e !important;
        }
        
        /* Light theme for date inputs in analytics */
        body.light-theme .bg-\[\#1a1f3a\].rounded-xl input[type="date"],
        body.light-theme .analytics-panel input[type="date"] {
            background: #FFFFFF !important;
            border: 1px solid rgba(0, 0, 0, 0.12) !important;
            color: #1a1a2e !important;
        }
        
        /* Light theme for tab switcher in analytics */
        body.light-theme .bg-\[\#1a1f3a\].rounded-full,
        body.light-theme .analytics-tabs {
            background: #F1F5F9 !important;
            border: 1px solid rgba(0, 0, 0, 0.08) !important;
        }
        
        body.light-theme .bg-\[\#1a1f3a\].rounded-full button,
        body.light-theme .analytics-tabs button {
            color: rgba(26, 26, 46, 0.6) !important;
        }
        
        body.light-theme .bg-\[\#1a1f3a\].rounded-full button:hover,
        body.light-theme .analytics-tabs button:hover {
            color: #1a1a2e !important;
        }
        
        body.light-theme .bg-\[\#1a1f3a\].rounded-full button.bg-white,
        body.light-theme .analytics-tabs button.bg-white,
        body.light-theme .bg-\[\#1a1f3a\].rounded-full button[class*="bg-white"] {
            background: #FFD700 !important;
            color: #1a1a2e !important;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
        }
        
        /* Light theme for TASK MODALS (quickAddTaskModal, quickAddGeneralTaskModal) */
        body.light-theme #quickAddTaskModal .bg-\[\#1a1f3a\],
        body.light-theme #quickAddGeneralTaskModal .bg-\[\#1a1f3a\],
        body.light-theme #addTaskFromCalendarModal .bg-\[\#1a1f3a\] {
            background: #FFFFFF !important;
            box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;
        }
        
        body.light-theme #quickAddTaskModal .text-white,
        body.light-theme #quickAddGeneralTaskModal .text-white,
        body.light-theme #addTaskFromCalendarModal .text-white,
        body.light-theme #quickAddTaskModal h3,
        body.light-theme #quickAddGeneralTaskModal h3,
        body.light-theme #addTaskFromCalendarModal h3 {
            color: #1a1a2e !important;
        }
        
        body.light-theme #quickAddTaskModal .text-white\/50,
        body.light-theme #quickAddTaskModal .text-white\/60,
        body.light-theme #quickAddGeneralTaskModal .text-white\/50,
        body.light-theme #quickAddGeneralTaskModal .text-white\/60,
        body.light-theme #addTaskFromCalendarModal .text-white\/50,
        body.light-theme #addTaskFromCalendarModal .text-white\/60 {
            color: rgba(26, 26, 46, 0.55) !important;
        }
        
        body.light-theme #quickAddTaskModal .border-white\/10,
        body.light-theme #quickAddGeneralTaskModal .border-white\/10,
        body.light-theme #addTaskFromCalendarModal .border-white\/10 {
            border-color: rgba(0, 0, 0, 0.08) !important;
        }
        
        body.light-theme #quickAddTaskModal .bg-white\/5,
        body.light-theme #quickAddGeneralTaskModal .bg-white\/5,
        body.light-theme #addTaskFromCalendarModal .bg-white\/5 {
            background: #F8FAFC !important;
            border: 1px solid rgba(0, 0, 0, 0.08) !important;
        }
        
        body.light-theme #quickAddTaskModal .bg-blue-500\/10,
        body.light-theme #quickAddGeneralTaskModal .bg-blue-500\/10 {
            background: rgba(59, 130, 246, 0.08) !important;
            border-color: rgba(59, 130, 246, 0.2) !important;
        }
        
        body.light-theme #quickAddTaskModal .text-blue-400,
        body.light-theme #quickAddGeneralTaskModal .text-blue-400 {
            color: #2563EB !important;
        }
        
        /* Light theme for PURCHASE REQUEST MODAL */
        body.light-theme #requestModal .bg-\[\#1a1f3a\] {
            background: #FFFFFF !important;
            box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;
        }
        
        body.light-theme #requestModal .text-white,
        body.light-theme #requestModal h3 {
            color: #1a1a2e !important;
        }
        
        body.light-theme #requestModal .text-white\/60,
        body.light-theme #requestModal .text-white\/50,
        body.light-theme #requestModal .text-white\/40 {
            color: rgba(26, 26, 46, 0.55) !important;
        }
        
        body.light-theme #requestModal .border-white\/10 {
            border-color: rgba(0, 0, 0, 0.08) !important;
        }
        
        body.light-theme #requestModal .bg-white\/10 {
            background: #F1F5F9 !important;
        }
        
        body.light-theme #requestModal .bg-white\/10:hover {
            background: #E2E8F0 !important;
        }
        
        body.light-theme #requestModal .bg-white\/5 {
            background: #F8FAFC !important;
            border: 1px solid rgba(0, 0, 0, 0.06) !important;
        }
        
        body.light-theme #requestModal .text-blue-400 {
            color: #2563EB !important;
        }
        
        /* Light theme for object card fields - bg-white/5 equivalent */
        body.light-theme .bg-white\/5,
        body.light-theme [class*="bg-white/5"] {
            background: #F8FAFC !important;
            border: 1px solid rgba(0, 0, 0, 0.08) !important;
            border-radius: 12px !important;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
        }
        
        body.light-theme .bg-white\/5:hover,
        body.light-theme [class*="bg-white/5"]:hover {
            border-color: rgba(255, 215, 0, 0.4) !important;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
        }
        
        /* Light theme for field labels in object cards */
        body.light-theme .bg-white\/5 .text-white\/40,
        body.light-theme [class*="bg-white/5"] .text-white\/40,
        body.light-theme .bg-white\/5 .text-white\/50,
        body.light-theme [class*="bg-white/5"] .text-white\/50 {
            color: rgba(26, 26, 46, 0.5) !important;
            font-size: 0.7rem !important;
            font-weight: 600 !important;
            text-transform: uppercase !important;
            letter-spacing: 0.03em !important;
        }
        
        /* Light theme for field values in object cards */
        body.light-theme .bg-white\/5 .text-white,
        body.light-theme [class*="bg-white/5"] .text-white,
        body.light-theme .bg-white\/5 .text-white\/90,
        body.light-theme [class*="bg-white/5"] .text-white\/90 {
            color: #1a1a2e !important;
            font-weight: 500 !important;
        }
        
        /* Light theme for icon colors in object cards */
        body.light-theme .bg-white\/5 i,
        body.light-theme [class*="bg-white/5"] i {
            opacity: 0.7;
        }
        
        /* Light theme for section headers in object cards */
        body.light-theme h3.text-white,
        body.light-theme h3 .text-white {
            color: #1a1a2e !important;
        }
        
        body.light-theme h3 i {
            color: inherit !important;
        }
        
        /* Light theme for modal content in object detail */
        body.light-theme .modal-content .text-2xl,
        body.light-theme .modal-content h2 {
            color: #1a1a2e !important;
        }
        
        body.light-theme .modal-content .text-white\/40 {
            color: rgba(26, 26, 46, 0.5) !important;
        }
        
        /* Light theme for status badges */
        body.light-theme [class*="rounded-full"][class*="text-xs"] {
            font-weight: 600 !important;
        }
        
        /* Light theme for price display boxes */
        body.light-theme .bg-emerald-500\/10,
        body.light-theme .bg-blue-500\/10,
        body.light-theme .bg-orange-500\/10 {
            background: #F8FAFC !important;
            border: 1px solid rgba(0, 0, 0, 0.08) !important;
        }
        
        body.light-theme .bg-emerald-500\/10 .text-white\/50,
        body.light-theme .bg-blue-500\/10 .text-white\/50,
        body.light-theme .bg-orange-500\/10 .text-white\/50 {
            color: rgba(26, 26, 46, 0.5) !important;
        }
        
        body.light-theme .text-emerald-400 {
            color: #059669 !important;
        }
        
        body.light-theme .text-blue-400 {
            color: #2563EB !important;
        }
        
        body.light-theme .text-orange-400 {
            color: #D97706 !important;
        }
        
        /* ============ RESPONSIVE DESIGN ============ */
        
        /* Large Tablet (900px - 1024px) */
        @media (max-width: 1024px) and (min-width: 901px) {
            .sidebar {
                width: 260px;
            }
            
            .sidebar nav {
                padding: 16px;
            }
            
            .sidebar-item {
                padding: 10px 12px;
                font-size: 13px;
            }
            
            main {
                padding: 20px;
            }
            
            #contentArea {
                padding: 20px;
            }
            
            .grid-cols-4 {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .grid-cols-3 {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .kanban-column {
                min-width: 300px;
            }
            
            .vision-table {
                font-size: 13px;
            }
            
            .vision-table th,
            .vision-table td {
                padding: 12px 14px;
            }
        }
        
        /* Tablet (768px - 900px) */
        @media (max-width: 900px) and (min-width: 769px) {
            .sidebar {
                width: 220px;
            }
            
            .sidebar nav {
                padding: 12px;
            }
            
            .sidebar-item {
                padding: 8px 10px;
                font-size: 12px;
            }
            
            .sidebar-item i {
                font-size: 14px;
                width: 20px;
            }
            
            main {
                padding: 16px;
            }
            
            #contentArea {
                padding: 16px;
            }
            
            header {
                padding: 0 16px;
                height: 60px;
            }
            
            .grid-cols-4 {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .grid-cols-3 {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .stat-card {
                padding: 16px;
            }
            
            .stat-icon {
                width: 40px;
                height: 40px;
                font-size: 16px;
            }
            
            .kanban-column {
                min-width: 280px;
            }
            
            .calendar-day {
                min-height: 100px;
                padding: 6px;
            }
            
            .vision-table {
                font-size: 12px;
            }
            
            .vision-table th,
            .vision-table td {
                padding: 10px 12px;
            }
            
            .filter-panel .flex-wrap {
                gap: 8px;
            }
            
            .filter-panel select,
            .filter-panel input {
                font-size: 13px;
                padding: 8px 12px;
            }
            
            .modal-content {
                max-width: 90vw;
            }
        }
        
        /* Mini Tablet (600px - 768px) */
        @media (max-width: 768px) and (min-width: 601px) {
            .sidebar {
                position: fixed;
                top: 0;
                left: 0;
                bottom: 0;
                width: 260px;
                max-width: 80vw;
                height: 100vh;
                z-index: 100;
                transform: translateX(-100%);
                transition: transform 0.3s ease;
            }
            
            .sidebar.mobile-open {
                transform: translateX(0);
            }
            
            .sidebar-overlay {
                display: none;
                position: fixed;
                inset: 0;
                background: rgba(0, 0, 0, 0.5);
                z-index: 99;
            }
            
            .sidebar-overlay.active {
                display: block;
            }
            
            main {
                padding: 16px;
                width: 100%;
            }
            
            #contentArea {
                padding: 16px;
            }
            
            header {
                padding: 0 16px;
                height: 56px;
            }
            
            #pageTitle {
                font-size: 16px;
            }
            
            .grid-cols-4,
            .grid-cols-3 {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .kanban-column {
                min-width: 260px;
            }
            
            .vision-table {
                font-size: 12px;
                min-width: 500px;
            }
            
            .modal-content {
                max-width: 95vw;
                margin: 20px;
            }
        }
        
        /* Mobile (< 768px) */
        @media (max-width: 768px) {
            /* Sidebar becomes slide-out panel */
            #mainInterface {
                flex-direction: column;
            }
            
            .sidebar {
                position: fixed;
                top: 0;
                left: 0;
                bottom: 0;
                width: 280px;
                max-width: 85vw;
                height: 100vh;
                z-index: 100;
                border-right: 1px solid rgba(255, 255, 255, 0.05);
                border-radius: 0;
                transform: translateX(-100%);
                transition: transform 0.3s ease;
            }
            
            .sidebar.mobile-open {
                transform: translateX(0);
            }
            
            .sidebar > div:first-child {
                display: block;
            }
            
            .sidebar nav {
                padding: 16px;
                max-height: none;
            }
            
            .sidebar > div:last-child {
                display: block;
            }
            
            /* Hide sidebar handle on mobile slide-out */
            .sidebar::before {
                display: none;
            }
            
            /* Main content adjustments */
            main {
                padding-bottom: 80px;
            }
            
            header {
                padding: 0 16px;
                height: 56px;
            }
            
            #pageTitle {
                font-size: 16px;
            }
            
            #contentArea {
                padding: 16px;
            }
            
            /* Stats grid */
            .grid-cols-4 {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .grid-cols-3 {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .grid-cols-2 {
                grid-template-columns: 1fr;
            }
            
            /* Welcome card */
            .welcome-card {
                padding: 20px;
            }
            
            .welcome-card h2 {
                font-size: 24px;
            }
            
            /* Kanban - horizontal scroll */
            .flex.gap-4.overflow-x-auto {
                gap: 12px;
            }
            
            .kanban-column {
                min-width: 280px;
                min-height: 400px;
                padding: 12px;
            }
            
            /* Calendar */
            .calendar-grid {
                gap: 4px;
            }
            
            .calendar-day {
                min-height: 80px;
                padding: 4px;
                border-radius: 8px;
            }
            
            .calendar-day span {
                font-size: 12px;
            }
            
            .calendar-objects {
                max-height: 50px;
                gap: 2px;
            }
            
            .calendar-object-item {
                padding: 4px 6px;
                font-size: 10px;
                border-radius: 6px;
            }
            
            .calendar-object-item .object-address {
                font-size: 10px;
            }
            
            .calendar-object-item .object-price {
                font-size: 9px;
            }
            
            /* Table - horizontal scroll */
            .glass-card.overflow-hidden {
                overflow-x: auto;
            }
            
            .vision-table {
                min-width: 600px;
            }
            
            /* Filters */
            .filter-panel .flex-wrap {
                flex-direction: column;
                align-items: stretch;
            }
            
            .filter-panel > div > div {
                width: 100%;
            }
            
            .filter-panel select,
            .filter-panel input {
                width: 100% !important;
            }
            
            /* Modal */
            .modal-content {
                max-width: calc(100% - 32px);
                margin: 16px;
                max-height: calc(100vh - 32px);
            }
            
            /* Search overlay */
            .search-container {
                margin: 0 16px;
            }
            
            .search-input-wrapper input {
                padding: 16px 50px;
                font-size: 16px;
            }
            
            /* Header buttons */
            header .flex.items-center.gap-3 > button {
                width: 36px;
                height: 36px;
            }
            
            /* Header dropdown mobile */
            .header-dropdown {
                top: 70px;
                right: 16px;
                left: auto;
                min-width: 280px;
                max-width: calc(100vw - 32px);
            }
            
            /* Knowledge grid */
            .grid-cols-3 {
                grid-template-columns: 1fr;
            }
            
            /* Notification */
            .notification {
                left: 16px;
                right: 16px;
                top: 16px;
            }
            
            /* Charts */
            .chart-container {
                height: 200px;
            }
            
            /* Login */
            .login-card {
                padding: 32px 24px;
                margin: 16px;
            }
        }
        
        /* Small mobile (< 480px) */
        @media (max-width: 480px) {
            .login-card {
                padding: 24px 20px;
                border-radius: 16px;
            }
            
            .login-container {
                padding: 12px;
            }
            
            .grid-cols-4,
            .grid-cols-3,
            .grid-cols-2 {
                grid-template-columns: 1fr;
            }
            
            .welcome-card h2 {
                font-size: 20px;
            }
            
            .welcome-card .flex.gap-3 {
                flex-direction: column;
                gap: 8px;
            }
            
            .stat-card {
                padding: 16px;
            }
            
            .kanban-column {
                min-width: 260px;
            }
            
            .calendar-day {
                min-height: 60px;
            }
            
            .calendar-objects {
                display: none;
            }
            
            .calendar-day.has-objects::after {
                content: '';
                position: absolute;
                bottom: 4px;
                left: 50%;
                transform: translateX(-50%);
                width: 6px;
                height: 6px;
                background: #4318FF;
                border-radius: 50%;
            }
            
            header {
                padding: 0 12px;
                height: 52px;
            }
            
            #pageTitle {
                font-size: 14px;
                max-width: 120px;
            }
            
            header button {
                width: 32px !important;
                height: 32px !important;
            }
            
            .vision-table {
                min-width: 400px;
                font-size: 11px;
            }
            
            .vision-table th,
            .vision-table td {
                padding: 8px 10px;
            }
            
            .modal-content {
                margin: 8px;
                max-width: calc(100% - 16px);
                border-radius: 12px;
            }
            
            .filter-panel {
                padding: 12px;
            }
            
            .filter-panel .flex {
                flex-direction: column;
                gap: 8px;
            }
            
            .filter-panel input,
            .filter-panel select {
                width: 100% !important;
            }
        }
        
        /* ============ TABLET & MINI-TABLET SPECIFIC FIXES ============ */
        
        /* Responsive tables for all tablet sizes */
        @media (max-width: 1024px) {
            .responsive-table-container {
                overflow-x: auto;
                -webkit-overflow-scrolling: touch;
            }
            
            .responsive-table-container table {
                min-width: 600px;
            }
            
            /* Compact cards for tablet */
            .glass-card {
                padding: 16px;
            }
            
            /* Compact form inputs */
            .vision-input {
                padding: 10px 14px;
                font-size: 14px;
            }
            
            /* Smaller buttons */
            .btn {
                padding: 8px 16px;
                font-size: 13px;
            }
            
            /* Compact kanban */
            .kanban-column {
                padding: 12px;
            }
            
            .kanban-card {
                padding: 12px;
            }
            
            /* Calendar adjustments */
            .calendar-day {
                min-height: 90px;
            }
            
            /* Chart containers */
            .chart-container {
                height: 250px;
            }
            
            /* Modal adjustments */
            .modal-content {
                max-height: calc(100vh - 40px);
            }
            
            /* Filter panel */
            .filter-panel {
                flex-wrap: wrap;
            }
            
            .filter-panel > * {
                flex: 1 1 auto;
                min-width: 150px;
            }
        }
        
        /* Touch-friendly targets for tablets */
        @media (max-width: 1024px) and (pointer: coarse) {
            .sidebar-item {
                padding: 12px 14px;
                min-height: 44px;
            }
            
            .kanban-card {
                min-height: 80px;
            }
            
            button, 
            .btn,
            select,
            input[type="checkbox"],
            input[type="radio"] {
                min-height: 44px;
                min-width: 44px;
            }
            
            .calendar-day {
                min-height: 80px;
            }
        }
        
        /* Landscape tablet optimization */
        @media (max-width: 1024px) and (orientation: landscape) {
            .sidebar {
                width: 200px;
            }
            
            .grid-cols-4 {
                grid-template-columns: repeat(4, 1fr);
            }
            
            .kanban-column {
                min-width: 250px;
            }
        }
        
        /* Portrait tablet optimization */
        @media (max-width: 900px) and (orientation: portrait) {
            .grid-cols-4 {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .kanban-column {
                min-width: 280px;
            }
        }
        
        /* Responsive table wrapper */
        .table-responsive {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            width: 100%;
        }
        
        .table-responsive table {
            min-width: 100%;
        }
        
        @media (max-width: 1024px) {
            .table-responsive {
                margin: 0 -16px;
                padding: 0 16px;
                width: calc(100% + 32px);
            }
        }
        
        /* Card grid for tablet */
        @media (max-width: 1024px) {
            .card-grid-4 {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .card-grid-3 {
                grid-template-columns: repeat(2, 1fr);
            }
        }
        
        @media (max-width: 640px) {
            .card-grid-4,
            .card-grid-3,
            .card-grid-2 {
                grid-template-columns: 1fr;
            }
        }
        
        /* Form layout for tablet */
        @media (max-width: 768px) {
            .form-grid-2 {
                grid-template-columns: 1fr;
            }
            
            .form-grid-3 {
                grid-template-columns: 1fr;
            }
        }
        
        /* Dashboard stats for tablet */
        @media (max-width: 1024px) {
            .stats-grid {
                grid-template-columns: repeat(2, 1fr);
            }
        }
        
        @media (max-width: 640px) {
            .stats-grid {
                grid-template-columns: 1fr;
            }
        }
        
        /* Sidebar improvements for tablet */
        @media (max-width: 1024px) {
            .sidebar-section-title {
                font-size: 10px;
                padding: 8px 12px;
            }
            
            .sidebar-submenu-item {
                padding: 8px 12px 8px 36px;
                font-size: 12px;
            }
        }
        
        /* Header improvements for all tablet sizes */
        @media (max-width: 1024px) {
            header .flex.items-center.gap-3 > button {
                width: 38px;
                height: 38px;
            }
            
            header .flex.items-center.gap-3 > button i {
                font-size: 14px;
            }
        }
        
        /* Content area padding for different sizes */
        @media (max-width: 1024px) and (min-width: 769px) {
            #contentArea {
                padding: 20px;
            }
        }
        
        @media (max-width: 768px) and (min-width: 481px) {
            #contentArea {
                padding: 16px;
            }
        }
        
        @media (max-width: 480px) {
            #contentArea {
                padding: 12px;
            }
        }
        
        /* Filter panel responsive */
        @media (max-width: 1024px) {
            .filter-bar {
                flex-wrap: wrap;
                gap: 8px;
            }
            
            .filter-bar > * {
                flex: 1 1 calc(50% - 8px);
                min-width: 140px;
            }
        }
        
        @media (max-width: 640px) {
            .filter-bar > * {
                flex: 1 1 100%;
            }
        }
        
        /* Button group responsive */
        @media (max-width: 640px) {
            .btn-group {
                flex-direction: column;
                width: 100%;
            }
            
            .btn-group .btn {
                width: 100%;
            }
        }
        
        /* Tab navigation responsive */
        @media (max-width: 768px) {
            .tab-nav {
                overflow-x: auto;
                flex-wrap: nowrap;
                -webkit-overflow-scrolling: touch;
                padding-bottom: 4px;
            }
            
            .tab-nav::-webkit-scrollbar {
                display: none;
            }
            
            .tab-nav .tab-item {
                white-space: nowrap;
                flex-shrink: 0;
            }
        }
        
        /* Search overlay responsive */
        @media (max-width: 768px) {
            .search-overlay-content {
                margin: 60px 16px;
                max-width: calc(100% - 32px);
            }
            
            .search-input {
                font-size: 16px;
                padding: 16px 20px;
            }
        }
        
        /* Notification dropdown responsive */
        @media (max-width: 768px) {
            .notification-dropdown {
                right: 8px;
                left: 8px;
                max-width: none;
                width: calc(100% - 16px);
            }
        }
        
        /* Settings modal responsive */
        @media (max-width: 768px) {
            .settings-sidebar {
                width: 100%;
                border-right: none;
                border-bottom: 1px solid rgba(255, 255, 255, 0.1);
            }
            
            .settings-content {
                padding: 16px;
            }
        }
        
        /* Gantt chart responsive */
        @media (max-width: 1024px) {
            .gantt-container {
                overflow-x: auto;
                -webkit-overflow-scrolling: touch;
            }
            
            .gantt-chart {
                min-width: 800px;
            }
        }
        
        /* Calendar responsive */
        @media (max-width: 768px) {
            .calendar-grid {
                gap: 2px;
            }
            
            .calendar-day {
                min-height: 70px;
                padding: 4px;
            }
            
            .calendar-day-number {
                font-size: 11px;
            }
        }
        
        /* Kanban responsive */
        @media (max-width: 1024px) {
            .kanban-board {
                gap: 12px;
            }
        }
        
        @media (max-width: 768px) {
            .kanban-board {
                gap: 8px;
            }
            
            .kanban-column {
                min-width: 260px;
            }
        }
        
        /* Touch device optimizations */
        @media (hover: none) {
            .kanban-card .group-hover\:opacity-100 {
                opacity: 1;
            }
            
            .glass-card:hover {
                transform: none;
            }
            
            .sidebar-item:hover {
                background: transparent;
            }
            
            .sidebar-item:active {
                background: rgba(255, 255, 255, 0.1);
            }
        }
        
        /* Header z-index fix for mobile */
        header {
            position: relative;
            z-index: 50;
        }
        
        /* Ensure proper stacking context for main interface */
        #mainInterface {
            isolation: isolate;
        }
        
        /* Mobile header improvements */
        @media (max-width: 768px) {
            header {
                padding: 0 12px;
                height: 56px;
            }
            
            #pageTitle {
                font-size: 15px;
                max-width: 150px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            
            header .flex.items-center.gap-3 > button {
                width: 36px;
                height: 36px;
            }
            
            /* Better mobile dropdown positioning */
            .header-dropdown {
                top: 65px;
                right: 10px;
                left: 10px;
                min-width: auto;
                max-width: none;
            }
        }
        
        /* Tablet improvements */
        @media (min-width: 769px) and (max-width: 1024px) {
            .sidebar {
                width: 220px;
            }
            
            .grid-cols-4 {
                grid-template-columns: repeat(2, 1fr);
            }
        }
        
        /* Hidden */
        .hidden {
            display: none !important;
        }
        /* File Upload Area */
        .file-upload-area {
            border: 2px dashed rgba(255, 255, 255, 0.15);
            border-radius: 12px;
            padding: 16px;
            cursor: pointer;
            transition: all 0.2s ease;
            background: rgba(255, 255, 255, 0.02);
        }
        
        .file-upload-area:hover {
            border-color: rgba(99, 102, 241, 0.5);
            background: rgba(99, 102, 241, 0.05);
        }
        
        .file-preview {
            text-align: center;
        }
        
        body.light-theme .file-upload-area {
            border-color: rgba(0, 0, 0, 0.15);
            background: rgba(0, 0, 0, 0.02);
        }
        
        body.light-theme .file-upload-area:hover {
            border-color: rgba(99, 102, 241, 0.5);
            background: rgba(99, 102, 241, 0.05);
        }
        
        /* Small File Upload Area for Stage Files */
        .file-upload-area-small {
            border: 1px dashed rgba(255, 255, 255, 0.2);
            border-radius: 8px;
            padding: 8px 12px;
            cursor: pointer;
            transition: all 0.2s ease;
            background: rgba(255, 255, 255, 0.02);
        }
        
        .file-upload-area-small:hover {
            border-color: rgba(99, 102, 241, 0.6);
            background: rgba(99, 102, 241, 0.08);
        }
        
        body.light-theme .file-upload-area-small {
            border-color: rgba(0, 0, 0, 0.2);
            background: rgba(0, 0, 0, 0.02);
        }
        
        body.light-theme .file-upload-area-small:hover {
            border-color: rgba(99, 102, 241, 0.6);
            background: rgba(99, 102, 241, 0.08);
        }
        
        /* ============ LIGHT THEME: DARK BACKGROUND OVERRIDES ============ */

        /* Universal catch-all for any element with dark inline backgrounds */
        body.light-theme [class*="bg-[#0B1437]"],
        body.light-theme [class*="bg-[#1B254B]"],
        body.light-theme [class*="bg-[#1e2340]"],
        body.light-theme [class*="bg-[#1a1f3a]"],
        body.light-theme [class*="bg-[#111c44]"] {
            background-color: #FFFFFF !important;
            border-color: rgba(0,0,0,0.08) !important;
        }

        /* Dark backgrounds with opacity suffix */
        body.light-theme [class*="bg-[#0B1437]/"],
        body.light-theme [class*="bg-[#1B254B]/"],
        body.light-theme [class*="bg-[#1e2340]/"],
        body.light-theme [class*="bg-[#1a1f3a]/"] {
            background: rgba(255,255,255,0.95) !important;
            border-color: rgba(0,0,0,0.08) !important;
        }

        /* Input/select backgrounds that use dark colors */
        body.light-theme input[class*="bg-[#1B254B]"],
        body.light-theme select[class*="bg-[#1B254B]"],
        body.light-theme input[class*="bg-[#1e2340]"],
        body.light-theme select[class*="bg-[#1e2340]"],
        body.light-theme input[class*="bg-[#1a1f3a]"],
        body.light-theme select[class*="bg-[#1a1f3a]"] {
            background-color: #FFFFFF !important;
            color: #1a1a2e !important;
            border-color: rgba(0,0,0,0.12) !important;
        }

        /* Dark containers - force light text inside */
        body.light-theme [class*="bg-[#0B1437]"] *,
        body.light-theme [class*="bg-[#1B254B]"] *,
        body.light-theme [class*="bg-[#1e2340]"] *,
        body.light-theme [class*="bg-[#1a1f3a]"] * {
            color: #1a1a2e !important;
        }

        /* But keep colored accents */
        body.light-theme [class*="bg-[#0B1437]"] [class*="text-emerald"],
        body.light-theme [class*="bg-[#1B254B]"] [class*="text-emerald"],
        body.light-theme [class*="bg-[#1e2340]"] [class*="text-emerald"],
        body.light-theme [class*="bg-[#1a1f3a]"] [class*="text-emerald"] {
            color: #10B981 !important;
        }

        body.light-theme [class*="bg-[#0B1437]"] [class*="text-blue"],
        body.light-theme [class*="bg-[#1B254B]"] [class*="text-blue"],
        body.light-theme [class*="bg-[#1e2340]"] [class*="text-blue"],
        body.light-theme [class*="bg-[#1a1f3a]"] [class*="text-blue"] {
            color: #3B82F6 !important;
        }

        /* Dropdown items hover */
        body.light-theme [class*="bg-[#0B1437]"] > div:hover,
        body.light-theme [class*="bg-[#1B254B]"] > div:hover,
        body.light-theme [class*="bg-[#1e2340]"] > div:hover,
        body.light-theme [class*="bg-[#1a1f3a]"] > div:hover {
            background: rgba(255,215,0,0.12) !important;
        }

        /* Override border-white to dark borders */
        body.light-theme [class*="border-white"] {
            border-color: rgba(0,0,0,0.08) !important;
        }

        /* Sidebar active */
        body.light-theme .sidebar-item.active {
            background: #FFD700 !important;
            color: #1a1a1a !important;
            border-color: rgba(255,215,0,0.5) !important;
            box-shadow: 0 2px 12px rgba(255,215,0,0.3) !important;
        }
        body.light-theme .sidebar-item.active i { color: #1a1a1a !important; }

        /* Header */
        body.light-theme [class*="bg-[#0B1437]"] {
            background: rgba(255,255,255,0.95) !important;
        }

        /* Modal content dark bg */
        body.light-theme .modal-content [class*="bg-[#1a1f3a]"],
        body.light-theme .modal-content [class*="bg-[#1e2340]"],
        body.light-theme .modal-content [class*="bg-[#1B254B]"] {
            background: #F8FAFC !important;
            border: 1px solid rgba(0,0,0,0.06);
        }

        /* Dropdown containers */
        body.light-theme #addressSuggestions,
        body.light-theme [id*="Dropdown"] {
            background: #FFFFFF !important;
            border-color: rgba(0,0,0,0.1) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,0.15) !important;
        }
        body.light-theme #addressSuggestions > div,
        body.light-theme [id*="Dropdown"] > div { color: #1a1a2e !important; }
        body.light-theme #addressSuggestions > div:hover,
        body.light-theme [id*="Dropdown"] > div:hover { background: rgba(255,215,0,0.1) !important; }

        /* Overlays */
        body.light-theme [class*="bg-black/"] { background-color: rgba(0,0,0,0.3) !important; }

        /* Glass card / kanban card internal dark elements */
        body.light-theme .glass-card [class*="bg-[#1B254B]"],
        body.light-theme .glass-card [class*="bg-[#1e2340]"],
        body.light-theme .glass-card [class*="bg-[#1a1f3a]"],
        body.light-theme .kanban-card [class*="bg-[#1B254B]"],
        body.light-theme .kanban-card [class*="bg-[#1e2340]"],
        body.light-theme .kanban-card [class*="bg-[#1a1f3a]"] {
            background: #F8FAFC !important;
            border: 1px solid rgba(0,0,0,0.06);
        }

        /* Kanban column header dark */
        body.light-theme .kanban-column-header [class*="bg-[#0B1437]"] {
            background: #FFFFFF !important;
        }

        /* Rounded full with dark bg */
        body.light-theme [class*="rounded-full"][class*="bg-[#1e2340]"],
        body.light-theme [class*="rounded-full"][class*="bg-[#1a1f3a]"] {
            background: #FFFFFF !important;
            border: 1px solid rgba(0,0,0,0.08);
        }

        /* Notification dropdown text */
        body.light-theme .header-dropdown [class*="text-white/"] { color: rgba(26,26,46,0.5) !important; }

        /* Override bg-gray-400 in light theme */
        body.light-theme .bg-gray-400 { background-color: #E5E7EB !important; }
        body.light-theme .bg-gray-500 { background-color: #D1D5DB !important; }
        body.light-theme .bg-gray-600 { background-color: #9CA3AF !important; }
        body.light-theme .bg-gray-700 { background-color: #6B7280 !important; }
        body.light-theme .bg-gray-800 { background-color: #4B5563 !important; }
        body.light-theme .bg-gray-900 { background-color: #374151 !important; }
        
        /* Drag and Drop Styles for Stages */
        .stage-item {
            transition: all 0.2s ease;
        }
        
        .stage-item.dragging {
            opacity: 0.5;
            transform: scale(0.98);
        }
        
        .stage-item.drag-over {
            border-top: 2px solid #3b82f6;
        }
        
        .drag-handle {
            cursor: grab;
        }
        
        .drag-handle:active {
            cursor: grabbing;
        }
        
        /* Profile Avatar */
        #profileAvatarBtn {
            transition: all 0.2s ease;
        }
        
        #profileAvatarBtn:hover {
            transform: scale(1.05);
            box-shadow: 0 4px 16px rgba(99, 102, 241, 0.4);
        }
        
        /* TZ Form Modal */
        .tz-form-link {
            background: linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));
            border: 1px dashed rgba(99, 102, 241, 0.3);
            border-radius: 12px;
            padding: 16px;
            word-break: break-all;
        }
        
        .tz-form-link code {
            color: #818cf8;
            font-size: 12px;
        }
    


                    .gantt-input {
                        background: transparent;
                        border: 1px solid transparent;
                        color: inherit;
                        width: 100%;
                        padding: 2px 4px;
                        border-radius: 4px;
                        transition: all 0.2s;
                    }
                    .gantt-input:hover, .gantt-input:focus {
                        background: rgba(255,255,255,0.1);
                        border-color: rgba(255,255,255,0.2);
                        outline: none;
                    }
                    /* Стили для выпадающего списка подрядчиков */
                    select.gantt-input {
                        background: transparent;
                        color: inherit;
                        border: 1px solid transparent;
                        cursor: pointer;
                        appearance: none;
                        -webkit-appearance: none;
                        -moz-appearance: none;
                        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath fill='%23ffffff60' d='M4 5L0 0h8z'/%3E%3C/svg%3E");
                        background-repeat: no-repeat;
                        background-position: right 2px center;
                        padding-right: 12px;
                        font-size: 12px;
                    }
                    select.gantt-input:hover, select.gantt-input:focus {
                        background: rgba(255,255,255,0.08);
                        border-color: rgba(255,255,255,0.15);
                    }
                    select.gantt-input option {
                        background: #1a1f3a;
                        color: #fff;
                        padding: 8px;
                        font-size: 13px;
                    }
                    .resize-handle {
                        position: absolute;
                        right: 0;
                        top: 0;
                        bottom: 0;
                        width: 4px;
                        cursor: col-resize;
                        background: transparent;
                        transition: background 0.2s;
                    }
                    .resize-handle:hover {
                        background: rgba(99, 102, 241, 0.5);
                    }
                    .gantt-row {
                        cursor: grab;
                    }
                    .gantt-row:active {
                        cursor: grabbing;
                    }
                    .gantt-row.dragging {
                        opacity: 0.5;
                        background: rgba(99, 102, 241, 0.2);
                    }
                    .gantt-bar {
                        transition: all 0.2s;
                    }
                    .gantt-bar:hover {
                        transform: scaleY(1.1);
                        box-shadow: 0 2px 8px rgba(0,0,0,0.3);
                    }
                


                    .role-select option { background: #1e2340; color: white; }
                    .role-select option:hover { background: #2d3655; }