:root {
    --logo-image-with:250px;
    --header-height:70px;
    --navbar-width:175px;
    --app-root-margin-left :var(--navbar-width)
}

.mantine-AppShell-header{
    height: var(--header-height); 
}
.header-inner-container{
    height: calc(var(--header-height));
}
.company-logo-image { width: var(--logo-image-with)}

.mantine-AppShell-navbar {
    margin-top: calc(var(--header-height));
    width: var(--navbar-width);
}
.mantine-AppShell-root{
    margin-left: var(--app-root-margin-left);
    margin-top: calc(var(--header-height));
}

@media only screen and (max-width: 61.99375em) { 
    :root {
        --app-root-margin-left:0px;
        --logo-image-with:170px;
        --header-height:50px;
        --navbar-width:175px;
   
    }
    .mantine-AppShell-navbar {
        margin-left: 0px
    }
  }
 
.test{
    /* border: 2px solid red; */
   z-index: 2000px;
    /* marginBottom: -8px; */
}

/* Cookie Notice Styles */
#cookie-notice-container {
    animation: slideUp 0.3s ease-out;
}

@keyframes slideUp {
    from {
        transform: translateY(100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Responsive adjustments for cookie notice */
@media only screen and (max-width: 61.99375em) {
    #cookie-notice-container .mantine-Group-root {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
    }
    
    #cookie-notice-container .mantine-Text-root {
        text-align: center;
    }
    
    #cookie-notice-container .mantine-Group-root > div:last-child {
        justify-content: center;
    }
    
    #cookie-countdown-text {
        text-align: center !important;
    }
}

/* Loading Screen Styles */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

#loading-screen {
    opacity: 1;
    pointer-events: all;
}

#loading-screen.hidden {
    opacity: 0;
    pointer-events: none;
}