/* Christmas palette shared by the Helix lobby dialogs. */
:is(.helix-holiday-modal, #page-login.auth-modal-page, #page-cadastro.auth-modal-page) {
  --holiday-ivory: #fff7ef;
  --holiday-muted: #ecc6ba;
  --holiday-gold: #ffdc77;
  --holiday-ink: #451720;
  --holiday-edge: #e9a25580;
  --holiday-field: #42131f;
  --holiday-panel: linear-gradient(155deg, #722434, #461423);
  --holiday-button: linear-gradient(180deg, #fff2b0 0%, #ffd561 46%, #f4aa2e 100%);
  --holiday-button-shadow: inset 0 1px #fff9d2, inset 0 -2px #a555283b, 0 3px #a55721, 0 7px 16px #28060f50;
  --holiday-surface:
    radial-gradient(ellipse at 88% 0%, #b5463a66, transparent 48%),
    radial-gradient(ellipse at 6% 0%, #bd2c4266, transparent 60%),
    repeating-linear-gradient(135deg, #fff1bf06 0 1px, transparent 1px 24px),
    linear-gradient(153deg, #771c2c, #461120 53%, #310d1a);
}

html :is(body, #page-painel) .helix-holiday-modal:not(.hidden),
html body :is(#page-login, #page-cadastro).auth-modal-page.active {
  background: radial-gradient(ellipse at 50% 28%, #49091a45, transparent 66%), #080510c9 !important;
  backdrop-filter: blur(7px);
}

html :is(body, #page-painel) .helix-holiday-modal:is(#modal-deposito, #modal-dep-confirmado,
  #modal-saque, #modal-saque-afiliado, #modal-indicacao, #modal-perfil, #fc-ranking-modal),
html body :is(#page-login, #page-cadastro).auth-modal-page {
  & :is(.pnl-modal, .fc-ranking-card, .lgn-wrap, .reg-wrap) {
    background: var(--holiday-surface) !important;
    color: var(--holiday-ivory) !important;
    border: 1px solid #dc9a59 !important;
    border-radius: 20px !important;
    box-shadow: inset 0 0 0 5px #561021, inset 0 0 0 6px #f0b96755, 0 22px 70px #12030fba !important;
  }

  & :is(.pnl-modal, .fc-ranking-card, .lgn-wrap, .reg-wrap)::before {
    border-color: transparent !important;
    background: none !important;
  }

  & :is(.pnl-modal-title, .fc-ranking-card h2) {
    color: var(--holiday-ivory) !important;
    font-size: clamp(20px, 5.7vw, 25px) !important;
    font-weight: 800 !important;
    text-shadow: 0 2px #390a18 !important;
  }

  & :is(.pnl-modal-close, .fc-feature-close, .auth-modal-close) {
    border: 1px solid var(--holiday-edge) !important;
    border-radius: 10px !important;
    background: linear-gradient(#8b2e3b, #581628) !important;
    color: var(--holiday-ivory) !important;
    box-shadow: inset 0 1px #ffb97b33, 0 2px #320a15 !important;
  }

  & :is(.pnl-modal-close, .fc-feature-close, .auth-modal-close):hover {
    filter: brightness(1.2);
  }

  & :is(.pnl-play-btn, .prf-btn-salvar, #btn-sacar-afil, .pnl-btn-copy, #dep-copy-btn,
        .lgn-btn, .reg-btn, .auth-tab.is-active) {
    background: var(--holiday-button) !important;
    color: var(--holiday-ink) !important;
    border: 1px solid #ffeba7 !important;
    border-radius: 11px !important;
    box-shadow: var(--holiday-button-shadow) !important;
    font-weight: 800 !important;
    text-shadow: none !important;
  }

  & :is(.pnl-play-btn, .prf-btn-salvar, #btn-sacar-afil, .pnl-btn-copy, #dep-copy-btn,
        .lgn-btn, .reg-btn, .auth-tab.is-active):hover:not(:disabled) {
    filter: brightness(1.08);
  }

  & :is(button, a):focus-visible {
    outline: 2px solid #fff0b1 !important;
    outline-offset: 3px;
  }

  & :is(.pnl-input-wrap, .pnl-input-modal, .lgn-input, .reg-input, .auth-tabs) {
    background: var(--holiday-field) !important;
    border: 1px solid var(--holiday-edge) !important;
    border-radius: 11px !important;
    color: var(--holiday-ivory) !important;
    box-shadow: inset 0 2px 5px #24051050 !important;
  }

  & .pnl-input-wrap .pnl-input {
    background: transparent !important;
    color: var(--holiday-ivory) !important;
    box-shadow: none !important;
  }

  & .pnl-input-wrap:focus-within,
  & :is(.pnl-input-modal, .lgn-input, .reg-input):focus {
    border-color: var(--holiday-gold) !important;
    box-shadow: 0 0 0 2px #ffd47735 !important;
  }

  & :is(.pnl-input, .pnl-input-modal, .lgn-input, .reg-input)::placeholder {
    color: var(--holiday-muted) !important;
    opacity: 1;
  }

  & :is(#dep-valor, #saq-valor, #saq-afil-valor)::placeholder {
    opacity: .7;
  }

  & :is(.pnl-input-prefix, .lgn-eye, .reg-eye, .dep-modal-feature svg, .lgn-footer a, .reg-footer a) {
    color: var(--holiday-gold) !important;
  }

  & :is(.pnl-info-box, .pnl-saldo-modal-info, .prf-stat, .prf-section, #prf-guest-state,
        .pnl-link-box, .pnl-mini-stat, .ind-bau-box, #ind-saldo-box, #ind-card-montante,
        .helix-pix-copy-row, #dep-bonus-card) {
    background: var(--holiday-panel) !important;
    color: var(--holiday-ivory) !important;
    border: 1px solid var(--holiday-edge) !important;
    box-shadow: inset 0 1px #ffe3b71a !important;
  }

  & :is(.pnl-mini-val, .prf-stat-val, #saldo-afil-disp, #ind-saldo-afil, #ind-total-comissao,
        #dep-bonus-valor, #dep-timer) {
    color: var(--holiday-gold) !important;
  }

  & :is(.pnl-mini-lbl, .pnl-link-label, .prf-stat-lbl, .prf-section-title, .prf-email,
        .ind-bau-title, .pnl-tx-date, .fc-feature-subtitle, .fc-feature-footnote, .lgn-label,
        .reg-label, .lgn-forgot, .lgn-footer, .reg-footer) {
    color: var(--holiday-muted) !important;
  }
}

html body :is(#page-login, #page-cadastro).auth-modal-page {
  & :is(.lgn-wrap, .reg-wrap) { width: min(440px, calc(100vw - 36px)) !important; }

  & .auth-brand {
    width: min(230px, 80%);
    height: 70px;
    margin: 8px auto 20px !important;
    border-color: var(--holiday-edge);
    background: radial-gradient(ellipse at 50% 0%, #b6493a, #541525 75%);
  }

  & .auth-tab:not(.is-active) { color: var(--holiday-muted); }
  & :is(.lgn-input, .reg-input).error { border-color: #ffa2af !important; }
  & .reg-input.valid { border-color: #8de1a9 !important; }
}

html :is(body, #page-painel) #modal-deposito.helix-holiday-modal {
  & .dep-modal-hero-copy { color: var(--holiday-ivory); }
  & .dep-modal-hero-promo strong { color: var(--holiday-gold) !important; }

  & .dep-modal-hero-art {
    object-fit: contain;
    object-position: center;
    filter: drop-shadow(0 5px 12px #ffaf4e40) !important;
  }

  & .dep-amount-grid .pnl-quick {
    background: linear-gradient(175deg, #a63442, #621525) !important;
    border-color: var(--holiday-edge) !important;
    box-shadow: inset 0 1px #ffd6ad40, 0 2px #3a0a15 !important;
    color: var(--holiday-ivory) !important;
  }

  & .dep-amount-grid .pnl-quick:is(.active, :hover) {
    background: var(--holiday-button) !important;
    border-color: #ffe89e !important;
    box-shadow: var(--holiday-button-shadow) !important;
  }

  & .dep-amount-grid .pnl-quick:is(.active, :hover) .dep-quick-value {
    color: var(--holiday-ink) !important;
    text-shadow: none !important;
  }

  & .dep-preset-label:is(.lbl-destaque, .lbl-vip, .lbl-custom) {
    background: linear-gradient(#bc414d, #861d33) !important;
    border-color: #ffd493 !important;
    color: var(--holiday-ivory) !important;
  }

  & .dep-quick-badge {
    background: #521522 !important;
    border-color: #ffcd73 !important;
    color: var(--holiday-gold) !important;
  }

  & .pnl-modal:has(#dep-step2:not(.hidden)) .dep-modal-hero {
    display: flex !important;
    align-items: center;
    min-height: 42px !important;
    padding-block: 0 !important;
  }

  & .pnl-modal:has(#dep-step2:not(.hidden)) :is(.dep-modal-hero-promo, .dep-modal-hero-features, .dep-modal-hero-art) {
    display: none !important;
  }

  & #dep-qr-wrap {
    width: fit-content;
    max-width: 100%;
    margin: 14px auto 18px;
    padding: 14px;
    border: 2px solid var(--holiday-gold) !important;
    border-radius: 14px;
    background: #fff !important;
    box-shadow: 0 0 0 4px #ffc97424, 0 7px 16px #2d071b80;
  }

  & #dep-qr-img { border-radius: 0; }

  & .helix-pix-copy { margin-bottom: 14px; }

  & .helix-pix-label {
    margin-bottom: 7px;
    color: var(--holiday-gold);
    font-size: 11px;
    font-weight: 700;
    text-align: left;
  }

  & .helix-pix-copy-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
    border-radius: 11px;
  }

  & #dep-pix-txt {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    color: var(--holiday-ivory) !important;
    text-align: left;
    font: 12px/1.5 ui-monospace, monospace;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  & #dep-copy-btn {
    flex-shrink: 0;
    min-height: 38px;
    padding: 7px 12px;
    font-size: 12px;
    cursor: pointer;
  }

  & #dep-close-secondary {
    border-color: var(--holiday-edge) !important;
    background: #491421 !important;
    color: var(--holiday-ivory) !important;
  }
}

html :is(body, #page-painel) :is(#modal-saque, #modal-saque-afiliado, #modal-perfil, #modal-indicacao).helix-holiday-modal .pnl-modal-title::before {
  content: "";
  display: inline-block;
  width: 25px;
  height: 20px;
  margin-inline-end: 7px;
  vertical-align: -.1em;
  background: url("/helix-jogo/gorro-natal.webp") center / contain no-repeat;
}

html :is(body, #page-painel) #modal-saque-afiliado.helix-holiday-modal {
  & .pnl-input-wrap[style] { background: var(--holiday-field) !important; }
  & .pnl-input-wrap .pnl-input::placeholder { color: var(--holiday-muted) !important; }
}

html :is(body, #page-painel) #modal-perfil.helix-holiday-modal {
  & .prf-avatar-lg {
    border-color: #ffe3a5 !important;
    background: var(--holiday-button) !important;
    color: var(--holiday-ink) !important;
  }

  & .prf-btn-logout {
    border-color: var(--holiday-edge) !important;
    background: #541524 !important;
    color: var(--holiday-ivory) !important;
  }
}

html :is(body, #page-painel) #modal-indicacao.helix-holiday-modal {
  & #ind-saldo-box > div div { color: var(--holiday-muted) !important; }
  & #ind-saldo-box :is(#ind-saldo-afil, #ind-total-comissao) { color: var(--holiday-gold) !important; }
  & :is(#ind-saldo-box, #ind-card-montante)[style],
  & .pnl-modal > div[style*="grid-template-columns"] > div {
    background: var(--holiday-panel) !important;
    border-color: var(--holiday-edge) !important;
    box-shadow: inset 0 1px #ffe3b71a !important;
  }
  & .ind-bau-item {
    background: var(--holiday-field) !important;
    border-color: var(--holiday-edge) !important;
  }
  & .ind-bau-item:is(.available, .claimed) { background: var(--holiday-panel) !important; }
  & #ind-lista .pnl-tx-item { border-color: var(--holiday-edge) !important; }
  & #ind-lista .pnl-tx-ico {
    background: var(--holiday-field) !important;
    color: var(--holiday-gold) !important;
  }
}

html :is(body, #page-painel) #fc-ranking-modal.helix-holiday-modal {
  & .fc-feature-kicker { color: var(--holiday-gold) !important; }

  & .fc-ranking-list li {
    border-color: var(--holiday-edge) !important;
    background: var(--holiday-panel) !important;
    box-shadow: inset 0 1px #ffcf8a28 !important;
  }

  & .fc-ranking-list li:nth-child(-n+3) {
    border-color: #f5c171 !important;
    background: linear-gradient(110deg, #945437, #711b29 72%) !important;
  }

  & .fc-ranking-list li:nth-child(-n+3)::after { display: none; }

  & .fc-ranking-list li:nth-child(-n+3) strong {
    color: var(--holiday-ivory) !important;
    text-shadow: none !important;
  }

  & .fc-ranking-list li > span:last-child {
    color: var(--holiday-gold) !important;
    text-shadow: none !important;
  }

  & .fc-rank-position {
    display: grid;
    place-items: center;
    min-height: 25px;
    border-radius: 7px;
    background: var(--holiday-field) !important;
    color: var(--holiday-gold) !important;
    text-shadow: none !important;
  }

  & .fc-ranking-list li:nth-child(-n+3) .fc-rank-position {
    background: var(--holiday-button) !important;
    color: var(--holiday-ink) !important;
    text-shadow: none !important;
  }
}