
        /* Custom font for a clean look */
        body {
            font-family: 'Inter', sans-serif;
            background-color: #f8fafc; /* Tailwind gray-50 */
            color: #1a202c; /* Tailwind gray-900 */
        }
        .status-indicator {
            width: 12px;
            height: 12px;
            border-radius: 50%;
            display: inline-block;
            margin-right: 8px;
        }
        .status-operational { background-color: #10b981; /* Tailwind green-500 */ }
        .status-degraded { background-color: #f59e0b; /* Tailwind yellow-500 */ }
        .status-major-outage { background-color: #ef4444; /* Tailwind red-500 */ }
        .status-maintenance { background-color: #60a5fa; /* Tailwind blue-400 */ }
        .status-error { background-color: #ef4444; /* Tailwind red-500 */ } /* Added for explicit error state */

        /* Loading spinner for components and incidents */
        .spinner {
            border: 4px solid rgba(0, 0, 0, 0.1);
            border-left-color: #3b82f6; /* Tailwind blue-500 */
            border-radius: 50%;
            width: 24px;
            height: 24px;
            animation: spin 1s linear infinite;
        }
        @keyframes spin {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }
    
