:root {
    /*Color*/
    --black: #000000;
    --white: #f4f4f4;
    --grey: #717171;
    --transgrey: #878787;
    --light: #EBEBEB;
    --green: #2E8B57;
    --primary-wb: #27045D;
    --primary-wb-2: #7746FF;
    --secondary-wb: #FD5958;
    --secondary-wb-2: #FE9393;
    --secondary-wb-3: #FFB7A5;

    /*Border*/
    --primary-border-wb: 6px;
    --secondary-border-wb: 25px;

    /*font family*/
    --font-family-wb: "Outfit", sans-serif;
}

body {
    font-family: var(--font-family-wb) !important;
}

.btn-purple {
    color: #fff;
    background-color: #1b1464;
    border-color: #0D0B38;
}

.btn-purple:hover {
    color: #fff;
    background-color: #17104D;
}

.btn-black {
    background-color: var(--black);
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: var(--primary-border-wb);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    font-weight: 500;
    gap: 8px;
}

.btn-black:hover {
    transform: translateY(-2px);
}

.btn-black i {
    font-size: 16px;
}

.table.list-table {
    th, td {
        padding: 1rem 1.5rem;
    }

    a {
        color: #241A52;
        font-weight: bold;
        text-decoration: none;
    }

    .subtitle {
        margin-bottom: 0px;
    }

    th:first-of-type {
        border-top-left-radius: 15px;
    }

    th:last-of-type {
        border-top-right-radius: 15px;
    }

    tr:last-of-type td:first-of-type {
        border-bottom-left-radius: 15px;
    }

    tr:last-of-type td:last-of-type {
        border-bottom-right-radius: 15px;
    }

    thead tr th {
        background-color: #D4C4FF; /*#D6D4FF;*/
    }
}

.title {
    font-size: 28px;
    font-weight: 700;
    color: var(--black);
    margin: 0 0 6px;
}

.subtitle {
    font-size: 16px;
    color: var(--grey);
    margin: 0;
}