/*
 * arena216.net site overrides, loaded after the bundle's stylesheets from
 * resources/views/welcome.blade.php (cache-busted with nextjs.asset_version).
 *
 * The bundle is mbet24's, recoloured with arena216's palette. arena216's
 * primary buttons are dark text on green, but the mbet24 skin repaints a few
 * "primaryBtn" elements with a dark grey background (header balance on
 * phones, filter dropdowns). With the dark text inherited from primaryBtn the
 * balance became unreadable; give those elements white text.
 */
.headerBalanceBtnMobile,
.headerBalanceBtnMobile *,
button.headerBalanceBtn,
button.headerBalanceBtn *,
.headerDropdownBtn,
.headerDropdownBtn *,
.providerFilter button,
.sortFilter button {
    color: #fff !important;
}

/* Header logo: the skin sets 36px desktop / 30px mobile; a little bigger. */
/* The skin defines these on body{}, so match that and win with !important. */
body {
    --header-logo-height: 44px !important;
    --header-logo-mobile-height: 36px !important;
}

/*
 * Phone header, logged in: the bundle renders a Deposit link right after the
 * balance button but ships it with Tailwind's "hidden" class (desktop shows
 * its own Deposit button next to the balance). Show it, sized like the
 * balance button beside it.
 */
.headerLoggedInButnsMobileContainer .headerDepositBtnMobile {
    display: flex !important;
    font-size: var(--btn-mob-font-size);
    padding: var(--btn-mob-padding-y) var(--btn-mob-padding-x);
    line-height: var(--btn-mob-line-height);
    white-space: nowrap;
}