﻿.icon-banner {
    width: unset;
    height: 48px;
}
.bg-primary {
    background-color: #3498db !important;
}

.navbar {
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: .5rem;
    padding-right: .5rem;
}

.dropdown-menu {
    min-width: 7.5rem;
}

.dropdown-item {
    padding: .25rem 1.25rem;
}

.card-header {
    padding: .25rem 1.25rem;
}

.card-header h2 {
    margin-bottom: .25rem;
}

.form-control::placeholder {
    color: lightgray;
}

.btn-primary {
    color: #fff;
    background-color: #3498db;
    border-color: #3498db;
}

a.btn-primary {
    color: #fff;
}

.btn-primary:focus {
    color: #fff;
    background-color: #2478bb;
    border-color: #2478bb;
}

.btn-primary:active {
    background-color: #14689b;
    border-color: #14689b;
}

    .btn-primary:active:focus {
        background-color: #14689b;
        border-color: #14689b;
    }

    .btn-primary:hover,
    .btn-primary:active:hover {
        color: #fff;
        background-color: #54b8eb;
        border-color: #54b8eb;
    }

.btn-primary:focus:hover {
    color: #fff;
    background-color: #54b8eb;
    border-color: #54b8eb;
}

.body-container {
    margin-top: 0px;
    padding-bottom: 0px;
}

/* Sign In */
.login-page {
    max-width: 25rem;
    width: 100%;
    margin: 0 auto;
}

.card-logo {
    padding: 1.25rem;
}

.btn-login {
    width: 7.5rem;
}

.alert {
    margin-bottom: 0;
}

.validation-summary-errors ul {
    margin-bottom: .25rem;
}

/* Sign Out */
.logout-page {
    max-width: 25rem;
    width: 100%;
    margin: 0 auto;
}

.btn-logout {
    width: 7.5rem;
}

/* Signed Out */
.logged-out-page {
    max-width: 25rem;
    width: 100%;
    margin: 0 auto;
}

/* Wait Screen Style (Initially hidden) */
.wait-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0); /* Start with transparent background */
    display: none; /* Hidden by default */
    justify-content: center;
    align-items: center;
    z-index: 9999; /* Make sure it is on top of other elements */
    animation: fadeInBackground 0.25s forwards; /* Fade-in effect for the background */
}

/* Background fade-in animation */
@keyframes fadeInBackground {
    0% {
        background-color: rgba(0, 0, 0, 0); /* Fully transparent */
    }

    100% {
        background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent black */
    }
}

/* Spinner Style */
.spinner {
    border: 8px solid #f3f3f3; /* Light gray */
    border-top: 8px solid #3498db; /* Blue spinner */
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 2s linear infinite;
}

/* Spinner Animation */
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* Ensure that the spinner stays centered */
.wait-screen .spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}