:root {
    --team-MTL: #AF1E2D;
    --team-BUF: #003087;
    --team-NYI: #00539B;
    --team-SJS: #006D75;
    --team-CBJ: #002654;
    --team-PIT: #FCB514;
    --team-FLA: #c8102e;
    --team-CAR: #CC0000;
    --team-DAL: #006847;
    --team-TBL: #002868;
    --team-NSH: #FFB81C;
    --team-PHI: #F74902;
    --team-NJD: #CE1126;
    --team-OTT: #E31837;
    --team-COL: #6F263D;
    --team-WSH: #041E42;
    --team-ANA: #F47A38;
    --team-LAK: #a2aaad;
    --team-VAN: #00205B;
    --team-TOR: #00205B;
    --team-NYR: #0038A8;
    --team-EDM: #d14520;
    --team-CGY: #C8102E;
    --team-BOS: #FFB81C;
    --team-STL: #002F87;
    --team-CHI: #CF0A2C;
    --team-DET: #CE1126;
    --team-VGK: #B4975A;
    --team-UTA: #888888; /* Placeholder gray */
    --team-SEA: #99D9D9;
    --team-WPG: #041E42;
    --team-MIN: #154734;
  }
  
  /* Text color classes */
  .team-color-MTL { color: var(--team-MTL); }
  .team-color-BUF { color: var(--team-BUF); }
  .team-color-NYI { color: var(--team-NYI); }
  .team-color-SJS { color: var(--team-SJS); }
  .team-color-CBJ { color: var(--team-CBJ); }
  .team-color-PIT { color: var(--team-PIT); }
  .team-color-FLA { color: var(--team-FLA); }
  .team-color-CAR { color: var(--team-CAR); }
  .team-color-DAL { color: var(--team-DAL); }
  .team-color-TBL { color: var(--team-TBL); }
  .team-color-NSH { color: var(--team-NSH); }
  .team-color-PHI { color: var(--team-PHI); }
  .team-color-NJD { color: var(--team-NJD); }
  .team-color-OTT { color: var(--team-OTT); }
  .team-color-COL { color: var(--team-COL); }
  .team-color-WSH { color: var(--team-WSH); }
  .team-color-ANA { color: var(--team-ANA); }
  .team-color-LAK { color: var(--team-LAK); }
  .team-color-VAN { color: var(--team-VAN); }
  .team-color-TOR { color: var(--team-TOR); }
  .team-color-NYR { color: var(--team-NYR); }
  .team-color-EDM { color: var(--team-EDM); }
  .team-color-CGY { color: var(--team-CGY); }
  .team-color-BOS { color: var(--team-BOS); }
  .team-color-STL { color: var(--team-STL); }
  .team-color-CHI { color: var(--team-CHI); }
  .team-color-DET { color: var(--team-DET); }
  .team-color-VGK { color: var(--team-VGK); }
  .team-color-UTA { color: var(--team-UTA); }
  .team-color-SEA { color: var(--team-SEA); }
  .team-color-WPG { color: var(--team-WPG); }
  .team-color-MIN { color: var(--team-MIN); }
  
  /* Background color classes */
  .bg-team-MTL { background-color: var(--team-MTL); }
  .bg-team-BUF { background-color: var(--team-BUF); }
  .bg-team-NYI { background-color: var(--team-NYI); }
  .bg-team-SJS { background-color: var(--team-SJS); }
  .bg-team-CBJ { background-color: var(--team-CBJ); }
  .bg-team-PIT { background-color: var(--team-PIT); }
  .bg-team-FLA { background-color: var(--team-FLA); }
  .bg-team-CAR { background-color: var(--team-CAR); }
  .bg-team-DAL { background-color: var(--team-DAL); }
  .bg-team-TBL { background-color: var(--team-TBL); }
  .bg-team-NSH { background-color: var(--team-NSH); }
  .bg-team-PHI { background-color: var(--team-PHI); }
  .bg-team-NJD { background-color: var(--team-NJD); }
  .bg-team-OTT { background-color: var(--team-OTT); }
  .bg-team-COL { background-color: var(--team-COL); }
  .bg-team-WSH { background-color: var(--team-WSH); }
  .bg-team-ANA { background-color: var(--team-ANA); }
  .bg-team-LAK { background-color: var(--team-LAK); }
  .bg-team-VAN { background-color: var(--team-VAN); }
  .bg-team-TOR { background-color: var(--team-TOR); }
  .bg-team-NYR { background-color: var(--team-NYR); }
  .bg-team-EDM { background-color: var(--team-EDM); }
  .bg-team-CGY { background-color: var(--team-CGY); }
  .bg-team-BOS { background-color: var(--team-BOS); }
  .bg-team-STL { background-color: var(--team-STL); }
  .bg-team-CHI { background-color: var(--team-CHI); }
  .bg-team-DET { background-color: var(--team-DET); }
  .bg-team-VGK { background-color: var(--team-VGK); }
  .bg-team-UTA { background-color: var(--team-UTA); }
  .bg-team-SEA { background-color: var(--team-SEA); }
  .bg-team-WPG { background-color: var(--team-WPG); }
  .bg-team-MIN { background-color: var(--team-MIN); }
  
  /* Team-specific background colors for DataTable cells */
.dash-cell:has(img[src*="#dtlogo_MTL"]) { background-color: var(--team-MTL)!important; }
.dash-cell:has(img[src*="#dtlogo_BUF"]) { background-color: var(--team-BUF)!important; }
.dash-cell:has(img[src*="#dtlogo_NYI"]) { background-color: var(--team-NYI)!important; }
.dash-cell:has(img[src*="#dtlogo_SJS"]) { background-color: var(--team-SJS)!important; }
.dash-cell:has(img[src*="#dtlogo_CBJ"]) { background-color: var(--team-CBJ)!important; }
.dash-cell:has(img[src*="#dtlogo_PIT"]) { background-color: var(--team-PIT)!important; }
.dash-cell:has(img[src*="#dtlogo_FLA"]) { background-color: var(--team-FLA)!important; }
.dash-cell:has(img[src*="#dtlogo_CAR"]) { background-color: var(--team-CAR)!important; }
.dash-cell:has(img[src*="#dtlogo_DAL"]) { background-color: var(--team-DAL)!important;}
.dash-cell:has(img[src*="#dtlogo_TBL"]) { background-color: var(--team-TBL)!important; }
.dash-cell:has(img[src*="#dtlogo_NSH"]) { background-color: var(--team-NSH)!important; }
.dash-cell:has(img[src*="#dtlogo_PHI"]) { background-color: var(--team-PHI)!important; }
.dash-cell:has(img[src*="#dtlogo_NJD"]) { background-color: var(--team-NJD)!important; }
.dash-cell:has(img[src*="#dtlogo_OTT"]) { background-color: var(--team-OTT)!important; }
.dash-cell:has(img[src*="#dtlogo_COL"]) { background-color: var(--team-COL)!important; }
.dash-cell:has(img[src*="#dtlogo_WSH"]) { background-color: var(--team-WSH)!important; }
.dash-cell:has(img[src*="#dtlogo_ANA"]) { background-color: var(--team-ANA)!important; }
.dash-cell:has(img[src*="#dtlogo_LAK"]) { background-color: var(--team-LAK)!important; }
.dash-cell:has(img[src*="#dtlogo_VAN"]) { background-color: var(--team-VAN)!important; }
.dash-cell:has(img[src*="#dtlogo_TOR"]) { background-color: var(--team-TOR)!important; }
.dash-cell:has(img[src*="#dtlogo_NYR"]) { background-color: var(--team-NYR)!important; }
.dash-cell:has(img[src*="#dtlogo_EDM"]) { background-color: var(--team-EDM)!important; }
.dash-cell:has(img[src*="#dtlogo_CGY"]) { background-color: var(--team-CGY)!important; }
.dash-cell:has(img[src*="#dtlogo_BOS"]) { background-color: var(--team-BOS)!important; }
.dash-cell:has(img[src*="#dtlogo_STL"]) { background-color: var(--team-STL)!important; }
.dash-cell:has(img[src*="#dtlogo_CHI"]) { background-color: var(--team-CHI)!important; }
.dash-cell:has(img[src*="#dtlogo_DET"]) { background-color: var(--team-DET)!important; }
.dash-cell:has(img[src*="#dtlogo_VGK"]) { background-color: var(--team-VGK)!important; }
.dash-cell:has(img[src*="#dtlogo_UTA"]) { background-color: var(--team-UTA)!important; }
.dash-cell:has(img[src*="#dtlogo_SEA"]) { background-color: var(--team-SEA)!important; }
.dash-cell:has(img[src*="#dtlogo_WPG"]) { background-color: var(--team-WPG)!important; }
.dash-cell:has(img[src*="#dtlogo_MIN"]) { background-color: var(--team-MIN)!important; }



body {
    background-color: #141414;
  }
  

img[src*="#profileteamlogo"] {
    width:auto;
    height:45px;
    text-align:center;
    filter: drop-shadow(0px 0px 1px #fff);
 }

 img[src*="#teamsprofileteamlogo"] {
    width:120px;
    text-align:center;
    filter: drop-shadow(0px 0px 3px #fff);
 }

 .custom-navbar {
    background: linear-gradient(180deg, rgb(238, 204, 0), rgb(200, 150, 0));
    color: #000 !important;
    /*height: 60px;*/
  }

a {
    color: #ffffff;  /* Set your desired color here */
    text-decoration: none;  /* Optional: remove underline */
}

.dash-table-container .dash-cell a {
    color: inherit !important;
}

a:hover {
    text-decoration: underline;  /* Optional: add underline on hover */
}

img[src*="#dtlogo"] {
    width:auto;
    height:40px;

    text-align:center;
    filter: drop-shadow(0px 0px 1px #fff);
 }
 img[src*="#dtlogo"]:hover {
    filter: drop-shadow(0px 0px 2px #fff);
 }

 img[src*="#dtlogo_winner_away"] {
    width:auto;
    height:40px;
    text-align:center;
    filter: drop-shadow(0px 0px 1px #fff);
 }
 img[src*="#dtlogo_winner_home"] {
    width:auto;
    height:40px;
    text-align:center;
    filter: drop-shadow(0px 0px 1px #fff);
 }
 img[src*="#dtlogo"]:hover {
    filter: drop-shadow(0px 0px 2px #fff);
 }

 /*we use italics for sog on games table, no other places*/
 td[data-dash-column="hometeamabbr"] em {
    font-size: 11px!important;
    font-style:normal!important;
    display: block!important;  /*make it go on a new line*/
    margin: 0;
    padding: 0;
    line-height: 1.2;
}
td[data-dash-column="awayteamabbr"] em {
    font-size: 11px!important;
    font-style:normal!important;
    display: block!important;  /*make it go on a new line*/
    margin: 0;
    padding: 0;
    line-height: 1.2;
}
td[data-dash-column="starttimeutc"] em {
    font-style:normal!important;
    color:rgb(238, 204, 0)!important; /* Accent yellow */
}

/* Style <em> tags inside the Dash DataTable */
#boxscore_datatable td:has(em) {
    /*position: relative; /* needed for ::before positioning */
    font-style: normal !important;
    font-weight:bold !important;
    color:rgb(238, 204, 0) !important;
    overflow: hidden; /* ensures ::before doesn't leak outside */
}

/* This creates a pseudo-background layer behind the content */
/*
#boxscore_datatable td:has(em)::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(180deg, rgb(238, 204, 0), rgb(200, 150, 0));
    opacity: 0.1; 
    z-index: 0;
    border-radius: 4px;
}
    */

/* Pushes text above the pseudo-background */
#boxscore_datatable td:has(em) * {
    position: relative;
    z-index: 1;
}

#boxscore_datatable em {
    font-style: normal !important;
    font-weight:normal !important;
}

#boxscore_datatable em::after {
    /*content: "🔥";*/
    margin-left: 4px;
}

/*
.dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner.dash-freeze-left, .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner.dash-freeze-top, .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner.dash-virtualized
{
    overflow:inherit!important;
}

.dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner.dash-freeze-left .dt-table-container__row-1, .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner.dash-freeze-top .dt-table-container__row-1, .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner.dash-virtualized .dt-table-container__row-1
{
    overflow:inherit!important;
}

#boxscore_datatable .dash-spreadsheet-inner .dash-spreadsheet .dash-freeze-top .dash-freeze-left .dash-no-filter .dash-fill-width
{
    overflow:inherit!important;
}

#boxscore_datatable .dash-spreadsheet-inner .dash-spreadsheet .dash-freeze-top .dash-freeze-left .dash-no-filter .dash-fill-width
{
    overflow:inherit!important;
}
#boxscore_datatable .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner.dash-freeze-left, .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner.dash-freeze-top, .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner.dash-virtualized
{
    overflow:inherit!important;
}
#boxscore_datatable .dash-spreadsheet-inner.dash-freeze-left,
#boxscore_datatable .dash-spreadsheet-inner.dash-freeze-top,
#boxscore_datatable .dash-spreadsheet-inner.dash-virtualized {
  overflow: inherit !important;
}
*/

td[data-dash-column="starttimeutc"] em::after {
    content: '';
    display: inline-block;
    width: 7px;
    height: 7px;
    background-color: rgb(238, 204, 0); /* Accent yellow */
    border-radius: 50%;
    margin-left: 6px;
    animation: pulse 1s infinite;
    vertical-align: middle;
}

#boxscore_gamestatus em {
    font-style: normal !important;
}


#boxscore_gamestatus em::after {
    content: '';
    display: inline-block;
    width: 7px;
    height: 7px;
    background-color: rgb(238, 204, 0); /* Accent yellow */
    border-radius: 50%;
    margin-left: 6px;
    animation: pulse 1s infinite;
    vertical-align: middle;
}


@keyframes pulse {
  0%   { transform: scale(1); opacity: 1; }
  50%  { transform: scale(1.4); opacity: 0.5; }
  100% { transform: scale(1); opacity: 1; }
}
  
  @keyframes pulse {
    0%   { transform: scale(1); opacity: 1; }
    50%  { transform: scale(1.4); opacity: 0.5; }
    100% { transform: scale(1); opacity: 1; }
  }

 /*workaround to apply gradient*/
 .dash-cell:has(img[src*="#dtlogo_winner"]) {
    background: linear-gradient(180deg, rgb(238, 204, 0), rgb(200, 150, 0));
}

 /*workaround to apply gradient to datatable row*/
 .dash-spreadsheet-inner tr:has(img[src*="#dtlogo_rowwinner"]) td {
    background: linear-gradient(180deg, rgb(238, 204, 0), rgb(200, 150, 0)) !important;
    color:#000!important;
    font-weight:bold!important;
}



.score-winner{
    /*background: linear-gradient(180deg, rgb(238, 204, 0), rgb(200, 150, 0)) !important;*/
    color:#fff!important;
    font-weight:bold!important;
    border-radius:10px!important;
}
.score-regular{
    color:#fff!important;
    font-weight:bold!important;
}

 img[src*="#dtlogosmall"] {
    width:auto;
    height:25px;
    text-align:center;
 }

 p, a {
    margin-bottom: 0;
    text-align : center;
 }

.rounded-date-div{
    background-color: #4d4d4d;
    border: 1px solid #fff !important;
    border-radius:5px!important;
}

 .DateInput, .DateInput_1 {
    Width: 91px !important;
}
.DatePickerInput, .DateInput input{
    background-color: #4d4d4d!important;
}
.DateInput{
    background:none!important;
}

.DateInput_input, .DateInput_input_1 {
    Height: 34px !important;
    Width: 91px !important;
    font-size: 14px;
    color:#fff;
    background-color: #4d4d4d!important;
}

.SingleDatePickerInput__withBorder {
    color:#fff;
    background-color: #4d4d4d;
}

.DateRangeInput_input, .DateRangeInput_input_1 {
    Height: 34px !important;
    /*Width: 100% !important;*/
    max-width: 250px;
    font-size: 12px;
    color:#fff;
    background-color: #4d4d4d;
    /*white-space: nowrap;*/
}

.DateRangePickerInput__withBorder {
    border-radius: none!important;
    color:#fff;
    background-color: #4d4d4d;
}

.DateRangePickerInput_arrow_svg {
    fill:#fff;
}

.DateInput_1 input, .SingleDatePickerInput__withBorder, .DateRangePickerInput__withBorder, .Select-placeholder, .Select-input, .Select-multi-value-wrapper,
.Select-control,.Select,.dash-dropdown{
    border-radius:5px!important;
    border:0px!important;
}

/* Minimal Accordion Container */
.minimal-accordion .accordion-button {
    padding: 2px 8px;
    height: 40px;
    font-size: 16px;
    background-color: #4d4d4d;        /* Dark minimal background */
    color: #fff;
    border: none;
    box-shadow: none;
}

.minimal-accordion .accordion-button::after {
    transform: scale(0.8); /* Smaller expand icon */
    color: #ffffff !important;         /* White text */
    background-image: 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");
}

.accordion-button{
    color: #ffffff !important;         /* White text */
}

/* Remove button focus/hover outlines */
.minimal-accordion .accordion-button:focus {
    box-shadow: none;
}

/* Accordion Body Styling */
.minimal-accordion .accordion-body {
    padding: 6px 10px;
    background-color: #1a1a1a;
    color: #fff;
    font-size: 13px;
}

/* Apply to both collapsed and expanded states */
.minimal-accordion .accordion-button,
.minimal-accordion .accordion-button:not(.collapsed) {
    padding: 2px 8px;
    height: 40px;
    font-size: 16px;
    background-color: #4d4d4d !important;
    color: #ffffff !important;
    border: none;
    box-shadow: none;
}


/* Optional hover styling */
.minimal-accordion .accordion-button:hover {
    background-color: rgb(29, 29, 29) !important;
    color: #ffffff !important;
}

/* Body inside the accordion */
.minimal-accordion .accordion-body {
    background-color: #1a1a1a;
    color: #ffffff;
    font-size: 14px;
    padding: 20px !important; /* Set 5px padding inside */
}

.accordion-button.collapsed::after {
    background-image: 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");
  }

  /* Allow page scroll even when touching the graph */
.graph-scrollable .js-plotly-plot {
    touch-action: pan-y; /* Allow vertical scrolling on touch */
}

/* Make sure touch gestures don't get trapped by Plotly */
.graph-container {
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y !important; /* critical for vertical scroll */
}

.graph-container .js-plotly-plot {
    touch-action: pan-y !important; /* try forcing here too */
    overscroll-behavior: contain; /* prevent scroll chaining issues */
}

/* Optional: disable Plotly's scroll trap hack */
.graph-container .main-svg {
    pointer-events: none !important;
}

/* Dropdown menu container */
.custom-dropdown .Select-menu {
    background-color: #1a1a1a!important; /* Dark background */
    color: #fff;              /* Default font color */
}

/* Options inside the menu */
.custom-dropdown .Select-option {
    background-color: #1a1a1a!important;
    color: #ffffff;
    padding: 8px 12px;
}

/* Hover state for options */
.custom-dropdown .Select-option:hover {
    background-color: #333333!important;
    color: rgb(238, 204, 0)!important; /* Accent yellow */
    cursor: pointer;
}

/* Selected item in dropdown (in multiselect list) */
.custom-dropdown .Select-value {
    color: #000;
    border: 1px solid #666;
}

.custom-dropdown .Select-value {
    color: #fff;
    border: 1px solid #666;
}

/* Placeholder text */
.custom-dropdown .Select-placeholder {
    color: #aaaaaa;
    background-color:#000
}

/* Control/input box */
.custom-dropdown .Select-control {
    background-color: #1a1a1a!important;
    border: 1px solid #444;
    color: #000;
}


.Select-multi-value-wrapper .Select-input input{
    color:#fff!important;

}

.player-details {
    font-size:14px!important;
}

/*custom css for boxscore player column */
td[data-dash-column="boxscore_player_name"] {
    text-align: left !important;
    border-right: 2px solid #000 !important;
    /*background-color: #1d1d1d!important;*/
}

td[data-dash-column="boxscore_player_name"] p {
    text-align: left !important;
    margin: 0;
}

td[data-dash-column="boxscore_player_name"] p {
    display: inline-flex;         /* Aligns logo and name horizontally */
    align-items: center;          /* Vertically centers the items */
    /*gap: 5px;                    /* Optional: adds spacing between logo and name */
}

td[data-dash-column="starttimeutc"] a {
    text-decoration: underline !important;  /* Optional: remove underline */
}

td[data-dash-column="hometeamabbr"] p {
    font-size:24px;
    margin: 0;
    padding: 0;
}
td[data-dash-column="awayteamabbr"] p {
    font-size:24px;
    margin: 0;
    padding: 0;
}

/* assets/custom-navbar.css */

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;utf8,<svg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'><path stroke='black' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/></svg>");
}

#mingames-slider .rc-slider-mark,
#mingames-slider .rc-slider-step,
#maxgames-slider .rc-slider-mark,
#maxgames-slider .rc-slider-step {
    display: none !important;
}