/* Global styles for navigation and footer moved from MainLayout.razor */
.landing-appbar {
    backdrop-filter: blur(6px) !important;
    background-color: rgba(var(--mud-palette-background-rgb,255,255,255),0.7) !important;
}

.brand-title {
    text-shadow: 0 1px 1px rgba(0,0,0,.05)
}

.brand-logo {
    width: 210px;
    height: 70px;
    display: block
}

.horizontal-padding {
    padding-left: 124px;
    padding-right: 124px
}

@media (max-width:1280px) {
    .horizontal-padding {
        padding-left: 32px;
        padding-right: 32px
    }
}

.footer-section {
    background: var(--mud-palette-background-grey);
    flex-shrink: 0;
    margin-top: auto; /* Push footer to bottom when content is short */
}

.footer-link {
    color: inherit;
    text-decoration: none
}

    .footer-link:hover {
        text-decoration: underline
    }

/* Make the MudMenu trigger align nicely to the left */
.menu-trigger {
    margin-right: 8px
}

/* Existing */
.mud-nav-link-icon-default {
    transform: scale(0.8)
}

/* Fix for landing page layout - ensure footer is always visible */
.mud-layout {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.mud-main-content {
    flex: 1 0 auto;
}

/* Ensure html and body take full height */
html, body {
    min-height: 100vh;
    margin: 0;
    padding: 0;
}

#app {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.mud-tab-panell-invent-details {
    height: calc(100vh - 341px);
}

/* help button highlight (global) */
@keyframes helpBlink {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 rgba(25, 118, 210, 0.0);
        background-color: transparent;
        color: inherit;
    }

    20% {
        transform: scale(1.07);
        box-shadow: 0 0 0.9rem rgba(25, 118, 210, 0.45);
        background-color: rgba(25, 118, 210, 0.14);
        color: var(--mud-palette-primary-text, inherit);
    }

    40% {
        transform: scale(1);
        box-shadow: 0 0 0 rgba(25, 118, 210, 0.0);
        background-color: transparent;
        color: inherit;
    }

    60% {
        transform: scale(1.07);
        box-shadow: 0 0 0.9rem rgba(25, 118, 210, 0.45);
        background-color: rgba(25, 118, 210, 0.14);
        color: var(--mud-palette-primary-text, inherit);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 0 0 rgba(25, 118, 210, 0.0);
        background-color: transparent;
        color: inherit;
    }
}

.help-blink {
    animation: helpBlink 550ms ease-in-out 0s 5;
    border-radius: 999px;
    transition: background-color 120ms ease, color 120ms ease;
}