/* #0 /www/wwwroot/s.motosati.pl/public/Application/Resources/Core.css */
@font-face {
    font-family: GoogleSans;
    src: url('/Assets/GoogleSans-VariableFont_GRAD\,opsz\,wght.ttf');
}

:root {
    font-family: GoogleSans;
    font-size: 100%;
}

app {
    background-color: hsl(0, 0%, 0%);
    color: white;
}

.page {
    background-color: hsl(0, 0%, 10%);
    color: white;

    >.page-main {
        height: 0%;
        flex-grow: 1;
    }
}

select {
    flex-grow: 1;
    width: auto;
}

.button {
    padding: 0.5rem;
}

.input {
    padding: 0.5rem;
}

form {
    background-color: hsl(0, 0%, 10%);
    padding: 0.5rem;
    gap: 0.5rem;
    width: 100%;

    .form-section {
        border-radius: 0.5rem;
        background-color: hsl(0, 0%, 20%);
        padding: 0.5rem;
        gap: 0.5rem;
    }

    .form-title {
        font-size: 1.6rem;
        font-weight: bold;
        padding: 0.5rem;
    }

    .form-description {
        font-size: 1.2rem;
        padding: 0.5rem;
    }

    .form-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(min(100%, 24rem), 1fr));
        padding: 0.5rem;
        gap: 0.5rem;
        width: 100%;
    }

    label {
        * {
            width: 100%;
        }
    }

    .form-button,
    .button {
        border-radius: 0.5rem;
        background-color: #C10E3A;
        color: white;
        padding: 0.5rem;
        overflow: hidden;
    }

    .input,
    .form-input,
    .image-input {
        border-radius: 0.5rem;
        background-color: hsl(0, 0%, 90%);
        color: black;
        padding: 0.5rem;
        overflow: hidden;
    }
}

/* #1 /www/wwwroot/s.motosati.pl/public/Application/Resources/Auth/AuthPage.css */
.auth-page {
    align-items: center;
    justify-content: center;

    >.page-main {
        flex-grow: 0;
        max-width: 360px;
        height: min-content;
    }
}

/* #2 /www/wwwroot/s.motosati.pl/public/Application/Resources/Main/MainPage.css */
.main-page {
    .main-page-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(min(100%, 24rem), 1fr));
        padding: 0.5rem;
        gap: 0.5rem;
        width: 100%;

        >a {
            align-items: center;
            justify-content: center;
            aspect-ratio: 16 / 9;
            border-radius: 0.5rem;
            background-color: #C10E3A;
            color: white;
            padding: 0.5rem;
            overflow: hidden;
        }
    }
}