/* Bootstrap */
@import url("../../ResourcePackages/Bootstrap5/assets/dist/css/main.min.css");

/* Font Awesome */
@import url("../../ResourcePackages/fontawesome-free-6.1.1-web/css/all.min.css");

/* Root Variables */
:root {
    --color-1: var(--sf-color-1, #712cf9);
    --color-2: var(--sf-color-2, #712cf9);
    --color-light-1: var(--sf-color-light-1, #efefef);
    --color-light-2: var(--sf-color-light-2, #E5EEFF);
    --color-tr-1: var(--sf-color-tr-1, #0000005c);
    --gradient-1: var(--sf-gradient-1, linear-gradient(90deg, rgba(13,110,253,1) 35%, rgba(0,212,255,1) 100%));
    --gradient-2: var(--sf-gradient-2, linear-gradient(90deg, rgba(13,110,253,1) 35%, rgba(0,212,255,1) 100%));
    --bs-gutter-x: 0.75rem;
    --border-color: var(--sf-border-color, #a1a6ab);
    --min-card-height: var(--sf-min-card-height, 35vh);
}

.bg-color-1 {
    background-color: var(--color-1);
}

.bg-color-2 {
    background-color: var(--color-2);
}

.bg-color-light-1 {
    background-color: var(--color-light-1);
}

.bg-color-light-2 {
    background-color: var(--color-light-2);
}

.bg-color-transparent-1 {
    background-color: var(--color-tr-1);
}

.bg-gradient-1 {
    background: rgb(13,110,253);
    background: var(--gradient-1);
}

.bg-gradient-2 {
    background: rgb(13,110,253);
    background: var(--gradient-2);
}

.text-color-1 {
    color: var(--color-1);
}

.text-color-2 {
    color: var(--color-2);
}

.container-offset {
    margin-left: calc(var(--bs-gutter-x) * -1);
    margin-right: calc(var(--bs-gutter-x) * -1);
}

.hover-animate {
    box-shadow: none;
    transform: translateY(0px);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.hover-animate:hover {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
    transform: translateY(-4px);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.card-height-clamp {
    min-height: var(--min-card-height);
}

.header {
    display: inline-flex;
    align-items: center;
    letter-spacing: 2px;
}

.header::before {
    content: "";
    border: 1px solid var(--color-1);
    width: 50px;
    margin-right: 1rem;
}