:root {
    --bvbinfo-plate-10: rgba(16, 72, 229, 0.1);
    --bvbinfo-plate-40: rgba(16, 72, 229, 0.4);

    --img-bg: url('/images/sot-academy/dark-bg.png');

    .form{
        background: #08276F;


        input{
            background-color: rgba(255, 255, 255, 0.2);
        }
    }

}

[data-theme="light"] {
    --bvbinfo-plate-10: rgba(16, 72, 229, 0.1);
    --bvbinfo-plate-40: rgba(16, 72, 229, 0.4);

    --img-bg: url('/images/sot-academy/light-bg.png');

    .form{
        background: #ffffff;


        input{
            background-color:var(--bvbinfo-plate-10);
        }
    }
}

:root, [data-theme="light"]{
    --sot-academy-gradient-blue: linear-gradient(90deg, #40B4FF 0%, #1048E5 100%);
    --color-input-bg: var(--sot-academy-plate-10);
    --color-input-border: var(--sot-academy-plate-40);
}



.home-page {
    background-image: url('/images/sot-academy/home-bg.png');

    .home-page__link{
        background-color: var(--sot-academy-plate-10);
    }
}

html{
    scrollbar-gutter: auto;
}

.background{
    background-size: cover;
    .background-hexagons{
        filter: brightness(0) saturate(100%) invert(12%) sepia(82%) saturate(6895%) hue-rotate(230deg) brightness(96%) contrast(88%) !important;
    }

    .images-grid {
        [data-img-key="auth-center"]{
            content: url('/images/sot-academy/auth-image-center.png');
        }
        [data-img-key="auth-left-bottom"]{
            content: url('/images/sot-academy/auth-image-left-bottom.png');
        }
        [data-img-key="auth-left-top"]{
            content: url('/images/sot-academy/auth-image-left-top.png');
        }
        [data-img-key="auth-right-top"]{
            content: url('/images/sot-academy/auth-image-right-top.png');
        }
        [data-img-key="auth-right-bottom"]{
            content: url('/images/sot-academy/auth-image-right-bottom.png');
        }
    }
}

.form{
    box-shadow: 0 0 32px 0 rgba(0, 120, 240, 0.50);
    backdrop-filter: blur(32px);

    .form__row__button-primary,
    .form__row__button-transparent::before{
        background: var(--sot-academy-gradient-blue);
    }
}



