:root {
    --regen-orange: #FEB13F !important;
    --regen-orange-light: #FEC879 !important;
    --regen-green: #0EB28F !important;
    --regen-green-light: #31EFC6 !important;
    --regen-gray: #E8E8E8 !important;

    --dark: #5a5c69 !important;
    --gray: #858796 !important;

    --eigengrau: #16161D;

    --bs-primary: #007bff;
    --bs-secondary: #6c757d;
    --bs-success: #28a745;
    --bs-info: #17a2b8;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
}

* {
    /* color: var(--eigengrau); */
}

.bg-regen-orange {
    background-color: var(--regen-orange) !important;
}

.bg-regen-green {
    background-color: var(--regen-green) !important;
}

.bg-gradient-sidebar {
    background: var(--regen-gray);
    background: linear-gradient(180deg, var(--regen-gray) 0%, #eee 100%);
}

.bg-gradient-regen {
    background: var(--regen-gray);
    background: linear-gradient(180deg, var(--regen-orange) 30%, var(--regen-green) 100%);
}

.sidebar {
    &>*, &>#cont-sidebar-links>*, a, i, a::after, .rounded-circle::after, h6 {
        /* color: gray !important; */
        color: var(--dark) !important;
    }

    & .rounded-circle {
        position: relative;
        background-color: white !important;
    }
}

.btn-regen-orange {
    background-color: var(--regen-orange);
    color:white;

    &:hover, &:focus {
        background-color: var(--regen-orange-light) !important;
    }
}

.btn-regen-green {
    background-color: var(--regen-green);
    color:white;

    &:hover, &:focus {
        background-color: var(--regen-green-light) !important;
    }
}

.btn-link {
    color: var(--gray) !important;
}

.btn-register-type {
    height: 256px;
    display: flex; align-items: center; justify-content: center;
}

.text-regen-orange {
    color: var(--regen-orange) !important;
}

.text-regen-green {
    color: var(--regen-green) !important;
}

/* //? Border customization */
.border-right-regen-sidebar {
    border-right: .25rem solid transparent !important;
    border-right-color: var(--regen-orange) !important;
    border-image: linear-gradient(180deg, var(--regen-orange) 30%, var(--regen-green) 100%) 1 !important;
}

/* //? Branding */
.sidebar-brand-icon > img {
    width: 32px;
}

/* //? Login */
.bg-auth-image-1 {
    background-image: url("http://localhost:8080/assets/images/TempCover.png") !important;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.bg-auth-image-2 {
    background-image: url("http://localhost:8080/assets/images/bg-test.webp") !important;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.form-required::after {
    content:" *";
    color:red;
}

.form-control[type="file"] {
    display: none;
}

/* MARK: Loader */
.loader {
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;

    width: 100%; height:100%;
    background-color: rgba(0,0,0,0.5);
    z-index: 99
}

.loader-content {
    background-color: var(--dark);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;

    padding:25px;
    border-radius: 25px;
}

/* MARK: Product Image */
.product-image {
    width: 128px;
}

/* MARK: Toast */
.toast-max {
    width:100dvw;
}

/* MARK: Shop Items */
#cont-shop {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    gap: 16px;
    padding: 16px;
}

.shop-item {
    color: var(--eigengrau);
    min-width: 256px; width: 100%; max-width: 15dvw;
    position: relative;
    

    &:hover {
        border-radius: 25px;

        color: var(--eigengrau);
        text-decoration: none;
        box-shadow: 0 0 16px rgba(0,0,0,0.5);
    }

    & .shop-item-container {
        & .shop-item-header {
            height: 128px;
            border-radius: 25px 25px 0 0;
            background-size: cover; background-position:center;
        }

        & .shop-item-body {
            padding: 8px;
            border-radius: 0 0 25px 25px;

            background-color: var(--regen-gray);
        }
    }
}

/* MARK: Notification Cards */
.notification-card {
    padding: 8px; margin: 16px 4px;
    border-radius: 8px;
    text-wrap: wrap;
    width: fit-content;

    &.notification-card-w100 {
        width:100%;
    }

    &.notification-card-primary {
        background-color: var(--bs-primary) !important;
        &, &>* {
            color:white;
        }
    }
    &.notification-card-info {
        background-color: var(--bs-info) !important;
        &, &>* {
            color:white;
        }
    }
    &.notification-card-success {
        background-color: var(--bs-success) !important;
        &, &>* {
            color:white;
        }
    }
    &.notification-card-danger {
        background-color: var(--bs-danger) !important;
        &, &>* {
            color:white;
        }
    }
    &.notification-card-secondary {
        background-color: var(--bs-secondary) !important;
        &, &>* {
            color: white;
        }
    }
    /* & .notification-card-primary {
        background-color: var(--bs-primary);
        color: white;
        &>* {
            color: white;
        }
    } */
}