body {
            font-family: 'Vazirmatn', sans-serif;
            background-color: #0D1117;
            color: #C9D1D9;
        }
        ::-webkit-scrollbar {
            width: 8px;
        }
        ::-webkit-scrollbar-track {
            background: #161B22;
        }
        ::-webkit-scrollbar-thumb {
            background: #30363D;
            border-radius: 4px;
        }
        ::-webkit-scrollbar-thumb:hover {
            background: #58A6FF;
        }
        .btn-active {
            background-color: #58A6FF !important;
            color: #FFFFFF !important;
            font-weight: 700;
        }
        .ai-result-card {
            border: 1px solid #30363D;
            background-color: #161B22;
            transition: all 0.3s ease;
        }
        .ai-result-card:hover {
            border-color: #58A6FF;
        }
        .calendar-day {
            min-height: 90px;
        }
        .calendar-day.has-event {
            cursor: pointer;
            background-color: #161B22;
        }
        .calendar-day.has-event:hover {
            border: 1px solid #58A6FF;
        }
        .modal-overlay {
            transition: opacity 0.3s ease;
        }
        .modal-content {
            transition: transform 0.3s ease, opacity 0.3s ease;
            transform: translateY(-20px) scale(0.95);
        }
        .modal-open .modal-content {
            transform: translateY(0) scale(1);
        }
        /* Loader animation */
        .loader {
            width: 48px;
            height: 48px;
            border: 5px solid #FFF;
            border-bottom-color: #58A6FF;
            border-radius: 50%;
            display: inline-block;
            box-sizing: border-box;
            animation: rotation 1s linear infinite;
        }

        @keyframes rotation {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }
        
        .skeleton-loader {
            background-color: #21262D;
            border-radius: 4px;
            animation: pulse 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
        }
        @keyframes pulse {
            50% {
                opacity: .5;
            }
        }
        
        .needs-attention {
            animation: pulse-border 2s infinite;
        }
        @keyframes pulse-border {
            0%, 100% {
                box-shadow: 0 0 0 0 rgba(88, 166, 255, 0.7);
            }
            50% {
                box-shadow: 0 0 0 4px rgba(88, 166, 255, 0);
            }
        }