:root {
    --lorcana-spelen-dark-blue:            #1C2536;
    --lorcana-spelen-dark-blue-rgb:        28, 37, 54;
    --lorcana-spelen-dark-blue-hover:      #232e43;
    --lorcana-spelen-dark-blue-active:     #151c29;

    --lorcana-spelen-light-blue:           #0989C3;
    --lorcana-spelen-light-blue-rgb:       9, 137, 195;
    --lorcana-spelen-light-blue-hover:     #2992ce;
    --lorcana-spelen-light-blue-hover-rgb: 41, 146, 206;
    --lorcana-spelen-light-blue-active:    #09729f;

    --lorcana-spelen-yellow:               #F4B21B;
    --lorcana-spelen-yellow-rgb:           244, 178, 27;
    --lorcana-spelen-yellow-hover:         #e0a817;
    --lorcana-spelen-yellow-active:        #c79e13;

    --lorcana-spelen-purple:               #82377C;
    --lorcana-spelen-purple-rgb:           130, 55, 124;
    --lorcana-spelen-purple-hover:         #71306b;
    --lorcana-spelen-purple-active:        #5e2a5f;

    --lorcana-spelen-green:                #2C8A42;
    --lorcana-spelen-green-rgb:            44, 138, 66;
    --lorcana-spelen-green-hover:          #25793b;
    --lorcana-spelen-green-active:         #1e6833;

    --lorcana-spelen-red:                  #D41F31;
    --lorcana-spelen-red-rgb:              212, 31, 49;
    --lorcana-spelen-red-hover:            #c01a2e;
    --lorcana-spelen-red-active:           #a7152a;

    --lorcana-spelen-grey:                 #9FA8B4;
    --lorcana-spelen-grey-rgb:             159, 168, 180;
    --lorcana-spelen-grey-hover:           #8c95a0;
    --lorcana-spelen-grey-active:          #79818c;

    --lorcana-spelen-light:                #F4F4F5;
    --lorcana-spelen-light-rgb:            244, 244, 245;
    --lorcana-spelen-light-hover:          #e6e6e7;
    --lorcana-spelen-light-active:         #d8d8d9;

    --lorcana-spelen-medium:               #A2A4AB;
    --lorcana-spelen-medium-rgb:           162, 164, 171;

    /* Overwrite Bootstrap variables. */
    --bs-primary:                          var(--lorcana-spelen-dark-blue);
    --bs-primary-rgb:                      var(--lorcana-spelen-dark-blue-rgb);
    --bs-secondary:                        var(--lorcana-spelen-light-blue);
    --bs-secondary-rgb:                    var(--lorcana-spelen-light-blue-rgb);
    --bs-success:                          var(--lorcana-spelen-green);
    --bs-success-rgb:                      var(--lorcana-spelen-green-rgb);
    --bs-danger:                           var(--lorcana-spelen-red);
    --bs-danger-rgb:                       var(--lorcana-spelen-red-rgb);
    --bs-warning:                          var(--lorcana-spelen-yellow);
    --bs-warning-rgb:                      var(--lorcana-spelen-yellow-rgb);
    --bs-info:                 var(--lorcana-spelen-light-blue);
    --bs-info-rgb:             var(--lorcana-spelen-light-blue-rgb);
    --bs-light:                var(--lorcana-spelen-light);
    --bs-light-rgb:            var(--lorcana-spelen-light-rgb);
    --bs-dark:                 var(--lorcana-spelen-dark-blue);
    --bs-dark-rgb:             var(--lorcana-spelen-dark-blue-rgb);

    --bs-link-color-rgb:       var(--lorcana-spelen-light-blue-rgb);
    --bs-link-hover-color-rgb: var(--lorcana-spelen-light-blue-hover-rgb);

    .card {
        --bs-card-title-spacer-y: 20px;
        box-shadow: 0 4px 15px 0 rgba(0, 0, 0, 0.1);
    }

    .table {
        --bs-table-bg:            var(--lorcana-spelen-dark-blue-hover);
        --bs-table-color-type:    var(--lorcana-spelen-light);
        --bs-table-color:         #ffffff;
        --bs-table-striped-bg:    var(--lorcana-spelen-dark-blue-active);
        --bs-table-striped-color: var(--lorcana-spelen-light);
        --bs-table-active-bg:     #000000;
        --bs-table-active-color:  #ffffff;
        --bs-table-hover-bg:      #2c3a54;
        --bs-table-hover-color:   #ffffff;
        --bs-table-border-color:  #000000;

        th {
            --bs-table-bg: #0f131c;
        }
    }

    .tooltip {
        --bs-tooltip-color: var(--lorcana-spelen-dark-blue);
        font-weight:        bold;
        --bs-tooltip-bg:    var(--lorcana-spelen-light);
        opacity:            1;
    }

    .dropdown-menu-dark {
        --bs-dropdown-header-color:   var(--lorcana-spelen-medium);
        --bs-dropdown-bg:             var(--lorcana-spelen-dark-blue-active);
        --bs-dropdown-link-active-bg:  #2c3a54;
        --bs-dropdown-divider-bg:     var(--lorcana-spelen-medium);
        z-index: 9999;
    }

    .form-check-input:checked {
        background-color: var(--lorcana-spelen-light-blue);
        border-color:     var(--lorcana-spelen-light-blue);
    }

    .form-text {
        color: var(--lorcana-spelen-medium);
    }

    .navbar-toggler {
        --bs-navbar-toggler-focus-width: 0.1rem;
    }

    .form-check-label {
        white-space: nowrap;
    }

    .breadcrumb-item {
        --bs-breadcrumb-divider-color: var(--lorcana-spelen-grey);
        --bs-breadcrumb-item-active-color: var(--lorcana-spelen-light);
    }

    .accordion {
        --bs-accordion-bg: rgba(35, 46, 67, 0.87);
        --bs-accordion-color: var(--lorcana-spelen-light);
        --bs-accordion-btn-color: var(--lorcana-spelen-light);
        --bs-accordion-border-color: #2c3a54;
        --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
        --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");

        --bs-accordion-active-bg: #2c3a54;
        --bs-accordion-active-color: var(--lorcana-spelen-light);
        --bs-accordion-btn-focus-box-shadow: none;
    }

    .accordion-button {
        font-size: 1rem;
        font-weight: bold;
    }
}

.alert-info {
    --bs-alert-color: #ffffff;
    --bs-alert-bg: #2c3a54;
    --bs-alert-border-color: --bs-card-border-color;
    --bs-alert-link-color: var(--lorcana-spelen-light-blue);
}

/* Buttons */
.btn-primary {
    --bs-btn-color:                 #ffffff;
    --bs-btn-bg:                    var(--lorcana-spelen-dark-blue);
    --bs-btn-border-color:          var(--lorcana-spelen-dark-blue);
    --bs-btn-hover-color:           #ffffff;
    --bs-btn-hover-bg:              var(--lorcana-spelen-dark-blue-hover);
    --bs-btn-hover-border-color:    var(--lorcana-spelen-dark-blue-hover);
    --bs-btn-focus-shadow-rgb:      49, 132, 253;
    --bs-btn-active-color:          #ffffff;
    --bs-btn-active-bg:             var(--lorcana-spelen-dark-blue-active);
    --bs-btn-active-border-color:   var(--lorcana-spelen-dark-blue-active);
    --bs-btn-active-shadow:         inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color:        #ffffff;
    --bs-btn-disabled-bg:           var(--lorcana-spelen-dark-blue);
    --bs-btn-disabled-border-color: var(--lorcana-spelen-dark-blue);
}

.btn-secondary {
    --bs-btn-color:                 #ffffff;
    --bs-btn-bg:                    var(--lorcana-spelen-light-blue);
    --bs-btn-border-color:          var(--lorcana-spelen-light-blue);
    --bs-btn-hover-color:           #ffffff;
    --bs-btn-hover-bg:              var(--lorcana-spelen-light-blue-hover);
    --bs-btn-hover-border-color:    var(--lorcana-spelen-light-blue-hover);
    --bs-btn-focus-shadow-rgb:      var(--lorcana-spelen-light-blue-rgb);
    --bs-btn-active-color:          #ffffff;
    --bs-btn-active-bg:             var(--lorcana-spelen-light-blue-active);
    --bs-btn-active-border-color:   var(--lorcana-spelen-light-blue-active);
    --bs-btn-active-shadow:         inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color:        #ffffff;
    --bs-btn-disabled-bg:           var(--lorcana-spelen-light-blue);
    --bs-btn-disabled-border-color: var(--lorcana-spelen-light-blue);
}

.btn-outline-secondary {
    --bs-btn-color: var(--lorcana-spelen-light-blue);;
    --bs-btn-border-color: var(--lorcana-spelen-light-blue);;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: var(--lorcana-spelen-light-blue);;
    --bs-btn-hover-border-color: var(--lorcana-spelen-light-blue);;
    --bs-btn-focus-shadow-rgb: var(--lorcana-spelen-light-blue-rgb);
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: var(--lorcana-spelen-light-blue);;
    --bs-btn-active-border-color: var(--lorcana-spelen-light-blue);;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--lorcana-spelen-light-blue);;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--lorcana-spelen-light-blue);;
    --bs-gradient: none;
}

.btn-danger {
    --bs-btn-color:                 #ffffff;
    --bs-btn-bg:                    var(--lorcana-spelen-red);
    --bs-btn-border-color:          var(--lorcana-spelen-red);
    --bs-btn-hover-color:           #ffffff;
    --bs-btn-hover-bg:              var(--lorcana-spelen-red-hover);
    --bs-btn-hover-border-color:    var(--lorcana-spelen-red-hover);
    --bs-btn-focus-shadow-rgb:      var(--lorcana-spelen-red-rgb);
    --bs-btn-active-color:          #ffffff;
    --bs-btn-active-bg:             var(--lorcana-spelen-red-active);
    --bs-btn-active-border-color:   var(--lorcana-spelen-red-active);
    --bs-btn-active-shadow:         inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color:        #ffffff;
    --bs-btn-disabled-bg:           var(--lorcana-spelen-red);
    --bs-btn-disabled-border-color: var(--lorcana-spelen-red);
}

.btn-success {
    --bs-btn-color:                 #ffffff;
    --bs-btn-bg:                    var(--bs-success);
    --bs-btn-border-color:          var(--bs-success);
    --bs-btn-hover-color:           #ffffff;
    --bs-btn-hover-bg:              #358c3e;
    --bs-btn-hover-border-color:    #2c7435;
    --bs-btn-focus-shadow-rgb:      60, 118, 61;
    --bs-btn-active-color:          #ffffff;
    --bs-btn-active-bg:             #2c7435;
    --bs-btn-active-border-color:   #275d2e;
    --bs-btn-active-shadow:         inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color:        #ffffff;
    --bs-btn-disabled-bg:           var(--bs-success);
    --bs-btn-disabled-border-color: var(--bs-success);
}

.btn-warning {
    --bs-btn-color:                 #000000;
    --bs-btn-bg:                    var(--lorcana-spelen-yellow);
    --bs-btn-border-color:          var(--lorcana-spelen-yellow);
    --bs-btn-hover-color:           #000000;
    --bs-btn-hover-bg:              var(--lorcana-spelen-yellow-hover);
    --bs-btn-hover-border-color:    var(--lorcana-spelen-yellow-hover);
    --bs-btn-focus-shadow-rgb:      var(--lorcana-spelen-yellow-rgb);
    --bs-btn-active-color:          #000000;
    --bs-btn-active-bg:             var(--lorcana-spelen-yellow-active);
    --bs-btn-active-border-color:   var(--lorcana-spelen-yellow-active);
    --bs-btn-active-shadow:         inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color:        #000000;
    --bs-btn-disabled-bg:           var(--lorcana-spelen-yellow);
    --bs-btn-disabled-border-color: var(--lorcana-spelen-yellow);
}

.btn-info {
    --bs-btn-color:                 #ffffff;
    --bs-btn-bg:                    var(--lorcana-spelen-light-blue);
    --bs-btn-border-color:          var(--lorcana-spelen-light-blue);
    --bs-btn-hover-color:           #ffffff;
    --bs-btn-hover-bg:              var(--lorcana-spelen-light-blue-hover);
    --bs-btn-hover-border-color:    var(--lorcana-spelen-light-blue-hover);
    --bs-btn-focus-shadow-rgb:      var(--lorcana-spelen-light-blue-rgb);
    --bs-btn-active-color:          #ffffff;
    --bs-btn-active-bg:             var(--lorcana-spelen-light-blue-active);
    --bs-btn-active-border-color:   var(--lorcana-spelen-light-blue-active);
    --bs-btn-active-shadow:         inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color:        #ffffff;
    --bs-btn-disabled-bg:           var(--lorcana-spelen-light-blue);
    --bs-btn-disabled-border-color: var(--lorcana-spelen-light-blue);
}

.btn-light {
    --bs-btn-color:                 #000000;
    --bs-btn-bg:                    var(--lorcana-spelen-light);
    --bs-btn-border-color:          var(--lorcana-spelen-light);
    --bs-btn-hover-color:           #000000;
    --bs-btn-hover-bg:              var(--lorcana-spelen-light-hover);
    --bs-btn-hover-border-color:    var(--lorcana-spelen-light-hover);
    --bs-btn-focus-shadow-rgb:      var(--lorcana-spelen-light-rgb);
    --bs-btn-active-color:          #000000;
    --bs-btn-active-bg:             var(--lorcana-spelen-light-active);
    --bs-btn-active-border-color:   var(--lorcana-spelen-light-active);
    --bs-btn-active-shadow:         inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color:        #000000;
    --bs-btn-disabled-bg:           var(--lorcana-spelen-light);
    --bs-btn-disabled-border-color: var(--lorcana-spelen-light);
}

.btn-dark {
    --bs-btn-color:                 #ffffff;
    --bs-btn-bg:                    var(--lorcana-spelen-dark-blue);
    --bs-btn-border-color:          var(--lorcana-spelen-dark-blue);
    --bs-btn-hover-color:           #ffffff;
    --bs-btn-hover-bg:              var(--lorcana-spelen-dark-blue-hover);
    --bs-btn-hover-border-color:    var(--lorcana-spelen-dark-blue-hover);
    --bs-btn-focus-shadow-rgb:      var(--lorcana-spelen-dark-blue-rgb);
    --bs-btn-active-color:          #ffffff;
    --bs-btn-active-bg:             var(--lorcana-spelen-dark-blue-active);
    --bs-btn-active-border-color:   var(--lorcana-spelen-dark-blue-active);
    --bs-btn-active-shadow:         inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color:        #ffffff;
    --bs-btn-disabled-bg:           var(--lorcana-spelen-dark-blue);
    --bs-btn-disabled-border-color: var(--lorcana-spelen-dark-blue);
}

.pagination {
    --bs-pagination-color:               #000000;
    --bs-pagination-bg:                  var(--lorcana-spelen-light);
    --bs-pagination-active-color:        #ffffff;
    --bs-pagination-active-bg:           var(--lorcana-spelen-dark-blue);
    --bs-pagination-active-border-color: var(--lorcana-spelen-dark-blue);
}
