:root {
    --transition-fast: 0.15s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

a {
    text-decoration: none;
    color: inherit;
}

li {
    list-style: none;
}

img {
    max-width: 100%;
    vertical-align: top;
}

body {
    font-family: var(--font-inter);
    background-color: var(--bg-lightest-grey_dark);
    color: var(--text-black-white);
    font-size: 16px;
    display: flex;
    flex-direction: column;
    user-select: none;
}

body.no-scroll {
    overflow: hidden;
}

.betting {
    height: 100%;
    min-height: 100%;
    width: 100%;
    background-color: var();
}

.betting__header {
    padding: 0 20px 0 25px;
    background-color: var(--bg-white-darkest);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header__tabs:not(.header__tabs--theme) {
    display: flex;
    gap: 20px;
}

.header__tab {
    cursor: pointer;
    color: var(--text-light-grey-white);
    text-transform: capitalize;
    font-weight: 700;
    padding: 19px 0;
}

.header__tab.active {
    color: var(--text-black-white);
    position: relative;
}

.header__tab.active::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background-color: var(--bg-main_green);
}

.betting__main {
    padding: 20px 10px 0;
    flex: 1 0 95%;
}

.betting__container {
    display: grid;
    gap: 20px;
    grid-template-columns: 300px auto;
    height: 100%;
}

/* ------------------- left-sidebar -------------- */
.betting__left-sidebar {
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 10px 15px;
    position: sticky;
    top: 0;
    height: 100dvh;
    overflow: auto;
}

.swiper-wrapper {
    height: auto;
}

.betting__left-sidebar::-webkit-scrollbar {
    width: 5px;
    background: transparent;
}

.betting__left-sidebar::-webkit-scrollbar-thumb {
    width: 4px;
    background-color: var(--bg-grey_light-dark);
    border-radius: 2px;
}

.left-sidebar__favorites {

}

.left-sidebar__favorites h5 {
    text-transform: uppercase;
}

.left-sidebar-header {
    display: flex;
    gap: 10px;
}

.left-sidebar-header__item {
    gap: 5px;
    display: flex;
    align-items: center;
    text-transform: uppercase;
}

.left-sidebar-header__icon {
    border-radius: 5px;
    width: 20px;
    height: 20px;
    overflow: hidden;
}

.left-sidebar-header__text {
    font-family: var(--font-golos);
    font-size: var(--font-size-small);
    font-weight: 600;
    letter-spacing: 1.3px;
}

.left-sidebar-header {
    margin-bottom: 15px;
}

.left-sidebar__sports-modal.active {
    background: var(--bg-lightest-grey_dark);
}

/*------------------------------------*/

.top-events-slider__list {
    font-size: 15px;
    overflow: hidden;
    color: #0a0a0a;
    font-weight: 400;
}

.top-events-slider__list .swiper-wrapper {
    height: auto;
}

.top-events-slider__list::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1;
    width: 50px;
    background: linear-gradient(90deg, rgba(var(--bg-lightest-grey_dark_rgb), 0) 0%, rgba(var(--bg-lightest-grey_dark_rgb), 1) 85%);
    transition: .3s;
}

.top-events-slider__list.ended::after {
    width: 0px;
}

.top-events-slider__header,
.top-live-slider__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.left-sidebar__header-btn-text {
    font-family: var(--font-golos);
    font-size: var(--font-size-smaller);
    font-weight: 600;
    cursor: pointer;
    color: var(--bg-gray-middle);
}

.left-sidebar__header-text {
    color: var(--text-light-grey-white);
    text-transform: uppercase;
    font-family: var(--font-golos);
    font-weight: 700;
    font-size: var(--font-size-small);
    letter-spacing: 1.3px;
}

.swiper-grid-column > .swiper-wrapper {
    flex-direction: row;
}

.top-events-slider__item {
    display: flex;
    gap: 5px;
    margin-bottom: 5px;
}

.top-events-slider__subitem {
    background-color: var(--bg-grey_light-dark);
    border-radius: 10px;
    padding: 8px 12px 8px 40px;
    white-space: nowrap;
    margin-top: 10px;
    font-weight: 500;
    width: auto !important;
    position: relative;
    cursor: pointer;
}

.top-events-slider__subitem:before {
    content: '';
    position: absolute;
    left: 8px;
    width: 25px;
    height: 25px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
    background: url(/storage/image/betting/league.png) center / contain no-repeat;
}

.top-events-slider__controls {
    cursor: pointer;
    display: flex;
    gap: 10px;
}

.top-events-slider__control,
.top-live-slider__control {
    position: static;
    width: 20px;
    height: 20px;
    margin-top: 0;
    color: inherit;
}

.top-events-slider__control:hover,
.top-live-slider__control:hover {
    font-weight: bolder;
}

.top-events-slider__control::after,
.top-live-slider__control::after {
    content: none;
}

/*-----------------------------------------*/

.left-sidebar-time-filter__title {
    color: var(--text-light-grey-white);
    text-transform: uppercase;
    margin-bottom: 10px;
}

.left-sidebar-time-filter__content {
    background-color: var(--bg-grey_darkest);
    border-radius: 20px;
    padding: 3px;
    text-transform: capitalize;
    display: flex;
}

.left-sidebar-time-filter__item {
    padding: 8px 10px;
    border-radius: 18px;
    flex: 1;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    color: var(--text-dark-light);
    transition: .2s;
}

.left-sidebar-time-filter__item:hover {
    cursor: pointer;
}

.left-sidebar-time-filter__item:not(.active):hover {
    color: var(--text-black-white);
}

.left-sidebar-time-filter__item.active {
    background-color: var(--bg-white_white);
    color: var(--text-dark-dark);
}

.left-sidebar__search__input,
.bets__search__input {
    width: 100%;
    border-radius: 20px;
    padding: 9px 10px 9px 44px;
    outline: none;
    border: 2px var(--border-light-gray) solid;
    background: left 12px center / 20px no-repeat var(--search-img), var(--bg-white_light-dark);
    color: var(--text-black-white);
}

.bets__search__input {
    min-width: 50px;
}

.left-sidebar__search__input::placeholder {
    color: var(--text-light-grey-white);
}

.left-sidebar__sports-wrapper {
    position: relative;
}

/*--------------------------------------*/

.sports__header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    color: var(--text-light-grey-white);
}

.sports__header div:first-child {
    text-transform: uppercase;
}

.sports__list {
    display: flex;
    flex-direction: column;
}

.sports-item-header {
    display: flex;
    justify-content: space-between;
}

.sports-item-header__leftside,
.sports-item-header__rightside,
.sports-subitem-header__rightside {
    display: flex;
    align-items: center;
    text-transform: capitalize;
    gap: 12px;
    position: relative;
    z-index: 2;
}

.sports-item-header__rightside,
.sports-subitem-header__rightside {
    gap: 8px;
}

.sports-item-header__icon img {
    filter: var(--filter-none-dark);
}

.sports-item-header__icon {
    width: 20px;
    height: 20px;
}

.sports-subitem-header__icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50px;
    overflow: hidden;
}

.sports-subitem-header__icon img {
    width: 100%;
    height: 100%;
}

.sports-item-header__icon svg {
    width: 100%;
    height: 100%;
    stroke: grey;
}

.sports-item .sports-item__body,
.sports-subitem .sports-subitem__body {
    display: none;
}

.sports-item-header__count,
.sports-subitem-header__count {
    color: var(--text-light-grey-white);
    font-size: var(--font-size-small);
    font-weight: 600;
}

.sports-item-header__count span,
.sports-subitem-header__count span {
    color: var(--text-green-green);
}

.sports-item-header__arrow-down,
.sports-subitem-header__arrow-down {
    stroke: var(--text-light-grey-white);
    width: 15px;
    height: 9px;
}

.pointer-none {
    pointer-events: none;
}

.pointer-only-hover {
    pointer-events: none;
}

.pointer-only-hover:hover {
    pointer-events: all;
}

.rotate-180 {
    transform: rotate(180deg);
}

.sports-item.expanded {
    background-color: var(--bg-white-darkest);
}

.sports-item.expanded .sports-item__header .sports-subitem-header__arrow-down {
    transform: rotate(180deg);
}

.sports-subitem.expanded {
    background-color: var(--bg-white-darkest);
}

.sports-item.expanded .sports-item__body,
.sports-subitem.expanded .sports-subitem__body {
    display: flex;
    flex-direction: column;
}

.sports-subitem__body {
    margin: 20px 10px 0 20px;
    padding-left: 10px;
    border-left: 2px solid var(--bg-light-grey__white);
}

.sports-item {
    border-radius: 10px;
    overflow: hidden;
}

.sports-subitem {
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 20px;
}

.sports-subitem:last-child {
    margin-bottom: 0;
}

.sports-item__header {
    cursor: pointer;
    padding: 15px 10px;
    border-radius: 10px;
    display: flex;
    justify-content: space-between;
}

.sports-subitem__header {
    width: calc(100% - 20px);
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    margin: 5px auto;
}

.sports-item-header__title,
.sports-subitem-header__title {
    font-family: var(--font-golos);
    font-weight: 500;
}

.sports-item.expanded .sports-item__header,
.sports-item__header:hover {
    background-color: var(--bg-grey_light-dark);
}

.sports-item.expanded .sports-item__header {
    position: relative;
    overflow: hidden;
}

.sports-item.expanded .sports-item__header::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 36px;
    background-color: var(--bg-main_green);
}

.sports-item.expanded .sports-item__header .sports-item-header__icon {
    filter: invert(1);
}

.sports-subitem.expanded .sports-subitem__header,
.sports-item.expanded .sports-item__header {
    margin-bottom: 5px;
}

.sports-subitem__subcategory {
    display: flex;
    align-items: center;
    margin: 10px 0;
    gap: 10px;
    cursor: pointer;
}

.sports-subitem__subcategory .image-wrapper {
    max-width: 30px;
    max-height: 30px;
    width: 100%;
    height: 100%;
    display: inline-block;
}

.sports-subitem__subcategory .num {
    margin-left: auto;
    color: var(--text-light-grey-white);
    font-size: var(--font-size-small);
    font-weight: 600;
}

.sports-subitem__subcategory.active .num {
    color: var(--text-green-green);
}

.checkbox-block {
    display: flex;
    align-items: center;
    justify-content: center;
}

.checkbox-block span {
    width: 22px;
    height: 22px;
    border-radius: 3px;
    border: 2px solid var(--bg-light-grey__white);
}

.checkbox-block input {
    width: 0;
    height: 0;
    opacity: 0;
    appearance: none;
    -webkit-appearance: none;
}

.checkbox-block input:checked + span {
    border: 2px solid var(--bg-main_green);
    background-color: var(--bg-main_green);
    position: relative;
}

.checkbox-block input:checked + span::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -3px;
    bottom: 0;
    margin: auto;
    width: 10px;
    height: 6px;
    transform: rotate(-45deg);
    border-radius: 1px;
    border-color: var(--bg-lightest-grey_dark);
    border-style: solid;
    border-width: 0 0 3px 3px;
    z-index: 1;
}

/*--------------------------------  -----------*/

.betting__main-content {
    display: grid;
    gap: 20px;
    grid-template-columns: 3fr 1fr;
    grid-template-rows: auto 1fr;
}

.top-events-section {
    grid-column: 1 / -1;
}

.main-section-events {
    background-color: var(--bg-white-dark);
    padding: 20px 0;
    border-radius: 10px;
}

.main-section-events.live {
    grid-row: 1;
}

.bet-panel-aside {
    grid-column: 2;
    grid-row: 2;
}

/*------------ ---------------*/

.top-events-section {
    overflow: hidden;
    width: 100%;
}

.top-events-section__wrapper {
}

.top-events-section__control {
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 75px;
    height: 100%;
    margin: 0;
    color: inherit;
}

.top-events-section__control.swiper-button-next {
    background: linear-gradient(90deg, rgba(var(--bg-lightest-grey_dark_rgb), 0) 2%, rgba(var(--bg-lightest-grey_dark_rgb), .9) 75%);
    right: 0;
    padding-left: 20px;
}

.top-events-section__control.swiper-button-prev {
    background: linear-gradient(-90deg, rgba(var(--bg-lightest-grey_dark_rgb), 0) 2%, rgba(var(--bg-lightest-grey_dark_rgb), .9) 75%);
    left: 0;
    padding-right: 20px;
}

.top-events-section__control::after {
    content: none;
}

.top-events-section__control svg {
    width: 20px;
    height: 20px;
}

.top-events-section__control.swiper-button-disabled {
    opacity: 0;
}

.top-events-section__item {
    height: 280px;
    border-radius: 10px;
    background-color: var(--bg-white-dark);
    overflow: hidden;
}

.top-events-section-item__wrapper {
    display: flex;
    flex-direction: column;
    position: relative;
    padding: 10px;
    height: 100%;
    gap: 12px;
}

.top-events-section-item__wrapper.swiper-slide {
    margin-top: 10px !important;
}

.top-events-section-item__wrapper.ver2 {
    height: auto;
    background-color: var(--bg-white-dark);
    border-radius: 10px;
}

.top-events-section-item__wrapper.ver2 .highlights-events-item__tournament-title {
    font-size: var(--font-size-smaller);
}

.top-events-section-item__top {
    flex: 1;
}

.ver2 .top-events-section-item__top {
    flex: inherit;
}

.flexable {
    flex: 1 0 50%;
}

.top-events-section-item__image {
    position: absolute;
    top: 0;
    height: 50%;
    left: 0;
    right: 0;
    z-index: 1;
    background-color: lightgrey;
}

.top-events-section-item__img {
    width: 100%;
    height: 100%;
}

.top-events-section-item__tournament-title {
    position: absolute;
    bottom: 0;
    height: 25%;
    left: 0;
    right: 0;
    z-index: 1;
    background-color: #EEF0F2;
    opacity: 0.5;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    text-transform: uppercase;
    font-weight: bolder;
    color: #0a0a0a;
}

.top-events-section-item__header {
    display: flex;
    justify-content: space-between;
    z-index: 2;
    position: relative;
}

.top-events-section-item__header-time {
    display: flex;
    gap: 5px;
    text-transform: capitalize;
}

.icon-football-field__wrapper,
.icon-analyze__wrapper,
.icon-is-favorite__wrapper {
    width: 20px;
    height: 20px;
    border-radius: 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.icon-analyze__wrapper,
.icon-is-favorite__wrapper {
    background-color: #F2F4F5;
}

.icon-is-favorite__wrapper,
.icon-analyze__wrapper svg {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    fill: var(--bg-gray-middle);
}

.icon-is-favorite__wrapper svg {
    width: 15px;
    height: 15px;
}

.icon-is-favorite__wrapper.active svg {
    fill: var(--main-orange);
}

.top-events-section-item__header-is-favorite {
    margin-right: 5px;
}

.top-events-section-item__header-live {
    color: #fff;
    font-size: var(--font-size-small);
    background-color: var(--main-red);
    padding: 2px 5px;
    border-radius: 5px;
    text-transform: uppercase;
}

.top-events-section-item__header-analyze {
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    background-color: var(--bg-light-grey__green);
}

.top-events-section-item__header-analyze svg {
    width: 12px;
    height: 12px;
}


.top-events-section-item--live__commands,
.top-events-section-item__commands {
    display: flex;
    gap: 20px;
    justify-content: center;
    align-items: center;
    /*align-items: flex-end;*/
}

.top-events-section-item__commands {
    height: 100%;
}

.top-events-section-item--live__command,
.top-events-section-item__command {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex: 1;
}

.top-events-section-item__command .image,
.top-events-section-item--live__command .image {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    overflow: hidden;
    background-color: var(--bg-light-grey__white);
}

.top-events-section-item__command img,
.top-events-section-item--live__command img {
    width: 100%;
    height: 100%;
}

.top-events-section-item__vs,
.top-events-section-item--live__vs {
    font-weight: bolder;
    text-transform: uppercase;
}

.top-events-section-item__commands-names-section,
.top-events-section-item--live__commands-names-section {
    display: flex;
    flex-direction: column;
    gap: 5px;
    border-right: 2px solid var(--bg-light-grey__white);
    padding-right: 5px;
}

.top-events-section-item__command-name.winner,
.top-events-section-item--live__command-name.winner {
    font-weight: bolder;
}

.top-events-section-item--live__command-name {
    display: flex;
    justify-content: space-between;
}

.top-events-section-item__coefficients {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.top-events-section-item__coefficient span:first-child {
    font-size: var(--font-size-smaller);
    font-weight: normal;
}

.top-events-section-item__coefficient {
    border: 2px solid var(--bg-light-grey__white);
    padding: 13px 8px;
    display: flex;
    gap: 15px;
    justify-content: space-between;
    align-items: center;
    border-radius: 8px;
    font-weight: bolder;
    flex: 1;
}

.top-events-section-item--live__time {
    position: relative;
}

.top-events-section-item--live__time-number {
    text-transform: uppercase;
    font-size: var(--font-size-small);
    font-weight: 600;
}

.top-events-section-item--live__time-number span {
    color: var(--text-dark-light);
}

.top-events-section-item--live__time-wrapper {
    height: 3px;
    background: var(--bg-grey_darkest);
}

.top-events-section-item--live__time-line {
    background: var(--bg-main_green);
    height: 3px;
    border-right: 4px solid var(--bg-white_light-dark);
}

.top-events-section-item__commands-names-section {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex: 1 0 auto;
}

.top-events-section-item__divider {
    display: flex;
    width: 7px;
    height: 7px;
}

.top-events-section-item__divider svg {
    width: 100%;
    height: 100%;
    fill: var(--text-black-white);
}

.top-events-section-item__command-name {
    flex: 1 0 45%;
    display: flex;
    align-items: center;
}

.top-events-section-item__command-name .name {
    font-family: var(--font-golos);
    font-size: var(--font-size-small);
    font-weight: 600;
    width: 100%;
}

.top-events-section-item__command-name.right {
    text-align: right;
    justify-content: flex-end;
}

.top-events-section-item__command-name.right .top-events-section-item__command-image {
    margin-right: 0;
    margin-left: 7px;
    order: 1;
}

.top-events-section-item__command-image {
    width: 30px;
    height: 30px;
    background-color: var(--bg-light-grey__white);
    border-radius: 50%;
    margin-right: 7px;
    display: inline-block;
    flex: 0 0 auto;
}

.top-events-section-item__command-image.right {
    order: 1;
}

/*-------------------------------- main section -----------*/
.betting__main-section-events {
    background-color: var(--bg-white-dark);
    border-radius: 10px;
    display: grid;
    gap: 50px;
    position: relative;
}

.betting__main-section-events.top {
    background-color: inherit;
    gap: 20px;
}

.main-section-events__list {
    border-top: 1px solid var(--bg-light-grey__green);
    border-bottom: 1px solid var(--bg-light-grey__green);
    padding: 5px 15px 5px 20px;
}

.main-section-events__title {
    margin: 9px 0 9px 50px;
    text-transform: capitalize;
    font-size: var(--font-size-title);
}

.highlights-events__item {
    padding: 5px 10px;
}

.highlights-events__item:not(:last-child) {
    border-bottom: 1px solid var(--bg-light-grey__white);
}

.highlights-events-item__wrapper {
    display: flex;
    gap: 10px;
}

.highlights-events-item__info {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 10px;
}

.highlights-events-item__info-header {
    display: flex;
    gap: 10px;
    align-items: center;
}

.highlights-events-item__info-header-left {
    flex: 1;
    display: flex;
    gap: 5px;
    align-items: center;
    font-size: var(--font-size-smaller);
}

.highlights-events-item__time {
    text-transform: uppercase;
    color: var(--text-light-grey-white);
    font-weight: 500;
}

.highlights-events-item__time span {
    font-weight: 600;
    color: var(--text-black-white);
}

.highlights-events-item__time.white {
    color: var(--text-light-grey);
}

.highlights-events-item__time.white span {
    color: var(--text-white);
}

.highlights-events-item__tournament-title {
    text-transform: uppercase;
}

.highlights-events-item__is-favorite {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.highlights-events-item__is-favorite svg {
    fill: gray;
    width: 15px;
    height: 15px;
}

.highlights-events-item__tournament-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    overflow: hidden;
    opacity: 1;
}

.highlights-events-item__tournament-icon img {
    width: 100%;
    height: 100%;
}

.highlights-events-item__sport-icon,
.highlights-events-item__info-match-icon {
    display: inline-block;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    overflow: hidden;
}

.highlights-events-item__sport-icon img {
    filter: var(--filter-none-green);
}

.highlights-events-item__sport-icon {
    width: 20px;
    height: 20px;
}

.highlights-events-item__sport-icon-text {
    color: var(--main-red);
    text-transform: uppercase;
    font-weight: 700;
}

.highlights-events-item__tournament-icon {
    background-color: var(--bg-light-grey__white);
}

.highlights-events-item__sport-icon svg {
    fill: grey;
    stroke: grey;
    width: 100%;
    height: 100%;
}

.highlights-events-item__info-matches {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.highlights-events-item__info-match-title {
    text-transform: capitalize;
}

.highlights-events-item__info-match {
    display: flex;
    align-items: center;
    gap: 5px;
}

.highlights-events-item__totals,
.highlights-events-item__coefficients {
    display: flex;
    gap: 10px;
    position: relative;
    padding: 0 15px;
}

.highlights-events-item__totals:before,
.highlights-events-item__coefficients:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    height: 50px;
    width: 1px;
    z-index: 1;
    background-color: var(--bg-light-grey__white);
}

.highlights-events-item__additional-bets-all,
.highlights-events-item__total,
.highlights-events-item__coefficient {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    justify-content: center;
}

.highlights-events-item__coefficient-value {
    border: 2px solid var(--bg-light-grey__white);
    padding: 13px 10px;
    border-radius: 8px;
    font-weight: bolder;
    min-width: 60px;
    min-height: 50px;
    text-align: center;
    cursor: pointer;
}

.highlights-events-item__coefficient-value:empty {
    cursor: default;
}

.highlights-events-item__coefficient-value:empty {
    background-color: var(--bg-light-gray);
    border: 2px solid var(--bg-light-gray);
}

.bet-item.top-event:active,
.bet-item .highlights-events-item__coefficient-value:active,
.bet-item.top-events-section-item__coefficient:active,
.bet-item.top-event:hover,
.bet-item .highlights-events-item__coefficient-value:hover,
.bet-item.top-events-section-item__coefficient:hover {
    border: 2px solid var(--bg-main_green);
    background-color: var(--bg-main_green);
    color: var(--text-white-dark);
}

.highlights-events-item__coefficient-value.up,
.top-events-section-item__coefficient.up {
    background-color: rgba(var(--bg-main_green_rgb), .2);
    border: 2px solid rgba(var(--bg-main_green_rgb), .6);
    position: relative;
}

.highlights-events-item__coefficient-value.up::after,
.top-events-section-item__coefficient.up::after {
    content: "";
    position: absolute;
    top: 6px;
    left: 50%;
    transform: translate(-50%, 0);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 4px 5px 4px;
    border-color: transparent transparent var(--bg-main_green) transparent;
}

.highlights-events-item__coefficient-value.down,
.top-events-section-item__coefficient.down {
    background-color: rgba(var(--main-red_rgb), .2);
    border: 2px solid rgba(var(--main-red_rgb), .6);
    position: relative;
}

.highlights-events-item__coefficient-value.down::after,
.top-events-section-item__coefficient.down::after {
    content: "";
    position: absolute;
    bottom: 6px;
    left: 50%;
    transform: translate(-50%, 0);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 4px 0 4px;
    border-color: var(--main-red) transparent transparent transparent;
}

.highlights-events-item__additional-bets:hover {
    opacity: 0.5;
}

.highlights-events-item__additional-bets {
    display: flex;
    cursor: pointer;
}

.highlights-events-item__additional-bets-all-count {
    padding: 5px 10px;
    font-weight: bolder;
    margin: auto 0;
}

.highlights-events-item__coefficient-bet {
    color: var(--text-light-grey-white);
    font-size: var(--font-size-smaller);
    text-transform: uppercase;
    line-height: 22px;
    font-weight: 600;
    font-family: var(--font-golos);
}

.highlights-events-item__coefficient-bet.mobile {
    display: none;
}

.main-section-events__more {
    border-bottom: 1px solid var(--bg-light-grey__green);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    color: var(--text-green-green);
    text-transform: uppercase;
    font-weight: 600;
    font-family: var(--font-golos);
    letter-spacing: 1.3px;
    cursor: pointer;
}

/*--------------- main section event modal --------*/

.modal.active {
    display: block;
}

.modal {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: 2;
    display: none;
    background: inherit;
    padding-top: 20px;
}

.modal .icon-close:hover {
    opacity: 0.5;
}

.modal .icon-close {
    position: absolute;
    top: 5px;
    right: 5px;
    border-radius: 10px;
    padding: 5px;
    border: 1px solid white;
    color: white;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: var(--font-size-small);
    color: var(--text-black-white);
    border-color: var(--text-black-white);
}

/*--------------------*/

.main-section-events__modal {
    background: var(--bg-white-dark);
}

.main-section-events__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.live-sports-list {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-right: 15px;
}

.live-sports-list__icon-item {
    display: flex;
    align-items: center;
    background: var(--bg-light-gray);
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
    position: relative;
    height: 40px;
    max-width: 40px;
    padding: 8px;
}

.live-sports-list__icon-item:hover,
.live-sports-list__icon-item.active {
    background: var(--text-green-green);
    border-color: var(--text-green-green);
    box-shadow: 0 4px 12px rgba(0, 212, 170, 0.3);
    max-width: 200px;
    padding-right: 6px;
}

.live-sports-list__icon-item:hover .live-sports-list__icon-wrapper,
.live-sports-list__icon-item.active .live-sports-list__icon-wrapper {
    filter: none;

}

.live-sports-list__icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    transition: all 0.5s ease;
    filter: var(--filter-none-green);
}

.live-sports-list__icon-text {
    font-size: 14px;
    font-weight: 300;
    color: var(--text-white-dark);
    opacity: 0;
    transform: translateX(-10px);
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    white-space: nowrap;
    margin-left: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.live-sports-list__icon-item:hover .live-sports-list__icon-text,
.live-sports-list__icon-item.active .live-sports-list__icon-text {
    opacity: 1;
    transform: translateX(0);
}

.live-sports-list__icon-count {
    color: black;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 50%;
    font-size: 12px;
    margin-left: 8px;
    opacity: 0;
    transform: scale(0.8);
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    width: 29px;
    height: 29px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.live-sports-list__icon-item:hover .live-sports-list__icon-count,
.live-sports-list__icon-item.active .live-sports-list__icon-count {
    opacity: 1;
    transform: scale(1);
}

.main-section-events__head {
    display: flex;
    align-items: center;
    padding: 10px 30px;
    background: var(--bg-lightest-gray);
    margin-top: 15px;
}

.main-section-events__list + .main-section-events__head {
    margin-top: 0;
}

.main-section-events__head-title {
    display: flex;
    align-items: center;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.3px;
    font-size: var(--font-size-small);
}

.main-section-events__head-title img,
.main-section-events__head-title svg {
    width: 22px;
    height: 22px;
    margin-right: 10px;
    filter: var(--filter-none-green);
}

.main-section-events__head-link {
    margin-left: auto;
    font-size: var(--font-size-small);
    font-weight: 500;
}

.row-slider__container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.row-slider {
    width: calc(100% - 90px);
}

.row-slider__slide {
    width: calc((100% - 80px) / 9);
    background-color: var(--bg-white-dark);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    padding: 0 5px;
    position: relative;
    min-height: 105px;
}

.row-slider__slide .count {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 35px;
    padding: 3px 5px;
    font-size: var(--font-size-smaller);
    font-weight: 600;
    color: var(--text-light-grey-white);
    background-color: var(--bg-light-gray);
    border-radius: 7px;
}

.row-slider__slide img,
.row-slider__slide svg {
    width: 32px;
    height: 32px;
    margin-top: 20px;
}

.row-slider__slide .title {
    margin: auto 0;
    font-size: var(--font-size-small);
    font-weight: 500;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 2;
}

.row-slider__control.swiper-button-prev,
.row-slider__control.swiper-button-next {
    position: static;
    margin-top: 0;
    color: inherit;
}

.row-slider__control.swiper-button-prev::after,
.row-slider__control.swiper-button-next::after {
    content: none;
}

/*--------------- start-page-event ------------------*/

.two-cols {
    display: flex;
    /*gap: 20px;*/
}

.col-thin {
    max-width: 270px;
}

.col-thin .top-events-section-item__wrapper {
    margin-bottom: 20px;
}

.col-wide {
    display: flex;
    flex-direction: column;
    gap: 20px;
    flex: 1;
    max-width: 100%;
    /*width: calc(100% - 290px);*/
}

.main-description {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 260px;
    border-radius: 10px;
    padding: 20px;
    color: var(--text-white);
}

.main-description .head {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.main-description .head svg,
.main-description .head img {
    width: 22px;
    height: 22px;
}

.main-description .head .title {
    font-weight: 700;
    font-size: var(--font-size-subtitle);
}

.main-description .info {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin: auto 0;
    width: 100%;
}

.main-description .info.wrapped {
    flex-wrap: wrap;
    row-gap: 0;
}

.main-description .current-info {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: var(--font-size-smaller);
}

.main-description .current-info svg {
    width: 12px;
    height: 12px;
    margin: 0 5px;
}

.main-description .time-date {
    text-align: center;
    font-weight: 700;
}

.main-description .time {
    font-size: var(--font-size-title);
}

.main-description .info .text {
    display: flex;
    align-items: center;
    gap: 15px;
    text-transform: capitalize;
    font-weight: 700;
    font-size: var(--font-size-subtitle);
    width: 40%;
}

.main-description .info .text:first-child,
.main-description .info .current-info + .text {
    justify-content: flex-end;
}

.main-description .info img {
    width: 70px;
    height: 70px;
}

.main-description .score {
    display: flex;
    align-items: center;
    font-size: var(--font-size-largest);
    font-weight: 700;
}

.main-description .score span {
    margin: 0 5px;
    font-size: var(--font-size-title);
}

.main-description .team-1 {
    color: var(--text-score-first);
}

.main-description .team-2 {
    color: var(--text-score-second);
}

.main-description .timer {
    display: flex;
    align-items: flex-start;
}

.main-description .timer-col {
    text-align: center;
    min-width: 38px;
}

.main-description .divider {
    font-size: var(--font-size-title);
    font-weight: 700;
    line-height: 16px;
}

.main-description .timer-col div:first-child {
    font-size: var(--font-size-title);
    font-weight: 700;
    line-height: 20px;
}

.main-description .timer-col div:last-child {
    font-size: var(--font-size-smallest);
}

.score-table {
    display: flex;
    gap: 5px;
    text-align: center;
    max-width: 100%;
}

.score-table__scroll-block {
    display: flex;
    gap: 5px;
}

.score-table__col {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.score-table__scroll-block {
    overflow: auto;
}

.score-table__scroll-block::-webkit-scrollbar {
    height: 5px;
    background: transparent;
}

.score-table__scroll-block::-webkit-scrollbar-thumb {
    height: 4px;
    background-color: var(--bg-gray-middle);
    border-radius: 2px;
}

.score-table__row {
    padding: 3px 5px;
    background: rgba(0, 0, 0, .4);
    min-height: 26px;
    font-size: var(--font-size-small);
    white-space: nowrap;
}

.score-table__row:first-child,
.score-table__row:empty {
    background: none;
}

.score-table__row img {
    min-width: 20px;
    height: 20px;
    object-fit: contain;
}

.filters-pannel {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border-radius: 10px;
    background-color: var(--bg-white-dark);
}

.filters-pannel .periods {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
    max-width: 75%;
}

.filters-pannel .search {
    /*flex: 1 0 100px;*/
}

.bets-slider .swiper-slide {
    width: auto;
    padding: 9px 15px;
    font-size: var(--font-size-smaller);
    border-radius: 31px;
    border: 2px solid var(--border-light-gray);
    font-weight: 500;
    cursor: pointer;
}

.bets-slider .swiper-slide.selected {
    background: var(--bg-grey_light-dark);
    font-weight: bolder;
    border-width: 3px;
}

.bets-slider__control {
    top: 0;
    bottom: 0;
    margin: 0;
    color: inherit;
    height: auto;
    width: 45px;
}

.bets-slider__control.swiper-button-disabled {
    opacity: 0;
}

.bets-slider__control svg {
    width: 20px;
}

.bets-slider__control.swiper-button-prev {
    left: 0;
    background: linear-gradient(-90deg, rgba(var(--bg-white_rgb), 0) 0%, rgba(var(--bg-white_rgb), 1) 44%);
}

.bets-slider__control.swiper-button-next {
    right: 0;
    background: linear-gradient(90deg, rgba(var(--bg-white_rgb), 0) 0%, rgba(var(--bg-white_rgb), 1) 44%);
}

.bets-slider__control.swiper-button-prev::after,
.bets-slider__control.swiper-button-next::after {
    content: none;
}

.column-display {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
}

.column-display svg {
    width: 22px;
    height: 22px;
}

.column-display span {
    display: flex;
    color: var(--text-dark-light);
    cursor: pointer;
}

.column-display span.active {
    color: var(--text-dark-white);
}

.show-hide-periods {
    display: flex;
    cursor: pointer;
    transform: rotate(180deg);
}

.show-hide-periods.active {
    transform: rotate(0deg);
}

.show-hide-periods svg {
    width: 22px;
    height: 22px;
}

.dropdown-stakes {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.dropdown-stakes.two-columns .column {
    display: flex;
    flex-direction: column;
    width: calc(50% - 10px);
    gap: 20px;
}

.dropdown-stake {
    width: 100%;
    border-radius: 10px;
    background: var(--bg-white-dark);
    overflow: hidden;
}

.dropdown-stake.hidden {
    max-height: 40px;
}

.dropdown-stake.hidden .sports-subitem-header__arrow-down {
    transform: rotate(0deg);
}

.dropdown-stake__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 15px;
    cursor: pointer;
    background: var(--bg-grey_light-dark);
    border-bottom: 1px solid var(--main-peach);
}

.dropdown-stake__head .sports-subitem-header__arrow-down {
    stroke: var(--text-black-white);
    transform: rotate(180deg);
}

.dropdown-stake__list {
    padding: 10px 15px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.dropdown-stake.columns-2 .top-events-section-item__coefficient {
    flex: 1 1 calc(50% - 5px);
}

.dropdown-stake.columns-3 .top-events-section-item__coefficient {
    flex: 1 1 calc(33% - 5px);
}


/*--------------- end-page-event ------------------*/

/*----------------- my-bets -----------------*/

.my-bets {
    border-radius: 10px;
    overflow: hidden;
    position: sticky;
    top: 10px;
    max-height: 100dvh;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.my-bets.live {
    grid-column: 2;
}

.my-bets__tabs {
    display: flex;
    background-color: var(--bg-white_light-dark);
    font-size: var(--font-size-default);
}

.my-bets__tab-icon svg {
    filter: var(--filter-none-green);
}

.my-bets__tab-icon {
    width: 24px;
    height: 24px;
}

.my-bets__tab {
    padding: 15px 15px;
    cursor: pointer;
    transition: all 0.3s ease;
    flex: 1;
    text-align: center;
    display: flex;
    gap: 5px;
    align-items: center;
    justify-content: center;
    opacity: 0.5;
    text-transform: uppercase;
}

.my-bets__tab.active {
    font-weight: bolder;
    opacity: 1;
}

.my-bets__tab-content {
    display: none;
    padding: 10px 10px 0;
    animation: fadeIn 0.3s ease-in;
    background-color: var(--bg-betslip);
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    max-height: calc(100dvh - 54px);
    overflow: auto;
}

.my-bets__tab-content.history-tab {
    padding-bottom: 20px;
}

.betslip-tab__empty,
.history-tab__empty {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 10px;
    text-align: center;
    padding: 10px 0 20px;
}

.betslip-tab__empty-icon,
.history-tab__empty-icon {
    max-width: 125px;
    margin-bottom: 20px;
}

.betslip-tab__empty-title,
.history-tab__empty-title {
    text-transform: uppercase;
    font-weight: bolder;
    font-size: var(--font-size-subtitle);
}

.my-bets__tab-content.active {
    display: block;
}

.my-bets__tab-content-wrapper {
    overflow: hidden;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    background-color: var(--bg-white_light-dark);
}

.my-bets__inner-tabs {
    display: flex;
    align-items: center;
    width: calc(100% - 20px);
    margin: 0 auto;
    background-color: var(--bg-light-gray);
    border-radius: 10px;
    padding: 4px;
    margin-bottom: 20px;
}

.my-bets__inner-tabs.ver2 {
    background: none;
    padding: 0;
    border-bottom: 2px solid var(--border-gray);
    border-radius: 0;
}

.my-bets__inner-content {
    display: flex;
    flex-direction: column;
    gap: 15px;
    min-height: 300px;
}

.my-bets__inner-tabs .tab {
    text-align: center;
    width: 50%;
    padding: 7px;
    cursor: pointer;
    border-radius: 8px;
    font-size: var(--font-size-small);
}

.my-bets__inner-tabs .tab.active {
    background-color: var(--bg-white_light-dark);
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.23);
    -webkit-box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.23);
    -moz-box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.23);
}

.my-bets__inner-tabs.ver2 .tab {
    border-radius: 0;
}

.my-bets__inner-tabs.ver2 .tab.active {
    background: none;
    box-shadow: none;
    position: relative;
}

.my-bets__inner-tabs.ver2 .tab.active::after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 3px;
    width: 100%;
    background: var(--bg-main_green);
}

.my-bets__item {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.my-bets__item.error .my-bets__item-title > img,
.my-bets__item.error .my-bets__item-title > svg,
.my-bets__item.error .my-bets__item-title span,
.my-bets__item.error .my-bets__bet-description {
    opacity: .3;
}

.my-bets__item-wrapper {
    background-color: var(--bg-white_light-dark);
    border-radius: 10px;
    padding: 6px 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow: hidden;
}

.my-bets__item-title {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: var(--font-size-smaller);
}

.my-bets__item-title img,
.my-bets__item-title svg {
    width: 16px;
    height: 16px;
}

.my-bets__item-title .remove {
    display: flex;
    margin-left: auto;
    cursor: pointer;
}

.my-bets__bet-description {
    font-size: var(--font-size-smaller);
}

.my-bets__teams {
    display: flex;
    align-items: center;
    gap: 5px;
    font-weight: 600;
    font-size: var(--font-size-small);
}

.my-bets__team {
    display: flex;
    align-items: center;
    gap: 5px;
    text-transform: capitalize;
}

.my-bets__team svg,
.my-bets__team img {
    width: 20px;
    height: 20px;
}

.my-bets__coefficient {
    margin-left: auto;
}

.my-bets__note {
    font-size: var(--font-size-small);
    text-align: center;
}

.my-bets__note.success {
    color: var(--text-green-green);
}

.my-bets__item-summ {
    padding: 0 15px;
    background-color: var(--bg-white_light-dark);
    padding-bottom: 5px;
    border-radius: 10px;
    display: flex;
    align-items: center;
}

.my-bets__item-summ input {
    padding: 10px 0 5px;
    width: 100%;
    border: none;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    border-bottom: 2px solid var(--border-light-gray);
    background: none;
    font-size: var(--font-size-small);
    color: var(--text-black-white);
}

.my-bets__item-summ input::placeholder {
    color: var(--text-black-white);
}

.my-bets__item-summ span {
    display: flex;
    padding: 9px 0 5px;
    border-bottom: 2px solid var(--border-light-gray);
    font-size: var(--font-size-small);
}

.my-bets__bet-error {
    font-size: var(--font-size-smaller);
    color: var(--text-white);
    background: var(--main-red);
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 6px 8px;
    position: relative;
    bottom: -6px;
    left: -8px;
    width: calc(100% + 16px);
}

.my-bets__bet-error svg {
    width: 16px;
    height: 16px;
}

.my-bets__item-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 5px;
    padding-bottom: 5px;
    border-bottom: 1px solid var(--border-gray);
}

.my-bets__item-head .type {
    font-size: var(--font-size-small);
    min-width: 50px;
}

.my-bets__item-head .date {
    font-size: var(--font-size-smallest);
}

.my-bets__item-head .status {
    min-width: 60px;
    font-size: var(--font-size-small);
    text-align: center;
    text-transform: uppercase;
    padding: 3px;
    background-color: var(--bg-gray-middle);
    color: var(--text-white);
    border-radius: 6px;
}

.my-bets__item-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 5px;
    padding-top: 5px;
    border-top: 1px solid var(--border-gray);
}

.my-bets__item-footer .item:nth-child(2) {
    text-align: center;
}

.my-bets__item-footer .item:last-child {
    text-align: right;
}

.my-bets__item-footer .text {
    font-size: var(--font-size-smaller);
}

.my-bets__item-footer .item div:not(.text) {
    font-size: var(--font-size-small);
    font-weight: 600;
}

.my-bets__item.win .my-bets__item-head .status {
    background: var(--text-green-green);
}

.my-bets__item.win .my-bets__item-footer .status {
    color: var(--text-green-green);
}

.my-bets__item.loss .my-bets__item-head .status {
    background: var(--main-red);
}

.my-bets__item.loss .my-bets__item-footer .status {
    color: var(--main-red);
}

.remove-all-bets {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: var(--font-size-small);
    cursor: pointer;
}

.remove-all-bets svg {
    width: 17px;
    height: 17px;
}

.bets-payment-block {
    display: flex;
    flex-direction: column;
    position: relative;
    left: -10px;
    width: calc(100% + 20px);
    padding-bottom: 20px;
    background: var(--bg-white_light-dark);
}

.bets-payment-block__notification {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 8px 19px;
    font-size: var(--font-size-small);
    color: var(--text-dark-dark);
    background: var(--bg-main_green);
}

.bets-payment-block__notification.success {
    background: var(--bg-main_green);
}

.bets-payment-block__notification.error {
    background: var(--main-red);
}

.bets-payment-block__notification svg,
.bets-payment-block__notification img {
    width: 16px;
    height: 16px;
}

.bets-payment-block__summ {
    padding: 8px 19px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.bets-payment-block__summ-item:not(.input-container) {
    text-align: center;
    padding: 10px 5px;
    background-color: var(--bg-grey_light-dark);
    border-radius: 10px;
    cursor: pointer;
    text-transform: uppercase;
    font-size: var(--font-size-small);
}

.bets-payment-block__summ-item:not(.input-container).active {
    background-color: var(--bg-main_green);
    color: var(--text-dark-light);
}

.bets-payment-block__summ-item.input-container {
    display: flex;
    align-items: center;
    grid-column: 1 / 3;
}

.bets-payment-block__summ-item.input-container input {
    padding: 5px 0 10px;
    width: 100%;
    border: none;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    background: none;
    border-bottom: 2px solid var(--border-light-gray);
    font-size: var(--font-size-small);
    color: var(--text-black-white);
}

.bets-payment-block__summ-item.input-container input::placeholder {
    color: var(--text-black-white);
}

.bets-payment-block__summ-item.input-container span {
    display: flex;
    padding: 5px 0 9px;
    border-bottom: 2px solid var(--border-light-gray);
    font-size: var(--font-size-small);
    text-transform: uppercase;
}

.bets-payment-block__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 19px;
}

.bets-payment-block__summary-item {
    font-size: var(--font-size-small);
    color: var(--text-light-grey-white);
}

.bets-payment-block__summary-item:last-child {
    color: var(--text-green-green);
    text-align: right;
}

.bets-payment-block__summary-item span {
    display: block;
}

.bets-payment-block__btn:disabled {
    opacity: 0.75;
    cursor: default;
}

.bets-payment-block__btn {
    font-family: var(--font-golos);
    font-size: var(--font-size-default);
    width: calc(100% - 38px);
    border: none;
    outline: none;
    border-radius: 10px;
    background-color: var(--main-peach);
    text-transform: uppercase;
    color: var(--text-white);
    padding: 20px 10px;
    font-weight: 700;
    margin: 8px auto 0;
    cursor: pointer;
}

.left-sidebar-btn {
    display: none;
    align-items: center;
}

.left-sidebar-btn svg {
    width: 25px;
    height: 25px;
}

.open-bets-btn {
    display: none;
    align-items: center;
    margin-left: auto;
    text-transform: uppercase;
}

.open-bets-btn svg {
    width: 32px;
    height: 32px;
}

.overflow-layer.active {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 20;
    background-color: rgba(0, 0, 0, .7);
}

/*---------------- change theme ------------------*/
.header__tabs--theme {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 60px;
    height: 32px;
    padding: 4px;
    border-radius: 100px;
    background-color: var(--bg-grey_light-dark);
    position: relative;
    margin: 0 5px;
    cursor: pointer;
}

.header__tabs--theme span {
    width: 25px;
    height: 25px;
}

.header__tabs--theme span svg {
    width: 100%;
    height: 100%;
}

.header__tabs--theme::after {
    transition: all 0.3s linear;
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    z-index: 2;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    transform: translate(0);
    background-color: #fff;
}

.header__tabs--theme.dark::after {
    left: calc(100% - 28px);
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media only screen and (max-width: 5000px) {
    .row-slider__slide {
        width: calc((100% - 60px) / 7);
    }

    .highlights-events-item__totals {
        display: none;
    }

    .my-bets {
        min-width: 300px;
        max-width: 320px;
    }

    .betting__main-content {
        display: flex;
        flex-wrap: wrap;
        width: calc(100% - 320px);
    }

    .betting__container {
        display: flex;
    }

    .betting__left-sidebar {
        max-width: 300px;
        width: 100%;
        min-width: 300px;
    }

    .betting__main-section-events {
        display: flex;
        flex-direction: column;
        width: calc(100vw - 700px);
    }
}

@media only screen and (max-width: 1550px) {

    .left-sidebar-btn {
        display: flex;
    }

    .betting__left-sidebar {
        position: fixed;
        top: 0;
        right: 100%;
        bottom: 0;
        background: var(--bg-lightest-grey_dark);
        transition: .3s;
        z-index: 22;
    }

    .betting__left-sidebar .left-sidebar-btn {
        margin-left: auto;
    }

    .betting__left-sidebar.active {
        right: calc(100% - 300px);
    }

    .highlights-events-item__totals {
        display: flex;
    }

    .betting__header {
        padding-left: 20px;
    }

    .betting__main-section-events {
        width: calc(100vw - 380px);
    }

    .betting__main-content {
        width: 100%;
    }
}

@media only screen and (max-width: 1250px) {
    .my-bets {
        position: fixed;
        left: 100%;
        top: 0;
        bottom: 0;
        max-width: 360px;
        width: 360px;
        z-index: 22;
        transition: .3s;
        opacity: 0;
        pointer-events: none;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .my-bets.active {
        left: calc(100% - 360px);
        opacity: 1;
        pointer-events: all;
    }

    .my-bets__tab-content.active {
        height: calc(100dvh - 54px);
        display: flex;
        flex-direction: column;
    }

    .betslip-tab__empty,
    .history-tab__empty {
        margin: auto 0;
    }

    .my-bets__inner-contents,
    .my-bets__inner-content {
        height: 100%;
    }

    .bets-payment-block {
        margin-top: auto;
    }

    .betting__main-section-events {
        width: 100%;
    }

    .open-bets-btn {
        display: flex;
    }

    .my-bets__tabs .open-bets-btn {
        margin-right: 10px;
    }
}

@media only screen and (max-width: 991px) {
    .my-bets {
        position: fixed;
        left: 100%;
        top: 0;
        bottom: 0;
    }

    .row-slider__slide {
        width: calc((100% - 50px) / 6);
    }

    .betting__main-section-events {
        display: block;
    }

    .betting__main-content {
        /*display: block;*/
    }

    .betting__container {
        display: block;
    }

    .row-slider__container {
        margin-bottom: 20px;
    }

    .top-events-section__control,
    .row-slider__control {
        display: none;
    }

    .row-slider {
        width: 100%;
    }

    .highlights-events-item__totals {
        display: none;
    }

    .top-events-section {
        margin-bottom: 20px;
    }

    .col-thin {
        display: none;
    }

    .col-wide {
        width: 100%;
    }
}

@media only screen and (max-width: 768px) {
    .row-slider__slide {
        width: calc((100% - 30px) / 4);
    }

    .highlights-events-item__additional-bets {
        display: none;
    }

    .highlights-events-item__wrapper {
        flex-wrap: wrap;
    }

    .highlights-events-item__coefficients {
        width: 100%;
        padding: 0;
        order: 2;
    }

    .highlights-events-item__is-favorite {
        order: 1;
    }

    .highlights-events-item__totals:before,
    .highlights-events-item__coefficients:before {
        content: none;
    }

    .highlights-events-item__coefficient {
        width: calc((100% - 20px) / 3);
    }

    .highlights-events-item__coefficient-value {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .highlights-events-item__coefficient-bet {
        display: none;
    }

    .highlights-events-item__coefficient-bet.mobile {
        display: block;
    }

    .main-section-events__list {
        padding: 5px 15px;
    }

    .highlights-events__item {
        padding: 15px 5px;
    }

    .main-section-events__head {
        padding: 10px 20px;
    }

    .main-section-events__title {
        margin-left: 20px;
    }

    .main-section-events__title {
        font-size: var(--font-size-subtitle);
    }

    .filters-pannel {
        flex-wrap: wrap;
    }

    .filters-pannel .periods {
        width: 100%;
        max-width: 100%;
    }

    .filters-pannel .search {
        width: calc(100% - 96px);
    }
}

@media only screen and (max-width: 560px) {
    .my-bets {
        width: 100%;
        max-width: 100%;
        right: 0;
        left: 0;
        top: 100%;
    }

    .my-bets.active {
        width: 100%;
        right: 0;
        left: 0;
        top: 0;
    }

    .highlights-events-item__info-header-left {
        flex-wrap: wrap;
    }

    .highlights-events-item__separator {
        color: rgba(0, 0, 0, 0);
        height: 0;
        font-size: 0;
        width: 100%;
    }

    .highlights-events-item__info-header {
        align-items: flex-start;
    }

    .live-sports-list {
        display: none;
    }

    .row-slider__slide {
        width: calc((100% - 10px) / 2.5);
    }

    .main-description .head .title {
        font-size: var(--font-size-default);
        text-align: center;
    }

    .main-description .info {
        gap: 10px;
        flex-wrap: wrap;
        margin: 20px 0;
    }

    .main-description .info .text {
        font-size: var(--font-size-small);
        gap: 5px;
    }

    .main-description .score,
    .main-description .time-date {
        width: 100%;
        order: 1;
        justify-content: center;
    }

}

@media only screen and (max-width: 400px) {
    .dropdown-stake.columns-2 .top-events-section-item__coefficient,
    .dropdown-stake.columns-3 .top-events-section-item__coefficient {
        flex: 1 1 100%;
    }
}
