/* Modern Dashboard - Clean & Professional */

/* Improved spacing and layout */
main {
    padding: 2rem !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
}

/* Better service cards */
div[class*="service"] {
    transition: all 0.3s ease !important;
    border-radius: 12px !important;
}

div[class*="service"]:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2) !important;
}

/* Cleaner category headers */
h2 {
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    margin-bottom: 1.5rem !important;
    margin-top: 2.5rem !important;
    color: #e2e8f0 !important;
    padding-bottom: 0.75rem !important;
    border-bottom: 2px solid rgba(100, 181, 246, 0.2) !important;
}

/* Better icons */
img[class*="icon"] {
    border-radius: 10px !important;
    transition: transform 0.3s ease !important;
}

img[class*="icon"]:hover {
    transform: scale(1.05) !important;
}

/* Status dots with better visibility */
span[class*="status"] {
    font-size: 0.875rem !important;
}

/* Smoother animations */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

div[class*="service"] {
    animation: fadeIn 0.5s ease-out !important;
}

/* Better widget styling */
div[class*="widget"] {
    border-radius: 12px !important;
    backdrop-filter: blur(10px) !important;
}

/* Improved search bar */
input[type="search"] {
    border-radius: 10px !important;
    padding: 0.75rem 1rem !important;
    font-size: 1rem !important;
}

/* Better scrollbar */
::-webkit-scrollbar {
    width: 10px !important;
}

::-webkit-scrollbar-track {
    background: rgba(30, 41, 59, 0.5) !important;
}

::-webkit-scrollbar-thumb {
    background: rgba(100, 181, 246, 0.3) !important;
    border-radius: 5px !important;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(100, 181, 246, 0.5) !important;
}

/* Responsive improvements */
@media (max-width: 768px) {
    main {
        padding: 1rem !important;
    }
    
    h2 {
        font-size: 1.1rem !important;
    }
}