/*At this point favorites viewer is just a repurposed sports menu with the other stuff hidden
TODO: See if I can implement a custom version of this, to avoid all the unnecessary bloat */
#root .favorites-viewer-container {
    position: relative;
    /* margin-bottom: -38px; */
    order: -2;
    min-height: unset;
}

#root .favorites-viewer-container .favorites-viewer-helper {
    min-height: 0px;
    position: relative;
}

#root .mouse .favorites-viewer-container:hover .favorites-viewer-helper {
    min-height: 32px;
}

#root app-nav.favorites-viewer .nav-favorites-header, #root app-nav.favorites-viewer .nav-sport-wrapper {
    display: none
}

#root app-nav.favorites-viewer .nav-sports-header {
    height: 0px
}

#root app-nav.favorites-viewer .nav-sports-header div:not(.navbar-toggle) {
    display: none;
}

#root app-nav.favorites-viewer .nav-sports-header .navbar-toggle {
    display: flex;
    position: absolute;
    z-index: 2;
    top: -26px;
    right: 30px;
}

#root app-nav.favorites-viewer .nav-sports-header .navbar-toggle:after {
    align-items: center;
    content: '';
    background-image: url(/v1.185/r/images/site/icons/Arrow_Down.svg);
    display: flex;
    height: 100%;
    justify-content: center;
    width: 24px;
    transform: rotate( 0deg );
}

#root app-nav.favorites-viewer .nav-sports-header.collapsed .navbar-toggle:after {
    transform: rotate( 90deg );
}

#root app-nav.favorites-viewer .nav-favorites-panel {
    overflow: hidden;
}

#root app-nav.favorites-viewer .nav-featured-wrapper {
    display: none;
}

#root app-nav.favorites-viewer .nav-favorite {
    align-items: center;
    cursor: pointer;
    display: flex;
    user-select: none;
    min-height: 36px;
    background-color: var(--o-primary);
    border-bottom: 1px solid var(--o-primary-c);
    padding: 5px;
}

#root app-nav.favorites-viewer .nav-favorite .nav-favorite-icon {
    margin: 0 5px 0px 0px;
    height: 24px;
    width: 24px;
    display: flex;
    flex-shrink: 0;
    background: url(/v1.185/r/images/site/icons/Star-OnNew.svg) center center no-repeat;
}

#root app-nav.favorites-viewer .nav-favorite .default-flag {
    display: none;
}

#root app-nav.favorites-viewer .nav-favorite .nav-favorite-counter {
    display: none;
}

#root app-nav.favorites-viewer .nav-favorite .default-sport {
    min-width: 18px;
    height: 18px;
    background-size: 18px 18px;
    margin-right: 5px;
}

#root app-nav.favorites-viewer .nav-favorite .nav-favorite-selector, #root app-nav.favorites-viewer .nav-favorite .tournament_checkbox {
    background: unset;
    margin-left: auto;
    opacity: 1;
    margin-right: 5px;
    border-radius: var(--rd2);
    border: 1px solid var(--c-shade-b);
    box-shadow: unset;
    background-color: var(--c-shade-b);
    transition: 0.25s;
    flex-shrink: 0;
    height: 20px;
    min-height: 20px;
    width: 20px;
}

#root app-nav.favorites-viewer .nav-favorite .nav-favorite-tournament {
    overflow: hidden;
    text-overflow: ellipsis;
    /* white-space: nowrap; */
    width: 100%;
}

#root app-nav.favorites-viewer .nav-favorite .nav-favorite-name {
    width: 100%;
}

#root app-nav.favorites-viewer .nav-favorite .nav-favorite-selector.checked, #root app-nav.favorites-viewer .nav-favorite .tournament_checkbox:checked {
    background-color: var(--o-blue-a);
    border: 4px solid var(--o-primary-c);
}

#root .mouse app-nav.favorites-viewer .nav-favorite:hover .nav-favorite-selector {
    background-size: 24px 24px;
    border: solid 1px var(--o-blue-a);
    background-color: var(--o-blue-b);
    box-shadow: inset 4px 4px 0px var(--o-primary-c), inset -4px -4px 0px var(--o-primary-c);
}

#root .favorites-viewer-container .featured-item.favorites div::after {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    margin-left: auto;
    margin-right: 5px;
    background-image: url(/v1.185/r/images/site/icons/Plus.svg);
    background-position: top;
    background-repeat: no-repeat;
    background-size: 20px 20px;
}

#root .mouse .favorites-viewer-container:hover .info {
    opacity: 1;
}

#root .favorites-viewer-container .info {
    position: absolute;
    width: 100%;
    z-index: 1;
    padding: 3px;
    color: var(--c-white);
    background-color: var(--o-primary-b);
    opacity: 0;
    pointer-events: none;
}

app-navbar-favorites {
    /* background-color: var(--o-primary); */
    position: relative;
}

app-navbar-favorites >* {
    /* margin-bottom: 42px; */
}

app-navbar-favorites .nav-favorites-wrapper {
    /* border-radius: var(--r-d2); */
    color: var(--o-primary);
    position: relative;
    overflow: hidden;
    /* margin-bottom: 8px; */
}

app-navbar-favorites .nav-favorites-header {
    /* display: none; */
    display: flex;
    align-items: center;
    height: 40px;
    background-image: var(--g-1i);
    box-shadow: var(--x-surface-c);
    /* margin: 0 5px; */
    border-radius: var(--r);
    width: 100%;
    /* font-feature-settings:"liga"; */
    background-color: var(--f-favorites);
    padding: 0 5px;
    cursor: pointer;
    color: var(--o-blue-c);
    position: relative;
}

app-navbar-favorites .nav-favorites-selector.all {
    pointer-events: none
}

app-navbar-favorites .nav-favorites-header .nav-favorites-name {
    /* text-transform: uppercase; */
    /* letter-spacing: 1px; */
    align-self: center;
    font-size: 0em;
    font-size: 1.1rem;
    font-weight: 600;
    display: contents;
}

app-navbar-favorites .nav-favorites-header .nav-favorites-name:after {
    font-family: BIF;
    content: " ar-left-small";
    font-size: 24px;
    display: flex;
    transition: 0.25s;
    letter-spacing: 0;
    height: 100%;
    width: 36px;
    justify-content: center;
    align-items: center;
    display: none;
}

.desktop app-navbar-favorites .nav-favorites-header .nav-favorites-name:after {
    display: none
}

app-navbar-favorites .nav-favorites-header.expanded {
    /* position: absolute; */
    /* box-shadow: var(--x-d-b3); */
    border-radius: var(--r) var(--r) 0 0;
}

.collapse-left-sidebar .mouse .left-sidebar:not(:hover) app-navbar-favorites .nav-favorites-header .nav-favorites-name, .collapse-left-sidebar .mouse .left-sidebar:not(:hover) app-navbar-favorites .nav-favorites-header .nav-favorites-toggle {
    display: none;
}

.collapse-left-sidebar .mouse .left-sidebar:not(:hover) app-navbar-favorites .nav-favorites-header::before {
    /* margin: 0 auto; */
}

app-navbar-favorites .nav-favorites-header .nav-favorites-toggle {
    order: 3;
    width: 100%;
    flex: 1 1 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

app-navbar-favorites .nav-favorites-header .nav-favorites-counter {
    display: none;
}

app-navbar-favorites .nav-favorites-header + .nav-favorites-panel {
    display: none;
}

app-navbar-favorites .nav-favorites-header.expanded + .nav-favorites-panel {
    display: block;
    color: var(--c-f);
    background-color: var(--o-primary-b);
    /* border-radius: var(--r-b); */
    /* margin-bottom: 4px; */
    /* border: 1px solid var(--c-o1); */
    box-sizing: border-box;
    border-top: 0px;
    padding-top: 8px;
    /* padding-left: 4px; */
}

app-navbar-favorites .nav-favorites-header .nav-favorites-toggle::before {
    font-family: BIF;
    content: " ar-left-small";
    font-size: 24px;
    display: flex;
    transition: 0.25s;
    letter-spacing: 0;
    height: 100%;
    width: 36px;
    align-items: center;
    margin-right: 4px;
}

app-navbar-favorites .nav-favorites-header.expanded .nav-favorites-toggle::before {
    content: " ar-down-small";
}

app-navbar-favorites .nav-favorites-header::before {
    font-family: 'BIF' !important;
    content: " app-bookmark";
    display: inline-block;
    width: 24px;
    line-height: 24px;
    height: 24px;
    font-size: 24px;
    margin-left: 2px;
    margin-right: 8px;
}

.desktop app-navbar-favorites .nav-favorites-panel {
    /* padding-top: 36px; */
    border-bottom-left-radius: var(--r);
    border-bottom-right-radius: var(--r);
    /* margin: 0 5px; */
    /*     background-color: inherit; */
}

app-navbar-favorites .nav-favorite {
    display: flex;
    padding: 0px 1px 12px;
    /* white-space: normal; */
    align-items: center;
    /* align-content: center; */
    /* flex-direction: row; */
    justify-content: center;
    cursor: pointer;
}

.mobile app-navbar-favorites .nav-favorite {
}

.mouse app-navbar-favorites .nav-favorite:hover {
    color: var(--c-f-e);
}

.mouse app-nav .sidebar .nav-sport-wrapper .nav-sport:hover, .mouse app-featured-leagues .featured-leagues-header:hover {
    color: var(--c-f-e)
}

.mouse app-featured-leagues .featured-leagues-header:hover, .mouse app-navbar-favorites .nav-favorites-header:not(.expanded):hover {
    /* box-shadow: var(--x-d-b3); */
    /* background-color: var(--c-o); */
    /* border-radius: var(--r); */
}

app-navbar-favorites .nav-favorite .nav-favorite-name {
    min-width: calc(100% - 102px);
    display: flex;
    height: 24px;
    align-items: center;
    padding-left: 4px;
}

app-navbar-favorites .nav-favorite .nav-favorite-name .nav-favorite-category {
    display: none;
}

app-navbar-favorites .nav-favorite .nav-favorite-tournament {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 100%;
    height: auto;
    line-height:  1.1rem;
}

app-navbar-favorites .nav-favorite .nav-favorite-icon {
    width: 24px;
    height: 24px;
    margin: 0 6px;
}

.mouse app-navbar-favorites .nav-favorite .nav-favorite-icon {
    position: relative;
    /* display: none; */
    opacity: 0;
    /* left: 7px; */
    /* transform: translate(1px, 0); */
    border-radius: var(--r-d2);
}

.mouse app-navbar-favorites .nav-favorite:hover .nav-favorite-icon {
    opacity: 1;
    display: block;
    z-index: 1;
    color: var(--c-f-s);
}

.mouse app-navbar-favorites .nav-favorite:hover .nav-favorite-icon:hover {
    color: var(--c-f);
    background-color: var(--c-o);
}

#root .mouse app-navbar-favorites .nav-favorite:hover .default-sport {
    display: none;
}

app-navbar-favorites .nav-favorite .nav-favorite-icon::before {
    font-family: BIF;
    content: " ba-close";
    font-size: 24px;
    width: 24px;
    min-width: 24px;
    height: 24px;
    min-height: 24px;
    text-align: center;
    border-radius: var(--r-d2);
    display: inline-block;
    line-height: 24px;
}

app-navbar-favorites .nav-favorite .nav-favorite-counter {
    display: none
}

#root .hover app-navbar-favorites .nav-favorite .default-sport {
    /* display: none; */
}

app-navbar-favorites .nav-favorite .default-sport::before {
    /* font-size: 16px; */
    background-color: transparent;
    display: inline-flex;
}

#root app-navbar-favorites .nav-favorite .nav-favorite-selector {
    margin-left: auto;
}

.ui-overlaypanel.favorites-viewer {
    left: var(--c-l-collapsed-sidebar-max)!important;
    margin: 0px;
    border: 0px;
    top: calc(var(--c-header-top) - var(--sidebar-scroll) + 154px)!important;
    max-width: 220px;
    width: 100%;
}

.ui-overlaypanel.favorites-viewer::before,.ui-overlaypanel.favorites-viewer::after {
    top: 5px;
    left: -12px;
    transform: rotate(90deg);
    border-top-color: var(--c-shade)!important;
    border-bottom-color: transparent;
    display: none
}

.ui-overlaypanel.favorites-viewer .ui-overlaypanel-content {
    padding: 0px;
}

.ui-overlaypanel.favorites-viewer app-navbar-favorites .nav-favorites-header + .nav-favorites-panel {
    display: block
}

.ui-overlaypanel.favorites-viewer app-navbar-favorites >* {
    margin-bottom: 0px;
}

app-navbar-favorites form {
    display: flex;
    flex-direction: column;
    color: var(--c-f);
    /* padding: 4px 1px; */
    background-color: var(--c-o2i);
    border-radius: var(--r);
    /* margin-bottom: 4px; */
    /* border: 1px solid var(--c-o1); */
    box-sizing: border-box;
    border-top: 0px;
    overflow:  hidden;
}

app-navbar-favorites form .league-select-go {
    order: 4;
    min-height: 40px;
    align-items: center;
    background-color: var(--o-blue-b);
    padding: 0px 0px;
    margin-top: -2px;
    border-radius: var(--r-b);
    border-top: 1px solid var(--c-o2i);
    box-shadow: var(--x-surface);
    display: none
}

app-navbar-favorites form .league-select-go.has-options {
    display: flex;
}

app-navbar-favorites form .league-select-go.has-options + .nav-favorites-wrapper .nav-favorites-header {
    border-radius: var(--r) var(--r) 0 0;
}

app-navbar-favorites form .league-select-go button {
    background-color: transparent;
}

.navigation-container app-navbar-favorites .nav-favorites-header .nav-favorites-toggle {
    margin-left: unset;
}

.navigation-container app-navbar-favorites .nav-favorites-header .nav-favorites-selector {
    margin-left: auto;
    margin-right: 2px;
    background-color: var(--f-favorites)!important;
}

.navigation-container app-navbar-favorites .nav-favorites-header:not(.expanded) .nav-favorites-selector {
    display: none
}

.navigation-container app-navbar-favorites .nav-favorites-header input[type=checkbox]:checked::before {
    color: var(--o-primary-a)!important
}

app-navbar-favorites form .league-select-go .nav-reset-button {
    width: 40px;
    height: 40px;
    font-size: 0px;
    padding: 0px;
    border-left: 1px solid var(--c-o1i);
}

app-navbar-favorites form .league-select-go .nav-reset-button::before {
    content: " ba-close";
    font-size: 24px;
    font-family: BIF;
}

app-navbar-favorites form .league-select-go .nav-submit-button {
    width: calc(100% - 24px);
    display: flex;
    align-items: center;
    padding: 0px;
}

app-navbar-favorites form .league-select-go .nav-submit-button .nav-submit-number {
    font-size: 1.1rem;
    order: -1;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--c-f);
    font-weight: bold;
    margin-left: 8px;
    background-color: var(--c-o1i);
    border-radius: 4px;
    box-shadow: var(--x-surface-i);
}

app-navbar-favorites form .league-select-go .nav-submit-button .nav-submit-go {
    font-size: 0px;
    margin-left: 10px;
    display: flex;
    align-items: center;
}

app-navbar-favorites form .league-select-go .nav-submit-button .nav-submit-go::before {
    content: "Display Selections";
    font-size: 1rem;
}

app-navbar-favorites form .league-select-go .nav-submit-button .nav-submit-go::after {
    content: " ar-right";
    font-size: 24px;
    font-family: BIF;
}

.navigation-container app-navbar-favorites .nav-favorites-header.expanded + .nav-favorites-panel {
    margin-bottom: 0px;
    /* border-radius: 0 0 10px 10px; */
    padding-top: 10px;
}
