@import url(../css/font.css);
@import url(../css/reset.css);
@import url(../css/header.css);
@import url(../css/sidebar-nav.css?v=1.0.2);
@import url(../css/footer.css?v=1.0.1);
@import url(../css/profile-dropdown.css);
@import url(../css/base.css);
@import url(../css/components/checkbox.css);
@import url(../css/components/form-components.css);
@import url(../css/components/buttons.css);
@import url(../css/components/account-actions.css);
@import url(../css/components/change-password-modal.css);
@import url(../css/components/alert.css);
@import url(../css/components/page-heading.css);
@import url(../css/components/breadcrumb.css);
@import url(../css/components/data-table.css);
@import url(../css/components/winning-slider.css);
@import url(../css/components/casino-hero.css);
@import url(../css/components/winning-numbers.css);

body{
    background-color: var(--color-page-bg);
}
.modal-backdrop{
    --bs-backdrop-zindex: 1098;
    --bs-backdrop-bg: rgba(233, 246, 253, 0.56) !important;
    --bs-backdrop-opacity: 1 !important;
    backdrop-filter: blur(8px) !important;
}
html {
    scrollbar-gutter: stable;
}
.modal{
    z-index: 1099;
}
.swiper-slide a {
    border-color: transparent;
}
.container-fluid .container-fluid {
    padding: 0;
}
section.casino-hero.casino-hero--home .container-fluid {
    padding: 0 5px;
}

.casino-page-hero {
    margin: 0 -40px;
    padding: 0px;
    background: #E9F6FD;
}

.casino-page-hero>.container-fluid,
.casino-page-hero>div {
    padding-inline: var(--space-40);
}

.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

body.overlay {
    position: relative;
    min-height: 100dvh;
}

section:not(:last-child) {
    /* background: #E9F6FD; */
    position: relative;
    padding-bottom: 40px;
}

.indent strong.black-bold {
    color: var(--color-dark);
    font-weight: var(--font-weight-bold);
}

section.bg-overlay {
    width: 100%;
    background: linear-gradient(180deg, #E9F6FD 5%, #E9F6FD00 50%);
    min-height: 350px;
}

main {
    overflow: hidden;
}
main:not(.auth-page) {
    overflow: hidden;
    padding-top: 140px !important;
}



.site-header .inner .header-items .desktop-header-top-nav .dropdown .dropdown-content.open,
.site-header .inner .header-items .desktop-header-top-nav .menu-dropdown .menu-dropdown-content.open {
    max-height: calc(100vh - 80px);
    overflow: auto;
}

.inner {
    width: 100%;
    max-width: none;
    /* padding: 0 20px; */
    margin: 0 auto;
}

.clear:after {
    content: "";
    display: table;
    clear: both;
}

.inline {
    display: inline-block;
}

.site-header .inner .header-items>.login-header .login-actions input[type="text"],
.site-header .inner .header-items>.login-header .login-actions input[type="password"] {
    display: none;
}

.form-check {
    color: var(--color-dark);
    font-size: var(--font-size-14);
    font-weight: var(--font-weight-medium);
    display: flex;
    align-items: center;
    gap: 12px;
}

.form-check .form-check-input[type=checkbox] {
    width: 20px;
    height: 20px;
}

.form-check>span.form-check-input {
    display: inline-flex;
    flex: 0 0 auto;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.form-check .form-check-input:focus {
    box-shadow: none;
}

.form-check-input:checked {
    background-color: var(--color-primary-blue);
    border-color: var(--color-primary-blue);
}

.form-check .form-check-input {
    margin-top: 0;
}

span.error-text {
    flex: 0 0 100%;
}

.form-dropdown {
    width: 100%;
}
.change-password-modal__actions button {
    height: 42px;
    font-size: 16px;
    font-weight: 400 !important;
}

table tr:last-child td:first-child {
    border-radius: 0px 0px 0px 8px;
}
table tr:last-child td:last-child {
    border-radius: 0px 0px 8px 0px;
}

table tr:first-child th:first-child {
    border-radius: 8px 0px 0px 0px;
}
table tr:first-child th:last-child {
    border-radius: 0px 8px 0px 0px;
}

.toast-container{
    top: 120px;
}

/* Casino game thumbnail blurred background effect */
img.bg-blr-img {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    filter: blur(6px) !important;
    z-index: 0 !important;
    opacity: 0.9;
}

.casino-library__card > img:not(.bg-blr-img) {
    position: relative !important;
    z-index: 1 !important;
    object-fit: contain !important;
    width: 100% !important;
    height: 100% !important;
}

/* Home page game rails: thumbnails are resized to fill their square tile, nothing letterboxed or cropped */
section.casino-games .casino-games__thumb img:not(.bg-blr-img),
section.hot-games .hot-games__thumb img:not(.bg-blr-img),
section.new-games .new-games__thumb img:not(.bg-blr-img),
section.jackpot-games .jackpot-games__thumb img:not(.bg-blr-img),
section.promo-games .promo-games__thumb img:not(.bg-blr-img) {
    position: relative !important;
    z-index: 1 !important;
    object-fit: fill !important;
    width: 100% !important;
    height: 100% !important;
}

section.casino-games .casino-games__thumb img.bg-blr-img,
section.hot-games .hot-games__thumb img.bg-blr-img,
section.new-games .new-games__thumb img.bg-blr-img,
section.jackpot-games .jackpot-games__thumb img.bg-blr-img,
section.promo-games .promo-games__thumb img.bg-blr-img {
    display: none !important;
}

section.casino-games .casino-games__thumb,
section.hot-games .hot-games__thumb {
    position: relative !important;
    overflow: hidden !important;
}

.page-register-profile .dropdown-menu.auth-date__menu.show::after {
    content: "abc";
    position: absolute;
    margin-top: 20px;
    color: transparent;
}
/* @media only screen and (min-width: 2560px){
    .container-fluid:not(.auth-page){
        max-width: 2560px !important;
    }
} */
@media only screen and (min-width: 1500px){
    .container-fluid:not(.auth-page){
        max-width: 1440px !important;
    }
    .site-header .container-fluid {
        max-width: 100% !important;
    }
}


@media only screen and (max-width: 575px) {

    main.lotto-page,
    .lotto-page section,
    .lotto-page .container-fluid,
    .lotto-page .inner,
    .lotto-page .page,
    .lotto-page .lottorow,
    .lotto-page .lottocol2 {
        border-radius: 0px;
    }
}

@media only screen and (max-width: 1199px) {
    html.no-scroll,
    body.no-scroll {
        overflow: hidden;
        /* height: 100dvh; */
        overscroll-behavior: none;
    }

    html.is-ipad body.no-scroll {
        position: fixed;
        left: 0;
        right: 0;
        width: 100%;
    }

    body.header-inbox-open {
        overflow: hidden;
    }
    
    main:not(.auth-page) {
        padding-top: 80px !important;
    }
}

/* Keep Bootstrap's modal scroll lock without shifting the page horizontally. */
body.modal-open {
    padding-right: 0 !important;
}

/* Prevent iOS/iPadOS from scrolling the page behind any open popup. */
html.popup-scroll-locked,
html.popup-scroll-locked body {
    overflow: hidden !important;
    overscroll-behavior: none;
}

html.popup-scroll-locked body {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
}
