/*
	This CSS file matches the color scheme from MudBlazor to Bootstrap when utilized for authentication.
	The file remains available at all times for demonstration purposes,
	but it is exclusively employed in the 'App.razor' component when authentication is enabled.
*/

.btn-primary {
    text-transform: uppercase;
    --bs-btn-bg: var(--mud-palette-primary) !important;
    --bs-btn-hover-bg: var(--mud-palette-primary-darken) !important;
}

.nav-pills {
    --bs-nav-pills-link-active-bg: var(--mud-palette-primary) !important;
}

.nav {
    --bs-nav-link-color: var(--mud-palette-primary) !important;
    --bs-nav-link-hover-color: var(--mud-palette-primary-darken) !important;
}


.logo-container {
    display: flex;
    align-items: center;
    margin-left: auto; /* Pushes the logo to the right */
}

.logo-image {
    width: 30px; /* Adjust width as needed */
    height: auto; /* Maintain aspect ratio */
    
}

.login-page {
    position: relative;
    height: 100vh; /* Full page height */
    display: flex;
    justify-content: left;
    align-items: start;
    overflow: hidden; 
}

    .login-page::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-image: url('../images/login2.png'); /* Background image path */
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        opacity: 1; /* Set opacity to 20% */
        z-index: -1; /* Ensure the background stays behind the content */
    }

.transparent-paper {
    background-color: rgba(255, 255, 255, 0.9); /* 90% opacity */
    
}

.vessel-icon div {
    font-size: 24px;
    color: red;
}



/*.home-page {
    position: relative;
    height: 100vh;*/ /* Full page height */
/*}

    .home-page::before {
        content: "";*/ /* Ensure content is created */
        /*position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-image: url('/images/background.png');*/ /* Ensure path is correct */
        /*background-size: cover;*/ /* Ensure the image covers the entire page */
        /*background-position: center;*/ /* Center the image */
        /*background-repeat: no-repeat;*/ /* No repeat */
        /*z-index: -1;*/ /* Ensure the background stays behind the content */
        
    /*}*/




