/* Generating Color Pack*/
:root {
  --color-highlight: #FFFFFF;
  --filter-theme: invert(18%) sepia(76%) saturate(3276%) hue-rotate(212deg) brightness(92%) contrast(103%);
  --color-general-text: #000;
  --color-general-button: #FFFFFF;
  --color-secondary: #003487;
  --color-secondary-bg: #FFFFFF;
  --color-wallet-bg: #f2f2f7;
  --color-loader: #FFFFFF;
  --color-btm-navbar-bg: rgba(249, 249, 249, 0.98);
  --color-btn-navbar-text: #1f1f1f;
  --color-quick-action-bg: #FFFFFF;
  --color-qa-text: #6c6c6c;
  --color-newsfeed-text: #0054FE;
  --color-newsfeed-bg: #0054FE26;
  --color-newsfeed-border: #0054FE33;
  --filter-newsfeed: invert(18%) sepia(76%) saturate(3276%) hue-rotate(212deg) brightness(92%) contrast(103%);
  --filter-general-button: invert(100%) sepia(0%) saturate(7447%) hue-rotate(166deg) brightness(103%) contrast(101%);
  --height-promotion-img: 140px;
  --width-promotion-img: 300px;
  --font-family: 'Inter';
  --domain-url: '';
  --app-path: '';
  --bg-img: 'url('/etronapp/wallet/images/pictures/home_bg.jpg') center center / cover';
  --hot-game-img: '';
}

*:not(.fas, .fa, .fa-solid) {
	font-family: var(--font-family) !important;
}

body {
    font-family: 'Overpass' !important;
}

.gp-btn-bg {
	background: linear-gradient(90deg, #4CCD81 0%, #079E4D 100%) !important;
}

.gp-n-btn-bg {
	background: linear-gradient(90deg, #EF5F5E 0%, #9e0707 100%) !important;;
}

.color-highlight {
  color: var(--color-highlight) !important;
}

.color-general-text {
	color: var(--color-general-text) !important;
}

.color-general-button {
	color: var(--color-general-button) !important;
}

.bg-highlight-secondary {
	background-color: var(--color-secondary-bg) !important;
}

.bg-highlight {
  background-color: var(--color-highlight) !important;
  color: #FFF !important;
}

.bg-general-button {
	background-color: var(--color-general-button) !important;
}

.border-highlight {
  border-color: var(--color-highlight) !important;
}

.gradient-highlight {
  background-image: linear-gradient(to bottom, #327ABF, var(--color-highlight)) !important;
}

.cursor-p {
	cursor: pointer;
}

.footer-bar-2 .active-nav,
.footer-bar-5 strong,
.footer-bar-4 strong,
.splide__pagination__page.is-active {
  background-color: var(--color-highlight) !important;
}

.footer-bar-1 .active-nav i,
.footer-bar-1 .active-nav span,
.footer-bar-3 .active-nav i {
  color: var(--color-highlight) !important;
}

.form-floating-over > .form-control:focus ~ label {
  color: var(--color-highlight);
}

.form-floating-over > .form-control:not(:placeholder-shown) ~ label {
  color: var(--color-highlight);
}

.form-floating-over > .form-select ~ label {
  color: var(--color-highlight);
}

.color-highlight {
  color: var(--color-highlight);
}

.color-highlight-general-text {
	color: #FFF !important;
}

.filter-highlight {
	filter: var(--filter-theme);
}

.filter-newsfeed {
	filter: var(--filter-newsfeed);
}

.filter-highlight-gray {
	filter: invert(43%) sepia(3%) saturate(4%) hue-rotate(4deg) brightness(96%) contrast(91%);
}

.filter-white {
	filter: invert(100%) sepia(0%) saturate(7447%) hue-rotate(166deg) brightness(103%) contrast(101%);
}

.filter-general-button {
	filter: var(--filter-general-button);
}

.bg-highlight {
  background-color: var(--color-highlight);
  color: #FFF !important;
}

.bg-highlight-light {
  background-color: #E6F6FF !important;
  color: var(--color-highlight) !important;
}

.bg-highlight-dark {
	background-color: var(--color-secondary) !important;
	color: #FFF !important;
}

.btn-highlight {
	background: var(--color-highlight) !important;
    border: 1px solid var(--color-secondary) !important;
    color: #FFF;
}

.interest-check input:checked ~ label {
  color: #FFF !important;
  background-color: var(--color-highlight) !important;
}

.header {
	background-color: var(--color-highlight) !important;
}

.header .header-title {
	color: white !important;
}

.header .header-icon {
	color: white !important;
}

.promotion-item-img {
	width: var(--width-promotion-img) !important;
	height: var(--height-promotion-img) !important;
}