@font-face {
    font-family: 'Inter';
    src:         url('/fonts/Inter_18pt-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style:  normal;
}

@font-face {
    font-family: 'Inter';
    src:         url('/fonts/Inter_18pt-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style:  normal;
}

@font-face {
    font-family: 'Inter';
    src:         url('/fonts/Inter_18pt-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style:  normal;
}

@font-face {
    font-family: 'Inter';
    src:         url('/fonts/Inter_18pt-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style:  normal;
}
body.custom-bg {
    background: url(../../img/auth_page/sims2travel-bg.png) no-repeat center center fixed;
    background-size: cover;
}

body.custom-bg .container .uri-logo .logo-image {
    display: none;
}

body.custom-bg .container .uri-logo::before {
    content: '';
    display: inline-block;
    width: 350px;
    height: 77px;
    background-image: url('../../img/auth_page/sims2travel-auth-logo.svg');
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-bottom: 50px;
    margin-top: -30px;
}
#sign-in .forgot-password-url {
    color: var(--primary);
}
#sign-in input[type=checkbox]:checked + label.remember-me-label:before {
    background-color: var(--primary);
    border-color: var(--primary);
}
#header .logo .logo-img,
.logo-image {
    width: 204px;
    height: 45px;
    margin-top: 10px;
}
#header #user-details-mobile-menu li a svg > path {
    fill: var(--white);
}

#language-wrapper {
    display: none;
}

.btn-outline-primary:hover {
    color: var(--white);
}

.btn-outline-primary.disabled:hover {
    color: var(--gray-300);
}

#recovery-password-wrapper .reset-password:hover, #recovery-password-wrapper .recovery-password-button:hover, #sign-up .register-button:hover, #sign-in .login-button:hover {
    background-color: var(--primary-hover);
}

.btn-outline-primary:focus, .btn-outline-primary.focus {
    box-shadow: none;
}

body .sidebar-nav ul li.active a {
    background-color: var(--leftbar-backgroud-hover) !important;
}

body .sidebar-nav ul li.activate-sim-hotspot:hover a, body .sidebar-nav ul li.buy-bundles:hover a {
    background: none !important;
}
body .platform-management {
    color: var(--white) !important;
}

#currency-and-language .current-lang,
#currency-and-language .vertical-line,
#currency-and-language .dropdown-menu .sub-menu:first-of-type {
    display: none !important;
}

#loader-background > div {
    display: none;
}
#loader-background .loader-circles {
    display:        flex!important;
}
#loader-background > div > img {
    display: none;
}
body .sidebar-nav ul li.activate-sim-hotspot a, body .sidebar-nav ul li.buy-bundles a {
    border: 1px solid var(--white) !important;
}
body .sidebar-nav ul li.buy-bundles a > svg path {
    fill: var(--white);
}
body #sidebar-menu .date-content .time,
body #sidebar-menu .date-header,
body #sidebar-menu .date-content .date,
body #sidebar-menu .date-content .semicolon {
    color: var(--indigo) !important;
}
.jsgrid-header-row > .jsgrid-header-cell:hover {
    color: var(--url-color);
}
.jsgrid-header-row > .jsgrid-header-cell:hover .custom-sort-icon > svg > path {
    fill: var(--url-color) !important;
}
#content-wrapper .jsgrid-table .jsgrid-header-cell:hover svg path{
    fill: var(--url-color) !important;
}

.btn,
.button,
#all-esim-section .show-all-button,
body .sidebar-nav ul li.activate-sim-hotspot a,
body .sidebar-nav ul li.buy-bundles a {
    border-radius: 10px !important;
}
body .sidebar-nav hr {
    border-top: 1px solid #FFF !important;
}
#currency-and-language .dropdown-menu .language-list li.active > label,
#currency-and-language .dropdown-menu .currencies-list li.active > label,
#user-details-mobile-menu .dropdown-menu .language-list li.active > label,
#user-details-mobile-menu .dropdown-menu .currencies-list li.active > label {
    color: var(--soft-orange);
}
#header #user-details-mobile-menu li.currency-and-language-item.partner-language-dd,
#currency-and-language.partner-language-dd{
    display:none;
}
@media only screen and (min-width: 993px) {
    #header .dropdown-menu {
        min-width: 135px !important;
    }
    #user-details-mobile-menu .dropdown-menu, #currency-and-language .dropdown-menu, .language-dropdown-menu {
        width: 135px !important;
    }
    [dir=ltr] #currency-and-language .dropdown-menu.show, [dir=ltr] .language-dropdown-menu.show {
        transform: translate3d(-12px, 52px, 0px) !important;
    }
}
@media only screen and (max-width: 993px) {
    #header #user-details-mobile-menu .balance-name,
    #header #user-details-mobile-menu .balance-usd,
    #header .user-name {
        color: var(--white) !important;
    }
    #header #user-details-mobile-menu button.logout:hover .fas, #header #user-details-mobile-menu button.logout:hover span {
        color: var(--white);
    }
    #user-details-mobile-menu, #mobile-menu {
        background: var(--leftbar-backgroud);
    }
    #header .mobile-menu-button {
        background-color: var(--leftbar-backgroud);
    }
    #header #user-details-mobile-menu li .main-title, #header #mobile-menu li .main-title {
        color: var(--white);
    }
    #header #mobile-menu li.last-nav-item {
        border-top: 1px solid var(--white) !important;
    }
    #header #mobile-menu li.buy-bundles, #header #mobile-menu li.activate-sim-hotspot {
        border: 1px solid var(--white) !important;
    }
    
    #header hr {
        border-top: 1px solid var(--white);
    }
    
    #header #user-details-mobile-menu button.logout,
    #header #user-details-mobile-menu button.logout,
    #header #user-details-mobile-menu li a i,
    #header #user-details-mobile-menu button.logout .fas,
    #header #user-details-mobile-menu .account-name,
    #header #user-details-mobile-menu li a,
    .mini .language-dropdown-menu.dropdown-menu,
    .mini .language-dropdown-menu.dropdown-menu .currencies-list li > label
    {
        color: var(--white)!important;
    }
    .mini .language-dropdown-menu.dropdown-menu .currencies-list li.active > label
    {
        color: var(--cyan)!important;
    }
    #header #user-details-mobile-menu .arrow::after,
    #header #user-details-mobile-menu .arrow::after
    {
        border-color: var(--white)!important;
    }
    #user-details-mobile-menu .language-dropdown-menu {
        background-color: unset!important;
    }
    #user-details-mobile-menu .language-currency-dropdown-menu .sub-menu:first-of-type {
        display: none;
    }
    .mini .language-dropdown-menu.dropdown-menu .currencies-list li.active > label {
        color: var(--soft-orange) !important;
    }
}

@media only screen and (max-width: 768px) {
    #header .user-name {
        color: var(--white);
    }
}