﻿video {
    position: fixed;
    right: 0;
    bottom: 0;
    padding-top: 30px;
    z-index: -1;

    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mud-appbar.mud-appbar-fixed-bottom {
    padding-bottom: env(safe-area-inset-bottom, 0px);
}

.mud-main-content {
    padding-bottom: 70px;
}

.bottom-navigation-active > div > span {
    color: white
}

.bottom-navigation-active > div > svg {
    color: white;
}

input[type="month"]::-webkit-calendar-picker-indicator {
    margin: 0px;
    border: none;
}

input[type="month"]::-webkit-datetime-edit-year-field {
    color: white;
}

input[type="month"]::-webkit-datetime-edit-month-field {
    color: white;
}

input[type="month"]::-webkit-calendar-picker-indicator {
    filter: invert(100);
    color: white;
}

input[type="month"] {
    border: none;
    background: none;
}

.splash-screen {
    display: flex;
    justify-content: center;
    height: 90vh;
    margin-right: 10px;
    margin-left: 10px;
}

.splash-screen-img {
    min-width: 100%;
    height: auto;
    object-fit: scale-down;
    animation: pulse 5s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
}

@keyframes pulse {
    0% {
        transform: scale(0.95);
    }

    5% {
        transform: scale(1.1);
    }

    39% {
        transform: scale(0.85);
    }

    45% {
        transform: scale(1);
    }

    60% {
        transform: scale(0.95);
    }

    100% {
        transform: scale(0.9);
    }
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

.toolbar {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    left: 52px !important;
    justify-content: end !important;
}

.toolbar .mud-input-control > .mud-input-control-input-container > div.mud-input.mud-input-text {
    margin-top: 0 !important;
}

@media (min-width: 600px) {
    .toolbar {
        left: 60px !important;
    }
}

.scan-region-highlight {
    width: 80vmin !important;
    height: 80vmin !important;

    inset: 0 !important;
    margin: auto !important;
}

#app {
    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}