/* Copyright Notice
 * bs-darkmode v1.2.0
 * https://palcarazm.github.io/bs-darkmode
 * @author 2022 Pablo Alcaraz Martínez (https://github.com/palcarazm)
 * @funding GitHub Sponsors
 * @see https://github.com/sponsors/palcarazm
 * @license MIT
 * @see https://github.com/palcarazm/bs-darkmode/blob/master/LICENSE
 */

.bs-darkmode-light {
    --blue: #0d6efd;
    --indigo: #6610f2;
    --purple: #7354ad;
    --pink: #d63384;
    --red: #dc3545;
    --orange: #fd7e14;
    --yellow: #ffc107;
    --green: #198754;
    --teal: #20c997;
    --cyan: #0dcaf0;
    --black: #000;
    --black-rgb: 0, 0, 0;
    --white: #fff;
    --white-rgb: 255, 255, 255;
    --black-h: 0;
    --black-s: 0%;
    --black-l: 0%;
    --white-h: 0;
    --white-s: 0%;
    --white-l: 100%;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --gray-100: #f8f9fa;
    --gray-200: #e9ecef;
    --gray-300: #dee2e6;
    --gray-400: #ced4da;
    --gray-500: #adb5bd;
    --gray-600: #6c757d;
    --gray-700: #495057;
    --gray-800: #343a40;
    --gray-900: #212529;
    --body-color: #404856;
    --body-bg: #e5e6e6;
    --primary: #0d6efd;
    --secondary: #6c757d;
    --success: #198754;
    --info: #f40d6d;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #f8f9fa;
    --dark: #212529;
    --primary-rgb: 13, 110, 253;
    --secondary-rgb: 108, 117, 125;
    --success-rgb: 25, 135, 84;
    --info-rgb: 13, 202, 240;
    --warning-rgb: 255, 193, 7;
    --danger-rgb: 220, 53, 69;
    --light-rgb: 248, 249, 250;
    --dark-rgb: 33, 37, 41;
    --primary-h: 216;
    --primary-s: 98%;
    --primary-l: 52%;
    --secondary-h: 208;
    --secondary-s: 7%;
    --secondary-l: 46%;
    --success-h: 152;
    --success-s: 69%;
    --success-l: 31%;
    --info-h: 190;
    --info-s: 90%;
    --info-l: 50%;
    --warning-h: 45;
    --warning-s: 100%;
    --warning-l: 51%;
    --danger-h: 354;
    --danger-s: 70%;
    --danger-l: 54%;
    --light-h: 210;
    --light-s: 17%;
    --light-l: 98%;
    --dark-h: 210;
    --dark-s: 11%;
    --dark-l: 15%
}

.bs-darkmode-dark {
    --blue: #3f6791;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #e83e8c;
    --red: #e74c3c;
    --orange: #fd7e14;
    --yellow: #f39c12;
    --green: #00bc8c;
    --teal: #20c997;
    --cyan: #3498db;
    --black: #fff;
    --white: #000;
    --black-rgb: 255, 255, 255;
    --white-rgb: 0, 0, 0;
    --black-h: 0;
    --black-s: 0%;
    --black-l: 100%;
    --white-h: 0;
    --white-s: 0%;
    --white-l: 0%;
    --gray: #ced4da;
    --gray-dark: #e9ecef;
    --gray-900: #f8f9fa;
    --gray-800: #e9ecef;
    --gray-700: #dee2e6;
    --gray-600: #ced4da;
    --gray-500: #adb5bd;
    --gray-400: #6c757d;
    --gray-300: #495057;
    --gray-200: #343a40;
    --gray-100: #212529;
    --body-color: #f8f9fa;
    --body-bg: #495057;
    --primary: #3f6791;
    --secondary: #ced4da;
    --success: #00bc8c;
    --info: #3498db;
    --warning: #f39c12;
    --danger: #e74c3c;
    --light: #212529;
    --dark: #f8f9fa;
    --primary-rgb: 63, 103, 145;
    --secondary-rgb: 206, 212, 218;
    --success-rgb: 0, 188, 140;
    --info-rgb: 52, 152, 219;
    --warning-rgb: 243, 156, 18;
    --danger-rgb: 231, 76, 60;
    --light-rgb: 33, 37, 41;
    --dark-rgb: 248, 249, 250;
    --primary-h: 211;
    --primary-s: 39%;
    --primary-l: 41%;
    --secondary-h: 210;
    --secondary-s: 14%;
    --secondary-l: 83%;
    --success-h: 165;
    --success-s: 100%;
    --success-l: 37%;
    --info-h: 204;
    --info-s: 70%;
    --info-l: 53%;
    --warning-h: 37;
    --warning-s: 90%;
    --warning-l: 51%;
    --danger-h: 6;
    --danger-s: 78%;
    --danger-l: 57%;
    --light-h: 210;
    --light-s: 11%;
    --light-l: 15%;
    --dark-h: 210;
    --dark-s: 17%;
    --dark-l: 98%
}

[class*=bs-darkmode-],
[class*=bs-darkmode-]>* {
    background-color: var(--body-bg);
    color: var(--body-color)
}

[class*=bs-darkmode-] a,
a[class*=bs-darkmode-] {
    color: var(--blue)
}

[class*=bs-darkmode-] a:not(.btn):not(.nav-link):not(.dropdown-item):not(.navbar-brand):not(.list-group-item-action):hover,
a[class*=bs-darkmode-]:not(.btn):not(.nav-link):not(.dropdown-item):not(.navbar-brand):hover {
    filter: brightness(.8)
}

[class*=bs-darkmode-] .text-primary,
[class*=bs-darkmode-].text-primary {
    color: var(--primary) !important
}

[class*=bs-darkmode-] .text-secondary,
[class*=bs-darkmode-].text-secondary {
    color: var(--secondary) !important
}

[class*=bs-darkmode-] .text-success,
[class*=bs-darkmode-].text-success {
    color: var(--success) !important
}

[class*=bs-darkmode-] .text-danger,
[class*=bs-darkmode-].text-danger {
    color: var(--danger) !important
}

[class*=bs-darkmode-] .text-warning,
[class*=bs-darkmode-].text-warning {
    color: var(--warning) !important
}

[class*=bs-darkmode-] .text-info,
[class*=bs-darkmode-].text-info {
    color: var(--info) !important
}

[class*=bs-darkmode-] .text-light,
[class*=bs-darkmode-].text-light {
    color: var(--light) !important
}

[class*=bs-darkmode-] .text-dark,
[class*=bs-darkmode-].text-dark {
    color: var(--dark) !important
}

[class*=bs-darkmode-] .text-body,
[class*=bs-darkmode-].text-body {
    color: var(--body-color) !important
}

[class*=bs-darkmode-] .text-muted,
[class*=bs-darkmode-].text-muted {
    color: var(--gray) !important
}

[class*=bs-darkmode-] .text-white,
[class*=bs-darkmode-].text-white {
    color: var(--white) !important
}

[class*=bs-darkmode-] .text-black-50,
[class*=bs-darkmode-].text-black-50 {
    color: rgba(var(--black-rgb), .5) !important
}

[class*=bs-darkmode-] .text-white-50,
[class*=bs-darkmode-].text-white-50 {
    color: rgba(var(--white-rgb), .5) !important
}

[class*=bs-darkmode-] .bg-primary,
[class*=bs-darkmode-].bg-primary {
    background-color: var(--primary) !important
}

[class*=bs-darkmode-] .bg-secondary,
[class*=bs-darkmode-].bg-secondary {
    background-color: var(--secondary) !important
}

[class*=bs-darkmode-] .bg-success,
[class*=bs-darkmode-].bg-success {
    background-color: var(--success) !important
}

[class*=bs-darkmode-] .bg-danger,
[class*=bs-darkmode-].bg-danger {
    background-color: var(--danger) !important
}

[class*=bs-darkmode-] .bg-warning,
[class*=bs-darkmode-].bg-warning {
    background-color: var(--warning) !important
}

[class*=bs-darkmode-] .bg-info,
[class*=bs-darkmode-].bg-info {
    background-color: var(--info) !important
}

[class*=bs-darkmode-] .bg-light,
[class*=bs-darkmode-].bg-light {
    background-color: var(--light) !important
}

[class*=bs-darkmode-] .bg-dark,
[class*=bs-darkmode-].bg-dark {
    background-color: var(--dark) !important
}

[class*=bs-darkmode-] .bg-white,
[class*=bs-darkmode-].bg-white {
    background-color: var(--white) !important
}

[class*=bs-darkmode-] .border-primary,
[class*=bs-darkmode-].border-primary {
    border-color: var(--primary) !important
}

[class*=bs-darkmode-] .border-secondary,
[class*=bs-darkmode-].border-secondary {
    border-color: var(--secondary) !important
}

[class*=bs-darkmode-] .border-success,
[class*=bs-darkmode-].border-success {
    border-color: var(--success) !important
}

[class*=bs-darkmode-] .border-danger,
[class*=bs-darkmode-].border-danger {
    border-color: var(--danger) !important
}

[class*=bs-darkmode-] .border-warning,
[class*=bs-darkmode-].border-warning {
    border-color: var(--warning) !important
}

[class*=bs-darkmode-] .border-info,
[class*=bs-darkmode-].border-info {
    border-color: var(--info) !important
}

[class*=bs-darkmode-] .border-light,
[class*=bs-darkmode-].border-light {
    border-color: var(--light) !important
}

[class*=bs-darkmode-] .border-dark,
[class*=bs-darkmode-].border-dark {
    border-color: var(--dark) !important
}

[class*=bs-darkmode-] .border-white,
[class*=bs-darkmode-].border-white {
    border-color: var(--white) !important
}

[class*=bs-darkmode-] .badge-primary,
[class*=bs-darkmode-].badge-primary {
    background-color: var(--primary);
    color: var(--white)
}

[class*=bs-darkmode-] .badge-secondary,
[class*=bs-darkmode-].badge-secondary {
    background-color: var(--secondary);
    color: var(--white)
}

[class*=bs-darkmode-] .badge-success,
[class*=bs-darkmode-].badge-success {
    background-color: var(--success);
    color: var(--white)
}

[class*=bs-darkmode-] .badge-danger,
[class*=bs-darkmode-].badge-danger {
    background-color: var(--danger);
    color: var(--white)
}

[class*=bs-darkmode-] .badge-warning,
[class*=bs-darkmode-].badge-warning {
    background-color: var(--warning);
    color: var(--body-color)
}

[class*=bs-darkmode-] .badge-info,
[class*=bs-darkmode-].badge-info {
    background-color: var(--info);
    color: var(--white)
}



[class*=bs-darkmode-] .badge-dark,
[class*=bs-darkmode-].badge-dark {
    background-color: var(--dark);
    color: var(--white)
}

[class*=bs-darkmode-] .btn,
[class*=bs-darkmode-].btn {
    --btn-bg: var(--purple); 
    --btn-border: transparent;
    --btn-theme-h: 216;
    --btn-theme-s: 98%;
    --btn-theme-l: 52%;
    --btn-theme-a: 0;
    --btn-color: var(--body-color);
    --btn-border-darkness: .8;
    --btn-bg-darkness: .85;
    background-color: var(--btn-bg);
    border-color: var(--btn-border);
    color: var(--light)
}

[class*=bs-darkmode-] .btn:focus,
[class*=bs-darkmode-].btn:focus {
    box-shadow: 0 0 0 .25rem hsla(var(--btn-theme-h), var(--btn-theme-s), calc(var(--btn-theme-l)*var(--btn-border-darkness)), .5)
}

[class*=bs-darkmode-] .btn:focus,
[class*=bs-darkmode-] .btn:hover,
[class*=bs-darkmode-].btn:focus,
[class*=bs-darkmode-].btn:hover {
    background-color: var(--indigo);
}

[class*=bs-darkmode-] [class*=' btn-outline-']:focus,
[class*=bs-darkmode-] [class*=' btn-outline-']:hover,
[class*=bs-darkmode-] [class^=btn-outline-]:focus,
[class*=bs-darkmode-] [class^=btn-outline-]:hover,
[class*=bs-darkmode-][class*=' btn-outline-']:focus,
[class*=bs-darkmode-][class*=' btn-outline-']:hover {
    --btn-hover-color: var(--white);
    color: var(--btn-hover-color)
}

[class*=bs-darkmode-] .btn-primary,
[class*=bs-darkmode-].btn-primary {
    --btn-bg: var(--primary);
    --btn-border: var(--primary);
    --btn-color: var(--white);
    --btn-theme-h: var(--primary-h);
    --btn-theme-s: var(--primary-s);
    --btn-theme-l: var(--primary-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-secondary,
[class*=bs-darkmode-].btn-secondary {
    --btn-bg: var(--secondary);
    --btn-border: var(--secondary);
    --btn-color: var(--white);
    --btn-theme-h: var(--secondary-h);
    --btn-theme-s: var(--secondary-s);
    --btn-theme-l: var(--secondary-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-success,
[class*=bs-darkmode-].btn-success {
    --btn-bg: var(--success);
    --btn-border: var(--success);
    --btn-color: var(--white);
    --btn-theme-h: var(--success-h);
    --btn-theme-s: var(--success-s);
    --btn-theme-l: var(--success-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-danger,
[class*=bs-darkmode-].btn-danger {
    --btn-bg: var(--danger);
    --btn-border: var(--danger);
    --btn-color: var(--white);
    --btn-theme-h: var(--danger-h);
    --btn-theme-s: var(--danger-s);
    --btn-theme-l: var(--danger-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-warning,
[class*=bs-darkmode-].btn-warning {
   /* --btn-bg: var(var(--warning)); */
    --btn-border: var(--warning);
    --btn-color: var(--body-color);
    --btn-theme-h: var(--warning-h);
    --btn-theme-s: var(--warning-s);
    --btn-theme-l: var(--warning-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-info,
[class*=bs-darkmode-].btn-info {
    --btn-bg: var(--info);
    --btn-border: var(--info);
    --btn-color: var(--white);
    --btn-theme-h: var(--info-h);
    --btn-theme-s: var(--info-s);
    --btn-theme-l: var(--info-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-light,
[class*=bs-darkmode-].btn-light {
    --btn-bg: var(--light);
    --btn-border: var(--light);
    --btn-color: var(--body-color);
    --btn-theme-h: var(--light-h);
    --btn-theme-s: var(--light-s);
    --btn-theme-l: var(--light-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-dark,
[class*=bs-darkmode-].btn-dark {
    --btn-bg: var(--dark);
    --btn-border: var(--dark);
    --btn-color: var(--white);
    --btn-theme-h: var(--dark-h);
    --btn-theme-s: var(--dark-s);
    --btn-theme-l: var(--dark-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-link,
[class*=bs-darkmode-].btn-link {
    --btn-color: var(--blue)
}

[class*=bs-darkmode-] .btn-outline-primary,
[class*=bs-darkmode-].btn-outline-primary {
   /* --btn-border: var(--purple); */
   /* --btn-color: var(--purple); */
    --btn-hover-color: var(--white);
    --btn-theme-h: var(--primary-h);
    --btn-theme-s: var(--primary-s);
    --btn-theme-l: var(--primary-l);
    --btn-theme-a: 1
    
}

[class*=bs-darkmode-] .btn-outline-secondary,
[class*=bs-darkmode-].btn-outline-secondary {
    --btn-border: var(--secondary);
    --btn-color: var(--secondary);
    --btn-hover-color: var(--white);
    --btn-theme-h: var(--secondary-h);
    --btn-theme-s: var(--secondary-s);
    --btn-theme-l: var(--secondary-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-outline-success,
[class*=bs-darkmode-].btn-outline-success {
    --btn-border: var(--success);
    --btn-color: var(--success);
    --btn-hover-color: var(--white);
    --btn-theme-h: var(--success-h);
    --btn-theme-s: var(--success-s);
    --btn-theme-l: var(--success-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-outline-danger,
[class*=bs-darkmode-].btn-outline-danger {
    --btn-border: var(--danger);
    --btn-color: var(--danger);
    --btn-hover-color: var(--white);
    --btn-theme-h: var(--danger-h);
    --btn-theme-s: var(--danger-s);
    --btn-theme-l: var(--danger-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-outline-warning,
[class*=bs-darkmode-].btn-outline-warning {
    --btn-border: var(--warning);
    --btn-color: var(--warning);
    --btn-hover-color: var(--body-color);
    --btn-theme-h: var(--warning-h);
    --btn-theme-s: var(--warning-s);
    --btn-theme-l: var(--warning-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-outline-info,
[class*=bs-darkmode-].btn-outline-info {
    --btn-border: var(--info);
    --btn-color: var(--info);
    --btn-hover-color: var(--white);
    --btn-theme-h: var(--info-h);
    --btn-theme-s: var(--info-s);
    --btn-theme-l: var(--info-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-outline-light,
[class*=bs-darkmode-].btn-outline-light {
    --btn-border: var(--light);
    --btn-color: var(--light);
    --btn-hover-color: var(--body-color);
    --btn-theme-h: var(--light-h);
    --btn-theme-s: var(--light-s);
    --btn-theme-l: var(--light-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .btn-outline-dark,
[class*=bs-darkmode-].btn-outline-dark {
    --btn-border: var(--dark);
    --btn-color: var(--dark);
    --btn-hover-color: var(--white);
    --btn-theme-h: var(--dark-h);
    --btn-theme-s: var(--dark-s);
    --btn-theme-l: var(--dark-l);
    --btn-theme-a: 1
}

[class*=bs-darkmode-] .progress-bar,
[class*=bs-darkmode-].progress-bar {
    background-color: var(--primary)
}

[class*=bs-darkmode-] .alert,
[class*=bs-darkmode-].alert {
    --alert-theme-h: 216;
    --alert-theme-s: 98%;
    --alert-theme-l: 52%;
    --alert-theme-a: 0;
    --alert-border-darkness: 1.5;
    --alert-border-saturation: 1;
    --alert-bg-darkness: 1.75;
    --alert-bg-saturation: 1;
    --alert-color-darkness: .6;
    --alert-color-saturation: .9;
    background-color: hsla(var(--alert-theme-h), calc(var(--alert-theme-s)*var(--alert-bg-saturation)), calc(var(--alert-theme-l)*var(--alert-bg-darkness)), var(--alert-theme-a));
    border-color: hsla(var(--alert-theme-h), calc(var(--alert-theme-s)*var(--alert-border-saturation)), calc(var(--alert-theme-l)*var(--alert-border-darkness)), var(--alert-theme-a));
    color: hsla(var(--alert-theme-h), calc(var(--alert-theme-s)*var(--alert-color-saturation)), calc(var(--alert-theme-l)*var(--alert-color-darkness)), var(--alert-theme-a))
}

[class*=bs-darkmode-] .alert-primary,
[class*=bs-darkmode-].alert-primary {
    --alert-theme-h: var(--primary-h);
    --alert-theme-s: var(--primary-s);
    --alert-theme-l: var(--primary-l);
    --alert-theme-a: 1
}

[class*=bs-darkmode-] .alert-secondary,
[class*=bs-darkmode-].alert-secondary {
    --alert-theme-h: var(--secondary-h);
    --alert-theme-s: var(--secondary-s);
    --alert-theme-l: var(--secondary-l);
    --alert-theme-a: 1
}

[class*=bs-darkmode-] .alert-success,
[class*=bs-darkmode-].alert-success {
    --alert-theme-h: var(--success-h);
    --alert-theme-s: var(--success-s);
    --alert-theme-l: var(--success-l);
    --alert-theme-a: 1
}

[class*=bs-darkmode-] .alert-danger,
[class*=bs-darkmode-].alert-danger {
    --alert-theme-h: var(--danger-h);
    --alert-theme-s: var(--danger-s);
    --alert-theme-l: var(--danger-l);
    --alert-theme-a: 1
}

[class*=bs-darkmode-] .alert-warning,
[class*=bs-darkmode-].alert-warning {
    --alert-theme-h: var(--warning-h);
    --alert-theme-s: var(--warning-s);
    --alert-theme-l: var(--warning-l);
    --alert-theme-a: 1
}

[class*=bs-darkmode-] .alert-info,
[class*=bs-darkmode-].alert-info {
    --alert-theme-h: var(--info-h);
    --alert-theme-s: var(--info-s);
    --alert-theme-l: var(--info-l);
    --alert-theme-a: 1
}

[class*=bs-darkmode-] .alert-light,
[class*=bs-darkmode-].alert-light {
    --alert-theme-h: var(--light-h);
    --alert-theme-s: var(--light-s);
    --alert-theme-l: var(--light-l);
    --alert-theme-a: 1;
    --alert-border-darkness: 5;
    --alert-border-saturation: .2;
    --alert-bg-darkness: 5.5;
    --alert-bg-saturation: .1
}

[class*=bs-darkmode-] .alert-dark,
[class*=bs-darkmode-].alert-dark {
    --alert-theme-h: var(--dark-h);
    --alert-theme-s: var(--dark-s);
    --alert-theme-l: var(--dark-l);
    --alert-theme-a: 1;
    --alert-border-darkness: 5;
    --alert-border-saturation: .2;
    --alert-bg-darkness: 5.5;
    --alert-bg-saturation: .1
}

[class*=bs-darkmode-] .jumbotron,
[class*=bs-darkmode-].jumbotron {
    background-color: var(--gray-200)
}

[class*=bs-darkmode-] .card,
[class*=bs-darkmode-].card {
    background-color: var(--gray-300);
    border-color: rgba(var(--black-rgb), .125)
}

[class*=bs-darkmode-] .card-footer,
[class*=bs-darkmode-] .card-header,
[class*=bs-darkmode-].card-footer,
[class*=bs-darkmode-].card-header {
  /*  background-color: rgba(var(--black-rgb), .03); */
    border-color: rgba(var(--black-rgb), .125)
}

[class*=bs-darkmode-] .table,
[class*=bs-darkmode-].table {
    color: var(--body-color)
}

[class*=bs-darkmode-] .table td,
[class*=bs-darkmode-] .table th,
[class*=bs-darkmode-].table td,
[class*=bs-darkmode-].table th {
    border-color: var(--gray-200)
}

[class*=bs-darkmode-] .table-striped tbody tr:nth-of-type(odd),
[class*=bs-darkmode-].table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(var(--black-rgb), .05)
}

[class*=bs-darkmode-] .custom-file-label,
[class*=bs-darkmode-] .custom-select,
[class*=bs-darkmode-] .form-control {
    color: var(--gray-200);
    border-color: var(--gray-400);
    background-color: var(--gray-800)
}

[class*=bs-darkmode-] .form-control:disabled,
[class*=bs-darkmode-] .form-control[readonly] {
    background-color: var(--gray-200)
}

[class*=bs-darkmode-] .form-control-plaintext {
    color: var(--body-color)
}

[class*=bs-darkmode-] .custom-control-input.is-valid~.custom-control-label::before,
[class*=bs-darkmode-] .custom-file-input.is-valid~.custom-file-label,
[class*=bs-darkmode-] .custom-select.is-valid,
[class*=bs-darkmode-] .form-control.is-valid,
[class*=bs-darkmode-] .was-validated .custom-control-input:valid~.custom-control-label::before,
[class*=bs-darkmode-] .was-validated .custom-file-input:valid~.custom-file-label,
[class*=bs-darkmode-] .was-validated .custom-select:valid,
[class*=bs-darkmode-] .was-validated .form-control:valid {
    border-color: var(--success)
}

[class*=bs-darkmode-] .valid-feedback {
    color: var(--success)
}

[class*=bs-darkmode-] .custom-control-input.is-invalid~.custom-control-label::before,
[class*=bs-darkmode-] .custom-file-input.is-invalid~.custom-file-label,
[class*=bs-darkmode-] .custom-select.is-invalid,
[class*=bs-darkmode-] .form-control.is-invalid,
[class*=bs-darkmode-] .was-validated .custom-control-input:invalid~.custom-control-label::before,
[class*=bs-darkmode-] .was-validated .custom-file-input:invalid~.custom-file-label,
[class*=bs-darkmode-] .was-validated .custom-select:invalid,
[class*=bs-darkmode-] .was-validated .form-control:invalid {
    border-color: var(--danger)
}

[class*=bs-darkmode-] .invalid-feedback {
    color: var(--danger)
}

[class*=bs-darkmode-] .custom-control-input:disabled~.custom-control-label::before,
[class*=bs-darkmode-] .custom-control-input[disabled]~.custom-control-label::before {
    background-color: var(--gray-200)
}

[class*=bs-darkmode-] .custom-control-input:disabled~.custom-control-label,
[class*=bs-darkmode-] .custom-control-input[disabled]~.custom-control-label {
    color: var(--gray)
}

.bs-darkmode-light .custom-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e")
}

.bs-darkmode-dark .custom-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23e9ecef' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e")
}

[class*=bs-darkmode-] .custom-file-label::after {
    color: var(--gray-700);
    background-color: var(--gray-200)
}

[class*=bs-darkmode-] .input-group-text {
    color: var(--gray-700);
    border-color: var(--gray-400);
    background-color: var(--gray-200)
}

[class*=bs-darkmode-] .breadcrumb,
[class*=bs-darkmode-].breadcrumb {
    background-color: var(--gray-200)
}

[class*=bs-darkmode-] .breadcrumb-item.active {
    color: var(--gray)
}

[class*=bs-darkmode-] .breadcrumb-item+.breadcrumb-item::before {
    color: var(--gray)
}

[class*=bs-darkmode-] .navbar-light .navbar-nav .nav-link {
    color: rgba(var(--black-rgb), .5)
}

[class*=bs-darkmode-] .navbar-light .navbar-nav .active>.nav-link,
[class*=bs-darkmode-] .navbar-light .navbar-nav .nav-link.active,
[class*=bs-darkmode-] .navbar-light .navbar-nav .nav-link.show,
[class*=bs-darkmode-] .navbar-light .navbar-nav .show>.nav-link {
    color: rgba(var(--black-rgb), .9)
}

[class*=bs-darkmode-] .navbar-light .navbar-text {
    color: rgba(var(--black-rgb), .5)
}

[class*=bs-darkmode-] .navbar-light .navbar-brand {
    color: rgba(var(--black-rgb), .9)
}

[class*=bs-darkmode-] .navbar-light .navbar-toggler {
    color: rgba(var(--black-rgb), .5);
    border-color: rgba(var(--black-rgb), .1)
}

.bs-darkmode-dark .navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.5%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}

[class*=bs-darkmode-] .navbar-dark .navbar-nav .nav-link {
    color: rgba(var(--white-rgb), .5)
}

[class*=bs-darkmode-] .navbar-dark .navbar-nav .active>.nav-link,
[class*=bs-darkmode-] .navbar-dark .navbar-nav .nav-link.active,
[class*=bs-darkmode-] .navbar-dark .navbar-nav .nav-link.show,
[class*=bs-darkmode-] .navbar-dark .navbar-nav .show>.nav-link {
    color: rgba(var(--white-rgb), .9)
}

[class*=bs-darkmode-] .navbar-dark .navbar-text {
    color: rgba(var(--white-rgb), .5)
}

[class*=bs-darkmode-] .navbar-dark .navbar-brand {
    color: rgba(var(--white-rgb), .9)
}

[class*=bs-darkmode-] .navbar-dark .navbar-toggler {
    color: rgba(var(--white-rgb), .5);
    border-color: rgba(var(--white-rgb), .1)
}

.bs-darkmode-dark .navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.5%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}

[class*=bs-darkmode-] .nav-link:not(a) {
    color: var(--gray-dark)
}

[class*=bs-darkmode-] .nav-link.disabled {
    color: var(--gray)
}

[class*=bs-darkmode-] .dropdown-menu {
    color: var(--body-color);
    background-color: var(--body-bg)
}

[class*=bs-darkmode-] .dropdown-item {
    color: var(--body-color)
}

[class*=bs-darkmode-] .dropdown-divider {
    border-color: var(--indigo)
}

[class*=bs-darkmode-] .dropdown-item:focus,
[class*=bs-darkmode-] .dropdown-item:hover {
    background-color: var(--gray-200)
}

[class*=bs-darkmode-] .dropdown-item.active,
[class*=bs-darkmode-] .dropdown-item:active {
    background-color: var(--primary);
    color: var(--white)
}

.bs-darkmode-light .nav-tabs {
    border-color: var(--gray-300)
}

.bs-darkmode-dark .nav-tabs {
    border-color: var(--gray-400)
}

[class*=bs-darkmode-] .nav-tabs .nav-item.show .nav-link,
[class*=bs-darkmode-] .nav-tabs .nav-link.active {
    color: var(--gray-700);
    background-color: var(--body-bg);
    border-color: var(--gray-300) var(--gray-300) var(--body-bg)
}

.bs-darkmode-light .nav-tabs .nav-item.show .nav-link,
.bs-darkmode-light .nav-tabs .nav-link.active {
    border-color: var(--gray-300) var(--gray-300) var(--body-bg)
}

.bs-darkmode-dark .nav-tabs .nav-item.show .nav-link,
.bs-darkmode-dark .nav-tabs .nav-link.active {
    border-color: var(--gray-400) var(--gray-400) var(--body-bg)
}

.bs-darkmode-light .nav-tabs .nav-link:focus,
.bs-darkmode-light .nav-tabs .nav-link:hover {
    border-color: var(--gray-200) var(--gray-200) var(--gray-300)
}

.bs-darkmode-dark .nav-tabs .nav-link:focus,
.bs-darkmode-dark .nav-tabs .nav-link:hover {
    border-color: var(--gray-500) var(--gray-500) var(--gray-400)
}

[class*=bs-darkmode-] .nav-pills .nav-link.active,
[class*=bs-darkmode-] .nav-pills .show>.nav-link {
    color: var(--white);
    background-color: var(--primary)
}

[class*=bs-darkmode-] .list-group-item {
    background-color: var(--body-bg);
    border-color: rgba(var(--black-rgb), .125)
}

[class*=bs-darkmode-] .list-group-item.active {
    color: var(--white);
    background-color: var(--primary);
    border-color: var(--primary)
}

[class*=bs-darkmode-] .list-group-item.disabled,
[class*=bs-darkmode-] .list-group-item:disabled {
    color: var(--gray)
}

[class*=bs-darkmode-] .list-group-item-action {
    color: var(--body-color)
}

[class*=bs-darkmode-] .list-group-item-action:not(.active):focus,
[class*=bs-darkmode-] .list-group-item-action:not(.active):hover {
    color: var(--gray-dark);
    background-color: var(--gray-100)
}

.bs-darkmode-light .list-group-item[class*='list-group-item-action list-group-item-'],
.bs-darkmode-light .list-group-item[class*=list-group-item-]:not(.list-group-item-action) {
    --list-bg-darkness: 1.75;
    --list-bg-saturation: 1;
    --list-color-darkness: .6;
    --list-color-saturation: .9
}

.bs-darkmode-dark .list-group-item[class*='list-group-item-action list-group-item-'],
.bs-darkmode-dark .list-group-item[class*=list-group-item-]:not(.list-group-item-action) {
    --list-bg-darkness: .4;
    --list-bg-saturation: 1;
    --list-color-darkness: 1.4;
    --list-color-saturation: 1.1
}

[class*=bs-darkmode-] .list-group-item[class*='list-group-item-action list-group-item-'],
[class*=bs-darkmode-] .list-group-item[class*=list-group-item-]:not(.list-group-item-action) {
    --list-theme-a: 1;
    background-color: hsla(var(--list-theme-h), calc(var(--list-theme-s)*var(--list-bg-saturation)), calc(var(--list-theme-l)*var(--list-bg-darkness)), var(--list-theme-a));
    color: hsla(var(--list-theme-h), calc(var(--list-theme-s)*var(--list-color-saturation)), calc(var(--list-theme-l)*var(--list-color-darkness)), var(--list-theme-a))
}

[class*=bs-darkmode-] .list-group-item[class*='list-group-item-action list-group-item-']:not(.active):focus,
[class*=bs-darkmode-] .list-group-item[class*='list-group-item-action list-group-item-']:not(.active):hover {
    filter: brightness(.9);
    background-color: hsla(var(--list-theme-h), calc(var(--list-theme-s)*var(--list-bg-saturation)), calc(var(--list-theme-l)*var(--list-bg-darkness)), var(--list-theme-a));
    color: hsla(var(--list-theme-h), calc(var(--list-theme-s)*var(--list-color-saturation)), calc(var(--list-theme-l)*var(--list-color-darkness)), var(--list-theme-a))
}

.bs-darkmode-light .list-group-item-danger.active,
.bs-darkmode-light .list-group-item-dark.active,
.bs-darkmode-light .list-group-item-info.active,
.bs-darkmode-light .list-group-item-light.active,
.bs-darkmode-light .list-group-item-primary.active,
.bs-darkmode-light .list-group-item-secondary.active,
.bs-darkmode-light .list-group-item-success.active,
.bs-darkmode-light .list-group-item-warning.active {
    border-color: rgba(var(--black-rgb), .125);
    color: var(--white) !important;
    --list-bg-darkness: .5 !important;
    background-color: hsla(var(--list-theme-h), calc(var(--list-theme-s)*var(--list-bg-saturation)), calc(var(--list-theme-l)*var(--list-bg-darkness)), var(--list-theme-a))
}

.bs-darkmode-dark .list-group-item-danger.active,
.bs-darkmode-dark .list-group-item-dark.active,
.bs-darkmode-dark .list-group-item-info.active,
.bs-darkmode-dark .list-group-item-light.active,
.bs-darkmode-dark .list-group-item-primary.active,
.bs-darkmode-dark .list-group-item-secondary.active,
.bs-darkmode-dark .list-group-item-success.active,
.bs-darkmode-dark .list-group-item-warning.active {
    border-color: rgba(var(--black-rgb), .125);
    color: var(--black) !important;
    --list-bg-darkness: 1 !important;
    background-color: hsla(var(--list-theme-h), calc(var(--list-theme-s)*var(--list-bg-saturation)), calc(var(--list-theme-l)*var(--list-bg-darkness)), var(--list-theme-a))
}

[class*=bs-darkmode-] .list-group-item-primary {
    --list-theme-h: var(--primary-h);
    --list-theme-s: var(--primary-s);
    --list-theme-l: var(--primary-l)
}

[class*=bs-darkmode-] .list-group-item-secondary {
    --list-theme-h: var(--secondary-h);
    --list-theme-s: var(--secondary-s);
    --list-theme-l: var(--secondary-l)
}

[class*=bs-darkmode-] .list-group-item-success {
    --list-theme-h: var(--success-h);
    --list-theme-s: var(--success-s);
    --list-theme-l: var(--success-l)
}

[class*=bs-darkmode-] .list-group-item-danger {
    --list-theme-h: var(--danger-h);
    --list-theme-s: var(--danger-s);
    --list-theme-l: var(--danger-l)
}

[class*=bs-darkmode-] .list-group-item-warning {
    --list-theme-h: var(--warning-h);
    --list-theme-s: var(--warning-s);
    --list-theme-l: var(--warning-l)
}

[class*=bs-darkmode-] .list-group-item-info {
    --list-theme-h: var(--info-h);
    --list-theme-s: var(--info-s);
    --list-theme-l: var(--info-l)
}

[class*=bs-darkmode-] .list-group-item-light {
    --list-theme-h: var(--light-h);
    --list-theme-s: var(--light-s);
    --list-theme-l: var(--light-l)
}

[class*=bs-darkmode-] .list-group-item-dark {
    --list-theme-h: var(--dark-h);
    --list-theme-s: var(--dark-s);
    --list-theme-l: var(--dark-l)
}