@font-face {
    font-family: 'C64_Pro';
    src: url('../fonts/c64/C64_Pro-STYLE.woff2') format('woff2'),
         url('../fonts/c64/C64_Pro-STYLE.woff') format('woff'),
         url('../fonts/c64/C64_Pro-STYLE.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'C64_Pro_Mono';
    src: url('../fonts/c64/C64_Pro_Mono-STYLE.woff2') format('woff2'),
         url('../fonts/c64/C64_Pro_Mono-STYLE.woff') format('woff'),
         url('../fonts/c64/C64_Pro_Mono-STYLE.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
            font-family: "Twemoji Country Flags";
            src: url("/v2/assets/fonts/TwemojiCountryFlags.woff2") format("woff2");
            unicode-range: U+1F1E6-1F1FF, U+1F3F4, U+E0062-E0063, U+E0065, U+E0067,
                U+E006C, U+E006E, U+E0073-E0074, U+E0077, U+E007F;     
            font-display: swap;
        }
        .toast {
    
    --bs-toast-bg: rgba(var(--bs-body-bg-rgb), 0.95);
    
        }
    .stylescore-app-mode .ss-mobile-topbar {
        display: none;
    }
    .stylescore-app-mode .ss-sidebar-toggle {
        display: none;
    }
    body.stylescore-app-mode{
        padding-top: 0px !important;
    }
.space-mono-regular {
  font-family: "Space Mono", monospace;
  font-weight: 400;
  font-style: normal;
}

.space-mono-bold {
  font-family: "Space Mono", monospace;
  font-weight: 700;
  font-style: normal;
}

.space-mono-regular-italic {
  font-family: "Space Mono", monospace;
  font-weight: 400;
  font-style: italic;
}

.space-mono-bold-italic {
  font-family: "Space Mono", monospace;
  font-weight: 700;
  font-style: italic;
}
label.form-label,  .label.form-labeltext-muted 
{}

.form-control-sm {
    min-height: calc(1.5em + .5rem + calc(var(--bs-border-width) * 2));
    padding: .25rem .5rem;
    font-size: .975rem;
    border-radius: var(--bs-border-radius-sm);
}
input::placeholder{
    color: #00000034 !important;
}
.z-top{
    z-index: 1047;
}
.btn{
        line-height: normal;
}
.btn-light, .btn-outline-light, .btn-outline-secondary, .btn-secondary {
    color: var(--bs-gray-600);
}
body {
    font-family: "Lexend", sans-serif, "Twemoji Country Flags";
    font-optical-sizing: auto;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: .5rem;
    font-family: "Unbounded", sans-serif;
    font-optical-sizing: auto;
    font-weight: 600;
    line-height: 1.2;
    color: var(--bs-heading-color);  
  font-optical-sizing: auto;
}
.h6, h6
{
    font-size: .88rem;
}
.digital-font {
    font-family: var(--font-digital);
}
/* Score Display */
.min-w-initial{min-width: initial !important;}
.score-display {
    min-width: 88px;
    text-align: center;
    font-weight: 400;
    font-size: 3.75rem;
    padding: 0.75rem 1rem;
    border-radius: 10px;
    background: #e7f1ff;
    border: 2px solid var(--bs-tertiary-color);
    color: var(--bs-dark);
    margin-bottom: 0.75rem;
    font-family: var(--font-digital);
    line-height: .7em;
    box-shadow: inset 2px 2px 0px 0px #00000057;
            white-space: nowrap;
}
.score-display.small {
    font-size: 1.5rem !important;
    padding: 0.5rem 0.75rem;
}
#targetTotalScore{
   
    font-size: 2rem !important;
    padding: 0.2rem 0.55rem;

}
.attempt-row td {
    padding: 3px;
}
.bg-ss-sidebar {
    background: var(--ss-sidebar-bg) !important;
}
.bg-ss-sidebar-dark {
    background: linear-gradient(180deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%) !important;
}
.bg-success-subtele {
    background-color: #5bb08436;
}
.ss-f-number {
    font-family: "Lexend", sans-serif;
    font-optical-sizing: auto;   
    font-size: clamp(1.1rem, 1.5rem + -2vw, 1.5rem) !important;
}
.badge {
   
    --bs-badge-color: initial;
        text-wrap: auto;
}
.badge.score_value {
    font-size: clamp(0.75rem, -0.1875rem + 2.5vw, 1.7rem) !important;
}
@media screen and (max-width: 992px) {
    .ss-f-number {
        font-size: clamp(1rem, 1rem + -1.5vw, 2rem) !important;
    }
}
.country-code, .country-flag{
    font-family: "Twemoji Country Flags", "Lexend", sans-serif;   
}

/* Darker scale background colors */
.scale-bg-6  { 
    background-color: hsla(0, 100%, 20%, 0.4) !important;
    color: white !important;
}
.scale-bg-10  { 
    background-color: hsla(30, 100%, 20%, 0.4) !important;
    color: white !important;
}
.scale-bg-3  { 
    background-color: hsla(60, 100%, 20%, 0.4) !important;
    color: white !important;
}
.scale-bg-4  { 
    background-color: hsla(90, 100%, 20%, 0.4) !important;
    color: white !important;
}
.scale-bg-5  { 
    background-color: hsla(120, 100%, 20%, 0.4) !important;
    color: white !important;
}
.scale-bg-7  { 
    background-color: hsla(150, 100%, 20%, 0.4) !important;
    color: white !important;
}
.scale-bg-1  { 
    background-color: hsla(180, 100%, 20%, 0.4) !important;
    color: white !important;
}
.scale-bg-8  { 
    background-color: hsla(210, 100%, 20%, 0.4) !important;
    color: white !important;
}
.scale-bg-9  { 
    background-color: hsla(240, 100%, 20%, 0.4) !important;
    color: white !important;
}
.scale-bg-2 { 
    background-color: hsla(270, 100%, 20%, 0.4) !important;
    color: white !important;
}
.scale-bg-11 { 
    background-color: hsla(300, 100%, 20%, 0.4) !important;
    color: white !important;
}
.scale-bg-12 { 
    background-color: hsla(330, 100%, 20%, 0.4) !important;
    color: white !important;
}

/* StyleScore Color Classes - Background + Text Color */
.ss-color-1 {
    background-color: hsl(180, 100%, 25%) !important;
    color: rgb(207 238 238) !important;
}
.ss-color-2 {
    background-color:  hsl(270, 100%, 25%) !important;
    color: rgb(218 179 255) !important;
}
.ss-color-3 {
    background-color: rgb(69, 32, 255) !important;
    color: hsl(0, 0%, 84%) !important;
}
.ss-color-4 {
    background-color: hsla(90, 100%, 92%, 1) !important;
    color: hsl(90, 100%, 25%) !important;
}
.ss-color-5 {
    background-color: hsla(120, 100%, 92%, 1) !important;
    color: hsl(120, 100%, 25%) !important;
}
.ss-color-6 {
    background-color: hsla(0, 100%, 92%, 1) !important;
    color: hsl(0, 100%, 25%) !important;
}
.ss-color-7 {
    background-color: hsla(150, 100%, 92%, 1) !important;
    color: hsl(150, 100%, 25%) !important;
}
.ss-color-8 {
    background-color: hsla(210, 100%, 92%, 1) !important;
    color: hsl(210, 100%, 25%) !important;
}
.ss-color-9 {
    background-color: hsla(240, 100%, 92%, 1) !important;
    color: hsl(240, 100%, 25%) !important;
}
.ss-color-10 {
    background-color: hsla(30, 100%, 92%, 1) !important;
    color: hsl(30, 100%, 25%) !important;
}
.ss-color-11 {
    background-color: hsla(300, 100%, 92%, 1) !important;
    color: hsl(300, 100%, 25%) !important;
}
.ss-color-12 {
    background-color: hsla(330, 100%, 92%, 1) !important;
    color: hsl(330, 100%, 25%) !important;
}

.scale-6  { 
    /*box-shadow: inset 15px 0 30px  hsla(0, 100%, 50%, 0.15),   inset 0px 0px 0px hsla(0, 100%, 50%, 0.15) !important; */
    background-color: hsla(0, 100%, 95%, 0.4) !important;
    /*border: 2px solid hsl(0, 100%, 50%) !important;*/
}
.scale-10  { 
   /* box-shadow: inset 15px 0 30px  hsla(30, 100%, 50%, 0.15),  inset 0px 0px 0px hsla(30, 100%, 50%, 0.15) !important; */
    background-color: hsla(30, 100%, 95%, 0.4) !important;
    /*border: 2px solid hsl(30, 100%, 50%) !important;*/
}
.scale-3  { 
    /*box-shadow: inset 15px 0 30px  hsla(60, 100%, 50%, 0.15),  inset 0px 0px 0px hsla(60, 100%, 50%, 0.15) !important; */
    background-color: hsla(60, 100%, 95%, 0.4) !important;
    /*border: 2px solid hsl(60, 100%, 50%) !important;*/
}
.scale-4  { 
   /* box-shadow: inset 15px 0 30px  hsla(90, 100%, 50%, 0.15),  inset 0px 0px 0px hsla(90, 100%, 50%, 0.15) !important; */
    background-color: hsla(90, 100%, 95%, 0.4) !important;
    /*border: 2px solid hsl(90, 100%, 50%) !important;*/
}
.scale-5  { 
   /* box-shadow: inset 15px 0 30px  hsla(120, 100%, 50%, 0.15), inset 0px 0px 0px hsla(120, 100%, 50%, 0.15) !important; */
    background-color: hsla(120, 100%, 95%, 0.4) !important;
    /*border: 2px solid hsl(120, 100%, 50%) !important;*/
}
.scale-7  { 
   /* box-shadow: inset 15px 0 30px  hsla(150, 100%, 50%, 0.15), inset 0px 0px 0px hsla(150, 100%, 50%, 0.15) !important; */
    background-color: hsla(150, 100%, 95%, 0.4) !important;
    /*border: 2px solid hsl(150, 100%, 50%) !important;*/
}
.scale-1  { 
  /*  box-shadow: inset 15px 0 30px  hsla(180, 100%, 50%, 0.15), inset 0px 0px 0px hsla(180, 100%, 50%, 0.15) !important; */
    background-color: hsla(180, 100%, 95%, 0.4) !important;
    /*border: 2px solid hsl(180, 100%, 50%) !important;*/
}
.scale-8  { 
   /* box-shadow: inset 15px 0 30px  hsla(210, 100%, 50%, 0.15), inset 0px 0px 0px hsla(210, 100%, 50%, 0.15) !important; */
    background-color: hsla(210, 100%, 95%, 0.4) !important;
    /*border: 2px solid hsl(210, 100%, 50%) !important;*/
}
.scale-9  { 
   /* box-shadow: inset 15px 0 30px  hsla(240, 100%, 50%, 0.15), inset 0px 0px 0px hsla(240, 100%, 50%, 0.15) !important; */
    background-color: hsla(240, 100%, 95%, 0.4) !important;
    /*border: 2px solid hsl(240, 100%, 50%) !important;*/
}
.scale-2 { 
   /* box-shadow: inset 15px 0 30px  hsla(270, 100%, 50%, 0.15), inset 0px 0px 0px hsla(270, 100%, 50%, 0.15) !important; */
    background-color: hsla(270, 100%, 95%, 0.4) !important;
    /*border: 2px solid hsl(270, 100%, 50%) !important;*/
}
.scale-11 { 
   /* box-shadow: inset 15px 0 30px  hsla(300, 100%, 50%, 0.15), inset 0px 0px 0px hsla(300, 100%, 50%, 0.15) !important; */
    background-color: hsla(300, 100%, 95%, 0.4) !important;
    /*border: 2px solid hsl(300, 100%, 50%) !important;*/
}
.scale-12 { 
   /* box-shadow: inset 15px 0 30px  hsla(330, 100%, 50%, 0.15), inset 0px 0px 0px hsla(330, 100%, 50%, 0.15) !important; */
    background-color: hsla(330, 100%, 95%, 0.4) !important;
    /*border: 2px solid hsl(330, 100%, 50%) !important;*/
}



.fs-7 {
    font-size: .8em;
}

        :root {
           
            --bs-secondary-color: var(--bs-gray-600);
            --bs-secondary-rgb: 223 227 231 !important;
            --card-radius: 5px;
            --card-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.05);
            --card-hover-shadow: 0 20px 40px -5px rgba(0, 0, 0, 0.1);
        }
        .bg-secondary {
            --bs-bg-opacity: 1;
            background-color: rgba(223, 227, 231, var(--bs-bg-opacity)) !important;
        }
        
        body.body-bg-aurora-bright {
            background: #f3f4f6;
            color: #1f2937;
            min-height: 100vh;
          
        }

        body.body-bg-aurora-highcontrast {
            background: Canvas;
            color: CanvasText;
            min-height: 100vh;
        }
        
        .app-hero {
            background: linear-gradient(135deg, #2563eb, #4f46e5);
            border-radius: 28px;
            padding: 3rem;
            box-shadow: 0 20px 40px rgba(37, 99, 235, 0.2);
            color: #fff;
            position: relative;
           
        }
        .app-hero::after {
            content: '';
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at 80% 20%, rgba(255,255,255,0.15), transparent 40%);
            pointer-events: none;
        }
        
        .app-hero .badge {
            background: rgba(255,255,255,0.2);
            backdrop-filter: blur(4px);
        }
        .card-header {
            
            transition: background-color 0.3s ease;
        }
        .card:hover > .card-header {
                    background-color: rgb(255 253 240 / 19%);
                
        }

        .folder-card {
           
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            
            
        }
        .folder-card:hover {
            transform: translateY(-8px);
            box-shadow: none;
            border-color: rgba(37, 99, 235, 0.1);
        }
        .folder-card .card-body {
            min-height: 240px;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
        .folder-card .card-title {
            font-size: 1.25rem;
            font-weight: 700;
            color: #111827;
            margin-top: 1rem;
            transition: all 0.3s ease;
        }
        .folder-card p {
            color: #6b7280;
            font-weight: 500;
            transition: all 0.3s ease;
            max-height: 3em;
            opacity: 1;
            overflow: hidden;
        }

        .icon-shell {
            width: 72px;
            height: 72px;
            border-radius: 24px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
            transition: all 0.3s ease;
        }
        .icon-shell svg {
            transition: all 0.3s ease;
        }
        .folder-card:hover .icon-shell {
            transform: scale(1.1);
        }

        .app-section-heading {
            color: #111827;
        }

        /* Folder Expansion Styles */
        .folder-card {
            
        }
        .desaturate {
            filter: grayscale(100%);
        }
        .collapsed .card-body {
                overflow: hidden;
            }
        /* On mobile, enable collapsing */
        @media (max-width: 991px) {
            .folder-header {
                cursor: pointer;
            }
        }
        
        /* On desktop, disable collapsing and keep everything expanded */
        @media (min-width: 992px) {
            .folder-header {
                cursor: default;
                pointer-events: none;
            }
            .folder-card .collapse {
                display: block !important;
                height: auto !important;
            }
        }
        
        .folder-card.expanded {
            background-color: transparent;
            box-shadow: none;
            border-color: rgba(37, 99, 235, 0.1);
            transform: translateY(-4px);
        }

        .folder-header {
            padding: 1.5rem;
            transition: all 0.3s ease;
        }
        .folder-header:hover {
            background-color: transparent;
        }

        /* Compact Header State - only on mobile */
        @media (max-width: 991px) {
            .folder-card.expanded .folder-header {
                padding: 0.75rem;
            }
            .folder-card.expanded .folder-header .icon-shell {
                width: 48px;
                height: 48px;
                border-radius: 16px;
                margin-bottom: 0.25rem !important;
            }
            .folder-card.expanded .folder-header .icon-shell svg {
                width: 24px !important;
                height: 24px !important;
            }
            .folder-card.expanded .folder-header .card-title {
                font-size: 1.1rem;
                margin-bottom: 0;
            }
            .folder-card.expanded .folder-header p {
                max-height: 0;
                opacity: 0;
                margin: 0;
            }
            .folder-card.expanded .folder-header .lucide-chevron-down {
                margin-top: 0.25rem !important;
            }
        }

        .folder-content {
            background-color: transparent;
            border-top: 1px solid rgba(0,0,0,0.05);
        }

        .mini-app-card {
            background: transparent;
            border: 0px solid rgba(0,0,0,0.05);
            border-radius: 16px;
            padding: 1rem;
            transition: all 0.2s ease;
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-align: center;
        }
        .mini-app-card:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 12px rgba(0,0,0,0.05);
            border-color: rgba(37, 99, 235, 0.2);
        }
        .mini-app-card .icon-shell {
            width: 64px;
            height: 64px;
            border-radius: 18px;
            margin-bottom: 0.75rem;
        }
        .mini-app-card .small {
            font-size: 0.75rem;
            line-height: 1.2;
            font-weight: 600;
            color: #4b5563;
        } 
span.p_last_name {
    text-transform: uppercase;
    font-weight: 600;
}
.badge.badge_p {
    position: relative;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 50%;
    overflow: hidden;
    user-select: none;
    color: inherit;
    background-color: white;
    text-transform: uppercase;
    line-height: 1;
    font-weight: 600;
    /* max-width: 30px; */
    width: 25px;
    height: 25px;
    padding: 5px;
    z-index: 1;
    border: none !important;
    font-size: 12px;
}
.p_full_cell {
    display: flex;
    align-items: center;
    gap: 0.5em;
    white-space: nowrap;
}
.data-table td {
    vertical-align: middle;
}


.table-striped>tbody>tr:nth-of-type(odd)>*
 {
    --bs-table-color-type: var(--bs-table-striped-color);
    --bs-table-bg-type: rgb(0 0 0 / 2%) !important;
}
.data-table td {
       border: 0;
}
.judge-breakdown {
    display: flex;
    flex-wrap: wrap;
}
.judge-breakdown {
    display: grid;
    grid-template-columns: auto auto auto;
    flex-wrap: wrap;
    font-size: .85em;
}
.control-point-breakdown {
    font-size: .8em;
}
.control-point-group {
    display: grid;
    border-bottom: 1px solid;
}

.judge-score-item {
    display: grid;
    /* gap: .2em; */
}

.judges-in-control-point {
    display: flex;
    gap: .2em;
}

span.judge-name {
    font-size: .75em;
}

span.judge-score {
    font-size: .85em;
}

span.control-point-name {
    font-size: .95em;
}
.data-table th, .data-table td {
    padding-top: .2mm !important;
    padding-bottom: .2mm !important;
}
.summary-table-section  th, .summary-table-section  td {
    padding: 5px !important;
}
div#heatConfigOffcanvas {
    z-index: 1055;
}
#heatConfigOffcanvas li.nav-item button {
    padding: .5em;
    /* padding-top: .5em; */
    /* padding-bottom: .3em; */
}
.data-table table{font-size: 1rem;}
.figures-table {
    font-size: .75rem !important;
}
table.figures-table th, table.figures-table td {
    padding: 0px !important;
}

.figures-table .table-calculation-row td {   
    border-top: 2px solid #888888;
   
}
.figures-table .control-point-final-row td{border-bottom: 2px solid #888888;}

.css-bib .badge {
    border-radius: 0px;
    min-width: 22px;
    border-top: 1px solid black !important;
    border-bottom: 1px solid black !important;
    padding: 2px;
    margin: 0 !important;
    font-size: 1em;
    font-family: "Lexend", sans-serif;
        border-left: none;
    border-right: none;
    color: black;
    background: white !important;
}
.participant-bib-badge {
    height: 40px;
    min-width: 40px !important;
    color: #000000;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    background-color: white;
}
.key {
    min-height: 55px;
    border: 2px solid;
        max-width: 120px;
}
.key span {
    position: absolute;
    transform: translateY(-50%) translateX(-50%);
}
.score-ready button.submit {
    background: #2fb380 !important;
}
div#submitBtnWrapper {
    opacity: 0;
    bottom: -15%;
    display: none;
}
.score-ready div#submitBtnWrapper {
    opacity: 1 !important; 
    
}
/*input#bibInput, #editScoreValue, #createScoreValue, .criteria-input {
       text-align: center;
    font-size: clamp(2rem, 0.1818rem + 3.6364cqi, 3rem) !important;
}*/

.score-input-wrapper .btn, div#bibKeypadCollapse .btn {
    transition: all 0.2s ease;
}
.bg-gradient {
    background-image: linear-gradient(0deg, rgb(0 0 0 / 21%),rgb(0 0 0 / 0%), rgba(255, 255, 255, 0)) !important;
}

.score-input-wrapper .btn:hover {
    background-color: #0099ff !important;   
}


a.config-indicator.complete.small {
    font-size: 0.75em;
}
a.config-indicator.complete.small svg {
   width: 20px;
   height: 20px;
}
/*
.card.shadow-sm {box-shadow: 2px 2px 0 0 var(--bs-btn-border-color) !important;
    transform: translate(-2px, -2px); !important}
.card.shadow-lg {box-shadow: 5px 5px 0 0 var(--bs-btn-border-color) !important;
    transform: translate(-5px, -5px); !important}
    */
.animation-puls{animation: pulse-subtle 2s infinite;}
@keyframes pulse-subtle {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.8; }
}
.animation-puls-bg{animation: animation-puls-bg 2s infinite;}
@keyframes animation-puls-bg {
    0%, 100% { background-color: rgba(0, 149, 255, 0.4); }
    50% { background-color: rgba(0, 149, 255, 0.7); }
}
td.css-bib {
    vertical-align: middle;
}
tr.event-settings-row.table-info {
    font-size: 12px;
}


.format_pdf .country-code{display: none !important;}
.pdf-body .badge.badge_p, .format_pdf .badge.badge_p, .format_pdf .badge.badge_p,  .format_pdf .badge_p{
    display: none !important;
}
th.jscore {
   width: 20px;
}
td.jscore, th.jscore {
   font-size:.85em
}
th.rscore, td.rscore {width: 45px; text-align: right !important;}
 th.col-calculated{width: 45px; padding-right:10px !important}

 td.col-calculated{
    font-weight: bold;
    text-align: right;
    padding-right: 10px !important;}

 th.rscore.angle-th.stage-title {
    border-right: 1px solid #00000017;
}
/* Dropped score styling for aggregation methods (e.g., best 2 of 3) */
td.drop-score, span.drop-score, .run-score.drop-score {
    text-decoration: line-through;
    opacity: 0.7;
    color: #999;
    font-weight: 300;
}

th.c_bib {
    width: 30px;
}
th.c_rank {
    width: 15px;
    font-weight: bold;
}
td.css-rank{
    font-weight: bold;
}
th.c_participant {
    width: 23% !important;
}
th.c_club {
     width: 30% !important;
}
td.css-country {
    font-size: .789em;
}
th.css-overallbest.col-highest-average.table-info {
    width: 55px;
}
th.col-overall-calculated, td.col-overall-calculated {
    width: 55px;
    text-align: right;
    padding-left: 10px !important;
    font-weight: bold;
    text-align: right !important;
}
th.col-gap-leader, td.col-gap-leader {
    width: 30px;
    font-size: .6em !important;
    text-align: right !important;
}
td.css-club {
    white-space: nowrap;
}
td.css-club span {
    max-width: 220px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: inline-block;
    font-size: 0.85em;
}
.data-table tr[data-qual="false"] td {
      background: var(--bs-gray-200);
}
.table>:not(caption)>*>* {
    padding: .2rem .5rem;
    color: var(--bs-table-color-state, var(--bs-table-color-type, var(--bs-table-color)));
    background-color: var(--bs-table-bg);
    border-bottom-width: var(--bs-border-width);
    box-shadow: inset 0 0 0 9999px var(--bs-table-bg-state, var(--bs-table-bg-type, var(--bs-table-accent-bg)));
}
.smaller {
    font-size: 0.7em !important;
}
.active-heat-card .card-body{box-shadow: 0 0 0 rgba(var(--bs-success-rgb), 0.4);
  animation: active-pulse 2s infinite;
}
.hold-progress {
    z-index: -1;
}
.progress-bar {
   
        transition: all 1s ease;
}
.dropdown [data-bs-toggle="dropdown"]   {
   line-height: normal;
}
.result-config-name{
    width: 290px;
     overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
   
}
.target-panel-preview {
    width: 60px;
    height: 60px;
}
.draggable-field {
    cursor: move;
}

#languageSwitcher {
   line-height: .9em;
}

.body-bg-aurora-zephyr .bg-primary {
    
    background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity));
    color: var(--bs-gray-100);
}
.body-bg-aurora-zephyr .bg-info {
      
    background-color: rgba(var(--bs-info-rgb), var(--bs-bg-opacity));
   
}
.heat-card.active .text-muted {
    color: var(--bs-primary-text-emphasis) !important;
}
.fas.fa-fis {
    background: url("../vendor/fis/logo.737d5a82.svg") no-repeat center center;
    width: 15px;
    height: 15px;
    background-size: contain;
}
#notificationsHistoryCard .list-group-item {
    padding: 1em;
    margin-bottom: .5em;
}
#notificationsHistoryCard .card-body {
    padding: .51em !important;
    margin-bottom: 1em;
}
#notificationsHistoryCard .list-group-item .flex-grow-1
{    display: ruby;
    flex-wrap: nowrap;
    align-items: baseline;}
.body-bg-aurora-zephyr .bg-success {
   
    background-color: rgba(var(--bs-success-rgb), var(--bs-bg-opacity));
    color: white;
}
.bg-info {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-info-rgb), var(--bs-bg-opacity)) !important;
    color: white;
}
.bg-opacity-10.bg-info {
    --bs-bg-opacity: .1;
    background-color: rgba(var(--bs-info-rgb), var(--bs-bg-opacity)) !important;
    color: var(--bs-gray-800);
}
.body-bg-aurora-zephyr .bg-danger {
  
    background-color: rgba(var(--bs-danger-rgb), var(--bs-bg-opacity));
    color: var(--bs-gray-200);
}
.bg-dark {
  
    background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity));
    color: var(--bs-gray-200);
}
.bg-info-emphasis {
    background-color: #eaf5ff;
}
.bg-success-subtle {
    background-color: var(--bs-success-border-subtle) ;
    color: var(--bs-success-text-emphasis);
}

/* ============================================
   Range Slider Component (CSS-only)
   ============================================ */
.range-slider {
  --primary-color: #0366d6;
  --value-offset-y: var(--ticks-gap);
  --value-active-color: white;
  --value-background: transparent;
  --value-background-hover: var(--primary-color);
  --value-font: 700 12px/1 "Lexend", sans-serif;
  --fill-color: var(--primary-color);
  --progress-background: #eee;
  --progress-radius: 20px;
  --track-height: calc(var(--thumb-size) / 2);
  --min-max-font: 12px;
  --min-max-opacity: 0.5;
  --min-max-x-offset: 10%;
  --thumb-size: 25px;
  --thumb-color: white;
  --thumb-shadow: 0 0 3px rgba(0, 0, 0, 0.4), 0 0 1px rgba(0, 0, 0, 0.5) inset,
    0 0 0 99px var(--thumb-color) inset;
  --thumb-shadow-active: 0 0 0 calc(var(--thumb-size) / 4) inset
      var(--thumb-color),
    0 0 0 99px var(--primary-color) inset, 0 0 3px rgba(0, 0, 0, 0.4);
  --thumb-shadow-hover: var(--thumb-shadow);
  --ticks-thickness: 1px;
  --ticks-height: 5px;
  --ticks-gap: var(--ticks-height, 0);
  --ticks-color: silver;
  --step: 1;
  --ticks-count: Calc(var(--max) - var(--min)) / var(--step);
  --maxTicksAllowed: 30;
  --too-many-ticks: Min(1, Max(var(--ticks-count) - var(--maxTicksAllowed), 0));
  --x-step: Max(var(--step), var(--too-many-ticks) * (var(--max) - var(--min)));
  --tickInterval: 100/ ((var(--max) - var(--min)) / var(--step)) * var(--tickEvery, 1);
  --tickIntervalPerc: calc(
    (100% - var(--thumb-size)) / ((var(--max) - var(--min)) / var(--x-step)) *
      var(--tickEvery, 1)
  );
  --value-a: Clamp(var(--min), var(--value, 0), var(--max));
  --value-b: var(--value, 0);
  --text-value-a: var(--text-value, "");
  --completed-a: calc(
    (var(--value-a) - var(--min)) / (var(--max) - var(--min)) * 100
  );
  --completed-b: calc(
    (var(--value-b) - var(--min)) / (var(--max) - var(--min)) * 100
  );
  --ca: Min(var(--completed-a), var(--completed-b));
  --cb: Max(var(--completed-a), var(--completed-b));
  --thumbs-too-close: Clamp(
    -1,
    1000 * (Min(1, Max(var(--cb) - var(--ca) - 5, -1)) + 0.001),
    1
  );
  --thumb-close-to-min: Min(1, Max(var(--ca) - 2, 0));
  --thumb-close-to-max: Min(1, Max(98 - var(--cb), 0));
  display: inline-block;
  height: max(var(--track-height), var(--thumb-size));
  background: linear-gradient(to right, var(--ticks-color) var(--ticks-thickness), transparent 1px) repeat-x;
  background-size: var(--tickIntervalPerc) var(--ticks-height);
  background-position-x: calc( var(--thumb-size) / 2 - var(--ticks-thickness) / 2 );
  background-position-y: var(--flip-y, bottom);
  padding-bottom: var(--flip-y, var(--ticks-gap));
  padding-top: calc(var(--flip-y) * var(--ticks-gap));
  position: relative;
  z-index: 1;
}

.range-slider[data-ticks-position=top] {
  --flip-y: 1;
}

.range-slider::before, .range-slider::after {
  --offset: calc(var(--thumb-size) / 2);
  content: counter(x);
  display: var(--show-min-max, block);
  font: var(--min-max-font);
  position: absolute;
  bottom: var(--flip-y, -2.5ch);
  top: calc(-2.5ch * var(--flip-y));
  opacity: clamp(0, var(--at-edge), var(--min-max-opacity));
  transform: translateX(calc(var(--min-max-x-offset) * var(--before, -1) * -1)) scale(var(--at-edge));
  pointer-events: none;
}

.range-slider::before {
  --before: 1;
  --at-edge: var(--thumb-close-to-min);
  counter-reset: x var(--min);
  left: var(--offset);
}

.range-slider::after {
  --at-edge: var(--thumb-close-to-max);
  counter-reset: x var(--max);
  right: var(--offset);
}

.range-slider__progress {
  --start-end: calc(var(--thumb-size) / 2);
  --clip-end: calc(100% - (var(--cb)) * 1%);
  --clip-start: calc(var(--ca) * 1%);
  --clip: inset(-20px var(--clip-end) -20px var(--clip-start));
  position: absolute;
  left: var(--start-end);
  right: var(--start-end);
  top: calc( var(--ticks-gap) * var(--flip-y, 0) + var(--thumb-size) / 2 - var(--track-height) / 2 );
  height: calc(var(--track-height));
  background: var(--progress-background, #eee);
  pointer-events: none;
  z-index: -1;
  border-radius: var(--progress-radius);
}

.range-slider__progress::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  clip-path: var(--clip);
  top: 0;
  bottom: 0;
  background: var(--fill-color, black);
  box-shadow: var(--progress-flll-shadow);
  z-index: 1;
  border-radius: inherit;
}

.range-slider__progress::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  box-shadow: var(--progress-shadow);
  pointer-events: none;
  border-radius: inherit;
}

.range-slider > input {
  -webkit-appearance: none;
  width: 100%;
  height: var(--thumb-size);
  margin: 0;
  position: absolute;
  left: 0;
  top: calc( 50% - Max(var(--track-height), var(--thumb-size)) / 2 + calc(var(--ticks-gap) / 2 * var(--flip-y, -1)) );
  cursor: grab;
  outline: none;
  background: none;
}

.range-slider > input:not(:only-of-type) {
  pointer-events: none;
}

.range-slider > input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  height: var(--thumb-size);
  width: var(--thumb-size);
  transform: var(--thumb-transform);
  border-radius: var(--thumb-radius, 50%);
  background: var(--thumb-color);
  box-shadow: var(--thumb-shadow);
  border: none;
  pointer-events: auto;
  transition: 0.1s;
}

.range-slider > input::-moz-range-thumb {
  -moz-appearance: none;
  appearance: none;
  height: var(--thumb-size);
  width: var(--thumb-size);
  transform: var(--thumb-transform);
  border-radius: var(--thumb-radius, 50%);
  background: var(--thumb-color);
  box-shadow: var(--thumb-shadow);
  border: none;
  pointer-events: auto;
  transition: 0.1s;
}

.range-slider > input::-ms-thumb {
  appearance: none;
  height: var(--thumb-size);
  width: var(--thumb-size);
  transform: var(--thumb-transform);
  border-radius: var(--thumb-radius, 50%);
  background: var(--thumb-color);
  box-shadow: var(--thumb-shadow);
  border: none;
  pointer-events: auto;
  transition: 0.1s;
}

.range-slider > input:hover {
  --thumb-shadow: var(--thumb-shadow-hover);
}

.range-slider > input:hover + output {
  --value-background: var(--value-background-hover);
  --y-offset: -5px;
  color: var(--value-active-color);
  box-shadow: 0 0 0 3px var(--value-background);
      opacity: 1 !important;
}

.range-slider > input:active {
  --thumb-shadow: var(--thumb-shadow-active);
  cursor: grabbing;
  z-index: 2;
}

.range-slider > input:active + output {
  transition: 0s;
  opacity: 1;
}

.range-slider > input:nth-of-type(1) {
  --is-left-most: Clamp(0, (var(--value-a) - var(--value-b)) * 99999, 1);
}
.attemptCriteriaContainer .criteria-info{transition: opacity 0.3s ease;}


[data-input-active="0"] .range-slider > input:nth-of-type(1) + output {
   display: none;
}
 [data-input-active="1"] .edit-lock{display: none;}
[data-input-active="0"] .criteria-info{opacity: 1 !important;}
.range-slider > input:nth-of-type(1) + output {
    --value: var(--value-a);
    --x-offset: calc(var(--completed-a) * -1%);
    --y-offset: 12px;
        opacity: 0;
}

.range-slider > input:nth-of-type(1) + output:not(:only-of-type) {
  --flip: calc(var(--thumbs-too-close) * -1);
}

.range-slider > input:nth-of-type(1) + output::after {
  content: var(--prefix, "") var(--text-value-a) var(--suffix, "");
}

.range-slider > input:nth-of-type(2) {
  --is-left-most: Clamp(0, (var(--value-b) - var(--value-a)) * 99999, 1);
}

.range-slider > input:nth-of-type(2) + output {
  --value: var(--value-b);
}

.range-slider > input:only-of-type ~ .range-slider__progress {
  --clip-start: 0;
}

.range-slider > input + output {
  --flip: -1;
  --x-offset: calc(var(--completed-b) * -1%);
  --pos: calc(
    ((var(--value) - var(--min)) / (var(--max) - var(--min))) * 100%
    
  );
  pointer-events: none;
  position: absolute;
  z-index: 5;
  background: var(--value-background);
  border-radius: 10px;
  padding: 2px 4px;
  left: var(--pos);
  transform: translate(var(--x-offset), calc( 150% * var(--flip) - (var(--y-offset, 0px) + var(--value-offset-y)) * var(--flip) ));
  transition: all 0.12s ease-out, left 0s;
}

.range-slider > input + output::after {
  content: var(--prefix, "") var(--text-value-b) var(--suffix, "");
     font-family: var(--font-digital);
     font-weight: 600;
     font-size: 1.2em;
}
[data-status="performing"], [data-status="current"] {
  background-color: orange !important;
  background-size: 30px 30px !important;
  background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%, transparent 75%, transparent) !important;
  animation: barberpole 1s linear infinite;
  padding: .5em;
    border-radius: 1em;
}
[data-status="scoring"] {
    background-color: rgb(83, 172, 250) !important;
    background-size: 30px 30px !important;
    background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%, transparent 75%, transparent) !important;
    animation: barberpole 1s linear infinite;
    padding: .5em;
    border-radius: 1em;
}

tr[data-participant-status="performing"] .bg-warning, tr[data-participant-status="current"] .bg-warning {
    
    font-weight: bold;
    text-shadow: 0 0 4px #fffa65;
  background-color: orange !important;
  background-size: 30px 30px !important;
  background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%, transparent 75%, transparent) !important;
  animation: barberpole_flash 1s linear infinite;
  padding: .5em;
    
}
tr[data-participant-status="performing"] td.participantCol, tr[data-participant-status="performing"] td.bg-info  {
    
    font-weight: bold;
    text-shadow: 0 0 4px #fffa65;
  background-color: orange !important;
  background-size: 30px 30px !important;
  background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%, transparent 75%, transparent) !important;
  animation: barberpole_flash 1s linear infinite;
  padding: .5em;
    
}
tr[data-participant-status="performing"] .participantCol {
    
    font-weight: bold;
    background-color: var(--bs-primary-border-subtle) !important;
  
  padding: .5em !important;
    
}

tr[data-participant-status="scoring"] td.participantCol  {
    
    font-weight: bold;
   
  background-color: rgb(105, 135, 210) !important;
  background-size: 30px 30px !important;
  background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%, transparent 75%, transparent) !important;
  animation: barberpole_flash 1s linear infinite;
  padding: .5em;
    
}
tr[data-participant-status="scoring"] .participantCol {
    
    font-weight: bold;
    background-color: var(--bs-primary-border-subtle) !important;
  
  padding: .5em !important;
    
}
.hide-expected-participant tr.expected-participant-item {
    display: none;
}
.expected-participants-module .tables-wrapper
 {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
#heatConfigCardBody .expected-participants-module .list-group-wrapper
 {
    display: grid;
    grid-template-columns: 1fr;
}
.glow {
    text-shadow: 0 0 4px #2fb380;
}
.text-danger.glow {
    text-shadow: 0 0 4px #c91010;
}
@keyframes barberpole {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 60px 30px;
  }
}
@keyframes barberpole_flash {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 60px 30px;
  }
}
    .stylescore-app-mode .some-element {
        display: none;
    }
    /*
    if (window.isStyleScoreApp) {
        // App-specific logic
    }
    
    */