:root {
    --orange:      #DC6B21;
    --orange-dark: #A24F18;
    --grey-700:    #2B2B2B;
}

html,
body {
    scrollbar-gutter: stable;
}

#footer {
    min-height: 60px;
}

.badge {
    --bs-badge-padding-y: 0.25em;
}

.btn-xs {
    --bs-btn-padding-y:     0.1rem;
    --bs-btn-padding-x:     0.2rem;
    --bs-btn-font-size:     0.75rem;
    --bs-btn-border-radius: var(--bs-border-radius-sm);
}

.btn-volunteer {
    --bs-btn-padding-y:     0.1rem;
    --bs-btn-padding-x:     0.5rem;
    --bs-btn-font-size:     0.875rem;
    --bs-btn-border-radius: var(--bs-border-radius-pill);
    display:                block;
}

.btn-labeled {
    padding-top:    0;
    padding-bottom: 0;
}

.btn-label {
    position:      relative;
    left:          -12px;
    display:       inline-block;
    padding:       6px 12px;
    background:    rgba(0, 0, 0, 0.15);
    border-radius: 3px 0 0 3px;
}

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

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

.btn-bmmc {
    --bs-btn-color:                 #FFFFFF;
    --bs-btn-bg:                    var(--orange);
    --bs-btn-border-color:          var(--orange);
    --bs-btn-hover-color:           #FFFFFF;
    --bs-btn-hover-bg:              var(--orange-dark);
    --bs-btn-hover-border-color:    var(--orange-dark);;
    --bs-btn-focus-shadow-rgb:      49, 132, 253;
    --bs-btn-active-color:          #FFFFFF;
    --bs-btn-active-bg:             var(--orange-dark);;
    --bs-btn-active-border-color:   var(--orange-dark);;
    --bs-btn-active-shadow:         inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color:        #FFFFFF;
    --bs-btn-disabled-bg:           var(--orange);
    --bs-btn-disabled-border-color: var(--orange);
}

.btn-group-xs > .btn {
    --bs-btn-padding-y:     0.1rem;
    --bs-btn-padding-x:     0.3rem;
    --bs-btn-font-size:     0.8rem;
    --bs-btn-border-radius: var(--bs-border-radius-sm);
}

.input-group-registrations {
    margin-top: 3px;
}

.dropdown-menu.show {
    min-width: 200px;
}

#header-member-info:hover {
    cursor: pointer;
}

input[type=text]:read-only,
input[readonly]:focus {
    outline:      1px solid #A12025;
    border-color: transparent;
    box-shadow:   none;
}

.modal-body input[type=text]:read-only,
.modal-body input[readonly]:focus {
    outline: none
}

.form-select-xs {
    padding-top:    0;
    padding-bottom: 0;
    padding-left:   .2rem;
    font-size:      .875rem;
}

#form-filter .col-form-label {
    font-size:   13px;
    line-height: 1;
}

.form-control:read-only {
    background-color: var(--bs-secondary-bg);
    opacity:          1;
}

.form-control::placeholder {
    opacity: .5;
}

label.radio-help {
    display:         inline-flex;
    justify-content: space-between;
    width:           100%;
}

.alert-up-next {
    /*--bs-link-color-rgb: var(--bd-callout-link);*/
    /*--bs-code-color:     var(--bd-callout-code-color);*/
    /*--bd-callout-color:  var(--bs-info-text-emphasis);*/
    /*--bd-callout-bg:     var(--bs-info-bg-subtle);*/
    /*padding:             1.25rem;*/
    /*margin-bottom:       1.25rem;*/
    /*color:               var(--bd-callout-color, inherit);*/
    /*background-color:    var(--bd-callout-bg, var(--bs-gray-100));*/
    --bd-callout-border:      var(--bs-info-border-subtle);
    --bs-alert-border-radius: 0;
    border-left:              0.25rem solid var(--bd-callout-border, var(--bs-gray-300));
}

#tableAccordionEvents {

    & .rowEvent:hover td {
        cursor: pointer;
    }

    /* Event row hover, unless expanded */

    & .rowEvent:hover:not([aria-expanded="true"]) td {
        color:              var(--orange);
        --bs-table-bg-type: var(--bs-table-striped-bg);
    }

    /* Set background and text colours when events are expanded */

    & .rowEvent[aria-expanded="true"] > td,
    & .rowEventDetail.collapse.show > td {
        --bs-table-color-type: var(--bs-table-striped-color);
        --bs-table-bg-type:    var(--bs-table-striped-bg);
    }

    .rowEvent a.btn-volunteer:hover {
        cursor:           pointer;
        color:            var(--bs-btn-hover-color);
        background-color: var(--bs-btn-hover-bg);
    }

}


#accordionEvents .row {
    min-height: 3em;
}

#accordionEvents .accordion-item {
    --bs-accordion-gutter-x: 1.5rem;
    margin-inline:           calc(-.5 * var(--bs-accordion-gutter-x));;
    padding-inline:          calc(.5 * var(--bs-accordion-gutter-x));;
}

#accordionEvents .accordion-item:nth-child(odd) {
    background-color: #F8F9FA;
}

#accordionEvents .accordion-item:nth-child(even) {
    background-color: #E9ECEF;
}

#accordionEvents .accordion-item:hover .accordion-header .col {
    color:  var(--orange);
    cursor: pointer;
}

#accordionEvents .accordion-item:hover .accordion-header a.btn-volunteer {
    cursor:           pointer;
    color:            var(--bs-btn-hover-color);
    background-color: var(--bs-btn-hover-bg);
}

#accordionEvents .accordion-item:has(.show) .accordion-header .col {
    color: var(--orange);
}

#accordionEvents .accordion-body {
    --bs-accordion-body-padding-x: 0;
}

/* Events actions column */
.col-actions {
    text-align: center;
}

.table-fixed {
    table-layout: fixed;
}

.link-email {
    display:       inline-block;
    overflow:      hidden;
    overflow-wrap: break-word;
    word-break:    break-all;
}

/* Motorsport UK Pathway Colours */
.pathway-on-track {
    background-color: #C7D5FC;
}

.pathway-off-track {
    background-color: #C8C9E9;
}

.pathway-rally {
    background-color: #FFFBCB;
}

.pathway-speed {
    background-color: #ECF6D1;
}

.pathway-kart {
    background-color: #FAD1BF;
}


.bootstrap-table .fixed-table-container .table tfoot th .th-inner,
.bootstrap-table .fixed-table-container .table thead th .th-inner {
    padding: .5rem !important;
}


.card {
    /*--bs-card-cap-bg: rgba(var(--bs-body-color-rgb), 0.3);*/
}

.accordion-body {
    background-color: #F9F9F9;
}

/* Dark Theme Options */
html[data-bs-theme="dark"] {

    #accordionEvents .accordion-item:nth-child(odd) {
        background-color: #292C32;
    }

    #accordionEvents .accordion-item:nth-child(even) {
        background-color: #343A40;
    }

    .accordion-body {
        background-color: #1B1B1B;
    }

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .columns-lg-3 {
        column-count: 3;
    }
}