/* Variable */

:root {
    --sidebar-collapsed-width: 120px;
    --sidebar-width: 235px;
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-7: 1.75rem;
    --space-8: 2rem;
    --space-9: 3rem;
    --space-10: 4rem;
    --white: #FFFFFF;
    --black: #000000;
    --transparent-black-10: #00000020;
    --transparent-black-20: #00000040;
    --transparent-black-30: #00000060;
    --transparent-black-40: #00000080;
    --transparent-black-50: #000000A0;
    --transparent-black-60: #000000C0;
    --transparent-black-70: #000000E0;
    --transparent-black-80: #000000F0;
    --transparent-primary-50: #FF6E4730;
    --transparent-success-50: #34D39930;
    --primary-10: #FFEAE5;
    --primary-20: #FFC1B0;
    --primary-30: #FFAC96;
    --primary-40: #FF8362;
    --primary-50: #FF6D47;
    --primary-60: #FF592D;
    --primary-70: #FF3B08;
    --primary-80: #E12F00;
    --primary-90: #961F00;
    --primary-100: #711800;
    --success-10: #ECFDF5;
    --success-20: #D1FAE5;
    --success-30: #A7F3D0;
    --success-40: #6EE7B7;
    --success-50: #34D399;
    --success-60: #10B981;
    --success-70: #059669;
    --success-80: #047857;
    --success-90: #065F46;
    --success-100: #064E3B;
    --warning-10: #FFF9E5;
    --warning-20: #FDF1B2;
    --warning-30: #FCE18A;
    --warning-40: #F7CF4B;
    --warning-50: #F2A32C;
    --warning-60: #D68B1D;
    --warning-70: #B87B14;
    --warning-80: #A05D0A;
    --warning-90: #8F4B07;
    --warning-100: #6F3B04;
    --error-10: #FBE5E5;
    --error-20: #F9B2B2;
    --error-30: #F78A8A;
    --error-40: #F54B4B;
    --error-50: #F32C2C;
    --error-60: #D91D1D;
    --error-70: #B81414;
    --error-80: #A00A0A;
    --error-90: #8F0707;
    --error-100: #6F0404;
    --alert-10: #E5F2FF;
    --alert-20: #B2D9FF;
    --alert-30: #8AC2FF;
    --alert-40: #4BA3FF;
    --alert-50: #2C8AFF;
    --alert-60: #1D6EBF;
    --alert-70: #1458A1;
    --alert-80: #0A3D7A;
    --alert-90: #072C5B;
    --alert-100: #041F40;
    --gray-10: #F5F5F5;
    --gray-20: #E0E0E0;
    --gray-30: #BEBEBE;
    --gray-40: #9E9E9E;
    --gray-50: #7D7D7D;
    --gray-60: #5C5C5C;
    --gray-70: #3A3A3A;
    --gray-80: #2A2A2A;
    --gray-90: #1B1B1B;
    --gray-100: #0C0C0C;
    --gradient-1: radial-gradient(100% 100% at 100% 0%, #2a2a2a, #1a1a1a 75%, #00000000 150%);
    --animation-200: 200ms;
    --animation-500: 500ms;
    --animation-5000: 5000ms;
    --semi-bold: 700;
    --bold: 800;
    --extra-bold: 900;
    --display-1: 4.75rem;
    --display-2: 4rem;
    --heading-1: 3.25rem;
    --heading-2: 2.5rem;
    --heading-3: 2.25rem;
    --heading-4: 2rem;
    --heading-5: 1.75rem;
    --heading-6: 1.5rem;
    --subheading: 1.5rem;
    --paragraph-1: 1.125rem;
    --paragraph-2: 1.25rem;
    --paragraph-3: 1.375rem;
    --caption: 1rem;
    --footer: 0.875rem;
    --input: 1.25rem;
    --table-heading: 1.25rem;
    --table-heading-small: 1rem;
    --table-data: 1.25rem;
    --table-data-small: 1rem;
}

*,
::after,
::before {
    box-sizing: border-box;
    margin: unset;
    padding: unset;
    font-family: 'PP Neue Montreal', Inter, sans-serif;
    font-size: var(--caption);
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

p {
    line-height: 150%;
}

html,
body {
    min-height: 100vh;
    min-height: 100dvh;
}

a {
    text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: normal;
}

button {
    border: none;
    outline: none;
    cursor: pointer;
}

button:disabled {
    cursor: not-allowed;
}

input:focus {
    outline: none;
}

input:-internal-autofill-selected {
    padding: var(--space-2);
}

.margin-top-minus-75-px {
    margin-top: -75px;
}

.page {
    background-color: var(--gray-90);
    background: url("../images/background.svg"), var(--gradient-1), var(--black);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
    display: flex;
    flex-direction: row;
    min-height: 100vh;
    min-height: 100dvh;
}

/* Page compontent */

.logo-sidebar {
    height: 51.52px;
    width: 56px;
}

.sidebar {
    position: absolute;
    align-items: start;
    background-color: var(--black);
    background-color: var(--transparent-black-40);
    color: var(--black);
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
    transition: background-color var(--animation-200) ease-in-out;
    transition: width var(--animation-200) linear;
    padding: var(--space-6) var(--space-8);
    width: var(--sidebar-collapsed-width);
    z-index: 3;
}

.sidebar:hover {
    background-color: var(--black);
    transition: background-color var(--animation-200) ease-in-out;
    transition: width var(--animation-200) linear;
    width: var(--sidebar-width);
}

.sidebar:hover .sidebar-element p {
    width: auto;
    max-width: 100%;
    transition: max-width var(--animation-200) linear;
}

.sidebar-element {
    align-items: center;
    cursor: pointer;
    color: var(--gray-50);
    display: flex;
    flex-direction: row;
    gap: var(--space-4);
    padding: var(--space-4);
    transition: var(--animation-200) linear;
    overflow: hidden;
}

.sidebar-element p {
    max-width: 0%;
    white-space: nowrap;
    overflow: hidden;
    transition: max-width var(--animation-200) linear;
}

.sidebar-element:hover {
    transition: var(--animation-200) linear;
    color: var(--primary-50);
}

.sidebar-element.active {
    color: var(--white);
}

.loaded_sidebar {
    background-color: var(--black);
    transition: background-color var(--animation-200) ease-in-out;
    transition: width var(--animation-200) linear;
    width: var(--sidebar-width);
}

.loaded_sidebar .sidebar-element p {
    width: auto;
    max-width: 100%;
    transition: max-width var(--animation-200) linear;
}

.sidebar-wrapper {
    width: var(--sidebar-collapsed-width);
}

.main-content {
    min-height: 100vh;
    min-height: 100dvh;
    max-height: 100vh;
    max-height: 100dvh;
    overflow-y: scroll;
    width: 100%;
}

.content {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    padding: var(--space-7) var(--space-9);
    width: 100%;
}

.header {
    align-items: center;
    justify-content: space-between;
    background-color: var(--black);
    background-color: var(--transparent-black-30);
    display: flex;
    flex-direction: row;
    padding: var(--space-6) var(--space-9);
    width: 100%;
}

.footer {
    color: var(--white);
    position: absolute;
    bottom: 0;
    left: 0;
    font-size: var(--footer);
    padding: var(--space-4);
    width: 100%;
}

.menu-wrapper {
    bottom: var(--space-4);
    display: flex;
    flex-direction: column-reverse;
    gap: var(--space-4);
    left: var(--space-4);
    position: fixed;
    max-height: calc(100vh - (var(--space-4) * 2));
    max-height: calc(100dvh - (var(--space-4) * 2));
    width: calc(100% - (var(--space-4) * 2));
    z-index: 5;
}

.menu,
.mobile-wrapper {
    align-items: center;
    background-color: var(--transparent-black-80);
    border-radius: var(--space-2);
    display: none;
    flex-direction: row;
    justify-content: space-between;
    padding: var(--space-4);
    width: 100%;
}

.mobile-wrapper {
    visibility: hidden;
}

.menu-element {
    padding: var(--space-2);
}

.menu-element.active {
    border-bottom: 1px solid var(--primary-50);
}

.menu-dropdown {
    background-color: var(--black);
    background-color: var(--transparent-black-80);
    border-radius: var(--space-2);
    overflow-y: scroll;
    position: relative;
    max-height: 0px;
    height: 100%;
    width: 100%;
}

.menu-dropdown-element {
    align-items: center;
    cursor: pointer;
    color: var(--gray-50);
    display: flex;
    flex-direction: row;
    gap: var(--space-4);
    padding: var(--space-4);
    transition: var(--animation-200) linear;
    overflow: hidden;
}

.menu-dropdown-element.active {
    color: var(--white);
}

.progress-bar {
    height: 15px;
}

/* Veriff */

#veriff-root {
    max-width: unset !important;
    min-width: unset !important;
    width: 100% !important;
}

.veriff-container {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: var(--space-4) !important;
}

.veriff-submit {
    background-color: var(--primary-50) !important;
    border-radius: var(--space-2) !important;
    color: var(--white) !important;
    padding: var(--space-4) !important;
    transition: background-color var(--animation-200) ease-in-out !important;
    text-align: center !important;
    box-shadow: none !important;
    border: unset !important;
    height: unset !important;
    text-transform: uppercase !important;
    font-weight: normal !important;
    font-size: var(--caption) !important;
    line-height: unset !important;
    letter-spacing: initial !important;
    display: flex !important;
    cursor: pointer !important;
    max-width: 400px !important;
}

.veriff-description {
    color: var(--gray-50) !important;
    font-size: var(--caption) !important;
    line-height: unset !important;
    margin: unset !important;
    text-align: left !important;
}

.veriff-description a {
    color: var(--primary-50) !important;
    font-size: var(--caption) !important;
    line-height: unset !important;
    margin: unset !important;
    text-align: left !important;
}

/* Button */

.button-transparent-black-20 {
    background-color: var(--transparent-black-20);
    border-radius: var(--space-2);
    color: var(--white);
    padding: var(--space-4);
    transition: background-color var(--animation-200) ease-in-out;
    text-align: center;
}

.button-primary-50 {
    background-color: var(--primary-50);
    border-radius: var(--space-2);
    color: var(--white);
    padding: var(--space-4);
    transition: background-color var(--animation-200) ease-in-out;
    text-align: center;
}

.button-primary-50-empty {
    background: none;
    border: 1px solid var(--primary-50);
    border-radius: var(--space-4);
    color: var(--white);
    padding: var(--space-4);
    text-align: center;
}

.button-gray-40-empty {
    background: none;
    border: 1px solid var(--gray-40);
    border-radius: var(--space-4);
    color: var(--gray-40);
    padding: var(--space-4);
    transition: background-color var(--animation-200) ease-in-out;
    text-align: center;
}

.button-gray-70-empty {
    background: none;
    border: 1px solid var(--gray-70);
    border-radius: var(--space-4);
    color: var(--gray-70);
    padding: var(--space-4);
    transition: background-color var(--animation-200) ease-in-out;
    text-align: center;
}

.button-empty {
    background: none;
    display: flex;
    flex-direction: row;
    gap: var(--space-2);
    padding: var(--space-4);
    text-align: center;
}

/* Switch */

.switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 20px;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 1px solid var(--gray-40);
    -webkit-transition: var(--animation-500);
    transition: var(--animation-500);
    border-radius: var(--space-4);
}

.slider::before {
    position: absolute;
    content: "";
    height: 16px;
    width: 16px;
    left: 1px;
    bottom: 1px;
    background-color: var(--gray-40);
    -webkit-transition: 0.4s;
    transition: var(--animation-500);
    border-radius: 16px;
}

input:checked+.slider {
    border: 1px solid var(--primary-50);
}

input:checked+.slider::before {
    background-color: var(--primary-50);
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
}

/* Input */

.input-type-1 {
    background: none;
    border: none;
    border-bottom: 1px solid var(--gray-40);
    color: var(--gray-30);
    padding: var(--space-2) 0;
    width: 100%;
}

.input-type-2 {
    background-color: var(--white);
    ;
    border: none;
    border-radius: var(--space-2);
    color: var(--black);
    padding: var(--space-4);
    width: 100%;
}

.input-type-1:focus {
    outline: none;
    border-bottom: 1px solid var(--gray-30);
}

.input-type-1::placeholder {
    color: var(--gray-40)
}

.input-type-1:disabled {
    color: var(--gray-50)
}

.label-type-1 {
    color: var(--white);
    text-transform: capitalize;
}

/* Dropdown */

.dropdown {
    position: relative;
}

.dropdown * {
    color: var(--white);
}

.dropdown[disabled] * {
    color: var(--gray-50)
}

.dropdown-open {
    align-items: center;
    background: none;
    border: none;
    border-bottom: 1px solid var(--gray-40);
    cursor: pointer;
    color: var(--white);
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: var(--space-2) 0;
    width: 100%;
}

.dropdown-select {
    display: flex;
    flex-direction: row;
    gap: var(--space-2);
}

.dropdown-content {
    background-color: var(--black);
    background-color: var(--gray-90);
    border-radius: 0 0 var(--space-3) var(--space-3);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    position: absolute;
    overflow-y: scroll;
    min-width: 100%;
    z-index: 5;
}

.dropdown-content::-webkit-scrollbar {
    display: none;
}

.dropdown-search {
    background: none;
    border: none;
    border-bottom: 1px solid var(--gray-60);
    color: var(--white);
    padding: var(--space-2);
}

.dropdown-search:focus {
    border-bottom: 1px solid var(--white);
}

.dropdown-search::placeholder {
    color: var(--gray-60);
}

.dropdown-items {
    color: var(--white);
    display: flex;
    flex-direction: column;
}

.dropdown-item {
    cursor: pointer;
    display: flex;
    flex-direction: row;
    gap: var(--space-2);
    padding: var(--space-2);
}

.dropdown-item:hover {
    background-color: var(--gray-80);
}

/* Alert */

.alert-wrapper {
    background-color: var(--gray-90);
    background: url("../images/background.svg"), var(--gradient-1), var(--black);
    border-radius: var(--space-2);
    position: fixed;
    top: 2vh;
    top: 2dvh;
    right: -100vw;
    right: -100dvw;
    overflow: hidden;
    z-index: 7;
    transition: right var(--animation-200) ease-in-out;
}

.alert-appear {
    top: 2vh;
    top: 2dvh;
    right: 2vw;
    right: 2dvw;
    width: 350px;
    transition: right var(--animation-200) ease-in-out;
}

.alert {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-4) var(--space-6);
}

.alert-heading {
    color: var(--white);
}

.alert-message {
    color: var(--gray-40);
}

.alert-duration {
    background-color: var(--primary-50);
    padding-bottom: var(--space-1);
    transition: width var(--animation-5000) linear;
    width: 100%;
}

.alert-duration-end {
    transition: width var(--animation-5000) linear;
    width: 0%;
}

/* Copy */

.copy {
    cursor: copy;
}

/* Popup */

.popup-wrapper {
    align-items: center;
    justify-content: center;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    padding: var(--space-10);
    position: fixed;
    height: 100vh;
    height: 100dvh;
    top: 0;
    left: 0;
    z-index: 5;
    width: 100%;
}

/* Filter */

.filter {
    max-height: 0px;
}

.horizontal {
    border: none;
    border-top: 1px solid var(--gray-80);
}

/* Loader */

@keyframes spinner {
    0% {
        transform: rotate(90deg);
    }
    100% {
        transform: rotate(450deg);
    }
}

.loader {
    margin: auto;
    border: 0.5rem solid var(--gray-80);
    border-radius: 50%;
    border-top: 0.5rem solid var(--primary-50);
    width: 10rem;
    height: 10rem;
    animation: spinner 1s linear infinite;
}

/* Cursor */

.cursor-pointer {
    cursor: pointer;
}

/* Opacity */

.opacity-0 {
    opacity: 0;
}

.opacity-1 {
    opacity: 1;
}

/* Transition */

.transition-universal {
    transition: all 200ms ease-in-out;
}

.transition-delay {
    transition-delay: var(--animation-200);
}

.transform-none {
    transform: none;
}

.transform-y-negative-100vh {
    transform: translateY(-100vh);
    transform: translateY(-100dvh);
}

.transform-x-negative-100 {
    transform: translateX(-100%);
}

.transform-x-100 {
    transform: translateX(100%);
}

/* Animation */

.animation-opacity-change-200 {
    transition: opacity var(--animation-200) ease-in-out;
}

.animation-opacity-change-500 {
    transition: opacity var(--animation-500) ease-in-out;
}

.animation-slide-type-1 {
    transition: transform var(--animation-200) ease-out;
}

.animation-slide-type-2 {
    transition: transform var(--animation-500) ease-out;
}

.animation-rotate-45-deg {
    transition: transform var(--animation-200) ease-in-out;
}

.animation-rotate-45-deg:hover {
    transform: rotate(45deg);
    transition: transform var(--animation-200) ease-in-out;
}

.animation-background-color-change-primary-60:hover {
    background-color: var(--primary-60);
    transition: background-color var(--animation-200) ease-in-out;
}

.animation-change-text-color-gray-40:hover {
    color: var(--gray-40);
    transition: color var(--animation-200) ease-in-out;
}

.animation-change-text-color-gray-50:hover {
    color: var(--gray-50);
    transition: color var(--animation-200) ease-in-out;
}

.animation-change-text-color-primary-50:hover {
    color: var(--primary-50);
    transition: color var(--animation-200) ease-in-out;
}

.animation-change-text-color-primary-30:hover {
    color: var(--primary-30);
    transition: color var(--animation-200) ease-in-out;
}

.animation-change-height {
    transition: max-height var(--animation-200) ease-in-out;
}

.animation-inner-glow-primary-50 {
    transition: box-shadow var(--animation-200) ease-in-out;
}

.animation-inner-glow-primary-50:hover {
    -moz-box-shadow: inset 0 0 20px 1px var(--transparent-primary-50);
    -webkit-box-shadow: inset 0 0 20px 1px var(--transparent-primary-50);
    box-shadow: inset 0 0 20px 1px var(--transparent-primary-50);
    transition: box-shadow var(--animation-200) ease-in-out;
}

.animation-background-color-change-transparent-primary-50 {
    transition: background-color var(--animation-200) ease-in-out;
}

.animation-background-color-change-transparent-primary-50:hover {
    background-color: var(--primary-50);
    background-color: var(--transparent-primary-50);
    transition: background-color var(--animation-200) ease-in-out;
}

.animation-hover-offset-image-type-1 .animation-image,
.animation-hover-offset-image-type-2 .animation-image {
    margin-bottom: unset;
    margin-left: unset;
    transition: margin var(--animation-200) ease-in-out;
}

.animation-hover-offset-image-type-1:hover .animation-image {
    margin-bottom: var(--space-1);
    ;
    margin-left: var(--space-1);
    transition: margin var(--animation-200) ease-in-out;
}

.animation-hover-offset-image-type-2:hover .animation-image {
    margin-bottom: var(--space-2);
    ;
    margin-left: var(--space-2);
    transition: margin var(--animation-200) ease-in-out;
}

/* Overflow */

.overflow-hidden {
    overflow: hidden;
}

.overflow-y-scroll {
    overflow-y: scroll;
}

.overflow-x-scroll {
    overflow-x: scroll;
}

.overflow-y-scroll::-webkit-scrollbar {
    display: none;
}

/* Padding */

.padding-0 {
    padding: unset;
}

.padding-1 {
    padding: var(--space-1);
}

.padding-2 {
    padding: var(--space-2);
}

.padding-3 {
    padding: var(--space-3);
}

.padding-4 {
    padding: var(--space-4);
}

.padding-5 {
    padding: var(--space-5);
}

.padding-6 {
    padding: var(--space-6);
}

.padding-7 {
    padding: var(--space-7);
}

.padding-8 {
    padding: var(--space-8);
}

.padding-9 {
    padding: var(--space-9);
}

.padding-10 {
    padding: var(--space-10);
}

.padding-x-0 {
    padding-left: unset;
    padding-right: unset;
}

.padding-x-1 {
    padding-left: var(--space-1);
    padding-right: var(--space-1);
}

.padding-x-2 {
    padding-left: var(--space-2);
    padding-right: var(--space-2);
}

.padding-x-3 {
    padding-left: var(--space-3);
    padding-right: var(--space-3);
}

.padding-x-4 {
    padding-left: var(--space-4);
    padding-right: var(--space-4);
}

.padding-x-5 {
    padding-left: var(--space-5);
    padding-right: var(--space-5);
}

.padding-x-6 {
    padding-left: var(--space-6);
    padding-right: var(--space-6);
}

.padding-x-7 {
    padding-left: var(--space-7);
    padding-right: var(--space-7);
}

.padding-x-8 {
    padding-left: var(--space-8);
    padding-right: var(--space-8);
}

.padding-x-9 {
    padding-left: var(--space-9);
    padding-right: var(--space-9);
}

.padding-x-10 {
    padding-left: var(--space-10);
    padding-right: var(--space-10);
}

.padding-y-0 {
    padding-top: unset;
    padding-bottom: unset;
}

.padding-y-1 {
    padding-top: var(--space-1);
    padding-bottom: var(--space-1);
}

.padding-y-2 {
    padding-top: var(--space-2);
    padding-bottom: var(--space-2);
}

.padding-y-3 {
    padding-top: var(--space-3);
    padding-bottom: var(--space-3);
}

.padding-y-4 {
    padding-top: var(--space-4);
    padding-bottom: var(--space-4);
}

.padding-y-5 {
    padding-top: var(--space-5);
    padding-bottom: var(--space-5);
}

.padding-y-6 {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
}

.padding-y-7 {
    padding-top: var(--space-7);
    padding-bottom: var(--space-7);
}

.padding-y-8 {
    padding-top: var(--space-8);
    padding-bottom: var(--space-8);
}

.padding-y-9 {
    padding-top: var(--space-9);
    padding-bottom: var(--space-9);
}

.padding-y-10 {
    padding-top: var(--space-10);
    padding-bottom: var(--space-10);
}

.padding-top-0 {
    padding-top: unset;
}

.padding-top-1 {
    padding-top: var(--space-1);
}

.padding-top-2 {
    padding-top: var(--space-2);
}

.padding-top-3 {
    padding-top: var(--space-3);
}

.padding-top-4 {
    padding-top: var(--space-4);
}

.padding-top-5 {
    padding-top: var(--space-5);
}

.padding-top-6 {
    padding-top: var(--space-6);
}

.padding-top-7 {
    padding-top: var(--space-7);
}

.padding-top-8 {
    padding-top: var(--space-8);
}

.padding-top-9 {
    padding-top: var(--space-9);
}

.padding-top-10 {
    padding-top: var(--space-10);
}

.padding-bottom-0 {
    padding-bottom: unset;
}

.padding-bottom-1 {
    padding-bottom: var(--space-1);
}

.padding-bottom-2 {
    padding-bottom: var(--space-2);
}

.padding-bottom-3 {
    padding-bottom: var(--space-3);
}

.padding-bottom-4 {
    padding-bottom: var(--space-4);
}

.padding-bottom-5 {
    padding-bottom: var(--space-5);
}

.padding-bottom-6 {
    padding-bottom: var(--space-6);
}

.padding-bottom-7 {
    padding-bottom: var(--space-7);
}

.padding-bottom-8 {
    padding-bottom: var(--space-8);
}

.padding-bottom-9 {
    padding-bottom: var(--space-9);
}

.padding-bottom-10 {
    padding-bottom: var(--space-10);
}

.padding-left-0 {
    padding-left: unset;
}

.padding-left-1 {
    padding-left: var(--space-1);
}

.padding-left-2 {
    padding-left: var(--space-2);
}

.padding-left-3 {
    padding-left: var(--space-3);
}

.padding-left-4 {
    padding-left: var(--space-4);
}

.padding-left-5 {
    padding-left: var(--space-5);
}

.padding-left-6 {
    padding-left: var(--space-6);
}

.padding-left-7 {
    padding-left: var(--space-7);
}

.padding-left-8 {
    padding-left: var(--space-8);
}

.padding-left-9 {
    padding-left: var(--space-9);
}

.padding-left-10 {
    padding-left: var(--space-10);
}

.padding-right-0 {
    padding-right: unset;
}

.padding-right-1 {
    padding-right: var(--space-1);
}

.padding-right-2 {
    padding-right: var(--space-2);
}

.padding-right-3 {
    padding-right: var(--space-3);
}

.padding-right-4 {
    padding-right: var(--space-4);
}

.padding-right-5 {
    padding-right: var(--space-5);
}

.padding-right-6 {
    padding-right: var(--space-6);
}

.padding-right-7 {
    padding-right: var(--space-7);
}

.padding-right-8 {
    padding-right: var(--space-8);
}

.padding-right-9 {
    padding-right: var(--space-9);
}

.padding-right-10 {
    padding-right: var(--space-10);
}

/* Gap */

.gap-1 {
    gap: var(--space-1);
}

.gap-2 {
    gap: var(--space-2);
}

.gap-3 {
    gap: var(--space-3);
}

.gap-4 {
    gap: var(--space-4);
}

.gap-5 {
    gap: var(--space-5);
}

.gap-6 {
    gap: var(--space-6);
}

.gap-7 {
    gap: var(--space-7);
}

.gap-8 {
    gap: var(--space-8);
}

.gap-9 {
    gap: var(--space-9);
}

.gap-10 {
    gap: var(--space-10);
}

/* Icon */

.icon-1 {
    width: var(--space-1);
}

.icon-2 {
    width: var(--space-2);
}

.icon-3 {
    width: var(--space-3);
}

.icon-4 {
    width: var(--space-4);
}

.icon-5 {
    width: var(--space-5);
}

.icon-6 {
    width: var(--space-6);
}

.icon-7 {
    width: var(--space-7);
}

.icon-8 {
    width: var(--space-8);
}

.icon-9 {
    width: var(--space-9);
}

.icon-10 {
    width: var(--space-10);
}

/* Min width */

.min-width-fixed-1 {
    min-width: var(--space-1);
}

.min-width-fixed-2 {
    min-width: var(--space-2);
}

.min-width-fixed-3 {
    min-width: var(--space-3);
}

.min-width-fixed-4 {
    min-width: var(--space-4);
}

.min-width-fixed-5 {
    min-width: var(--space-5);
}

.min-width-fixed-6 {
    min-width: var(--space-6);
}

.min-width-fixed-7 {
    min-width: var(--space-7);
}

.min-width-fixed-8 {
    min-width: var(--space-8);
}

.min-width-fixed-9 {
    min-width: var(--space-9);
}

.min-width-fixed-10 {
    min-width: var(--space-10);
}

/* Max width */

.max-width-fixed-1 {
    max-width: var(--space-1);
}

.max-width-fixed-2 {
    max-width: var(--space-2);
}

.max-width-fixed-3 {
    max-width: var(--space-3);
}

.max-width-fixed-4 {
    max-width: var(--space-4);
}

.max-width-fixed-5 {
    max-width: var(--space-5);
}

.max-width-fixed-6 {
    max-width: var(--space-6);
}

.max-width-fixed-7 {
    max-width: var(--space-7);
}

.max-width-fixed-8 {
    max-width: var(--space-8);
}

.max-width-fixed-9 {
    max-width: var(--space-9);
}

.max-width-fixed-10 {
    max-width: var(--space-10);
}

/* Width */

.width-0 {
    width: 0%;
}

.width-1 {
    width: 1%;
}

.width-2 {
    width: 2%;
}

.width-3 {
    width: 3%;
}

.width-4 {
    width: 4%;
}

.width-5 {
    width: 5%;
}

.width-6 {
    width: 6%;
}

.width-7 {
    width: 7%;
}

.width-8 {
    width: 8%;
}

.width-9 {
    width: 9%;
}

.width-10 {
    width: 10%;
}

.width-11 {
    width: 11%;
}

.width-12 {
    width: 12%;
}

.width-13 {
    width: 13%;
}

.width-14 {
    width: 14%;
}

.width-15 {
    width: 15%;
}

.width-16 {
    width: 16%;
}

.width-17 {
    width: 17%;
}

.width-18 {
    width: 18%;
}

.width-19 {
    width: 19%;
}

.width-20 {
    width: 20%;
}

.width-21 {
    width: 21%;
}

.width-22 {
    width: 22%;
}

.width-23 {
    width: 23%;
}

.width-24 {
    width: 24%;
}

.width-25 {
    width: 25%;
}

.width-26 {
    width: 26%;
}

.width-27 {
    width: 27%;
}

.width-28 {
    width: 28%;
}

.width-29 {
    width: 29%;
}

.width-30 {
    width: 30%;
}

.width-31 {
    width: 31%;
}

.width-32 {
    width: 32%;
}

.width-33 {
    width: 33%;
}

.width-34 {
    width: 34%;
}

.width-35 {
    width: 35%;
}

.width-36 {
    width: 36%;
}

.width-37 {
    width: 37%;
}

.width-38 {
    width: 38%;
}

.width-39 {
    width: 39%;
}

.width-40 {
    width: 40%;
}

.width-41 {
    width: 41%;
}

.width-42 {
    width: 42%;
}

.width-43 {
    width: 43%;
}

.width-44 {
    width: 44%;
}

.width-45 {
    width: 45%;
}

.width-46 {
    width: 46%;
}

.width-47 {
    width: 47%;
}

.width-48 {
    width: 48%;
}

.width-49 {
    width: 49%;
}

.width-50 {
    width: 50%;
}

.width-51 {
    width: 51%;
}

.width-52 {
    width: 52%;
}

.width-53 {
    width: 53%;
}

.width-54 {
    width: 54%;
}

.width-55 {
    width: 55%;
}

.width-56 {
    width: 56%;
}

.width-57 {
    width: 57%;
}

.width-58 {
    width: 58%;
}

.width-59 {
    width: 59%;
}

.width-60 {
    width: 60%;
}

.width-61 {
    width: 61%;
}

.width-62 {
    width: 62%;
}

.width-63 {
    width: 63%;
}

.width-64 {
    width: 64%;
}

.width-65 {
    width: 65%;
}

.width-66 {
    width: 66%;
}

.width-67 {
    width: 67%;
}

.width-68 {
    width: 68%;
}

.width-69 {
    width: 69%;
}

.width-70 {
    width: 70%;
}

.width-71 {
    width: 71%;
}

.width-72 {
    width: 72%;
}

.width-73 {
    width: 73%;
}

.width-74 {
    width: 74%;
}

.width-75 {
    width: 75%;
}

.width-76 {
    width: 76%;
}

.width-77 {
    width: 77%;
}

.width-78 {
    width: 78%;
}

.width-79 {
    width: 79%;
}

.width-80 {
    width: 80%;
}

.width-81 {
    width: 81%;
}

.width-82 {
    width: 82%;
}

.width-83 {
    width: 83%;
}

.width-84 {
    width: 84%;
}

.width-85 {
    width: 85%;
}

.width-86 {
    width: 86%;
}

.width-87 {
    width: 87%;
}

.width-88 {
    width: 88%;
}

.width-89 {
    width: 89%;
}

.width-90 {
    width: 90%;
}

.width-91 {
    width: 91%;
}

.width-92 {
    width: 92%;
}

.width-93 {
    width: 93%;
}

.width-94 {
    width: 94%;
}

.width-95 {
    width: 95%;
}

.width-96 {
    width: 96%;
}

.width-97 {
    width: 97%;
}

.width-98 {
    width: 98%;
}

.width-99 {
    width: 99%;
}

.width-100 {
    width: 100%;
}

.height-0 {
    height: 0px;
}

.height-100 {
    height: 100%;
}

.min-height-50-vh {
    min-height: 50vh;
    min-height: 50dvh;
}

.min-height-60-vh {
    min-height: 60vh;
    min-height: 60dvh;
}

.min-height-100-vh {
    min-height: 100vh;
    min-height: 100dvh;
}

.max-height-0 {
    max-height: 0px;
}

.max-height-40-vh {
    max-height: 40vh;
    max-height: 40dvh;
}

.max-height-50-vh {
    max-height: 50vh;
    max-height: 50dvh;
}

.max-height-60-vh {
    max-height: 60vh;
    max-height: 60dvh;
}

.max-height-70-vh {
    max-height: 70vh;
    max-height: 70dvh;
}

/* Visibility */

.visibility-hidden {
    visibility: hidden;
}

.visibility-visible {
    visibility: visible;
}

/* Display */

.display-block {
    display: block;
}

.display-flex {
    display: flex;
}

.display-none {
    display: none;
}

.row {
    display: flex;
    flex-direction: row;
}

.row-reverse {
    display: flex;
    flex-direction: row-reverse;
}

.column {
    display: flex;
    flex-direction: column;
}

/* Position */

.position-relative {
    position: relative;
}

.position-absolute {
    position: absolute;
}

.z-index-2 {
    z-index: 2;
}

.align-items-start {
    align-items: flex-start;
}

.align-items-center {
    align-items: center;
}

.align-items-end {
    align-items: flex-end;
}

.justify-content-center {
    justify-content: center;
}

.justify-content-space-between {
    justify-content: space-between;
}

.justify-content-space-evenly {
    justify-content: space-evenly;
}

.justify-content-end {
    justify-content: end;
}

.background-gradient-type-1 {
    background-color: var(--gray-90);
    background: url("../images/background.svg"), var(--gradient-1), var(--black);
    background-repeat: no-repeat;
    background-size: auto;
    background-position: center;
}

.background-color-black {
    background-color: var(--black);
}

.background-color-gray-80 {
    background-color: var(--gray-80);
}

.background-color-error-40 {
    background-color: var(--error-40);
}

.background-color-success-50 {
    background-color: var(--success-50);
}

.background-color-warning-50 {
    background-color: var(--warning-50);
}

.background-color-transparent-black-10 {
    background-color: var(--black);
    background-color: var(--transparent-black-10);
}

.background-color-transparent-black-20 {
    background-color: var(--black);
    background-color: var(--transparent-black-20);
}

.background-color-transparent-black-30 {
    background-color: var(--black);
    background-color: var(--transparent-black-30);
}

.background-color-transparent-black-40 {
    background-color: var(--black);
    background-color: var(--transparent-black-40);
}

.background-color-transparent-black-50 {
    background-color: var(--black);
    background-color: var(--transparent-black-50);
}

.background-color-transparent-black-60 {
    background-color: var(--black);
    background-color: var(--transparent-black-60);
}

.background-color-transparent-black-70 {
    background-color: var(--black);
    background-color: var(--transparent-black-70);
}

.background-color-transparent-black-80 {
    background-color: var(--black);
    background-color: var(--transparent-black-80);
}

.backdrop-filter-blur {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    transition: backdrop-filter var(--animation-200) ease-in-out;
}

.backdrop-filter-blur:hover {
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    transition: backdrop-filter var(--animation-200) ease-in-out;
}

.inner-glow-primary-50 {
    -moz-box-shadow: inset 0 0 20px 1px var(--transparent-primary-50);
    -webkit-box-shadow: inset 0 0 20px 1px var(--transparent-primary-50);
    box-shadow: inset 0 0 20px 1px var(--transparent-primary-50);
}

.inner-glow-success-50 {
    -moz-box-shadow: inset 0 0 20px 1px var(--transparent-success-50);
    -webkit-box-shadow: inset 0 0 20px 1px var(--transparent-success-50);
    box-shadow: inset 0 0 20px 1px var(--transparent-success-50);
}

.border {
    border: 1px solid;
}

.border-bottom {
    border-bottom: 2px solid;
}

.border-right {
    border-right: 1px solid;
}

.border-color-white {
    border-color: var(--white);
}

.border-color-gray-10 {
    border-color: var(--gray-10);
}

.border-color-gray-20 {
    border-color: var(--gray-20);
}

.border-color-gray-30 {
    border-color: var(--gray-30);
}

.border-color-gray-40 {
    border-color: var(--gray-40);
}

.border-color-gray-50 {
    border-color: var(--gray-50);
}

.border-color-gray-60 {
    border-color: var(--gray-60);
}

.border-color-gray-70 {
    border-color: var(--gray-70);
}

.border-color-gray-80 {
    border-color: var(--gray-80);
}

.border-color-gray-90 {
    border-color: var(--gray-90);
}

.border-color-gray-100 {
    border-color: var(--gray-100);
}

.border-color-primary-10 {
    border-color: var(--primary-10);
}

.border-color-primary-20 {
    border-color: var(--primary-20);
}

.border-color-primary-30 {
    border-color: var(--primary-30);
}

.border-color-primary-40 {
    border-color: var(--primary-40);
}

.border-color-primary-50 {
    border-color: var(--primary-50);
}

.border-color-primary-60 {
    border-color: var(--primary-60);
}

.border-color-primary-70 {
    border-color: var(--primary-70);
}

.border-color-primary-80 {
    border-color: var(--primary-80);
}

.border-color-primary-90 {
    border-color: var(--primary-90);
}

.border-color-primary-100 {
    border-color: var(--primary-100);
}

.border-color-success-50 {
    border-color: var(--success-50);
}

.border-radius-1 {
    border-radius: var(--space-1);
}

.border-radius-2 {
    border-radius: var(--space-2);
}

.border-radius-3 {
    border-radius: var(--space-3);
}

.border-radius-4 {
    border-radius: var(--space-4);
}

.border-radius-5 {
    border-radius: var(--space-5);
}

.border-radius-6 {
    border-radius: var(--space-6);
}

.border-radius-7 {
    border-radius: var(--space-7);
}

.border-radius-8 {
    border-radius: var(--space-8);
}

.border-radius-9 {
    border-radius: var(--space-9);
}

.border-radius-10 {
    border-radius: var(--space-10);
}

.border-radius-top-3 {
    border-radius: var(--space-3) var(--space-3) 0 0;
}

.border-radius-bottom-none {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.border-radius-top-left-none {
    border-top-left-radius: 0;
}

/* Text */

.text-prevent-select {
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.word-break-break-all {
    word-break: break-all;
}

.text-no-wrap {
    text-wrap: nowrap;
}

/* Text size */

.text-size-paragraph-1 {
    font-size: var(--paragraph-1);
}

.text-size-paragraph-2 {
    font-size: var(--paragraph-2);
}

.text-size-paragraph-3 {
    font-size: var(--paragraph-3);
}

.text-size-subheading {
    font-size: var(--subheading);
}

.text-size-caption {
    font-size: var(--caption);
}

.text-size-footer {
    font-size: var(--footer);
}

.text-size-display-1 {
    font-size: var(--display-1);
}

.heading-1 {
    font-size: var(--heading-1);
}

.heading-2 {
    font-size: var(--heading-2);
}

.heading-3 {
    font-size: var(--heading-3);
}

.heading-4 {
    font-size: var(--heading-4);
}

.heading-5 {
    font-size: var(--heading-5);
}

.heading-6 {
    font-size: var(--heading-6);
}

/* Text weigth */

.text-weigth-semi-bold {
    font-weight: var(--semi-bold);
}

.text-weigth-bold {
    font-weight: var(--bold);
}

/* Text color */

.text-color-white {
    color: var(--white);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-black {
    color: var(--black);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-gray-10 {
    color: var(--gray-10);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-gray-20 {
    color: var(--gray-20);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-gray-30 {
    color: var(--gray-30);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-gray-40 {
    color: var(--gray-40);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-gray-50 {
    color: var(--gray-50);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-gray-60 {
    color: var(--gray-60);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-gray-70 {
    color: var(--gray-70);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-gray-80 {
    color: var(--gray-80);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-gray-90 {
    color: var(--gray-90);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-gray-100 {
    color: var(--gray-100);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-error-10 {
    color: var(--error-10);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-error-20 {
    color: var(--error-20);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-error-30 {
    color: var(--error-30);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-error-40 {
    color: var(--error-40);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-error-50 {
    color: var(--error-50);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-error-60 {
    color: var(--error-60);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-error-70 {
    color: var(--error-70);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-error-80 {
    color: var(--error-80);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-error-90 {
    color: var(--error-90);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-error-100 {
    color: var(--error-100);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-warning-10 {
    color: var(--warning-10);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-warning-20 {
    color: var(--warning-20);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-warning-30 {
    color: var(--warning-30);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-warning-40 {
    color: var(--warning-40);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-warning-50 {
    color: var(--warning-50);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-warning-60 {
    color: var(--warning-60);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-warning-70 {
    color: var(--warning-70);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-warning-80 {
    color: var(--warning-80);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-warning-90 {
    color: var(--warning-90);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-warning-100 {
    color: var(--warning-100);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-success-10 {
    color: var(--success-10);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-success-20 {
    color: var(--success-20);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-success-30 {
    color: var(--success-30);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-success-40 {
    color: var(--success-40);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-success-50 {
    color: var(--success-50);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-success-60 {
    color: var(--success-60);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-success-70 {
    color: var(--success-70);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-success-80 {
    color: var(--success-80);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-success-90 {
    color: var(--success-90);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-success-100 {
    color: var(--success-100);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-primary-10 {
    color: var(--primary-10);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-primary-20 {
    color: var(--primary-20);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-primary-30 {
    color: var(--primary-30);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-primary-40 {
    color: var(--primary-40);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-primary-50 {
    color: var(--primary-50);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-primary-60 {
    color: var(--primary-60);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-primary-70 {
    color: var(--primary-70);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-primary-80 {
    color: var(--primary-80);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-primary-90 {
    color: var(--primary-90);
    transition: color var(--animation-200) ease-in-out;
}

.text-color-primary-100 {
    color: var(--primary-100);
    transition: color var(--animation-200) ease-in-out;
}

/* Text align */

.text-align-left {
    text-align: left;
}

.text-align-center {
    text-align: center;
}

.text-align-right {
    text-align: right;
}

.text-align-justify {
    text-align: justify;
}

/* Text transform */

.text-transform-none {
    text-transform: none;
}

.text-transform-uppercase {
    text-transform: uppercase;
}

.text-transform-capitalize {
    text-transform: capitalize;
}

/* Text decoration */

.text-decoration-underline {
    text-decoration: underline;
}

/* Desktop */

@media screen and (max-width: 1152px) {
    :root {
        --sidebar-collapsed-width: 120px;
        --sidebar-width: 235px;
        --space-1: 0.25rem;
        --space-2: 0.5rem;
        --space-3: 0.75rem;
        --space-4: 1rem;
        --space-5: 1.25rem;
        --space-6: 1.5rem;
        --space-7: 1.75rem;
        --space-8: 2rem;
        --space-9: 3rem;
        --space-10: 4rem;
        --display-1: 4rem;
        --display-2: 3rem;
        --heading-1: 2.5rem;
        --heading-2: 2.25rem;
        --heading-3: 2rem;
        --heading-4: 1.75rem;
        --heading-5: 1.5rem;
        --heading-6: 1.375rem;
        --subheading: 1.375rem;
        --paragraph-1: 1rem;
        --paragraph-2: 1.125rem;
        --paragraph-3: 1.25rem;
        --caption: 0.975rem;
        --footer: 0.785rem;
        --input: 1.125rem;
        --table-heading: 1.125rem;
        --table-heading-small: 0.975rem;
        --table-data: 1.125rem;
        --table-data-small: 0.975rem;
    }
    .header {
        padding: var(--space-5) var(--space-7);
    }
    .content {
        gap: var(--space-4);
        padding: var(--space-5) var(--space-7);
    }
    .text-align-desktop-left {
        text-align: left;
    }
    .text-align-desktop-center {
        text-align: center;
    }
    .text-align-desktop-right {
        text-align: right;
    }
    .text-align-desktop-justify {
        text-align: justify;
    }
    /* Padding */
    .padding-desktop-0 {
        padding: unset;
    }
    .padding-desktop-1 {
        padding: var(--space-1);
    }
    .padding-desktop-2 {
        padding: var(--space-2);
    }
    .padding-desktop-3 {
        padding: var(--space-3);
    }
    .padding-desktop-4 {
        padding: var(--space-4);
    }
    .padding-desktop-5 {
        padding: var(--space-5);
    }
    .padding-desktop-6 {
        padding: var(--space-6);
    }
    .padding-desktop-7 {
        padding: var(--space-7);
    }
    .padding-desktop-8 {
        padding: var(--space-8);
    }
    .padding-desktop-9 {
        padding: var(--space-9);
    }
    .padding-desktop-10 {
        padding: var(--space-10);
    }
    .padding-desktop-x-0 {
        padding-left: unset;
        padding-right: unset;
    }
    .padding-desktop-x-1 {
        padding-left: var(--space-1);
        padding-right: var(--space-1);
    }
    .padding-desktop-x-2 {
        padding-left: var(--space-2);
        padding-right: var(--space-2);
    }
    .padding-desktop-x-3 {
        padding-left: var(--space-3);
        padding-right: var(--space-3);
    }
    .padding-desktop-x-4 {
        padding-left: var(--space-4);
        padding-right: var(--space-4);
    }
    .padding-desktop-x-5 {
        padding-left: var(--space-5);
        padding-right: var(--space-5);
    }
    .padding-desktop-x-6 {
        padding-left: var(--space-6);
        padding-right: var(--space-6);
    }
    .padding-desktop-x-7 {
        padding-left: var(--space-7);
        padding-right: var(--space-7);
    }
    .padding-desktop-x-8 {
        padding-left: var(--space-8);
        padding-right: var(--space-8);
    }
    .padding-desktop-x-9 {
        padding-left: var(--space-9);
        padding-right: var(--space-9);
    }
    .padding-desktop-x-10 {
        padding-left: var(--space-10);
        padding-right: var(--space-10);
    }
    .padding-desktop-y-0 {
        padding-top: unset;
        padding-bottom: unset;
    }
    .padding-desktop-y-1 {
        padding-top: var(--space-1);
        padding-bottom: var(--space-1);
    }
    .padding-desktop-y-2 {
        padding-top: var(--space-2);
        padding-bottom: var(--space-2);
    }
    .padding-desktop-y-3 {
        padding-top: var(--space-3);
        padding-bottom: var(--space-3);
    }
    .padding-desktop-y-4 {
        padding-top: var(--space-4);
        padding-bottom: var(--space-4);
    }
    .padding-desktop-y-5 {
        padding-top: var(--space-5);
        padding-bottom: var(--space-5);
    }
    .padding-desktop-y-6 {
        padding-top: var(--space-6);
        padding-bottom: var(--space-6);
    }
    .padding-desktop-y-7 {
        padding-top: var(--space-7);
        padding-bottom: var(--space-7);
    }
    .padding-desktop-y-8 {
        padding-top: var(--space-8);
        padding-bottom: var(--space-8);
    }
    .padding-desktop-y-9 {
        padding-top: var(--space-9);
        padding-bottom: var(--space-9);
    }
    .padding-desktop-y-10 {
        padding-top: var(--space-10);
        padding-bottom: var(--space-10);
    }
    .padding-desktop-top-0 {
        padding-top: unset;
    }
    .padding-desktop-top-1 {
        padding-top: var(--space-1);
    }
    .padding-desktop-top-2 {
        padding-top: var(--space-2);
    }
    .padding-desktop-top-3 {
        padding-top: var(--space-3);
    }
    .padding-desktop-top-4 {
        padding-top: var(--space-4);
    }
    .padding-desktop-top-5 {
        padding-top: var(--space-5);
    }
    .padding-desktop-top-6 {
        padding-top: var(--space-6);
    }
    .padding-desktop-top-7 {
        padding-top: var(--space-7);
    }
    .padding-desktop-top-8 {
        padding-top: var(--space-8);
    }
    .padding-desktop-top-9 {
        padding-top: var(--space-9);
    }
    .padding-desktop-top-10 {
        padding-top: var(--space-10);
    }
    .padding-desktop-bottom-0 {
        padding-bottom: unset;
    }
    .padding-desktop-bottom-1 {
        padding-bottom: var(--space-1);
    }
    .padding-desktop-bottom-2 {
        padding-bottom: var(--space-2);
    }
    .padding-desktop-bottom-3 {
        padding-bottom: var(--space-3);
    }
    .padding-desktop-bottom-4 {
        padding-bottom: var(--space-4);
    }
    .padding-desktop-bottom-5 {
        padding-bottom: var(--space-5);
    }
    .padding-desktop-bottom-6 {
        padding-bottom: var(--space-6);
    }
    .padding-desktop-bottom-7 {
        padding-bottom: var(--space-7);
    }
    .padding-desktop-bottom-8 {
        padding-bottom: var(--space-8);
    }
    .padding-desktop-bottom-9 {
        padding-bottom: var(--space-9);
    }
    .padding-desktop-bottom-10 {
        padding-bottom: var(--space-10);
    }
    .padding-desktop-left-0 {
        padding-left: unset;
    }
    .padding-desktop-left-1 {
        padding-left: var(--space-1);
    }
    .padding-desktop-left-2 {
        padding-left: var(--space-2);
    }
    .padding-desktop-left-3 {
        padding-left: var(--space-3);
    }
    .padding-desktop-left-4 {
        padding-left: var(--space-4);
    }
    .padding-desktop-left-5 {
        padding-left: var(--space-5);
    }
    .padding-desktop-left-6 {
        padding-left: var(--space-6);
    }
    .padding-desktop-left-7 {
        padding-left: var(--space-7);
    }
    .padding-desktop-left-8 {
        padding-left: var(--space-8);
    }
    .padding-desktop-left-9 {
        padding-left: var(--space-9);
    }
    .padding-desktop-left-10 {
        padding-left: var(--space-10);
    }
    .padding-desktop-right-0 {
        padding-right: unset;
    }
    .padding-desktop-right-1 {
        padding-right: var(--space-1);
    }
    .padding-desktop-right-2 {
        padding-right: var(--space-2);
    }
    .padding-desktop-right-3 {
        padding-right: var(--space-3);
    }
    .padding-desktop-right-4 {
        padding-right: var(--space-4);
    }
    .padding-desktop-right-5 {
        padding-right: var(--space-5);
    }
    .padding-desktop-right-6 {
        padding-right: var(--space-6);
    }
    .padding-desktop-right-7 {
        padding-right: var(--space-7);
    }
    .padding-desktop-right-8 {
        padding-right: var(--space-8);
    }
    .padding-desktop-right-9 {
        padding-right: var(--space-9);
    }
    .padding-desktop-right-10 {
        padding-right: var(--space-10);
    }
    /* Gap */
    .gap-desktop-1 {
        gap: var(--space-1);
    }
    .gap-desktop-2 {
        gap: var(--space-2);
    }
    .gap-desktop-3 {
        gap: var(--space-3);
    }
    .gap-desktop-4 {
        gap: var(--space-4);
    }
    .gap-desktop-5 {
        gap: var(--space-5);
    }
    .gap-desktop-6 {
        gap: var(--space-6);
    }
    .gap-desktop-7 {
        gap: var(--space-7);
    }
    .gap-desktop-8 {
        gap: var(--space-8);
    }
    .gap-desktop-9 {
        gap: var(--space-9);
    }
    .gap-desktop-10 {
        gap: var(--space-10);
    }
    /* Icon */
    .icon-desktop-1 {
        width: var(--space-1);
    }
    .icon-desktop-2 {
        width: var(--space-2);
    }
    .icon-desktop-3 {
        width: var(--space-3);
    }
    .icon-desktop-4 {
        width: var(--space-4);
    }
    .icon-desktop-5 {
        width: var(--space-5);
    }
    .icon-desktop-6 {
        width: var(--space-6);
    }
    .icon-desktop-7 {
        width: var(--space-7);
    }
    .icon-desktop-8 {
        width: var(--space-8);
    }
    .icon-desktop-9 {
        width: var(--space-9);
    }
    .icon-desktop-10 {
        width: var(--space-10);
    }
    /* Display */
    .display-desktop-block {
        display: block;
    }
    .display-desktop-flex {
        display: flex;
    }
    .display-desktop-none {
        display: none;
    }
    .row-desktop {
        display: flex;
        flex-direction: row;
    }
    .row-reverse-desktop {
        display: flex;
        flex-direction: row-reverse;
    }
    .column-desktop {
        display: flex;
        flex-direction: column;
    }
    /* Width */
    .width-desktop-unset {
        width: unset;
    }
    .width-desktop-0 {
        width: 0%;
    }
    .width-desktop-1 {
        width: 1%;
    }
    .width-desktop-2 {
        width: 2%;
    }
    .width-desktop-3 {
        width: 3%;
    }
    .width-desktop-4 {
        width: 4%;
    }
    .width-desktop-5 {
        width: 5%;
    }
    .width-desktop-6 {
        width: 6%;
    }
    .width-desktop-7 {
        width: 7%;
    }
    .width-desktop-8 {
        width: 8%;
    }
    .width-desktop-9 {
        width: 9%;
    }
    .width-desktop-10 {
        width: 10%;
    }
    .width-desktop-11 {
        width: 11%;
    }
    .width-desktop-12 {
        width: 12%;
    }
    .width-desktop-13 {
        width: 13%;
    }
    .width-desktop-14 {
        width: 14%;
    }
    .width-desktop-15 {
        width: 15%;
    }
    .width-desktop-16 {
        width: 16%;
    }
    .width-desktop-17 {
        width: 17%;
    }
    .width-desktop-18 {
        width: 18%;
    }
    .width-desktop-19 {
        width: 19%;
    }
    .width-desktop-20 {
        width: 20%;
    }
    .width-desktop-21 {
        width: 21%;
    }
    .width-desktop-22 {
        width: 22%;
    }
    .width-desktop-23 {
        width: 23%;
    }
    .width-desktop-24 {
        width: 24%;
    }
    .width-desktop-25 {
        width: 25%;
    }
    .width-desktop-26 {
        width: 26%;
    }
    .width-desktop-27 {
        width: 27%;
    }
    .width-desktop-28 {
        width: 28%;
    }
    .width-desktop-29 {
        width: 29%;
    }
    .width-desktop-30 {
        width: 30%;
    }
    .width-desktop-31 {
        width: 31%;
    }
    .width-desktop-32 {
        width: 32%;
    }
    .width-desktop-33 {
        width: 33%;
    }
    .width-desktop-34 {
        width: 34%;
    }
    .width-desktop-35 {
        width: 35%;
    }
    .width-desktop-36 {
        width: 36%;
    }
    .width-desktop-37 {
        width: 37%;
    }
    .width-desktop-38 {
        width: 38%;
    }
    .width-desktop-39 {
        width: 39%;
    }
    .width-desktop-40 {
        width: 40%;
    }
    .width-desktop-41 {
        width: 41%;
    }
    .width-desktop-42 {
        width: 42%;
    }
    .width-desktop-43 {
        width: 43%;
    }
    .width-desktop-44 {
        width: 44%;
    }
    .width-desktop-45 {
        width: 45%;
    }
    .width-desktop-46 {
        width: 46%;
    }
    .width-desktop-47 {
        width: 47%;
    }
    .width-desktop-48 {
        width: 48%;
    }
    .width-desktop-49 {
        width: 49%;
    }
    .width-desktop-50 {
        width: 50%;
    }
    .width-desktop-51 {
        width: 51%;
    }
    .width-desktop-52 {
        width: 52%;
    }
    .width-desktop-53 {
        width: 53%;
    }
    .width-desktop-54 {
        width: 54%;
    }
    .width-desktop-55 {
        width: 55%;
    }
    .width-desktop-56 {
        width: 56%;
    }
    .width-desktop-57 {
        width: 57%;
    }
    .width-desktop-58 {
        width: 58%;
    }
    .width-desktop-59 {
        width: 59%;
    }
    .width-desktop-60 {
        width: 60%;
    }
    .width-desktop-61 {
        width: 61%;
    }
    .width-desktop-62 {
        width: 62%;
    }
    .width-desktop-63 {
        width: 63%;
    }
    .width-desktop-64 {
        width: 64%;
    }
    .width-desktop-65 {
        width: 65%;
    }
    .width-desktop-66 {
        width: 66%;
    }
    .width-desktop-67 {
        width: 67%;
    }
    .width-desktop-68 {
        width: 68%;
    }
    .width-desktop-69 {
        width: 69%;
    }
    .width-desktop-70 {
        width: 70%;
    }
    .width-desktop-71 {
        width: 71%;
    }
    .width-desktop-72 {
        width: 72%;
    }
    .width-desktop-73 {
        width: 73%;
    }
    .width-desktop-74 {
        width: 74%;
    }
    .width-desktop-75 {
        width: 75%;
    }
    .width-desktop-76 {
        width: 76%;
    }
    .width-desktop-77 {
        width: 77%;
    }
    .width-desktop-78 {
        width: 78%;
    }
    .width-desktop-79 {
        width: 79%;
    }
    .width-desktop-80 {
        width: 80%;
    }
    .width-desktop-81 {
        width: 81%;
    }
    .width-desktop-82 {
        width: 82%;
    }
    .width-desktop-83 {
        width: 83%;
    }
    .width-desktop-84 {
        width: 84%;
    }
    .width-desktop-85 {
        width: 85%;
    }
    .width-desktop-86 {
        width: 86%;
    }
    .width-desktop-87 {
        width: 87%;
    }
    .width-desktop-88 {
        width: 88%;
    }
    .width-desktop-89 {
        width: 89%;
    }
    .width-desktop-90 {
        width: 90%;
    }
    .width-desktop-91 {
        width: 91%;
    }
    .width-desktop-92 {
        width: 92%;
    }
    .width-desktop-93 {
        width: 93%;
    }
    .width-desktop-94 {
        width: 94%;
    }
    .width-desktop-95 {
        width: 95%;
    }
    .width-desktop-96 {
        width: 96%;
    }
    .width-desktop-97 {
        width: 97%;
    }
    .width-desktop-98 {
        width: 98%;
    }
    .width-desktop-99 {
        width: 99%;
    }
    .width-desktop-100 {
        width: 100%;
    }
    /* Text size */
    .text-size-desktop-paragraph-1 {
        font-size: var(--paragraph-1);
    }
    .text-size-desktop-paragraph-2 {
        font-size: var(--paragraph-2);
    }
    .text-size-desktop-paragraph-3 {
        font-size: var(--paragraph-3);
    }
    .text-size-desktop-subheading {
        font-size: var(--subheading);
    }
    .text-size-desktop-caption {
        font-size: var(--caption);
    }
    .heading-desktop-1 {
        font-size: var(--heading-1);
    }
    .heading-desktop-2 {
        font-size: var(--heading-2);
    }
    .heading-desktop-3 {
        font-size: var(--heading-3);
    }
    .heading-desktop-4 {
        font-size: var(--heading-4);
    }
    .heading-desktop-5 {
        font-size: var(--heading-5);
    }
    .heading-desktop-6 {
        font-size: var(--heading-6);
    }
}

/* Tablet */

@media screen and (max-width: 768px) {
    :root {
        --sidebar-collapsed-width: 120px;
        --sidebar-width: 235px;
        --space-1: 0.25rem;
        --space-2: 0.5rem;
        --space-3: 0.75rem;
        --space-4: 1rem;
        --space-5: 1.25rem;
        --space-6: 1.5rem;
        --space-7: 1.75rem;
        --space-8: 2rem;
        --space-9: 3rem;
        --space-10: 4rem;
        --display-1: 3.5rem;
        --display-2: 2rem;
        --heading-1: 2.325rem;
        --heading-2: 2.125rem;
        --heading-3: 1.825rem;
        --heading-4: 1.725rem;
        --heading-5: 1.5rem;
        --heading-6: 1.325rem;
        --subheading: 1.325rem;
        --paragraph-1: 1rem;
        --paragraph-2: 1.125rem;
        --paragraph-3: 1.25rem;
        --caption: 0.975rem;
        --footer: 0.75rem;
        --input: 1rem;
        --table-heading: 1rem;
        --table-heading-small: 0.85rem;
        --table-data: 1rem;
        --table-data-small: 0.85rem;
    }
    /* Veriff */
    .veriff-submit {
        max-width: 768px !important;
    }
    /* Page component */
    .main-content {
        position: initial;
        left: unset;
        width: 100%;
    }
    .content {
        padding: var(--space-4);
    }
    .sidebar,
    .header {
        display: none;
    }
    .sidebar-wrapper {
        display: none;
    }
    .menu,
    .mobile-wrapper {
        display: flex;
    }
    .align-items-tablet-start {
        align-items: flex-start;
    }
    .align-items-tablet-center {
        align-items: center;
    }
    .align-items-tablet-end {
        align-items: flex-end;
    }
    .justify-content-tablet-center {
        justify-content: center;
    }
    .justify-content-tablet-space-between {
        justify-content: space-between;
    }
    .justify-content-tablet-end {
        justify-content: end;
    }
    .text-align-tablet-left {
        text-align: left;
    }
    .text-align-tablet-center {
        text-align: center;
    }
    .text-align-tablet-right {
        text-align: right;
    }
    .text-align-tablet-justify {
        text-align: justify;
    }
    .background-tablet-none {
        background: none;
    }
    .background-color-tablet-transparent-black-20 {
        background-color: var(--black);
        background-color: var(--transparent-black-20);
    }
    /* Padding */
    .padding-tablet-0 {
        padding: unset;
    }
    .padding-tablet-1 {
        padding: var(--space-1);
    }
    .padding-tablet-2 {
        padding: var(--space-2);
    }
    .padding-tablet-3 {
        padding: var(--space-3);
    }
    .padding-tablet-4 {
        padding: var(--space-4);
    }
    .padding-tablet-5 {
        padding: var(--space-5);
    }
    .padding-tablet-6 {
        padding: var(--space-6);
    }
    .padding-tablet-7 {
        padding: var(--space-7);
    }
    .padding-tablet-8 {
        padding: var(--space-8);
    }
    .padding-tablet-9 {
        padding: var(--space-9);
    }
    .padding-tablet-10 {
        padding: var(--space-10);
    }
    .padding-tablet-x-0 {
        padding-left: unset;
        padding-right: unset;
    }
    .padding-tablet-x-1 {
        padding-left: var(--space-1);
        padding-right: var(--space-1);
    }
    .padding-tablet-x-2 {
        padding-left: var(--space-2);
        padding-right: var(--space-2);
    }
    .padding-tablet-x-3 {
        padding-left: var(--space-3);
        padding-right: var(--space-3);
    }
    .padding-tablet-x-4 {
        padding-left: var(--space-4);
        padding-right: var(--space-4);
    }
    .padding-tablet-x-5 {
        padding-left: var(--space-5);
        padding-right: var(--space-5);
    }
    .padding-tablet-x-6 {
        padding-left: var(--space-6);
        padding-right: var(--space-6);
    }
    .padding-tablet-x-7 {
        padding-left: var(--space-7);
        padding-right: var(--space-7);
    }
    .padding-tablet-x-8 {
        padding-left: var(--space-8);
        padding-right: var(--space-8);
    }
    .padding-tablet-x-9 {
        padding-left: var(--space-9);
        padding-right: var(--space-9);
    }
    .padding-tablet-x-10 {
        padding-left: var(--space-10);
        padding-right: var(--space-10);
    }
    .padding-tablet-y-0 {
        padding-top: unset;
        padding-bottom: unset;
    }
    .padding-tablet-y-1 {
        padding-top: var(--space-1);
        padding-bottom: var(--space-1);
    }
    .padding-tablet-y-2 {
        padding-top: var(--space-2);
        padding-bottom: var(--space-2);
    }
    .padding-tablet-y-3 {
        padding-top: var(--space-3);
        padding-bottom: var(--space-3);
    }
    .padding-tablet-y-4 {
        padding-top: var(--space-4);
        padding-bottom: var(--space-4);
    }
    .padding-tablet-y-5 {
        padding-top: var(--space-5);
        padding-bottom: var(--space-5);
    }
    .padding-tablet-y-6 {
        padding-top: var(--space-6);
        padding-bottom: var(--space-6);
    }
    .padding-tablet-y-7 {
        padding-top: var(--space-7);
        padding-bottom: var(--space-7);
    }
    .padding-tablet-y-8 {
        padding-top: var(--space-8);
        padding-bottom: var(--space-8);
    }
    .padding-tablet-y-9 {
        padding-top: var(--space-9);
        padding-bottom: var(--space-9);
    }
    .padding-tablet-y-10 {
        padding-top: var(--space-10);
        padding-bottom: var(--space-10);
    }
    .padding-tablet-top-0 {
        padding-top: unset;
    }
    .padding-tablet-top-1 {
        padding-top: var(--space-1);
    }
    .padding-tablet-top-2 {
        padding-top: var(--space-2);
    }
    .padding-tablet-top-3 {
        padding-top: var(--space-3);
    }
    .padding-tablet-top-4 {
        padding-top: var(--space-4);
    }
    .padding-tablet-top-5 {
        padding-top: var(--space-5);
    }
    .padding-tablet-top-6 {
        padding-top: var(--space-6);
    }
    .padding-tablet-top-7 {
        padding-top: var(--space-7);
    }
    .padding-tablet-top-8 {
        padding-top: var(--space-8);
    }
    .padding-tablet-top-9 {
        padding-top: var(--space-9);
    }
    .padding-tablet-top-10 {
        padding-top: var(--space-10);
    }
    .padding-tablet-bottom-0 {
        padding-bottom: unset;
    }
    .padding-tablet-bottom-1 {
        padding-bottom: var(--space-1);
    }
    .padding-tablet-bottom-2 {
        padding-bottom: var(--space-2);
    }
    .padding-tablet-bottom-3 {
        padding-bottom: var(--space-3);
    }
    .padding-tablet-bottom-4 {
        padding-bottom: var(--space-4);
    }
    .padding-tablet-bottom-5 {
        padding-bottom: var(--space-5);
    }
    .padding-tablet-bottom-6 {
        padding-bottom: var(--space-6);
    }
    .padding-tablet-bottom-7 {
        padding-bottom: var(--space-7);
    }
    .padding-tablet-bottom-8 {
        padding-bottom: var(--space-8);
    }
    .padding-tablet-bottom-9 {
        padding-bottom: var(--space-9);
    }
    .padding-tablet-bottom-10 {
        padding-bottom: var(--space-10);
    }
    .padding-tablet-left-0 {
        padding-left: unset;
    }
    .padding-tablet-left-1 {
        padding-left: var(--space-1);
    }
    .padding-tablet-left-2 {
        padding-left: var(--space-2);
    }
    .padding-tablet-left-3 {
        padding-left: var(--space-3);
    }
    .padding-tablet-left-4 {
        padding-left: var(--space-4);
    }
    .padding-tablet-left-5 {
        padding-left: var(--space-5);
    }
    .padding-tablet-left-6 {
        padding-left: var(--space-6);
    }
    .padding-tablet-left-7 {
        padding-left: var(--space-7);
    }
    .padding-tablet-left-8 {
        padding-left: var(--space-8);
    }
    .padding-tablet-left-9 {
        padding-left: var(--space-9);
    }
    .padding-tablet-left-10 {
        padding-left: var(--space-10);
    }
    .padding-tablet-right-0 {
        padding-right: unset;
    }
    .padding-tablet-right-1 {
        padding-right: var(--space-1);
    }
    .padding-tablet-right-2 {
        padding-right: var(--space-2);
    }
    .padding-tablet-right-3 {
        padding-right: var(--space-3);
    }
    .padding-tablet-right-4 {
        padding-right: var(--space-4);
    }
    .padding-tablet-right-5 {
        padding-right: var(--space-5);
    }
    .padding-tablet-right-6 {
        padding-right: var(--space-6);
    }
    .padding-tablet-right-7 {
        padding-right: var(--space-7);
    }
    .padding-tablet-right-8 {
        padding-right: var(--space-8);
    }
    .padding-tablet-right-9 {
        padding-right: var(--space-9);
    }
    .padding-tablet-right-10 {
        padding-right: var(--space-10);
    }
    /* Gap */
    .gap-tablet-1 {
        gap: var(--space-1);
    }
    .gap-tablet-2 {
        gap: var(--space-2);
    }
    .gap-tablet-3 {
        gap: var(--space-3);
    }
    .gap-tablet-4 {
        gap: var(--space-4);
    }
    .gap-tablet-5 {
        gap: var(--space-5);
    }
    .gap-tablet-6 {
        gap: var(--space-6);
    }
    .gap-tablet-7 {
        gap: var(--space-7);
    }
    .gap-tablet-8 {
        gap: var(--space-8);
    }
    .gap-tablet-9 {
        gap: var(--space-9);
    }
    .gap-tablet-10 {
        gap: var(--space-10);
    }
    /* Icon */
    .icon-tablet-1 {
        width: var(--space-1);
    }
    .icon-tablet-2 {
        width: var(--space-2);
    }
    .icon-tablet-3 {
        width: var(--space-3);
    }
    .icon-tablet-4 {
        width: var(--space-4);
    }
    .icon-tablet-5 {
        width: var(--space-5);
    }
    .icon-tablet-6 {
        width: var(--space-6);
    }
    .icon-tablet-7 {
        width: var(--space-7);
    }
    .icon-tablet-8 {
        width: var(--space-8);
    }
    .icon-tablet-9 {
        width: var(--space-9);
    }
    .icon-tablet-10 {
        width: var(--space-10);
    }
    /* Display */
    .display-tablet-block {
        display: block;
    }
    .display-tablet-flex {
        display: flex;
    }
    .display-tablet-none {
        display: none;
    }
    .row-tablet {
        display: flex;
        flex-direction: row;
    }
    .row-reverse-tablet {
        display: flex;
        flex-direction: row-reverse;
    }
    .column-tablet {
        display: flex;
        flex-direction: column;
    }
    .column-reverse-tablet {
        display: flex;
        flex-direction: column-reverse;
    }
    /* Alert */
    .alert-wrapper {
        top: -100vw;
        top: -100dvw;
    }
    .alert-appear {
        top: 2vh;
        top: 2dvh;
        right: var(--space-4);
        left: var(--space-4);
        width: calc(100% - 2 * var(--space-4));
        transition: top var(--animation-200) ease-in-out;
    }
    /* Popup */
    .popup-wrapper {
        padding: var(--space-8);
    }
    /* Width */
    .width-tablet-unset {
        width: unset;
    }
    .width-tablet-0 {
        width: 0%;
    }
    .width-tablet-1 {
        width: 1%;
    }
    .width-tablet-2 {
        width: 2%;
    }
    .width-tablet-3 {
        width: 3%;
    }
    .width-tablet-4 {
        width: 4%;
    }
    .width-tablet-5 {
        width: 5%;
    }
    .width-tablet-6 {
        width: 6%;
    }
    .width-tablet-7 {
        width: 7%;
    }
    .width-tablet-8 {
        width: 8%;
    }
    .width-tablet-9 {
        width: 9%;
    }
    .width-tablet-10 {
        width: 10%;
    }
    .width-tablet-11 {
        width: 11%;
    }
    .width-tablet-12 {
        width: 12%;
    }
    .width-tablet-13 {
        width: 13%;
    }
    .width-tablet-14 {
        width: 14%;
    }
    .width-tablet-15 {
        width: 15%;
    }
    .width-tablet-16 {
        width: 16%;
    }
    .width-tablet-17 {
        width: 17%;
    }
    .width-tablet-18 {
        width: 18%;
    }
    .width-tablet-19 {
        width: 19%;
    }
    .width-tablet-20 {
        width: 20%;
    }
    .width-tablet-21 {
        width: 21%;
    }
    .width-tablet-22 {
        width: 22%;
    }
    .width-tablet-23 {
        width: 23%;
    }
    .width-tablet-24 {
        width: 24%;
    }
    .width-tablet-25 {
        width: 25%;
    }
    .width-tablet-26 {
        width: 26%;
    }
    .width-tablet-27 {
        width: 27%;
    }
    .width-tablet-28 {
        width: 28%;
    }
    .width-tablet-29 {
        width: 29%;
    }
    .width-tablet-30 {
        width: 30%;
    }
    .width-tablet-31 {
        width: 31%;
    }
    .width-tablet-32 {
        width: 32%;
    }
    .width-tablet-33 {
        width: 33%;
    }
    .width-tablet-34 {
        width: 34%;
    }
    .width-tablet-35 {
        width: 35%;
    }
    .width-tablet-36 {
        width: 36%;
    }
    .width-tablet-37 {
        width: 37%;
    }
    .width-tablet-38 {
        width: 38%;
    }
    .width-tablet-39 {
        width: 39%;
    }
    .width-tablet-40 {
        width: 40%;
    }
    .width-tablet-41 {
        width: 41%;
    }
    .width-tablet-42 {
        width: 42%;
    }
    .width-tablet-43 {
        width: 43%;
    }
    .width-tablet-44 {
        width: 44%;
    }
    .width-tablet-45 {
        width: 45%;
    }
    .width-tablet-46 {
        width: 46%;
    }
    .width-tablet-47 {
        width: 47%;
    }
    .width-tablet-48 {
        width: 48%;
    }
    .width-tablet-49 {
        width: 49%;
    }
    .width-tablet-50 {
        width: 50%;
    }
    .width-tablet-51 {
        width: 51%;
    }
    .width-tablet-52 {
        width: 52%;
    }
    .width-tablet-53 {
        width: 53%;
    }
    .width-tablet-54 {
        width: 54%;
    }
    .width-tablet-55 {
        width: 55%;
    }
    .width-tablet-56 {
        width: 56%;
    }
    .width-tablet-57 {
        width: 57%;
    }
    .width-tablet-58 {
        width: 58%;
    }
    .width-tablet-59 {
        width: 59%;
    }
    .width-tablet-60 {
        width: 60%;
    }
    .width-tablet-61 {
        width: 61%;
    }
    .width-tablet-62 {
        width: 62%;
    }
    .width-tablet-63 {
        width: 63%;
    }
    .width-tablet-64 {
        width: 64%;
    }
    .width-tablet-65 {
        width: 65%;
    }
    .width-tablet-66 {
        width: 66%;
    }
    .width-tablet-67 {
        width: 67%;
    }
    .width-tablet-68 {
        width: 68%;
    }
    .width-tablet-69 {
        width: 69%;
    }
    .width-tablet-70 {
        width: 70%;
    }
    .width-tablet-71 {
        width: 71%;
    }
    .width-tablet-72 {
        width: 72%;
    }
    .width-tablet-73 {
        width: 73%;
    }
    .width-tablet-74 {
        width: 74%;
    }
    .width-tablet-75 {
        width: 75%;
    }
    .width-tablet-76 {
        width: 76%;
    }
    .width-tablet-77 {
        width: 77%;
    }
    .width-tablet-78 {
        width: 78%;
    }
    .width-tablet-79 {
        width: 79%;
    }
    .width-tablet-80 {
        width: 80%;
    }
    .width-tablet-81 {
        width: 81%;
    }
    .width-tablet-82 {
        width: 82%;
    }
    .width-tablet-83 {
        width: 83%;
    }
    .width-tablet-84 {
        width: 84%;
    }
    .width-tablet-85 {
        width: 85%;
    }
    .width-tablet-86 {
        width: 86%;
    }
    .width-tablet-87 {
        width: 87%;
    }
    .width-tablet-88 {
        width: 88%;
    }
    .width-tablet-89 {
        width: 89%;
    }
    .width-tablet-90 {
        width: 90%;
    }
    .width-tablet-91 {
        width: 91%;
    }
    .width-tablet-92 {
        width: 92%;
    }
    .width-tablet-93 {
        width: 93%;
    }
    .width-tablet-94 {
        width: 94%;
    }
    .width-tablet-95 {
        width: 95%;
    }
    .width-tablet-96 {
        width: 96%;
    }
    .width-tablet-97 {
        width: 97%;
    }
    .width-tablet-98 {
        width: 98%;
    }
    .width-tablet-99 {
        width: 99%;
    }
    .width-tablet-100 {
        width: 100%;
    }
    /* Text size */
    .text-size-tablet-paragraph-1 {
        font-size: var(--paragraph-1);
    }
    .text-size-tablet-paragraph-2 {
        font-size: var(--paragraph-2);
    }
    .text-size-tablet-paragraph-3 {
        font-size: var(--paragraph-3);
    }
    .text-size-tablet-subheading {
        font-size: var(--subheading);
    }
    .text-size-tablet-caption {
        font-size: var(--caption);
    }
    .heading-tablet-1 {
        font-size: var(--heading-1);
    }
    .heading-tablet-2 {
        font-size: var(--heading-2);
    }
    .heading-tablet-3 {
        font-size: var(--heading-3);
    }
    .heading-tablet-4 {
        font-size: var(--heading-4);
    }
    .heading-tablet-5 {
        font-size: var(--heading-5);
    }
    .heading-tablet-6 {
        font-size: var(--heading-6);
    }
    /* Border */
    .border-radius-tablet-2 {
        border-radius: var(--space-2);
    }
}

/* Mobile */

@media screen and (max-width: 430px) {
    :root {
        --sidebar-collapsed-width: 120px;
        --sidebar-width: 235px;
        --space-1: 0.25rem;
        --space-2: 0.5rem;
        --space-3: 0.75rem;
        --space-4: 1rem;
        --space-5: 1.25rem;
        --space-6: 1.5rem;
        --space-7: 1.75rem;
        --space-8: 2rem;
        --space-9: 3rem;
        --space-10: 4rem;
        --display-1: 3rem;
        --display-2: 2rem;
        --heading-1: 2.25rem;
        --heading-2: 2rem;
        --heading-3: 1.7rem;
        --heading-4: 1.5rem;
        --heading-5: 1.375rem;
        --heading-6: 1.25rem;
        --subheading: 1.25rem;
        --paragraph-1: 0.975rem;
        --paragraph-2: 1rem;
        --paragraph-3: 1.125rem;
        --caption: 0.925rem;
        --footer: 0.75rem;
        --input: 1rem;
        --table-heading: 1rem;
        --table-heading-small: 0.85rem;
        --table-data: 1rem;
        --table-data-small: 0.85rem;
    }
    /* Page component */
    .main-content {
        position: initial;
        left: unset;
        width: 100%;
    }
    .content {
        padding: var(--space-4);
    }
    .sidebar,
    .header {
        display: none;
    }
    .menu,
    .mobile-wrapper {
        display: flex;
    }
    .menu-element {
        padding: var(--space-1);
    }
    /* Padding */
    .padding-mobile-0 {
        padding: unset;
    }
    .padding-mobile-1 {
        padding: var(--space-1);
    }
    .padding-mobile-2 {
        padding: var(--space-2);
    }
    .padding-mobile-3 {
        padding: var(--space-3);
    }
    .padding-mobile-4 {
        padding: var(--space-4);
    }
    .padding-mobile-5 {
        padding: var(--space-5);
    }
    .padding-mobile-6 {
        padding: var(--space-6);
    }
    .padding-mobile-7 {
        padding: var(--space-7);
    }
    .padding-mobile-8 {
        padding: var(--space-8);
    }
    .padding-mobile-9 {
        padding: var(--space-9);
    }
    .padding-mobile-10 {
        padding: var(--space-10);
    }
    .padding-mobile-x-0 {
        padding-left: unset;
        padding-right: unset;
    }
    .padding-mobile-x-1 {
        padding-left: var(--space-1);
        padding-right: var(--space-1);
    }
    .padding-mobile-x-2 {
        padding-left: var(--space-2);
        padding-right: var(--space-2);
    }
    .padding-mobile-x-3 {
        padding-left: var(--space-3);
        padding-right: var(--space-3);
    }
    .padding-mobile-x-4 {
        padding-left: var(--space-4);
        padding-right: var(--space-4);
    }
    .padding-mobile-x-5 {
        padding-left: var(--space-5);
        padding-right: var(--space-5);
    }
    .padding-mobile-x-6 {
        padding-left: var(--space-6);
        padding-right: var(--space-6);
    }
    .padding-mobile-x-7 {
        padding-left: var(--space-7);
        padding-right: var(--space-7);
    }
    .padding-mobile-x-8 {
        padding-left: var(--space-8);
        padding-right: var(--space-8);
    }
    .padding-mobile-x-9 {
        padding-left: var(--space-9);
        padding-right: var(--space-9);
    }
    .padding-mobile-x-10 {
        padding-left: var(--space-10);
        padding-right: var(--space-10);
    }
    .padding-mobile-y-0 {
        padding-top: unset;
        padding-bottom: unset;
    }
    .padding-mobile-y-1 {
        padding-top: var(--space-1);
        padding-bottom: var(--space-1);
    }
    .padding-mobile-y-2 {
        padding-top: var(--space-2);
        padding-bottom: var(--space-2);
    }
    .padding-mobile-y-3 {
        padding-top: var(--space-3);
        padding-bottom: var(--space-3);
    }
    .padding-mobile-y-4 {
        padding-top: var(--space-4);
        padding-bottom: var(--space-4);
    }
    .padding-mobile-y-5 {
        padding-top: var(--space-5);
        padding-bottom: var(--space-5);
    }
    .padding-mobile-y-6 {
        padding-top: var(--space-6);
        padding-bottom: var(--space-6);
    }
    .padding-mobile-y-7 {
        padding-top: var(--space-7);
        padding-bottom: var(--space-7);
    }
    .padding-mobile-y-8 {
        padding-top: var(--space-8);
        padding-bottom: var(--space-8);
    }
    .padding-mobile-y-9 {
        padding-top: var(--space-9);
        padding-bottom: var(--space-9);
    }
    .padding-mobile-y-10 {
        padding-top: var(--space-10);
        padding-bottom: var(--space-10);
    }
    .padding-mobile-top-0 {
        padding-top: unset;
    }
    .padding-mobile-top-1 {
        padding-top: var(--space-1);
    }
    .padding-mobile-top-2 {
        padding-top: var(--space-2);
    }
    .padding-mobile-top-3 {
        padding-top: var(--space-3);
    }
    .padding-mobile-top-4 {
        padding-top: var(--space-4);
    }
    .padding-mobile-top-5 {
        padding-top: var(--space-5);
    }
    .padding-mobile-top-6 {
        padding-top: var(--space-6);
    }
    .padding-mobile-top-7 {
        padding-top: var(--space-7);
    }
    .padding-mobile-top-8 {
        padding-top: var(--space-8);
    }
    .padding-mobile-top-9 {
        padding-top: var(--space-9);
    }
    .padding-mobile-top-10 {
        padding-top: var(--space-10);
    }
    .padding-mobile-bottom-0 {
        padding-bottom: unset;
    }
    .padding-mobile-bottom-1 {
        padding-bottom: var(--space-1);
    }
    .padding-mobile-bottom-2 {
        padding-bottom: var(--space-2);
    }
    .padding-mobile-bottom-3 {
        padding-bottom: var(--space-3);
    }
    .padding-mobile-bottom-4 {
        padding-bottom: var(--space-4);
    }
    .padding-mobile-bottom-5 {
        padding-bottom: var(--space-5);
    }
    .padding-mobile-bottom-6 {
        padding-bottom: var(--space-6);
    }
    .padding-mobile-bottom-7 {
        padding-bottom: var(--space-7);
    }
    .padding-mobile-bottom-8 {
        padding-bottom: var(--space-8);
    }
    .padding-mobile-bottom-9 {
        padding-bottom: var(--space-9);
    }
    .padding-mobile-bottom-10 {
        padding-bottom: var(--space-10);
    }
    .padding-mobile-left-0 {
        padding-left: unset;
    }
    .padding-mobile-left-1 {
        padding-left: var(--space-1);
    }
    .padding-mobile-left-2 {
        padding-left: var(--space-2);
    }
    .padding-mobile-left-3 {
        padding-left: var(--space-3);
    }
    .padding-mobile-left-4 {
        padding-left: var(--space-4);
    }
    .padding-mobile-left-5 {
        padding-left: var(--space-5);
    }
    .padding-mobile-left-6 {
        padding-left: var(--space-6);
    }
    .padding-mobile-left-7 {
        padding-left: var(--space-7);
    }
    .padding-mobile-left-8 {
        padding-left: var(--space-8);
    }
    .padding-mobile-left-9 {
        padding-left: var(--space-9);
    }
    .padding-mobile-left-10 {
        padding-left: var(--space-10);
    }
    .padding-mobile-right-0 {
        padding-right: unset;
    }
    .padding-mobile-right-1 {
        padding-right: var(--space-1);
    }
    .padding-mobile-right-2 {
        padding-right: var(--space-2);
    }
    .padding-mobile-right-3 {
        padding-right: var(--space-3);
    }
    .padding-mobile-right-4 {
        padding-right: var(--space-4);
    }
    .padding-mobile-right-5 {
        padding-right: var(--space-5);
    }
    .padding-mobile-right-6 {
        padding-right: var(--space-6);
    }
    .padding-mobile-right-7 {
        padding-right: var(--space-7);
    }
    .padding-mobile-right-8 {
        padding-right: var(--space-8);
    }
    .padding-mobile-right-9 {
        padding-right: var(--space-9);
    }
    .padding-mobile-right-10 {
        padding-right: var(--space-10);
    }
    /* Gap */
    .gap-mobile-1 {
        gap: var(--space-1);
    }
    .gap-mobile-2 {
        gap: var(--space-2);
    }
    .gap-mobile-3 {
        gap: var(--space-3);
    }
    .gap-mobile-4 {
        gap: var(--space-4);
    }
    .gap-mobile-5 {
        gap: var(--space-5);
    }
    .gap-mobile-6 {
        gap: var(--space-6);
    }
    .gap-mobile-7 {
        gap: var(--space-7);
    }
    .gap-mobile-8 {
        gap: var(--space-8);
    }
    .gap-mobile-9 {
        gap: var(--space-9);
    }
    .gap-mobile-10 {
        gap: var(--space-10);
    }
    /* Icon */
    .icon-mobile-1 {
        width: var(--space-1);
    }
    .icon-mobile-2 {
        width: var(--space-2);
    }
    .icon-mobile-3 {
        width: var(--space-3);
    }
    .icon-mobile-4 {
        width: var(--space-4);
    }
    .icon-mobile-5 {
        width: var(--space-5);
    }
    .icon-mobile-6 {
        width: var(--space-6);
    }
    .icon-mobile-7 {
        width: var(--space-7);
    }
    .icon-mobile-8 {
        width: var(--space-8);
    }
    .icon-mobile-9 {
        width: var(--space-9);
    }
    .icon-mobile-10 {
        width: var(--space-10);
    }
    /* Display */
    .display-mobile-block {
        display: block;
    }
    .display-mobile-flex {
        display: flex;
    }
    .display-mobile-none {
        display: none;
    }
    .row-mobile {
        display: flex;
        flex-direction: row;
    }
    .row-reverse-mobile {
        display: flex;
        flex-direction: row-reverse;
    }
    .column-mobile {
        display: flex;
        flex-direction: column;
    }
    /* Popup */
    .popup-wrapper {
        padding: var(--space-4);
    }
    /* Width */
    .width-mobile-unset {
        width: unset;
    }
    .width-mobile-0 {
        width: 0%;
    }
    .width-mobile-1 {
        width: 1%;
    }
    .width-mobile-2 {
        width: 2%;
    }
    .width-mobile-3 {
        width: 3%;
    }
    .width-mobile-4 {
        width: 4%;
    }
    .width-mobile-5 {
        width: 5%;
    }
    .width-mobile-6 {
        width: 6%;
    }
    .width-mobile-7 {
        width: 7%;
    }
    .width-mobile-8 {
        width: 8%;
    }
    .width-mobile-9 {
        width: 9%;
    }
    .width-mobile-10 {
        width: 10%;
    }
    .width-mobile-11 {
        width: 11%;
    }
    .width-mobile-12 {
        width: 12%;
    }
    .width-mobile-13 {
        width: 13%;
    }
    .width-mobile-14 {
        width: 14%;
    }
    .width-mobile-15 {
        width: 15%;
    }
    .width-mobile-16 {
        width: 16%;
    }
    .width-mobile-17 {
        width: 17%;
    }
    .width-mobile-18 {
        width: 18%;
    }
    .width-mobile-19 {
        width: 19%;
    }
    .width-mobile-20 {
        width: 20%;
    }
    .width-mobile-21 {
        width: 21%;
    }
    .width-mobile-22 {
        width: 22%;
    }
    .width-mobile-23 {
        width: 23%;
    }
    .width-mobile-24 {
        width: 24%;
    }
    .width-mobile-25 {
        width: 25%;
    }
    .width-mobile-26 {
        width: 26%;
    }
    .width-mobile-27 {
        width: 27%;
    }
    .width-mobile-28 {
        width: 28%;
    }
    .width-mobile-29 {
        width: 29%;
    }
    .width-mobile-30 {
        width: 30%;
    }
    .width-mobile-31 {
        width: 31%;
    }
    .width-mobile-32 {
        width: 32%;
    }
    .width-mobile-33 {
        width: 33%;
    }
    .width-mobile-34 {
        width: 34%;
    }
    .width-mobile-35 {
        width: 35%;
    }
    .width-mobile-36 {
        width: 36%;
    }
    .width-mobile-37 {
        width: 37%;
    }
    .width-mobile-38 {
        width: 38%;
    }
    .width-mobile-39 {
        width: 39%;
    }
    .width-mobile-40 {
        width: 40%;
    }
    .width-mobile-41 {
        width: 41%;
    }
    .width-mobile-42 {
        width: 42%;
    }
    .width-mobile-43 {
        width: 43%;
    }
    .width-mobile-44 {
        width: 44%;
    }
    .width-mobile-45 {
        width: 45%;
    }
    .width-mobile-46 {
        width: 46%;
    }
    .width-mobile-47 {
        width: 47%;
    }
    .width-mobile-48 {
        width: 48%;
    }
    .width-mobile-49 {
        width: 49%;
    }
    .width-mobile-50 {
        width: 50%;
    }
    .width-mobile-51 {
        width: 51%;
    }
    .width-mobile-52 {
        width: 52%;
    }
    .width-mobile-53 {
        width: 53%;
    }
    .width-mobile-54 {
        width: 54%;
    }
    .width-mobile-55 {
        width: 55%;
    }
    .width-mobile-56 {
        width: 56%;
    }
    .width-mobile-57 {
        width: 57%;
    }
    .width-mobile-58 {
        width: 58%;
    }
    .width-mobile-59 {
        width: 59%;
    }
    .width-mobile-60 {
        width: 60%;
    }
    .width-mobile-61 {
        width: 61%;
    }
    .width-mobile-62 {
        width: 62%;
    }
    .width-mobile-63 {
        width: 63%;
    }
    .width-mobile-64 {
        width: 64%;
    }
    .width-mobile-65 {
        width: 65%;
    }
    .width-mobile-66 {
        width: 66%;
    }
    .width-mobile-67 {
        width: 67%;
    }
    .width-mobile-68 {
        width: 68%;
    }
    .width-mobile-69 {
        width: 69%;
    }
    .width-mobile-70 {
        width: 70%;
    }
    .width-mobile-71 {
        width: 71%;
    }
    .width-mobile-72 {
        width: 72%;
    }
    .width-mobile-73 {
        width: 73%;
    }
    .width-mobile-74 {
        width: 74%;
    }
    .width-mobile-75 {
        width: 75%;
    }
    .width-mobile-76 {
        width: 76%;
    }
    .width-mobile-77 {
        width: 77%;
    }
    .width-mobile-78 {
        width: 78%;
    }
    .width-mobile-79 {
        width: 79%;
    }
    .width-mobile-80 {
        width: 80%;
    }
    .width-mobile-81 {
        width: 81%;
    }
    .width-mobile-82 {
        width: 82%;
    }
    .width-mobile-83 {
        width: 83%;
    }
    .width-mobile-84 {
        width: 84%;
    }
    .width-mobile-85 {
        width: 85%;
    }
    .width-mobile-86 {
        width: 86%;
    }
    .width-mobile-87 {
        width: 87%;
    }
    .width-mobile-88 {
        width: 88%;
    }
    .width-mobile-89 {
        width: 89%;
    }
    .width-mobile-90 {
        width: 90%;
    }
    .width-mobile-91 {
        width: 91%;
    }
    .width-mobile-92 {
        width: 92%;
    }
    .width-mobile-93 {
        width: 93%;
    }
    .width-mobile-94 {
        width: 94%;
    }
    .width-mobile-95 {
        width: 95%;
    }
    .width-mobile-96 {
        width: 96%;
    }
    .width-mobile-97 {
        width: 97%;
    }
    .width-mobile-98 {
        width: 98%;
    }
    .width-mobile-99 {
        width: 99%;
    }
    .width-mobile-100 {
        width: 100%;
    }
    /* Text size */
    .text-size-mobile-paragraph-1 {
        font-size: var(--paragraph-1);
    }
    .text-size-mobile-paragraph-2 {
        font-size: var(--paragraph-2);
    }
    .text-size-mobile-paragraph-3 {
        font-size: var(--paragraph-3);
    }
    .text-size-mobile-subheading {
        font-size: var(--subheading);
    }
    .text-size-mobile-caption {
        font-size: var(--caption);
    }
    .heading-mobile-1 {
        font-size: var(--heading-1);
    }
    .heading-mobile-2 {
        font-size: var(--heading-2);
    }
    .heading-mobile-3 {
        font-size: var(--heading-3);
    }
    .heading-mobile-4 {
        font-size: var(--heading-4);
    }
    .heading-mobile-5 {
        font-size: var(--heading-5);
    }
    .heading-mobile-6 {
        font-size: var(--heading-6);
    }
}

/* XS Mobile */

@media screen and (max-width: 300px) {
    .row-xs-mobile {
        display: flex;
        flex-direction: row;
    }
    .row-reverse-xs-mobile {
        display: flex;
        flex-direction: row-reverse;
    }
    .column-xs-mobile {
        display: flex;
        flex-direction: column;
    }
    .column-reverse-xs-mobile {
        display: flex;
        flex-direction: column-reverse;
    }
}