/* style.css */

#particles-js {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
}

body {
    font-family: 'Arial', sans-serif; /* Placeholder font, replace with Skynetronics specific font */
    background-color: #000; /* Dark background */
    color: #f8f9fa; /* Light text color */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%239C92AC' fill-opacity='0.1' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E");
}

h1, h2, h3, h4, h5, h6 {
    color: #007bff; /* Primary color for headings (Bootstrap primary blue) */
}

.text-secondary {
    color: #6c757d !important; /* Bootstrap secondary color */
}

.text-secondary:hover {
    color: #f8f9fa !important; /* Lighter on hover */
}

.btn-primary {
    background-color: #007bff; /* Bootstrap primary blue */
    border-color: #007bff;
}

.btn-primary:hover {
    background-color: #0056b3;
    border-color: #0056b3;
    animation: pulse 1s;
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(0, 123, 255, 0.7);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(0, 123, 255, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(0, 123, 255, 0);
    }
}

.card {
    background-color: #212529; /* Darker background for cards */
    border-color: #343a40;
    transition: transform 0.5s;
}

.flip {
    transform: rotateX(360deg);
}

.alert-info {
    background-color: #0c5460;
    color: #d1ecf1;
    border-color: #0c5460;
}

.alert-success {
    background-color: #155724;
    color: #d4edda;
    border-color: #155724;
}

.alert-danger {
    background-color: #721c24;
    color: #f8d7da;
    border-color: #721c24;
}