.form-switch .form-check-input:checked {
    background-color: var(--bs-success); /* your color */
    border-color: var(--bs-success);
}



/*Text truncation fix*/
.table {
    table-layout: fixed;
}



td img {
    height: 100%;
    object-fit: scale-down;
    margin: 0;
    padding: 0;
}



table {
    border-collapse: collapse;
}



table.scores {
    border-collapse: separate;
    border-spacing: 1px; /* controls transparent gaps */
    background: transparent;
}

.scores td, .scores th {
    border-width:2px;
    border-radius: 0px;
    align-items: center;
    justify-content: center;
    padding: 0px 0px;
    text-align:center;
}


.border-helmet-red {
    border-color: var(--bs-red) !important;
}

.border-helmet-blue {
    border-color: var(--bs-blue) !important;
}

.border-helmet-white {
    border-color: #e6dbb9 !important;
}

.border-helmet-yellow {
    border-color: var(--bs-yellow) !important;
}



.scores .text-start,
.scores .text-end {
    padding: 0px 8px 0px 8px
}

.border-left {
    border-top-color: #404143 !important;
    border-bottom-color: #404143 !important;
    border-right-color: #404143 !important;
    border-left-width: 25px !important;
}


.score  {
    font-size: min(3vw, 28px);
}

.guest {
    background-color: #e3e3e3 !important;
}




body {
    background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url('../Content/images/background3.jpg');
    background-attachment: fixed;
    background-position: center;
    color: #bebebe;
}


.navbar {
    margin-bottom: 20px;
}

.card .table {
    margin-bottom:0px;
}


.card-header::after {
    content: "";
    position: absolute;
    left: 0; /* or center it, see below */
    width: 75%;
    border-bottom: 2px solid var(--bs-primary);
}



.table th.rotate {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    white-space: nowrap;
    overflow: visible;
    vertical-align: baseline;
}


.table-sm-width > :not(caption) > * > * {
    padding: 0.25rem;
}

.card {
    border: 1px solid #2d2d2d;
    border-radius: 5px;
    -webkit-box-shadow: 0px 0px 8px -2px var(--bs-primary);
    box-shadow: 0px 0px 8px -2px var(--bs-primary);
}


.navbar .dropdown-menu a:hover {
    color: var(--bs-dark) !important;
}

.shadow-img {
    position: relative; /* needed for pseudo-element positioning */
}

.shadow-img::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: inherit;
    background-repeat: no-repeat;
    background-size: auto 150%;
    background-position-y: center;
    filter: drop-shadow(0 0 1px rgba(255,255,255,1)) drop-shadow(0 0 4px rgba(255,255,255,0.8));
    pointer-events: none;
    z-index: 1;
}

.crop-middle {
    height: 200px; /* desired div height */
    overflow: hidden; /* hide the parts outside */
}

.crop-middle img {
    width: 300%;
    height: 100%; /* scale so middle third fills container */
    object-fit: cover; /* keep aspect ratio */
    object-position: center; /* center the middle third */
}



.crop {
    height: 200px;
    overflow: hidden;
    position: relative;
    background-color:whitesmoke;
}

    .crop img {
        width: 300px;
        height: 300px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%) rotate(10deg);
        transform-origin: center;
        filter: drop-shadow(5px 5px 0px rgba(0, 0, 0, 1)) drop-shadow(0px 0px 2px rgba(255, 255, 255, 1));
    }

.crop::after {
    content: "";
    position: absolute;
    bottom:0;
    right: 0;
    width: 75%;
    border-bottom: 1px solid var(--bs-primary);
}

.crop::before {
    content: "";
    position: absolute;
    width: 75%;
    border-bottom: 1px solid var(--bs-primary);
    z-index:2;
}




.table-sort thead th.sortable {
    cursor: pointer;
    background-position: right;
    background-repeat: no-repeat;
    padding-right: 30px;
}

.table-sort thead th.both {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpolygon points='8,3 4,7 12,7' fill='%23999999'/%3E%3Cpolygon points='4,9 12,9 8,13' fill='%23999999'/%3E%3C/svg%3E");
}

.table-sort thead th.asc {
    /*background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAZ0lEQVQ4y2NgGLKgquEuFxBPAGI2ahhWCsS/gDibUoO0gPgxEP8H4ttArEyuQYxAPBdqEAxPBImTY5gjEL9DM+wTENuQahAvEO9DMwiGdwAxOymGJQLxTyD+jgWDxCMZRsEoGAVoAADeemwtPcZI2wAAAABJRU5ErkJggg==');*/
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpolygon points='8,3 4,7 12,7' fill='%23999999' fill-opacity='0.2'/%3E%3Cpolygon points='4,9 12,9 8,13' fill='%23ce9233'/%3E%3C/svg%3E");
}

.table-sort thead th.desc {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpolygon points='8,3 4,7 12,7' fill='%23ce9233'/%3E%3Cpolygon points='4,9 12,9 8,13' fill='%23999999' fill-opacity='0.2'/%3E%3C/svg%3E");
}




.table-dark a:hover,
.navbar a:hover {
    color: var(--bs-light) !important;
    text-decoration: underline;
}


nav-link:has(.dropdown-item:hover) {
    color: red !important;
    text-decoration: underline;
}


.dropend:has(.dropdown-menu:hover) {
    background-color: #bdbdbd;
}