@charset "UTF-8";
:root {
    /* LIGHTNESS PERCENTAGES */
    --lit-000: 95%;
    --lit-100: 90%;
    --lit-150: 85%;
    --lit-200: 80%;
    --lit-250: 75%;
    --lit-300: 70%;
    --lit-350: 65%;
    --lit-400: 60%;
    --lit-450: 55%;
    --lit-500: 50%;
    --lit-550: 45%;
    --lit-600: 40%;
    --lit-650: 35%;
    --lit-700: 30%;
    --lit-750: 25%;
    --lit-800: 20%;
    --lit-850: 15%;
    --lit-900: 10%;
    --lit-1000: 5%;
    /* BLUE */
    --blue-hue: 210;
    --blue-sat: 40%;
    --blue-000: hsl(var(--blue-hue), var(--blue-sat), var(--lit-000));
    --blue-100: hsl(var(--blue-hue), var(--blue-sat), var(--lit-100));
    --blue-200: hsl(var(--blue-hue), var(--blue-sat), var(--lit-200));
    --blue-300: hsl(var(--blue-hue), var(--blue-sat), var(--lit-300));
    --blue-400: hsl(var(--blue-hue), var(--blue-sat), var(--lit-400));
    --blue-500: hsl(var(--blue-hue), var(--blue-sat), var(--lit-500));
    --blue-600: hsl(var(--blue-hue), var(--blue-sat), var(--lit-600));
    --blue-700: hsl(var(--blue-hue), var(--blue-sat), var(--lit-700));
    --blue-800: hsl(var(--blue-hue), var(--blue-sat), var(--lit-800));
    --blue-900: hsl(var(--blue-hue), var(--blue-sat), var(--lit-900));
    --blue-1000: hsl(var(--blue-hue), var(--blue-sat), var(--lit-1000));
    /* INDIGO */
    --indigo-hue: 250;
    --indigo-sat: 40%;
    --indigo-000: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-000));
    --indigo-100: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-100));
    --indigo-200: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-200));
    --indigo-300: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-300));
    --indigo-400: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-400));
    --indigo-500: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-500));
    --indigo-600: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-600));
    --indigo-700: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-700));
    --indigo-800: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-800));
    --indigo-900: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-900));
    --indigo-1000: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-1000));
    /* PURPLE */
    --purple-hue: 300;
    --purple-sat: 30%;
    --purple-000: hsl(var(--purple-hue), var(--purple-sat), var(--lit-000));
    --purple-100: hsl(var(--purple-hue), var(--purple-sat), var(--lit-100));
    --purple-200: hsl(var(--purple-hue), var(--purple-sat), var(--lit-200));
    --purple-300: hsl(var(--purple-hue), var(--purple-sat), var(--lit-300));
    --purple-400: hsl(var(--purple-hue), var(--purple-sat), var(--lit-400));
    --purple-500: hsl(var(--purple-hue), var(--purple-sat), var(--lit-500));
    --purple-600: hsl(var(--purple-hue), var(--purple-sat), var(--lit-600));
    --purple-700: hsl(var(--purple-hue), var(--purple-sat), var(--lit-700));
    --purple-800: hsl(var(--purple-hue), var(--purple-sat), var(--lit-800));
    --purple-900: hsl(var(--purple-hue), var(--purple-sat), var(--lit-900));
    --purple-1000: hsl(var(--purple-hue), var(--purple-sat), var(--lit-1000));
    /* PINK */
    --pink-hue: 340;
    --pink-sat: 40%;
    --pink-000: hsl(var(--pink-hue), var(--pink-sat), var(--lit-000));
    --pink-100: hsl(var(--pink-hue), var(--pink-sat), var(--lit-100));
    --pink-200: hsl(var(--pink-hue), var(--pink-sat), var(--lit-200));
    --pink-300: hsl(var(--pink-hue), var(--pink-sat), var(--lit-300));
    --pink-400: hsl(var(--pink-hue), var(--pink-sat), var(--lit-400));
    --pink-500: hsl(var(--pink-hue), var(--pink-sat), var(--lit-500));
    --pink-600: hsl(var(--pink-hue), var(--pink-sat), var(--lit-600));
    --pink-700: hsl(var(--pink-hue), var(--pink-sat), var(--lit-700));
    --pink-800: hsl(var(--pink-hue), var(--pink-sat), var(--lit-800));
    --pink-900: hsl(var(--pink-hue), var(--pink-sat), var(--lit-900));
    --pink-1000: hsl(var(--pink-hue), var(--pink-sat), var(--lit-1000));
    /* RED */
    --red-hue: 0;
    --red-sat: 40%;
    --red-000: hsl(var(--red-hue), var(--red-sat), var(--lit-000));
    --red-100: hsl(var(--red-hue), var(--red-sat), var(--lit-100));
    --red-200: hsl(var(--red-hue), var(--red-sat), var(--lit-200));
    --red-300: hsl(var(--red-hue), var(--red-sat), var(--lit-300));
    --red-400: hsl(var(--red-hue), var(--red-sat), var(--lit-400));
    --red-500: hsl(var(--red-hue), var(--red-sat), var(--lit-500));
    --red-600: hsl(var(--red-hue), var(--red-sat), var(--lit-600));
    --red-700: hsl(var(--red-hue), var(--red-sat), var(--lit-700));
    --red-800: hsl(var(--red-hue), var(--red-sat), var(--lit-800));
    --red-900: hsl(var(--red-hue), var(--red-sat), var(--lit-900));
    --red-1000: hsl(var(--red-hue), var(--red-sat), var(--lit-1000));
    /* ORANGE */
    --orange-hue: 20;
    --orange-sat: 70%;
    --orange-000: hsl(var(--orange-hue), var(--orange-sat), var(--lit-000));
    --orange-100: hsl(var(--orange-hue), var(--orange-sat), var(--lit-100));
    --orange-200: hsl(var(--orange-hue), var(--orange-sat), var(--lit-200));
    --orange-300: hsl(var(--orange-hue), var(--orange-sat), var(--lit-300));
    --orange-400: hsl(var(--orange-hue), var(--orange-sat), var(--lit-400));
    --orange-500: hsl(var(--orange-hue), var(--orange-sat), var(--lit-500));
    --orange-600: hsl(var(--orange-hue), var(--orange-sat), var(--lit-600));
    --orange-700: hsl(var(--orange-hue), var(--orange-sat), var(--lit-700));
    --orange-800: hsl(var(--orange-hue), var(--orange-sat), var(--lit-800));
    --orange-900: hsl(var(--orange-hue), var(--orange-sat), var(--lit-900));
    --orange-1000: hsl(var(--orange-hue), var(--orange-sat), var(--lit-1000));
    /* YELLOW */
    --yellow-hue: 40;
    --yellow-sat: 60%;
    --yellow-000: hsl(var(--yellow-hue), var(--yellow-sat), var(--lit-000));
    --yellow-100: hsl(var(--yellow-hue), var(--yellow-sat), var(--lit-100));
    --yellow-200: hsl(var(--yellow-hue), var(--yellow-sat), var(--lit-200));
    --yellow-300: hsl(var(--yellow-hue), var(--yellow-sat), var(--lit-300));
    --yellow-400: hsl(var(--yellow-hue), var(--yellow-sat), var(--lit-400));
    --yellow-500: hsl(var(--yellow-hue), var(--yellow-sat), var(--lit-500));
    --yellow-600: hsl(var(--yellow-hue), var(--yellow-sat), var(--lit-600));
    --yellow-700: hsl(var(--yellow-hue), var(--yellow-sat), var(--lit-700));
    --yellow-800: hsl(var(--yellow-hue), var(--yellow-sat), var(--lit-800));
    --yellow-900: hsl(var(--yellow-hue), var(--yellow-sat), var(--lit-900));
    --yellow-1000: hsl(var(--yellow-hue), var(--yellow-sat), var(--lit-1000));
    /* GREEN */
    --green-hue: 86;
    --green-sat: 45%;
    --green-000: hsl(var(--green-hue), var(--green-sat), var(--lit-000));
    --green-100: hsl(var(--green-hue), var(--green-sat), var(--lit-100));
    --green-200: hsl(var(--green-hue), var(--green-sat), var(--lit-200));
    --green-300: hsl(var(--green-hue), var(--green-sat), var(--lit-300));
    --green-400: hsl(var(--green-hue), var(--green-sat), var(--lit-400));
    --green-500: hsl(var(--green-hue), var(--green-sat), var(--lit-500));
    --green-600: hsl(var(--green-hue), var(--green-sat), var(--lit-600));
    --green-700: hsl(var(--green-hue), var(--green-sat), var(--lit-700));
    --green-800: hsl(var(--green-hue), var(--green-sat), var(--lit-800));
    --green-900: hsl(var(--green-hue), var(--green-sat), var(--lit-900));
    --green-1000: hsl(var(--green-hue), var(--green-sat), var(--lit-1000));
    /* TEAL */
    --teal-hue: 130;
    --teal-sat: 35%;
    --teal-000: hsl(var(--teal-hue), var(--teal-sat), var(--lit-000));
    --teal-100: hsl(var(--teal-hue), var(--teal-sat), var(--lit-100));
    --teal-200: hsl(var(--teal-hue), var(--teal-sat), var(--lit-200));
    --teal-300: hsl(var(--teal-hue), var(--teal-sat), var(--lit-300));
    --teal-400: hsl(var(--teal-hue), var(--teal-sat), var(--lit-400));
    --teal-500: hsl(var(--teal-hue), var(--teal-sat), var(--lit-500));
    --teal-600: hsl(var(--teal-hue), var(--teal-sat), var(--lit-600));
    --teal-700: hsl(var(--teal-hue), var(--teal-sat), var(--lit-700));
    --teal-800: hsl(var(--teal-hue), var(--teal-sat), var(--lit-800));
    --teal-900: hsl(var(--teal-hue), var(--teal-sat), var(--lit-900));
    --teal-1000: hsl(var(--teal-hue), var(--teal-sat), var(--lit-1000));
    /* CYAN */
    --cyan-hue: 176;
    --cyan-sat: 27%;
    --cyan-000: hsl(var(--cyan-hue), var(--cyan-sat), var(--lit-000));
    --cyan-100: hsl(var(--cyan-hue), var(--cyan-sat), var(--lit-100));
    --cyan-200: hsl(var(--cyan-hue), var(--cyan-sat), var(--lit-200));
    --cyan-300: hsl(var(--cyan-hue), var(--cyan-sat), var(--lit-300));
    --cyan-400: hsl(var(--cyan-hue), var(--cyan-sat), var(--lit-400));
    --cyan-500: hsl(var(--cyan-hue), var(--cyan-sat), var(--lit-500));
    --cyan-600: hsl(var(--cyan-hue), var(--cyan-sat), var(--lit-600));
    --cyan-700: hsl(var(--cyan-hue), var(--cyan-sat), var(--lit-700));
    --cyan-800: hsl(var(--cyan-hue), var(--cyan-sat), var(--lit-800));
    --cyan-900: hsl(var(--cyan-hue), var(--cyan-sat), var(--lit-900));
    --cyan-1000: hsl(var(--cyan-hue), var(--cyan-sat), var(--lit-1000));
    /* GRAY */
    --gray-hue: 210;
    --gray-sat: 9%;
    --white: hsl(var(--gray-hue), var(--blue-sat), 95%);
    --gray-000: hsl(var(--gray-hue), var(--gray-sat), var(--lit-000));
    --gray-100: hsl(var(--gray-hue), var(--gray-sat), var(--lit-100));
    --gray-200: hsl(var(--gray-hue), var(--gray-sat), var(--lit-200));
    --gray-300: hsl(var(--gray-hue), var(--gray-sat), var(--lit-300));
    --gray-400: hsl(var(--gray-hue), var(--gray-sat), var(--lit-400));
    --gray-500: hsl(var(--gray-hue), var(--gray-sat), var(--lit-500));
    --gray-600: hsl(var(--gray-hue), var(--gray-sat), var(--lit-600));
    --gray-700: hsl(var(--gray-hue), var(--gray-sat), var(--lit-700));
    --gray-800: hsl(var(--gray-hue), var(--gray-sat), var(--lit-800));
    --gray-900: hsl(var(--gray-hue), var(--gray-sat), var(--lit-900));
    --gray-1000: hsl(var(--gray-hue), var(--gray-sat), var(--lit-1000));
    --black: hsl(var(--indigo-hue), var(--indigo-sat), 0%);
    /* SET */
    --dark: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-900));
    --very-dark: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-1000));
    --primary: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-900));
    --secondary: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-850));
    --success: var(--green-500);
    --info: var(--purple-500);
    --warning: var(--orange-500);
    --danger: var(--red-500);
    --light: var(--yellow-400);
    --card-light: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-750));
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
}

html {
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: var(--dark);
    scrollbar-color: var(--black) var(--indigo-800);
    scrollbar-width: thin;
}

body::-webkit-scrollbar {
    width: 12px;
}

body::-webkit-scrollbar-track {
    background: var(--indigo-800);
}

body::-webkit-scrollbar-thumb {
    background-color: var(--black);
    border-radius: 20px;
    border: 3px solid var(--black);
}

body {
    color: var(--indigo-400);
    background-color: var(--indigo-800);
}

a {
    color: var(--purple-500);
}

a:hover {
    color: var(--purple-300);
}

caption {
    color: var(--indigo-600);
}

.blockquote-footer {
    color: var(--indigo-600);
}

.img-thumbnail {
    background-color: var(--indigo-900);
    border: 1px solid var(--indigo-800);
}

.figure-caption {
    color: var(--indigo-600);
}

code {
    color: var(--pink-500);
}

kbd {
    color: var(--white);
    background-color: var(--indigo-900);
}

pre {
    color: var(--indigo-300);
}

.table {
    color: var(--indigo-300);
    background-color: var(--indigo-900);
}

.table th, .table td {
    border-top: 1px solid var(--indigo-800);
}

.table thead th {
    border-bottom: 2px solid var(--indigo-800);
}

.table tbody+tbody {
    border-top: 2px solid var(--indigo-800);
}

.table tbody {
    color: var(--indigo-300);
    background-color: var(--indigo-800);
}

.table-bordered {
    border: 1px solid var(--indigo-800);
}

.table-bordered th, .table-bordered td {
    border: 1px solid var(--indigo-800);
}

.table-hover tbody tr:hover {
    color: var(--indigo-900);
    background-color: hsla(0, 0%, 100%, 0.075);
}

.table-primary, .table-primary>th, .table-primary>td {
    background-color: var(--indigo-100);
}

.table-primary th, .table-primary td, .table-primary thead th, .table-primary tbody+tbody {
    border-color: var(--indigo-200);
}

.table-hover .table-primary:hover {
    background-color: var(--indigo-200);
}

.table-hover .table-primary:hover>td, .table-hover .table-primary:hover>th {
    background-color: var(--indigo-200);
}

.table-secondary, .table-secondary>th, .table-secondary>td {
    background-color: var(--secondary);
}

.table-secondary th, .table-secondary td, .table-secondary thead th, .table-secondary tbody+tbody {
    border-color: var(--secondary);
}

.table-hover .table-secondary:hover {
    background-color: var(--indigo-300);
}

.table-hover .table-secondary:hover>td, .table-hover .table-secondary:hover>th {
    background-color: var(--indigo-300);
}

.table-success, .table-success>th, .table-success>td {
    background-color: var(--green-400);
}

.table-success th, .table-success td, .table-success thead th, .table-success tbody+tbody {
    border-color: var(--green-500);
}

.table-hover .table-success:hover {
    background-color: var(--green-400);
}

.table-hover .table-success:hover>td, .table-hover .table-success:hover>th {
    background-color: var(--green-400);
}

.table-info, .table-info>th, .table-info>td {
    background-color: var(--purple-300);
}

.table-info th, .table-info td, .table-info thead th, .table-info tbody+tbody {
    border-color: var(--purple-400);
}

.table-hover .table-info:hover {
    background-color: var(--purple-300);
}

.table-hover .table-info:hover>td, .table-hover .table-info:hover>th {
    background-color: var(--purple-300);
}

.table-warning, .table-warning>th, .table-warning>td {
    background-color: var(--purple-300);
}

.table-warning th, .table-warning td, .table-warning thead th, .table-warning tbody+tbody {
    border-color: var(--yellow-500);
}

.table-hover .table-warning:hover {
    background-color: var(--yellow-300);
}

.table-hover .table-warning:hover>td, .table-hover .table-warning:hover>th {
    background-color: var(--yellow-300);
}

.table-danger, .table-danger>th, .table-danger>td {
    background-color: var(--red-500);
}

.table-danger th, .table-danger td, .table-danger thead th, .table-danger tbody+tbody {
    border-color: var(--yellow-500);
}

.table-hover .table-danger:hover {
    background-color: var(--red-400);
}

.table-hover .table-danger:hover>td, .table-hover .table-danger:hover>th {
    background-color: var(--red-400);
}

.table-light, .table-light>th, .table-light>td {
    background-color: var(--secondary);
}

.table-light th, .table-light td, .table-light thead th, .table-light tbody+tbody {
    border-color: var(--secondary);
}

.table-hover .table-light:hover {
    background-color: var(--indigo-300);
}

.table-hover .table-light:hover>td, .table-hover .table-light:hover>th {
    background-color: var(--indigo-300);
}

.table-dark, .table-dark>th, .table-dark>td {
    background-color: var(--indigo-200);
}

.table-dark th, .table-dark td, .table-dark thead th, .table-dark tbody+tbody {
    border-color: var(--indigo-500);
}

.table-hover .table-dark:hover {
    background-color: var(--indigo-300);
}

.table-hover .table-dark:hover>td, .table-hover .table-dark:hover>th {
    background-color: var(--indigo-300);
}

.table-active, .table-active>th, .table-active>td {
    background-color: hsla(0, 0%, 100%, 0.075);
}

.table-hover .table-active:hover {
    background-color: hsla(0, 0%, 100%, 0.075);
}

.table-hover .table-active:hover>td, .table-hover .table-active:hover>th {
    background-color: hsla(0, 0%, 100%, 0.075);
}

.table .thead-dark th {
    color: var(--indigo-200);
    background-color: var(--indigo-900);
    border-color: var(--indigo-800);
}

.table .thead-light th {
    color: var(--indigo-400);
    background-color: var(--indigo-700);
    border-color: var(--indigo-800);
}

.table-dark {
    color: var(--indigo-800);
    background-color: var(--indigo-800);
}

.table-dark th, .table-dark td, .table-dark thead th {
    border-color: var(--indigo-700);
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-300), 0.1);
}

.table-dark.table-hover tbody tr:hover {
    color: var(--indigo-800);
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-000), 0.075);
}

.notifications-table .unread, .notifications-table .unread td {
    background-color: hsla(var(--indigo-hue), var(--purple-sat), var(--lit-500), 0.25);
    border-color: hsla(var(--indigo-hue), var(--purple-sat), var(--lit-700), 0.25);
}

.form-control {
    color: var(--indigo-200);
    background-color: var(--very-dark);
    border: 1px solid var(--very-dark);
}

.form-control:-moz-focusring {
    text-shadow: 0 0 0 var(--indigo-200);
}

.form-control:focus, .selectize-dropdown, .selectize-dropdown.form-control {
    color: var(--indigo-200);
    background-color: var(--indigo-900);
    border-color: var(--indigo-800);
}

.form-control::placeholder {
    color: var(--indigo-600);
}

.form-control:disabled, .form-control[readonly] {
    background-color: var(--indigo-800);
}

select.form-control:focus::-ms-value {
    color: var(--indigo-200);
    background-color: var(--indigo-900);
}

.form-control-plaintext {
    color: var(--indigo-400);
}

.form-check-input[disabled]~.form-check-label, .form-check-input:disabled~.form-check-label {
    color: var(--indigo-600);
}

.valid-feedback {
    color: var(--green-500);
}

.valid-tooltip {
    color: var(--white);
    background-color: hsla(var(--green-hue), var(--green-sat), var(--lit-800), 0.9);
}

.was-validated .form-control:valid, .form-control.is-valid {
    border-color: var(--green-500);
}

.was-validated .form-control:valid:focus, .form-control.is-valid:focus {
    border-color: var(--green-500);
    box-shadow: 0 0 0 0.2rem hsla(var(--green-hue), var(--green-sat), var(--lit-800), 0.25);
}

.was-validated .custom-select:valid, .custom-select.is-valid {
    border-color: var(--green-500);
}

.was-validated .custom-select:valid:focus, .custom-select.is-valid:focus {
    border-color: var(--green-500);
    box-shadow: 0 0 0 0.2rem hsla(var(--green-hue), var(--green-sat), var(--lit-800), 0.25);
}

.was-validated .form-check-input:valid~.form-check-label, .form-check-input.is-valid~.form-check-label {
    color: var(--green-500);
}

.was-validated .custom-control-input:valid~.custom-control-label, .custom-control-input.is-valid~.custom-control-label {
    color: var(--green-500);
}

.was-validated .custom-control-input:valid~.custom-control-label::before, .custom-control-input.is-valid~.custom-control-label::before {
    border-color: var(--green-500);
}

.was-validated .custom-control-input:valid:checked~.custom-control-label::before, .custom-control-input.is-valid:checked~.custom-control-label::before {
    border-color: var(--green-500);
    background-color: var(--green-500);
}

.was-validated .custom-control-input:valid:focus~.custom-control-label::before, .custom-control-input.is-valid:focus~.custom-control-label::before {
    box-shadow: 0 0 0 0.2rem hsla(var(--green-hue), var(--green-sat), var(--lit-800), 0.25);
}

.was-validated .custom-control-input:valid:focus:not(:checked)~.custom-control-label::before, .custom-control-input.is-valid:focus:not(:checked)~.custom-control-label::before {
    border-color: var(--green-500);
}

.was-validated .custom-file-input:valid~.custom-file-label, .custom-file-input.is-valid~.custom-file-label {
    border-color: var(--green-500);
}

.was-validated .custom-file-input:valid:focus~.custom-file-label, .custom-file-input.is-valid:focus~.custom-file-label {
    border-color: var(--green-500);
    box-shadow: 0 0 0 0.2rem hsla(var(--green-hue), var(--green-sat), var(--lit-800), 0.25);
}

.invalid-feedback {
    color: var(--danger);
}

.invalid-tooltip {
    color: var(--white);
    background-color: hsla(var(--red-hue), var(--red-sat), var(--lit-700), 0.9);
}

.was-validated .form-control:invalid, .form-control.is-invalid {
    border-color: var(--danger);
}

.was-validated .form-control:invalid:focus, .form-control.is-invalid:focus {
    border-color: var(--danger);
    box-shadow: 0 0 0 0.2rem hsla(var(--red-hue), var(--red-sat), var(--lit-700), 0.25);
}

.was-validated .custom-select:invalid, .custom-select.is-invalid {
    border-color: var(--danger);
}

.was-validated .custom-select:invalid:focus, .custom-select.is-invalid:focus {
    border-color: var(--danger);
    box-shadow: 0 0 0 0.2rem hsla(var(--red-hue), var(--red-sat), var(--lit-700), 0.25);
}

.was-validated .form-check-input:invalid~.form-check-label, .form-check-input.is-invalid~.form-check-label {
    color: var(--danger);
}

.was-validated .custom-control-input:invalid~.custom-control-label, .custom-control-input.is-invalid~.custom-control-label {
    color: var(--danger);
}

.was-validated .custom-control-input:invalid~.custom-control-label::before, .custom-control-input.is-invalid~.custom-control-label::before {
    border-color: var(--danger);
}

.was-validated .custom-control-input:invalid:checked~.custom-control-label::before, .custom-control-input.is-invalid:checked~.custom-control-label::before {
    border-color: var(--red-400);
    background-color: var(--red-400);
}

.was-validated .custom-control-input:invalid:focus~.custom-control-label::before, .custom-control-input.is-invalid:focus~.custom-control-label::before {
    box-shadow: 0 0 0 0.2rem hsla(var(--red-hue), var(--red-sat), var(--lit-700), 0.25);
}

.was-validated .custom-control-input:invalid:focus:not(:checked)~.custom-control-label::before, .custom-control-input.is-invalid:focus:not(:checked)~.custom-control-label::before {
    border-color: var(--danger);
}

.was-validated .custom-file-input:invalid~.custom-file-label, .custom-file-input.is-invalid~.custom-file-label {
    border-color: var(--danger);
}

.was-validated .custom-file-input:invalid:focus~.custom-file-label, .custom-file-input.is-invalid:focus~.custom-file-label {
    border-color: var(--danger);
    box-shadow: 0 0 0 0.2rem hsla(var(--red-hue), var(--red-sat), var(--lit-700), 0.25);
}

.btn {
    color: var(--purple-500);
}

.btn:hover {
    color: var(--purple-600);
}

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

.btn-primary:hover {
    color: var(--white);
    background-color: var(--primary);
    border-color: var(--primary);
}

.btn-primary:focus, .btn-primary.focus {
    color: var(--white);
    background-color: var(--primary);
    border-color: var(--primary);
}

.btn-primary.disabled, .btn-primary:disabled {
    color: var(--white);
    background-color: var(--purple-500);
    border-color: var(--purple-500);
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show>.btn-primary.dropdown-toggle {
    color: var(--white);
    background-color: var(--primary);
    border-color: var(--purple-700);
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show>.btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--blue-hue), var(--indigo-sat), var(--lit-400), 0.5);
}

.btn-secondary {
    color: var(--purple-200);
    background-color: var(--secondary);
    border-color: var(--secondary);
}

.btn-secondary a {
    color: var(--purple-200);
}

.btn-secondary a:hover {
    color: var(--purple-100);
}

.btn-secondary:hover {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--secondary);
}

.btn-secondary:focus, .btn-secondary.focus {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-400), 0.5);
}

.btn-secondary.disabled, .btn-secondary:disabled {
    color: var(--light);
    background-color: var(--indigo-500);
    border-color: var(--indigo-500);
}

.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, .show>.btn-secondary.dropdown-toggle {
    color: var(--light);
    background-color: var(--secondary);
    border-color: var(--indigo-300);
}

.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, .show>.btn-secondary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-400), 0.5);
}

.btn-success {
    color: var(--green-900);
    background-color: var(--success);
    border-color: var(--success);
}

.btn-success:hover {
    color: var(--green-800);
    background-color: var(--green-200);
    border-color: var(--green-200);
}

.btn-success:focus, .btn-success.focus {
    color: var(--white);
    background-color: var(--green-300);
    border-color: var(--green-300);
    box-shadow: 0 0 0 0.2rem hsla(var(--green-hue), var(--green-sat), var(--lit-800), 0.5);
}

.btn-success.disabled, .btn-success:disabled {
    color: var(--white);
    background-color: var(--green-500);
    border-color: var(--green-500);
}

.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active, .show>.btn-success.dropdown-toggle {
    color: var(--white);
    background-color: var(--green-300);
    border-color: var(--green-300);
}

.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus, .show>.btn-success.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rhsla(var(--green-hue), var(--green-sat), var(--lit-600), 0.5);
}

.btn-info {
    color: var(--white);
    background-color: var(--cyan-500);
    border-color: var(--cyan-500);
}

.btn-info:hover {
    color: var(--white);
    background-color: var(--cyan-600);
    border-color: var(--cyan-600);
}

.btn-info:focus, .btn-info.focus {
    color: var(--white);
    background-color: var(--cyan-600);
    border-color: var(--cyan-600);
    box-shadow: 0 0 0 0.2rem hsla(var(--cyan-hue), var(--cyan-sat), var(--lit-600), 0.5);
}

.btn-info.disabled, .btn-info:disabled {
    color: var(--white);
    background-color: var(--cyan-500);
    border-color: var(--cyan-500);
}

.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active, .show>.btn-info.dropdown-toggle {
    color: var(--white);
    background-color: var(--cyan-600);
    border-color: var(--cyan-700);
}

.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus, .show>.btn-info.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--cyan-hue), var(--cyan-sat), var(--lit-600), 0.5);
}

.btn-warning {
    color: var(--dark);
    background-color: var(--yellow-500);
    border-color: var(--yellow-500);
}

.btn-warning:hover {
    color: var(--dark);
    background-color: var(--yellow-500);
    border-color: var(--yellow-600);
}

.btn-warning:focus, .btn-warning.focus {
    color: var(--dark);
    background-color: var(--yellow-500);
    border-color: var(--yellow-600);
    box-shadow: 0 0 0 0.2rem hsla(var(--yellow-hue), var(--yellow-sat), var(--lit-500), 0.5);
}

.btn-warning.disabled, .btn-warning:disabled {
    color: var(--dark);
    background-color: var(--yellow-500);
    border-color: var(--yellow-500);
}

.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active, .show>.btn-warning.dropdown-toggle {
    color: var(--dark);
    background-color: var(--yellow-600);
    border-color: var(--yellow-700);
}

.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, .show>.btn-warning.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--yellow-hue), var(--yellow-sat), var(--lit-500), 0.5);
}

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

.btn-danger:hover {
    color: var(--white);
    background-color: var(--purple-700);
    border-color: var(--purple-700);
}

.btn-danger:focus, .btn-danger.focus {
    color: var(--white);
    background-color: var(--purple-700);
    border-color: var(--purple-700);
    box-shadow: 0 0 0 0.2rem hsla(var(--red-hue), var(--red-sat), var(--lit-300), 0.5);
}

.btn-danger.disabled, .btn-danger:disabled {
    color: var(--white);
    background-color: var(--purple-500);
    border-color: var(--purple-500);
}

.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active, .show>.btn-danger.dropdown-toggle {
    color: var(--white);
    background-color: var(--purple-700);
    border-color: var(--purple-700);
}

.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus, .show>.btn-danger.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--purple-hue), var(--purple-sat), var(--lit-700), 0.5);
}

.btn-light {
    color: var(--dark);
    background-color: var(--indigo-500);
    border-color: var(--indigo-500);
}

.btn-light:hover {
    color: var(--dark);
    background-color: var(--secondary);
    border-color: var(--secondary);
}

.btn-light:focus, .btn-light.focus {
    color: var(--dark);
    background-color: var(--secondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-400), 0.5);
}

.btn-light.disabled, .btn-light:disabled {
    color: var(--dark);
    background-color: var(--indigo-500);
    border-color: var(--indigo-500);
}

.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, .show>.btn-light.dropdown-toggle {
    color: var(--dark);
    background-color: var(--secondary);
    border-color: var(--indigo-300);
}

.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus, .show>.btn-light.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-400), 0.5);
}

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

.btn-dark:hover {
    color: var(--white);
    background-color: var(--dark);
    border-color: var(--dark);
}

.btn-dark:focus, .btn-dark.focus {
    color: var(--white);
    background-color: var(--dark);
    border-color: var(--dark);
    box-shadow: 0 0 0 0.2rem hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-800), 0.5);
}

.btn-dark.disabled, .btn-dark:disabled {
    color: var(--white);
    background-color: var(--dark);
    border-color: var(--dark);
}

.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active, .show>.btn-dark.dropdown-toggle {
    color: var(--white);
    background-color: var(--dark);
    border-color: var(--dark);
}

.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, .show>.btn-dark.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-800), 0.5);
}

.btn-outline-primary {
    color: var(--purple-500);
    border-color: var(--purple-500);
}

.btn-outline-primary:hover {
    color: var(--white);
    background-color: var(--purple-500);
    border-color: var(--purple-500);
}

.btn-outline-primary:focus, .btn-outline-primary.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--purple-hue), var(--purple-sat), var(--lit-500), 0.5);
}

.btn-outline-primary.disabled, .btn-outline-primary:disabled {
    color: var(--purple-500);
}

.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, .show>.btn-outline-primary.dropdown-toggle {
    color: var(--white);
    background-color: var(--purple-500);
    border-color: var(--purple-500);
}

.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, .show>.btn-outline-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--purple-hue), var(--purple-sat), var(--lit-500), 0.5);
}

.btn-outline-secondary {
    color: var(--indigo-500);
    border-color: var(--indigo-500);
}

.btn-outline-secondary:hover {
    color: var(--dark);
    background-color: var(--indigo-500);
    border-color: var(--indigo-500);
}

.btn-outline-secondary:focus, .btn-outline-secondary.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--blue-hue), var(--indigo-sat), var(--lit-300), 0.5);
}

.btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
    color: var(--indigo-500);
}

.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active, .show>.btn-outline-secondary.dropdown-toggle {
    color: var(--dark);
    background-color: var(--indigo-500);
    border-color: var(--indigo-500);
}

.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .show>.btn-outline-secondary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--blue-hue), var(--indigo-sat), var(--lit-300), 0.5);
}

.btn-outline-success {
    color: var(--green-300);
    border-color: var(--green-300);
}

.btn-outline-success:hover {
    color: var(--green-800);
    background-color: var(--green-300);
    border-color: var(--green-300);
}

.btn-outline-success:focus, .btn-outline-success.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--green-hue), var(--green-sat), var(--lit-800), 0.5);
}

.btn-outline-success.disabled, .btn-outline-success:disabled {
    color: var(--green-300);
}

.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active, .show>.btn-outline-success.dropdown-toggle {
    color: var(--white);
    background-color: var(--green-500);
    border-color: var(--green-500);
}

.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, .show>.btn-outline-success.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--green-hue), var(--green-sat), var(--lit-800), 0.5);
}

.btn-outline-info {
    color: var(--cyan-500);
    border-color: var(--cyan-500);
}

.btn-outline-info:hover {
    color: var(--white);
    background-color: var(--cyan-500);
    border-color: var(--cyan-500);
}

.btn-outline-info:focus, .btn-outline-info.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--cyan-hue), var(--cyan-sat), var(--lit-600), 0.5);
}

.btn-outline-info.disabled, .btn-outline-info:disabled {
    color: var(--cyan-500);
}

.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active, .show>.btn-outline-info.dropdown-toggle {
    color: var(--white);
    background-color: var(--cyan-500);
    border-color: var(--cyan-500);
}

.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus, .show>.btn-outline-info.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--cyan-hue), var(--cyan-sat), var(--lit-600), 0.5);
}

.btn-outline-warning {
    color: var(--yellow-500);
    border-color: var(--yellow-500);
}

.btn-outline-warning:hover {
    color: var(--dark);
    background-color: var(--yellow-500);
    border-color: var(--yellow-500);
}

.btn-outline-warning:focus, .btn-outline-warning.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--yellow-hue), var(--yellow-sat), var(--lit-500), 0.5);
}

.btn-outline-warning.disabled, .btn-outline-warning:disabled {
    color: var(--yellow-500);
}

.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active, .show>.btn-outline-warning.dropdown-toggle {
    color: var(--dark);
    background-color: var(--yellow-500);
    border-color: var(--yellow-500);
}

.btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus, .show>.btn-outline-warning.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--yellow-hue), var(--yellow-sat), var(--lit-500), 0.5);
}

.btn-outline-danger {
    color: var(--danger);
    border-color: var(--danger);
}

.btn-outline-danger:hover {
    color: var(--white);
    background-color: var(--danger);
    border-color: var(--danger);
}

.btn-outline-danger:focus, .btn-outline-danger.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--red-hue), var(--red-sat), var(--lit-700), 0.5);
}

.btn-outline-danger.disabled, .btn-outline-danger:disabled {
    color: var(--danger);
}

.btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active, .show>.btn-outline-danger.dropdown-toggle {
    color: var(--white);
    background-color: var(--red-500);
    border-color: var(--red-500);
}

.btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus, .show>.btn-outline-danger.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--red-hue), var(--red-sat), var(--lit-700), 0.5);
}

.btn-outline-light {
    color: var(--indigo-500);
    border-color: var(--indigo-500);
}

.btn-outline-light:hover {
    color: var(--dark);
    background-color: var(--indigo-500);
    border-color: var(--indigo-500);
}

.btn-outline-light:focus, .btn-outline-light.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--blue-hue), var(--indigo-sat), var(--lit-300), 0.5);
}

.btn-outline-light.disabled, .btn-outline-light:disabled {
    color: var(--indigo-500);
}

.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, .show>.btn-outline-light.dropdown-toggle {
    color: var(--dark);
    background-color: var(--indigo-500);
    border-color: var(--indigo-500);
}

.btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, .show>.btn-outline-light.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--blue-hue), var(--indigo-sat), var(--lit-300), 0.5);
}

.btn-outline-dark {
    color: var(--dark);
    border-color: var(--dark);
}

.btn-outline-dark:hover {
    color: var(--white);
    background-color: var(--dark);
    border-color: var(--dark);
}

.btn-outline-dark.disabled, .btn-outline-dark:disabled {
    color: var(--dark);
}

.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active, .show>.btn-outline-dark.dropdown-toggle {
    color: var(--white);
    background-color: var(--dark);
    border-color: var(--dark);
}

.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus, .show>.btn-outline-dark.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem var(--indigo-300);
}

.btn-link {
    color: var(--indigo-500);
}

.btn-link:hover {
    color: var(--indigo-100);
}

.btn-link:disabled, .btn-link.disabled {
    color: var(--indigo-600);
}

.dropdown-menu {
    color: var(--indigo-400);
    background-color: var(--indigo-800);
    border: 1px solid var(--indigo-900);
}

.dropdown-divider {
    border-top: 1px solid var(--indigo-900);
}

.dropdown-item {
    color: var(--indigo-300);
}

.dropdown-item:hover, .dropdown-item:focus {
    color: var(--indigo-900);
    background-color: var(--indigo-600);
}

.dropdown-item.active, .dropdown-item:active {
    color: var(--white);
    background-color: var(--indigo-500);
}

.dropdown-item.disabled, .dropdown-item:disabled {
    color: var(--indigo-600);
}

.dropdown-header {
    color: var(--indigo-600);
}

.dropdown-item-text {
    color: var(--indigo-300);
}

.input-group-text {
    color: var(--indigo-200);
    background-color: var(--indigo-800);
    border: 1px solid var(--indigo-900);
}

.custom-control-input:checked~.custom-control-label::before {
    color: var(--white);
    border-color: var(--blue-500);
    background-color: var(--blue-500);
}

.custom-control-input:focus~.custom-control-label::before {
    box-shadow: 0 0 0 0.2rem var(--blue-600);
}

.custom-control-input:focus:not(:checked)~.custom-control-label::before {
    border-color: var(--indigo-100);
}

.custom-control-input:not(:disabled):active~.custom-control-label::before {
    color: var(--white);
    background-color: var(--indigo-400);
    border-color: var(--indigo-400);
}

.custom-control-input[disabled]~.custom-control-label, .custom-control-input:disabled~.custom-control-label {
    color: var(--indigo-600);
}

.custom-control-input[disabled]~.custom-control-label::before, .custom-control-input:disabled~.custom-control-label::before {
    background-color: var(--indigo-800);
}

.custom-control-label::before {
    background-color: var(--indigo-900);
    border: var(--cyan-500) solid 1px;
}

.custom-checkbox .custom-control-input:indeterminate~.custom-control-label::before {
    border-color: var(--blue-500);
    background-color: var(--blue-500);
}

.custom-checkbox .custom-control-input:disabled:checked~.custom-control-label::before {
    background-color: hsla(var(--blue-hue), var(--blue-sat), var(--lit-500), 0.5);
}

.custom-checkbox .custom-control-input:disabled:indeterminate~.custom-control-label::before {
    background-color: hsla(var(--blue-hue), var(--blue-sat), var(--lit-500), 0.5);
}

.custom-radio .custom-control-input:disabled:checked~.custom-control-label::before {
    background-color: hsla(var(--blue-hue), var(--blue-sat), var(--lit-500), 0.5);
}

.custom-switch .custom-control-label::after {
    background-color: var(--cyan-500);
}

.custom-switch .custom-control-input:checked~.custom-control-label::after {
    background-color: var(--indigo-900);
    transform: translateX(0.75rem);
}

.custom-switch .custom-control-input:disabled:checked~.custom-control-label::before {
    background-color: hsla(var(--blue-hue), var(--blue-sat), var(--lit-500), 0.5);
}

.custom-select {
    color: var(--indigo-200);
    border: 1px solid var(--indigo-900);
}

.custom-select:focus {
    border-color: var(--indigo-100);
    box-shadow: 0 0 0 0.2rem var(--blue-600);
}

.custom-select:focus::-ms-value {
    color: var(--indigo-200);
    background-color: var(--indigo-900);
}

.custom-select:disabled {
    color: var(--indigo-600);
    background-color: var(--indigo-200);
}

.custom-select:-moz-focusring {
    text-shadow: 0 0 0 var(--indigo-200);
}

.custom-file-input:focus~.custom-file-label {
    border-color: var(--indigo-100);
    box-shadow: 0 0 0 0.2rem var(--blue-600);
}

.custom-file-input[disabled]~.custom-file-label, .custom-file-input:disabled~.custom-file-label {
    background-color: var(--indigo-800);
}

.custom-file-label {
    color: var(--indigo-200);
    background-color: var(--indigo-900);
    border: 1px solid var(--indigo-900);
}

.custom-file-label::after {
    color: var(--indigo-200);
    background-color: var(--indigo-800);
}

.custom-range:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 1px var(--indigo-800), 0 0 0 0.2rem var(--blue-600);
}

.custom-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 1px var(--indigo-800), 0 0 0 0.2rem var(--blue-600);
}

.custom-range:focus::-ms-thumb {
    box-shadow: 0 0 0 1px var(--indigo-800), 0 0 0 0.2rem var(--blue-600);
}

.custom-range::-webkit-slider-thumb {
    background-color: var(--blue-500);
}

.custom-range::-webkit-slider-thumb:active {
    background-color: var(--indigo-200);
}

.custom-range::-webkit-slider-runnable-track {
    background-color: var(--indigo-300);
}

.custom-range::-moz-range-thumb {
    background-color: var(--blue-500);
}

.custom-range::-moz-range-thumb:active {
    background-color: var(--indigo-800);
}

.custom-range::-moz-range-track {
    background-color: var(--indigo-900);
}

.custom-range::-ms-thumb {
    background-color: var(--blue-500);
}

.custom-range::-ms-thumb:active {
    background-color: var(--indigo-400);
}

.custom-range::-ms-fill-lower {
    background-color: var(--indigo-300);
}

.custom-range::-ms-fill-upper {
    background-color: var(--indigo-300);
}

.custom-range:disabled::-webkit-slider-thumb {
    background-color: var(--indigo-500);
}

.custom-range:disabled::-webkit-slider-runnable-track {
    cursor: default;
}

.custom-range:disabled::-moz-range-thumb {
    background-color: var(--indigo-500);
}

.custom-range:disabled::-ms-thumb {
    background-color: var(--indigo-500);
}

.nav-icons a {
    color: var(--indigo-200);
}

.nav-icons a:hover {
    color: var(--indigo-400);
}

.nav-link.disabled {
    color: var(--indigo-600);
}

.nav-tabs {
    border-bottom: 1px solid var(--indigo-900);
}

.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {
    background: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-900), 0.5);
    border-color: transparent;
}

.nav-tabs .nav-link.disabled {
    color: var(--indigo-600);
}

.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    color: var(--indigo-200);
    background-color: var(--indigo-800);
    border-color: var(--indigo-900) var(--indigo-900) var(--indigo-800);
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: var(--white);
    background-color: var(--blue-500);
}

.navbar-light .navbar-brand {
    color: var(--indigo-600);
}

.navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus {
    color: var(--indigo-500);
}

.navbar-light .navbar-nav .nav-link {
    color: var(--indigo-300);
}

.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
    color: var(--indigo-200);
}

.navbar-light .navbar-nav .nav-link.disabled {
    color: var(--indigo-400);
}

.navbar-light .navbar-nav .show>.nav-link, .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .nav-link.active {
    color: var(--indigo-500);
}

.navbar-light .navbar-toggler {
    color: var(--indigo-300);
    border-color: hsla(225, 10%, 100%, 0.1);
}

.navbar-light .navbar-text {
    color: var(--indigo-300);
}

.navbar-light .navbar-text a {
    color: var(--indigo-500);
}

.navbar-light .navbar-text a:hover, .navbar-light .navbar-text a:focus {
    color: var(--indigo-500);
}

.navbar-dark .navbar-brand {
    color: var(--white);
}

.navbar-dark .navbar-brand:hover, .navbar-dark .navbar-brand:focus {
    color: var(--white);
}

.navbar-dark .navbar-nav .nav-link {
    color: hsla(225, 10%, 95%, 0.5);
}

.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
    color: hsla(225, 10%, 95%, 0.75);
}

.navbar-dark .navbar-nav .nav-link.disabled {
    color: hsla(225, 10%, 95%, 0.25);
}

.navbar-dark .navbar-nav .show>.nav-link, .navbar-dark .navbar-nav .active>.nav-link, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .nav-link.active {
    color: var(--white);
}

.navbar-dark .navbar-toggler {
    color: hsla(225, 10%, 95%, 0.5);
    border-color: hsla(225, 10%, 95%, 0.1);
}

.navbar-dark .navbar-text {
    color: hsla(225, 10%, 95%, 0.5);
}

.navbar-dark .navbar-text a {
    color: var(--white);
}

.navbar-dark .navbar-text a:hover, .navbar-dark .navbar-text a:focus {
    color: var(--white);
}

.bg-card {
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-850), 0.9);
    border: 1px solid var(--indigo-800);
}

.card {
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-850), 0.9);
    border: 1px solid hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-850), 0.9);
}

.card-light {
    background-color: var(--card-light);
    border: 1px solid var(--card-light);
}

.card-lighter {
    background-color: var(--card-light);
    border: 1px solid var(--card-light);
}

.card-header {
    background-color: var(--dark);
    border-bottom: 0
}

.card-footer {
    background-color: var(--indigo-700);
    border-top: 1px solid var(--indigo-500);
}

.breadcrumb-item+.breadcrumb-item::before {
    color: var(--indigo-600);
}

.breadcrumb-item.active {
    color: var(--indigo-600);
}

.page-link {
    color: var(--indigo-500);
    background-color: var(--indigo-900);
    border: 1px solid var(--dark);
}

.page-link:hover {
    color: var(--indigo-100);
    background-color: var(--indigo-800);
    border-color: var(--indigo-900);
}

.page-link:focus {
    box-shadow: 0 0 0 0.2rem var(--blue-600);
}

.page-item.active .page-link {
    color: var(--white);
    background-color: var(--primary);
    border-color: var(--primary);
}

.page-item.disabled .page-link {
    color: var(--indigo-700);
    cursor: auto;
    background-color: var(--indigo-900);
    border-color: var(--dark);
}

.badge-primary {
    color: var(--white);
    background-color: var(--primary);
}

a.badge-primary:hover, a.badge-primary:focus {
    color: var(--white);
    background-color: var(--primary);
}

a.badge-primary:focus, a.badge-primary.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-500), 0.5);
}

.badge-secondary {
    color: var(--dark);
    background-color: var(--indigo-500);
}

a.badge-secondary:hover, a.badge-secondary:focus {
    color: var(--dark);
    background-color: var(--secondary);
}

a.badge-secondary:focus, a.badge-secondary.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--blue-hue), var(--indigo-sat), var(--lit-300), 0.5);
}

.badge-success {
    color: var(--white);
    background-color: var(--green-700);
}

a.badge-success:hover, a.badge-success:focus {
    color: var(--white);
    background-color: var(--green-700);
}

a.badge-success:focus, a.badge-success.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--green-hue), var(--green-sat), var(--lit-800), 0.5);
}

.badge-info {
    color: var(--white);
    background-color: var(--blue-500);
}

a.badge-info:hover, a.badge-info:focus {
    color: var(--white);
    background-color: var(--blue-600);
}

a.badge-info:focus, a.badge-info.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--blue-hue), var(--blue-sat), var(--lit-600), 0.5);
}

.badge-warning {
    color: var(--dark);
    background-color: var(--orange-500);
}

a.badge-warning:hover, a.badge-warning:focus {
    color: var(--dark);
    background-color: var(--orange-600);
}

a.badge-warning:focus, a.badge-warning.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--orange-hue), var(--orange-sat), var(--lit-500), 0.5);
}

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

a.badge-danger:hover, a.badge-danger:focus {
    color: var(--red-800) !important;
    background-color: var(--red-700);
}

a.badge-danger:focus, a.badge-danger.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--red-hue), var(--red-sat), var(--lit-700), 0.5);
}

.badge-light {
    color: var(--dark);
    background-color: var(--indigo-500);
}

a.badge-light:hover, a.badge-light:focus {
    color: var(--dark);
    background-color: var(--secondary);
}

a.badge-light:focus, a.badge-light.focus {
    box-shadow: 0 0 0 0.2rem hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-300), 0.5);
}

.badge-dark {
    color: var(--white);
    background-color: var(--dark);
}

a.badge-dark:hover, a.badge-dark:focus {
    color: var(--white);
    background-color: var(--dark);
}

a.badge-dark:focus, a.badge-dark.focus {
    box-shadow: 0 0 0 0.2rem var(--indigo-300);
}

.jumbotron {
    background-color: var(--indigo-900);
}

.alert-primary {
    color: var(--purple-700);
    background-color: var(--indigo-200);
    border-color: var(--indigo-100);
}

.alert-primary hr {
    border-top-color: var(--indigo-200);
}

.alert-primary .alert-link {
    color: var(--purple-900);
}

.alert-secondary {
    color: var(--indigo-300);
    background-color: var(--secondary);
    border-color: var(--secondary);
}

.alert-secondary hr {
    border-top-color: var(--indigo-300);
}

.alert-secondary .alert-link {
    color: var(--indigo-400);
}

.alert-success a {
    color: var(--purple-300);
}

.alert-success a:hover {
    color: var(--purple-200);
}

.alert-success {
    color: var(--green-200);
    background-color: hsla(var(--green-hue), var(--green-sat), var(--lit-200), 0.25);
    border-color: var(--green-300);
}

.alert-success hr {
    border-top-color: var(--green-400);
}

.alert-success .alert-link {
    color: var(--blue-900);
}

.alert-info {
    color: var(--blue-300);
    background-color: hsla(var(--blue-hue), var(--blue-sat), var(--lit-800), 0.5);
    border-color: var(--blue-300);
}

.alert-info hr {
    border-top-color: var(--blue-300);
}

.alert-info .alert-link {
    color: var(--blue-700);
}

.alert-warning {
    color: var(--orange-300);
    background-color: hsla(var(--orange-hue), var(--orange-sat), var(--lit-600), 0.25);
    border-color: var(--orange-300);
}

.alert-warning hr {
    border-top-color: var(--yellow-300);
}

.alert-warning .alert-link {
    color: var(--yellow-700);
}

.alert-danger {
    color: var(--purple-300);
    background-color: hsla(var(--purple-hue), var(--purple-sat), var(--lit-400), 0.25);
    border-color: var(--purple-300);
}

.alert-danger hr {
    border-top-color: var(--red-400);
}

.alert-danger .alert-link {
    color: var(--red-700);
}

.alert-light {
    color: var(--indigo-600);
    background-color: var(--indigo-100);
    border-color: var(--secondary);
}

.alert-light hr {
    border-top-color: var(--indigo-300);
}

.alert-light .alert-link {
    color: var(--indigo-600);
}

.alert-dark {
    color: var(--dark);
    background-color: var(--indigo-300);
    border-color: var(--indigo-200);
}

.alert-dark hr {
    border-top-color: var(--indigo-300);
}

.alert-dark .alert-link {
    color: var(--dark);
}

.progress {
    background-color: var(--indigo-200);
}

.progress-bar {
    color: var(--white);
    background-color: var(--blue-500);
}

.progress-bar-striped {
    background-image: linear-gradient(45deg, hsla(225, 10%, 95%, 0.15) 25%, transparent 25%, transparent 50%, hsla(225, 10%, 95%, 0.15) 50%, hsla(225, 10%, 95%, 0.15) 75%, transparent 75%, transparent);
}

.list-group-item-action {
    color: var(--indigo-700);
}

.list-group-item-action:hover, .list-group-item-action:focus {
    color: var(--indigo-700);
    background-color: var(--indigo-300);
}

.list-group-item-action:active {
    color: var(--indigo-400);
    background-color: var(--indigo-300);
}

.list-group-flush .list-group-item {
    background-color: transparent;
    border: 1px solid hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-600), 0.25);
    border-left: none;
    border-right: none
}

.list-group-item {
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-900), 0.75);
    border: 1px solid hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-600), 0.25);
}

.list-group-item.disabled, .list-group-item:disabled {
    color: var(--indigo-600);
    background-color: var(--white);
}

.list-group-item.active {
    color: var(--white);
    background-color: var(--blue-500);
    border-color: var(--blue-500);
}

.list-group-item-primary {
    color: var(--blue-700);
    background-color: var(--indigo-100);
}

.list-group-item-primary.list-group-item-action:hover, .list-group-item-primary.list-group-item-action:focus {
    color: var(--blue-700);
    background-color: var(--indigo-200);
}

.list-group-item-primary.list-group-item-action.active {
    color: var(--white);
    background-color: var(--blue-700);
    border-color: var(--blue-700);
}

.list-group-item-secondary {
    color: var(--indigo-600);
    background-color: var(--secondary);
}

.list-group-item-secondary.list-group-item-action:hover, .list-group-item-secondary.list-group-item-action:focus {
    color: var(--indigo-600);
    background-color: var(--indigo-300);
}

.list-group-item-secondary.list-group-item-action.active {
    color: var(--white);
    background-color: var(--indigo-600);
    border-color: var(--indigo-600);
}

.list-group-item-success {
    color: var(--green-400);
    background-color: var(--green-400);
}

.list-group-item-success.list-group-item-action:hover, .list-group-item-success.list-group-item-action:focus {
    color: var(--green-400);
    background-color: var(--green-400);
}

.list-group-item-success.list-group-item-action.active {
    color: var(--white);
    background-color: var(--green-400);
    border-color: var(--green-400);
}

.list-group-item-info {
    color: var(--blue-500);
    background-color: var(--blue-300);
}

.list-group-item-info.list-group-item-action:hover, .list-group-item-info.list-group-item-action:focus {
    color: var(--purple-500);
    background-color: var(--purple-300);
}

.list-group-item-info.list-group-item-action.active {
    color: var(--white);
    background-color: var(--purple-500);
    border-color: var(--purple-500);
}

.list-group-item-warning {
    color: var(--yellow-700);
    background-color: var(--purple-300);
}

.list-group-item-warning.list-group-item-action:hover, .list-group-item-warning.list-group-item-action:focus {
    color: var(--yellow-700);
    background-color: var(--yellow-300);
}

.list-group-item-warning.list-group-item-action.active {
    color: var(--white);
    background-color: var(--yellow-700);
    border-color: var(--yellow-700);
}

.list-group-item-danger {
    color: var(--red-700);
    background-color: var(--red-500);
}

.list-group-item-danger.list-group-item-action:hover, .list-group-item-danger.list-group-item-action:focus {
    color: var(--red-700);
    background-color: var(--red-400);
}

.list-group-item-danger.list-group-item-action.active {
    color: var(--white);
    background-color: var(--red-700);
    border-color: var(--red-700);
}

.list-group-item-light {
    color: var(--indigo-600);
    background-color: var(--secondary);
}

.list-group-item-light.list-group-item-action:hover, .list-group-item-light.list-group-item-action:focus {
    color: var(--indigo-600);
    background-color: var(--indigo-300);
}

.list-group-item-light.list-group-item-action.active {
    color: var(--white);
    background-color: var(--indigo-600);
    border-color: var(--indigo-600);
}

.list-group-item-dark {
    color: var(--dark);
    background-color: var(--indigo-200);
}

.list-group-item-dark.list-group-item-action:hover, .list-group-item-dark.list-group-item-action:focus {
    color: var(--dark);
    background-color: var(--indigo-300);
}

.list-group-item-dark.list-group-item-action.active {
    color: var(--white);
    background-color: var(--dark);
    border-color: var(--dark);
}

.close {
    color: var(--dark);
    text-shadow: 0 1px 0 var(--white);
}

.close:hover {
    color: var(--dark);
}

.toast {
    background-color: hsla(0, 0%, 100%, 0.85);
    border: 1px solid hsla(225, 10%, 100%, 0.1);
    box-shadow: 0 0.25rem 0.75rem hsla(225, 10%, 100%, 0.1);
}

.toast-header {
    color: var(--indigo-600);
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-000), 0.85);
    border-bottom: 1px solid hsla(0, 0%, 100%, 0.05);
}

.modal {
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-900), 0.5);
}

.modal-backdrop {
    background-color: var(--dark);
}

.modal-header {
    background-color: var(--indigo-800);
    color: var(--purple-200);
}

.modal-footer {
    border-top: 1px solid var(--black);
}

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

.modal-content {
    background-color: var(--indigo-700);
    color: var(--indigo-400);
    border: var(--black) 1px solid;
}

.modal-header .close {
    color: var(--purple-200);
    text-shadow: none
}

.modal-header .close:not(:disabled):not(.disabled):focus, .close:not(:disabled):not(.disabled):hover {
    color: var(--indigo-100);
}

.modal-content .btn-primary {
    background: var(--indigo-800);
}

.modal-content .btn-primary:hover {
    background: var(--indigo-700);
}

.bs-tooltip-top .arrow::before, .bs-tooltip-auto[x-placement^="top"] .arrow::before {
    border-top-color: var(--dark);
}

.bs-tooltip-right .arrow::before, .bs-tooltip-auto[x-placement^="right"] .arrow::before {
    border-right-color: var(--dark);
}

.bs-tooltip-bottom .arrow::before, .bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
    border-bottom-color: var(--dark);
}

.bs-tooltip-left .arrow::before, .bs-tooltip-auto[x-placement^="left"] .arrow::before {
    border-left-color: var(--dark);
}

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

.popover {
    background-color: var(--dark);
    border: 1px solid hsla(225, 10%, 100%, 0.2);
}

.bs-popover-top>.arrow::before, .bs-popover-auto[x-placement^="top"]>.arrow::before {
    border-top-color: hsla(225, 10%, 100%, 0.25);
}

.bs-popover-top>.arrow::after, .bs-popover-auto[x-placement^="top"]>.arrow::after {
    border-top-color: var(--dark);
}

.bs-popover-right>.arrow::before, .bs-popover-auto[x-placement^="right"]>.arrow::before {
    border-right-color: hsla(225, 10%, 100%, 0.25);
}

.bs-popover-right>.arrow::after, .bs-popover-auto[x-placement^="right"]>.arrow::after {
    border-right-color: var(--dark);
}

.bs-popover-bottom>.arrow::before, .bs-popover-auto[x-placement^="bottom"]>.arrow::before {
    border-bottom-color: hsla(225, 10%, 100%, 0.25);
}

.bs-popover-bottom>.arrow::after, .bs-popover-auto[x-placement^="bottom"]>.arrow::after {
    border-bottom-color: var(--dark);
}

.bs-popover-bottom .popover-header::before, .bs-popover-auto[x-placement^="bottom"] .popover-header::before {
    border-bottom: 1px solid var(--dark);
}

.bs-popover-left>.arrow::before, .bs-popover-auto[x-placement^="left"]>.arrow::before {
    border-left-color: hsla(225, 10%, 100%, 0.25);
}

.bs-popover-left>.arrow::after, .bs-popover-auto[x-placement^="left"]>.arrow::after {
    border-left-color: var(--dark);
}

.popover-header {
    background-color: var(--dark);
    border-bottom: 1px solid var(--dark);
}

.popover-body {
    color: var(--indigo-400);
}

.carousel-control-prev, .carousel-control-next {
    color: var(--white);
}

.carousel-control-prev:hover, .carousel-control-prev:focus, .carousel-control-next:hover, .carousel-control-next:focus {
    color: var(--white);
}

.carousel-indicators li {
    background-color: var(--white);
}

.carousel-caption {
    color: var(--white);
}

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

a.bg-primary:hover, a.bg-primary:focus, button.bg-primary:hover, button.bg-primary:focus {
    background-color: var(--primary) !important;
}

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

a.bg-secondary:hover, a.bg-secondary:focus, button.bg-secondary:hover, button.bg-secondary:focus {
    background-color: var(--secondary) !important;
}

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

a.bg-success:hover, a.bg-success:focus, button.bg-success:hover, button.bg-success:focus {
    background-color: var(--green-700) !important;
}

.bg-info {
    background-color: var(--cyan-500) !important;
}

a.bg-info:hover, a.bg-info:focus, button.bg-info:hover, button.bg-info:focus {
    background-color: var(--green-600) !important;
}

.bg-warning {
    background-color: var(--yellow-500) !important;
}

a.bg-warning:hover, a.bg-warning:focus, button.bg-warning:hover, button.bg-warning:focus {
    background-color: var(--yellow-600) !important;
}

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

a.bg-danger:hover, a.bg-danger:focus, button.bg-danger:hover, button.bg-danger:focus {
    background-color: var(--red-700) !important;
}

.bg-light {
    background-color: var(--indigo-500) !important;
}

.rounded-circle.bg-light {
    background-color: var(--indigo-900) !important;
}

a.bg-light:hover, a.bg-light:focus, button.bg-light:hover, button.bg-light:focus {
    background-color: var(--secondary) !important;
}

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

.bg-very-dark {
    background-color: var(--very-dark) !important;
}

.bg-very-dark-rtl {
    background-image: linear-gradient(to right, hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-1000), 0), hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-1000), 1));
}

@media only screen and (max-width:765px) {
    .bg-very-dark-rtl {
        background: var(--indigo-900)!important;
        padding: 1em;
    }
}

.sidebar .card, .half-bg-dark {
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-1000), 0.75);
    backdrop-filter: blur(2px);
}

.sidebar .card-header {
    backdrop-filter: blur(2px);
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-1000), 0.75);
}

a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
    background-color: var(--dark) !important;
}

#innerSidebar .text-pop {
    color: var(--purple-600) !important;
}

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

.bg-transparent {
    background-color: transparent !important;
}

.border {
    border: 1px solid var(--indigo-900) !important;
}

.border-top {
    border-top: 1px solid var(--indigo-900) !important;
}

.border-right {
    border-right: 1px solid var(--indigo-900) !important;
}

.border-bottom {
    border-bottom: 1px solid var(--indigo-900) !important;
}

.border-left {
    border-left: 1px solid var(--indigo-900) !important;
}

.border-0 {
    border: 0 !important;
}

.border-top-0 {
    border-top: 0 !important;
}

.border-right-0 {
    border-right: 0 !important;
}

.border-bottom-0 {
    border-bottom: 0 !important;
}

.border-left-0 {
    border-left: 0 !important;
}

.border-primary {
    border-color: var(--purple-500) !important;
}

.border-secondary {
    border-color: var(--indigo-500) !important;
}

.border-success {
    border-color: var(--green-500) !important;
}

.border-info {
    border-color: var(--cyan-500) !important;
}

.border-warning {
    border-color: var(--yellow-500) !important;
}

.border-danger {
    border-color: var(--danger) !important;
}

.border-light {
    border-color: var(--indigo-500) !important;
}

.border-dark {
    border-color: var(--dark) !important;
}

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

.shadow-sm {
    box-shadow: 0 0.125rem 0.25rem hsla(0, 0%, 100%, 0.075) !important;
}

.shadow {
    box-shadow: 0 0.5rem 1rem hsla(0, 0%, 100%, 0.15) !important;
}

.shadow-lg {
    box-shadow: 0 1rem 3rem hsla(0, 0%, 100%, 0.175) !important;
}

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

.text-primary {
    color: var(--purple-500) !important;
}

a.text-primary:hover, a.text-primary:focus {
    color: var(--purple-700) !important;
}

.text-secondary {
    color: var(--indigo-500) !important;
}

a.text-secondary:hover, a.text-secondary:focus {
    color: var(--light) !important;
}

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

a.text-success:hover, a.text-success:focus {
    color: var(--green-700) !important;
}

.text-info {
    color: var(--cyan-500) !important;
}

a.text-info:hover, a.text-info:focus {
    color: var(--green-600) !important;
}

.text-warning {
    color: var(--yellow-500) !important;
}

a.text-warning:hover, a.text-warning:focus {
    color: var(--yellow-600) !important;
}

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

a.text-danger:hover, a.text-danger:focus {
    color: var(--red-700) !important;
}

.text-light {
    color: var(--yellow-300) !important;
}

a.text-light:hover, a.text-light:focus {
    color: var(--light) !important;
}

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

a.text-dark:hover, a.text-dark:focus {
    color: var(--dark) !important;
}

.text-body {
    color: var(--indigo-400) !important;
}

.text-muted {
    color: var(--gray-500) !important;
}

.text-black-50 {
    color: var(--indigo-300) !important;
}

.text-white-50 {
    color: hsla(225, 10%, 95%, 0.5) !important;
}

.main-content {
    background: var(--indigo-800);
    color: var(--blue-200);
    background-image: url('https://drakiri.com/files/Theme-Images/starry_bg.png');
    background-attachment: fixed;
    background-size: cover;
}

.sidebar .sidebar-header {
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-800), 0.5);
    color: var(--blue-200);
}

.sidebar, #app {
    background-color: var(--indigo-1000);
}

.sidebar a {
    color: var(--blue-200);
    transition: .5s
}

.sidebar a:hover {
    color: var(--indigo-400);
}

.sidebar a.active {
    border-right: var(--purple-500) 2px solid
}

.sidebar a.active, .sidebar a.active:hover {
    background-color: var(--indigo-700);
}

.sidebar ul li {
    background: var(--indigo-800);
}

.sidebar ul li a {
    color: var(--indigo-200);
}

.sidebar ul li a:hover {
    color: var(--indigo-400);
}

.sidebar a .bg-danger {
    color: var(--black) !important;
}

.sidebar a:hover, .sidebar a:active {
    background-color: hsla(225, 9%, 0%, 0.5) !important;
    transition: .5s;
}

.breadcrumb-item a {
    color: var(--purple-500);
}

.breadcrumb-item a:hover {
    color: var(--purple-600);
}

.site-footer .copyright {
    color: var(--indigo-300);
}

.nav-tabs .nav-item .active {
    background: var(--indigo-900);
}

.btn-faded {
    background: var(--indigo-800);
}

h1 a, h2 a, h3 a, h4 a, h5 a, a.h1, a.h2, a.h3, a.h4, a.h5 {
    color: var(--purple-500);
}

.character-bio .nav-tabs.card-header-tabs .active {
    background-color: var(--indigo-700);
    border-bottom: 0
}

.image-nav .nav-item a.active {
    border-color: transparent;
    background-color: var(--indigo-900);
}

.logs-table-header div, .logs-table-body {
    background-color: var(--dark);
}

.logs-table-row:nth-child(odd) {
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-650), 0.5);
}

.logs-table-row a {
    color: var(--orange-200)!important;
}

.logs-table-row a:hover {
    color: var(--orange-100)!important;
    text-decoration: none;
}

.logs-table-row:nth-child(even) {
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-750), 0.5);
}

.comment-button {
    background: var(--primary);
    color: var(--indigo-300);
}

.text-bright {
    color: var(--purple-400);
}

.comment-button:hover {
    background: var(--indigo-900);
    color: var(--purple-400);
}

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

.comment {
    color: var(--purple-200);
}

.comment, .comment_replies .comment_replies, .comment_replies .comment_replies .comment_replies .comment_replies {
    background: var(--indigo-900);
    color: var(--purple-200) !important;
}

.comment_replies, .comment_replies .comment_replies .comment_replies {
    color: var(--purple-200);
    background: linear-gradient(90deg, hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-850), 1) 0%, hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-850), 0));
}

.comment_replies .comment_body, .comment_replies .comment_replies .comment_body, .comment_replies .comment_replies .comment_replies .comment_body {
    color: var(--purple-300);
    background: var(--primary);
}

.comment_body, .comment_replies .comment_replies .comment_body, .comment_replies .comment_replies .comment_replies .comment_replies .comment_body {
    color: var(--purple-300);
    background: var(--indigo-800);
}

@media only screen and (max-width:600px) {
    .comment_titles {
        background: var(--dark);
    }
}

.toggle-group .btn {
    white-space: nowrap;
    text-overflow: inherit;
    overflow: inherit
}

.toggle-group .btn-primary {
    background: var(--dark);
    color: var(--indigo-300);
}

.toggle-group .btn-secondary {
    background: var(--indigo-700);
    color: var(--indigo-300);
}

.comment .btn-primary {
    background: var(--indigo-900) !important;
    border-color: hsla(var(--green-hue), var(--green-sat), var(--lit-500), 0.3);
    color: var(--green-500);
}

.comment .btn-primary:hover {
    background: var(--dark) !important;
    border-color: hsla(var(--green-hue), var(--green-sat), var(--lit-300), 0.5);
    color: var(--green-300);
}

.modal-content .btn-primary {
    background: var(--primary);
    border-color: transparent;
    color: var(--purple-500);
}

.modal-content .btn-primary:hover {
    background: var(--dark);
    border-color: transparent;
    color: var(--purple-400);
}

.feature {
    background: hsla(var(--purple-hue), var(--purple-sat), var(--lit-500), 0.1);
}

.sideborders {
    border-style: solid;
    border-color: var(--purple-500) !important;
    border-width: 0 6px;
}

.site-header-image {
    background-color: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-800), 0.85);
}

.userbox a {
    background-color: var(--indigo-800);
}

.title {
    color: var(--purple-200);
}

.border {
    border: 1px solid var(--dark) !important;
}

.border-bottom {
    border-bottom: 1px solid var(--dark) !important;
}

.border-top {
    border-top: 1px solid var(--dark) !important;
}

.border-left {
    border-left: 1px solid var(--dark) !important;
}

.border-right {
    border-right: 1px solid var(--dark) !important;
}

@media(min-width:576px) {
    .border-sm-top {
        border-top: 1px solid var(--dark) !important;
    }
    .border-sm-right {
        border-right: 1px solid var(--dark) !important;
    }
    .border-sm-bottom {
        border-bottom: 1px solid var(--dark) !important;
    }
    .border-sm-left {
        border-left: 1px solid var(--dark) !important;
    }
    .border-sm-x {
        border-left: 1px solid var(--dark) !important;
        border-right: 1px solid var(--dark) !important;
    }
    .border-sm-y {
        border-top: 1px solid var(--dark) !important;
        border-bottom: 1px solid var(--dark) !important;
    }
    .border-sm {
        border-top: 1px solid var(--dark) !important;
        border-bottom: 1px solid var(--dark) !important;
        border-left: 1px solid var(--dark) !important;
        border-right: 1px solid var(--dark) !important;
    }
}

@media(min-width:768px) {
    .border-md-top {
        border-top: 1px solid var(--dark) !important;
    }
    .border-md-right {
        border-right: 1px solid var(--dark) !important;
    }
    .border-md-bottom {
        border-bottom: 1px solid var(--dark) !important;
    }
    .border-md-left {
        border-left: 1px solid var(--dark) !important;
    }
    .border-md-x {
        border-left: 1px solid var(--dark) !important;
        border-right: 1px solid var(--dark) !important;
    }
    .border-md-y {
        border-top: 1px solid var(--dark) !important;
        border-bottom: 1px solid var(--dark) !important;
    }
    .border-md {
        border-top: 1px solid var(--dark) !important;
        border-bottom: 1px solid var(--dark) !important;
        border-left: 1px solid var(--dark) !important;
        border-right: 1px solid var(--dark) !important;
    }
}

@media(min-width:992px) {
    .border-lg-top {
        border-top: 1px solid var(--dark) !important;
    }
    .border-lg-right {
        border-right: 1px solid var(--dark) !important;
    }
    .border-lg-bottom {
        border-bottom: 1px solid var(--dark) !important;
    }
    .border-lg-left {
        border-left: 1px solid var(--dark) !important;
    }
    .border-lg-x {
        border-left: 1px solid var(--dark) !important;
        border-right: 1px solid var(--dark) !important;
    }
    .border-lg-y {
        border-top: 1px solid var(--dark) !important;
        border-bottom: 1px solid var(--dark) !important;
    }
    .border-lg {
        border-top: 1px solid var(--dark) !important;
        border-bottom: 1px solid var(--dark) !important;
        border-left: 1px solid var(--dark) !important;
        border-right: 1px solid var(--dark) !important;
    }
}

@media(min-width:1200px) {
    .border-xl-top {
        border-top: 1px solid var(--dark) !important;
    }
    .border-xl-right {
        border-right: 1px solid var(--dark) !important;
    }
    .border-xl-bottom {
        border-bottom: 1px solid var(--dark) !important;
    }
    .border-xl-left {
        border-left: 1px solid var(--dark) !important;
    }
    .border-xl-x {
        border-left: 1px solid var(--dark) !important;
        border-right: 1px solid var(--dark) !important;
    }
    .border-xl-y {
        border-top: 1px solid var(--dark) !important;
        border-bottom: 1px solid var(--dark) !important;
    }
    .border-xl {
        border-top: 1px solid var(--dark) !important;
        border-bottom: 1px solid var(--dark) !important;
        border-left: 1px solid var(--dark) !important;
        border-right: 1px solid var(--dark) !important;
    }
}

.user-items .category-selected .inventory-item, .user-characters .category-selected .character-item {
    background: hsla(var(--indigo-hue), var(--indigo-sat), var(--lit-800), 0.75);
}


/* TOOLTIP */

.item-hints .hint::before {
    background-color: var(--purple-400);
}

.item-hints .hint-dot {
    border: 1px solid var(--purple-400);
}

@-webkit-keyframes home_hero_item_hints_border {
    0%, 100% {
        border-color: var(--purple-400);
    }
    50% {
        border-color: var(--purple-400);
    }
}

@keyframes home_hero_item_hints_border {
    0%, 100% {
        border-color: var(--purple-400);
    }
    50% {
        border-color: var(--purple-400);
    }
}

.item-hints {
    display: inline-block;
}

.item-hints .hint-radius {
    background-color: hsla(var(--purple-hue), var(--purple-sat), var(--lit-300), 0.1);
    filter: drop-shadow(0 0 0.75rem var(--purple-100));
}

.item-hints .hint-content {
    background-color: var(--indigo-900);
    color: var(--indigo-200);
    filter: drop-shadow(0 0 10rem var(--purple-100));
}

.item-hints .hint-content::before {
    background-color: var(--purple-300);
}

.item-hints .hint-content::after {
    background-color: var(--purple-300);
}


/**
 * selectize.dark.css (v0.11.2) - Dark Theme
 * Copyright (c) 2013 Brian Reavis & contributors
 *
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
 * file except in compliance with the License. You may obtain a copy of the License at:
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software distributed under
 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
 * ANY KIND, either express or implied. See the License for the specific language
 * governing permissions and limitations under the License.
 *
 * @author Brian Reavis <brian@thirdroute.com>
 * @author Damien "Mistic" Sorel <http://www.strangeplanet.fr>
 */

.selectize-control.plugin-drag_drop.multi>.selectize-input>div.ui-sortable-placeholder {
    background: var(--indigo-100) !important;
    background: rgba(0, 0, 0, 0.06) !important;
    -webkit-box-shadow: inset 0 0 12px 4px var(--white);
    box-shadow: inset 0 0 12px 4px var(--white);
}

.selectize-control.plugin-drag_drop .ui-sortable-helper {
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.selectize-dropdown-header {
    border-bottom: 1px solid var(--indigo-500);
    background: var(--dark);
}

.selectize-dropdown-header-close {
    color: var(--indigo-200);
}

.selectize-dropdown-header-close:hover {
    color: var(--indigo-200);
}

.selectize-dropdown.plugin-optgroup_columns .optgroup {
    border-right: 1px solid var(--indigo-100);
}

.selectize-dropdown.plugin-optgroup_columns .optgroup:last-child {
    border-right: 0 none;
}

.selectize-dropdown.plugin-optgroup_columns .optgroup-header {
    border-top: 0 none;
}

.selectize-control.plugin-remove_button [data-value] {
    padding-right: 24px !important;
}

.selectize-control.plugin-remove_button [data-value] .remove {
    border-left: 1px solid var(--blue-500);
}

.selectize-control.plugin-remove_button [data-value].active .remove {
    border-left-color: var(--blue-700);
}

.selectize-control.plugin-remove_button .disabled [data-value] .remove {
    border-left-color: var(--indigo-200);
}

.selectize-dropdown, .selectize-input, .selectize-input input {
    color: var(--indigo-200);
}

.selectize-input, .selectize-control.single .selectize-input.input-active {
    background: var(--indigo-900);
}

.selectize-input {
    border: 1px solid var(--indigo-500);
    padding: 8px 8px;
    width: 100%;
    overflow: hidden;
}

.selectize-input.full {
    background-color: var(--indigo-900);
}

.selectize-control.multi .selectize-input>div {
    background: var(--black);
    color: var(--white);
    border: 1px solid var(--indigo-900);
}

.selectize-control.multi .selectize-input>div.active {
    background: var(--indigo-700);
    color: var(--white);
    border: 1px solid var(--indigo-500);
}

.selectize-control.multi .selectize-input.disabled>div, .selectize-control.multi .selectize-input.disabled>div.active {
    color: var(--white);
    background: var(--indigo-300);
    border: 1px solid var(--indigo-200);
}

.selectize-input.dropdown-active::before {
    background: var(--indigo-500);
}

.selectize-dropdown {
    border: 1px solid var(--indigo-500);
    background: var(--indigo-900);
}

.selectize-dropdown [data-selectable] .highlight {
    background: rgba(125, 168, 208, 0.2);
}

.selectize-dropdown .optgroup-header {
    color: var(--indigo-200);
    background: var(--indigo-900);
}

.selectize-dropdown .active {
    background-color: var(--indigo-700);
    color: var(--indigo-200);
}

.selectize-dropdown .active.create {
    color: var(--indigo-200);
}

.selectize-dropdown .create {
    color: var(--indigo-400);
}

.selectize-control.single .selectize-input:after {
    border-color: var(--indigo-400) transparent transparent transparent;
}

.selectize-control.single .selectize-input.dropdown-active:after {
    border-color: transparent transparent var(--indigo-400) transparent;
}

.selectize-control .selectize-input.disabled {
    opacity: 0.5;
    background-color: var(--indigo-900);
}

.selectize-control.multi .selectize-input.disabled [data-value] {
    color: var(--indigo-600);
}

.selectize-control.multi .selectize-input.disabled [data-value], .selectize-control.multi .selectize-input.disabled [data-value] .remove {
    border-color: var(--indigo-500);
}

.selectize-control.multi .selectize-input [data-value] {
    background-color: var(--indigo-700);
}

.selectize-control.multi .selectize-input [data-value].active {
    background-color: var(--indigo-600);
}

.selectize-control.single .selectize-input {
    background-color: var(--dark);
}

.selectize-input.focus {
    background-color: var(--dark);
}

.selectize-dropdown .optgroup-header {
    padding-top: 7px;
    font-weight: bold;
}

.selectize-dropdown .optgroup::before {
    border-top: 1px solid var(--indigo-600);
}


/* TINYMCE DARK MODE by URI */

.tox .tox-tbtn svg {
    fill: var(--indigo-500) !important;
}

.tox-tbtn__select-label, .tox .tox-collection--list .tox-collection__item--active {
    color: var(--indigo-500) !important;
}

.tox .tox-tbtn:hover, .tox .tox-tbtn:focus, .tox .tox-tbtn:active, .tox .tox-collection--list .tox-collection__item--active {
    background-color: var(--indigo-800) !important;
}

.mce-content-body, .tox .tox-menu, .tox .tox-statusbar, .tox .tox-toolbar, .tox .tox-toolbar__overflow, .tox .tox-toolbar__primary {
    background: var(--dark) !important;
    color: var(--indigo-300) !important;
    border-color: var(--indigo-800) !important;
}

.tox-tinymce, .tox .tox-statusbar, .tox .tox-toolbar__group:not(:last-of-type), .tox .tox-edit-area {
    border-color: var(--indigo-700) !important;
}

.inventory-stack-name, .inventory-character-name {
    color: var(--light);
}


/* LOGS ******************************************************************************************/

.inflow {
    background-color: var(--primary) !important;
    color: var(--green-700) !important;
}

.outflow {
    background-color: var(--primary) !important;
    color: var(--pink-700) !important;
}

.lightbox .lb-image, .lb-outerContainer {
    background: #343536 !important;
    border-color: hsl(var(--indigo-hue), var(--indigo-sat), var(--lit-850)) !important;
}