:root {
	--bg-gradient-primary: linear-gradient(to bottom, #ff6dff, #ff6dff);
	--bg-gradient-secondary: linear-gradient(180deg, #2b2b2b 0%, #111 100%);
	--br-primary: var(--text-primary);
	--br-secondary: #d9d9d9;
	--bg-white: #ffffff;
	--bg-white-2: #f8f8f8;
	--bg-black: #111111;
	--bg-black-2: #1b1b1b;
	--text-primary: #ff6dff;
	--text-black: #000000;
	--text-white: #ffffff;
	--sidebar-game-column: 3;
	--panel-column: 4;
	--maintain-opacity: 50%;
	--text-contrast: #ffffff;
}

/* Combining Tailwind's @apply with standard CSS */

.common__input {
	background: var(--bg-white);
	border: var(--br-primary) 2px solid;
	color: var(--text-black);
}

.common__btn-primary {
	background: var(--bg-gradient-primary) !important;
	color: var(--text-contrast);
}

.common__btn-secondary {
	background: linear-gradient(to bottom, #ffffff, #e3e3e3);
	color: var(--text-primary);
}

.dark .common__btn-secondary {
	background: var(--bg-gradient-secondary);
	border: var(--br-primary) 2px solid;
	color: var(--text-contrast);
}

.common__text {
	color: var(--text-primary);
}

.tab-container {
	background: var(--bg-gradient-primary);
	color: var(--text-white);
}

.tab-container__tab-btn {
	background: var(--bg-white);
	color: var(--text-primary);
}

.dark .tab-container__tab-btn {
	background: var(--bg-black);
	color: var(--text-contrast);
}

.panel-container__panel {
	display: grid;
	grid-template-columns: repeat(var(--panel-column), minmax(0, 1fr));
	gap: 0.25rem;
}

.sidebar-container__game {
	display: grid;
	grid-template-columns: repeat(var(--sidebar-game-column), minmax(0, 1fr));
	gap: 0.25rem;
}

.game-c-container__search {
	background: var(--bg-white-2);
	border: var(--br-primary) 2px solid;
	color: var(--text-black);
}

.register-container__register-step {
	background: var(--bg-gradient-primary);
}

.c-profile-container__steps {
	background: var(--bg-gradient-primary);
	color: var(--text-black);
}

.deposit-container__option-btn--active {
	background: var(--bg-gradient-primary);
	color: var(--text-contrast);
}

.deposit-container__btn-container--active {
	border: var(--br-primary) 2px solid;
}

.deposit-container__btn-container--inactive {
	border: none;
}

.deposit-container__bank-btn--active,
.withdraw-container__bank-btn--active {
	background: var(--text-primary);
	color: var(--text-contrast);
}

.dark .deposit-container__bank-btn--active,
.dark .withdraw-container__bank-btn--active {
	background: var(--text-primary);
	color: var(--text-contrast);
}

.deposit-container__form-qr {
	border: var(--br-primary) 2px solid;
}

.withdraw-container__options-btn--active {
	background: var(--bg-gradient-primary);
}

.daily-container__btn {
	border: var(--br-primary) solid 2px;
}

.u-wallet-container__win-status {
	background: var(--bg-gradient-primary);
	color: var(--text-white);
}

.daily-modal-container__btn {
	border: var(--br-primary) 2px solid;
}

.referral-container__report-head {
	background: var(--bg-gradient-primary);
	color: var(--text-contrast);
}

.referral-container__steps-head {
	background: var(--bg-gradient-primary);
	color: var(--text-contrast);
}

.referral-container__steps-icon {
	background: var(--bg-gradient-primary);
}

.history-container__btn {
	border: var(--br-primary) 2px solid;
}

.history-container__table-container {
	width: 100%;
	overflow: auto;
	border-radius: 1rem 1rem 1rem 1rem;
	border: var(--br-primary) 2px solid;
}
.history-container__table-container th,
.history-container__table-container tfoot {
	background: var(--bg-gradient-primary);
	padding: 0.5rem 0 0.5rem 0;
	font-size: 12px;
	color: var(--text-contrast);
}

.history-container__table-container td {
	border-top: 1px solid var(--text-primary);
	border-bottom: 1px solid var(--text-primary);
	padding: 0.5rem; /* 2px */
	text-align: center;
	font-size: 0.75rem; /* text-xs */
}

.referral-modal-container__tab--active {
	background: var(--bg-gradient-primary);
	color: var(--text-contrast);
	border: none;
}

.referral-modal-container__table th {
	background: var(--bg-gradient-primary);
	color: var(--text-white);
}

.referral-modal-container__table thead,
.referral-modal-container__table tbody {
	border: 2px solid var(--br-primary);
}

.promo-modal-container__time {
	background: var(--bg-gradient-primary);
	color: var(--text-contrast);
}

.tips-container__even-row {
	background: var(--bg-gradient-primary);
}

.tourney-container__odd-row {
	background: var(--bg-gradient-primary);
}

.vip-container__tandc {
	border: var(--br-primary) 2px solid;
}

.referral-component-container__btn {
	color: var(--text-white);
}

.u-wallet-container__clear-btn {
	background: var(--bg-gradient-primary);
	color: var(--text-white);
}

.navbar__img {
	max-height: 3rem;
}
