
@media (max-width: 1023px) {
  body.saf-ambient-ready:not(.guest-mode) .app {
    background: transparent !important;
    background-color: transparent !important;
  }

  body.saf-ambient-ready:not(.guest-mode)
  #safAmbientBackground .saf-ambient-glow {
    opacity: .68 !important;
  }

  body.saf-ambient-ready:not(.guest-mode) {
    background-color: #091b12 !important;
  }
}



@media (max-width: 1023px) {

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme) .app,
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme) .page.active-page {
    background-color: transparent !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  :is(
    #homePage,
    #balancePage,
    #supportPage,
    #referralsPage,
    #profilePage
  ) > :is(.card, .list-card),

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  :is(
    #safInfoPage .saf-info-card,
    #safConnectPage .saf-connect-page-inner
  ) {
    background: rgba(12, 25, 19, .28) !important;

    border: 1px solid rgba(115, 210, 150, .16) !important;

    box-shadow:
      0 12px 36px rgba(0, 0, 0, .10),
      inset 0 1px 0 rgba(255, 255, 255, .025) !important;

    -webkit-backdrop-filter: blur(8px) saturate(125%) !important;
    backdrop-filter: blur(8px) saturate(125%) !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  nav.bottom-nav {
    background: rgba(10, 24, 16, .78) !important;

    border: 1px solid rgba(115, 210, 150, .19) !important;

    box-shadow:
      0 12px 32px rgba(0, 0, 0, .18),
      inset 0 1px 0 rgba(255, 255, 255, .035) !important;

    -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
    backdrop-filter: blur(18px) saturate(130%) !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  nav.bottom-nav .nav-item.active {
    background: rgba(13, 90, 49, .45) !important;
    border-color: rgba(30, 195, 100, .22) !important;
  }

}



@media (max-width: 1023px) {

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  nav.bottom-nav {
    background: rgba(8, 22, 14, .48) !important;
    border: 1px solid rgba(100, 195, 135, .17) !important;

    -webkit-backdrop-filter: blur(20px) saturate(130%) !important;
    backdrop-filter: blur(20px) saturate(130%) !important;

    box-shadow:
      0 10px 30px rgba(0, 0, 0, .12),
      inset 0 1px 0 rgba(255,255,255,.025) !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  nav.bottom-nav .nav-item.active {
    background: rgba(0, 115, 57, .24) !important;
    border: 1px solid rgba(30, 190, 100, .16) !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    outline: none !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  nav.bottom-nav .nav-item.active::before,
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  nav.bottom-nav .nav-item.active::after {
    box-shadow: none !important;
    border: 0 !important;
  }

}


@media (max-width: 1023px) {

   
  body:not(.guest-mode):not(.light):not(.light-theme)
  nav.bottom-nav .nav-item.active {
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    outline: none !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  nav.bottom-nav {
    background: rgba(8, 22, 14, .38) !important;
    border-color: rgba(100, 195, 135, .16) !important;

    -webkit-backdrop-filter: blur(20px) saturate(130%) !important;
    backdrop-filter: blur(20px) saturate(130%) !important;
  }

}


@media (max-width: 1023px) {

   
  nav.bottom-nav .nav-item.active,
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  nav.bottom-nav .nav-item.active {
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
    outline: none !important;
  }

   
  nav.bottom-nav #safBottomActivePillV35 {
    background: linear-gradient(
      135deg,
      rgba(24, 211, 112, .13),
      rgba(18, 180, 91, .08)
    ) !important;

    border-color: rgba(40, 225, 130, .13) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025),
      0 4px 14px rgba(0,0,0,.045) !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  nav.bottom-nav {
    background: rgba(8, 22, 14, .32) !important;
    border-color: rgba(100, 195, 135, .14) !important;
    -webkit-backdrop-filter: blur(20px) saturate(130%) !important;
    backdrop-filter: blur(20px) saturate(130%) !important;
  }

}



 
body:has(#safTopupPage.active-page)::before {
    background: rgba(2, 10, 6, .46) !important;

    -webkit-backdrop-filter: blur(5px) saturate(115%) !important;
    backdrop-filter: blur(5px) saturate(115%) !important;
}

 
@media (max-width: 1023px) {
    body:has(#safTopupPage.active-page)::before {
        background: rgba(2, 10, 6, .40) !important;
    }
}



@media (max-width: 1023px) {
  body:not(.light):not(.light-theme)
  #safTopupPage.active-page {
    width: min(calc(100vw - 40px), 410px) !important;
    max-width: 410px !important;
    max-height: 82dvh !important;
    padding: 20px !important;
    box-sizing: border-box !important;

    background: rgba(10, 29, 18, .58) !important;
    border: 1px solid rgba(115, 210, 150, .22) !important;
    border-radius: 22px !important;

    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;

    box-shadow:
      0 20px 55px rgba(0,0,0,.24),
      inset 0 1px 0 rgba(255,255,255,.04) !important;

    animation: none !important;
  }

  body:has(#safTopupPage.active-page)::before {
    background: rgba(0, 0, 0, .38) !important;
  }
}



@media (max-width: 1023px) {

   
  body:not(.light):not(.light-theme)
  #safTopupPage.active-page {
    width: min(calc(100vw - 32px), 360px) !important;
    max-width: 360px !important;
    max-height: 80dvh !important;

    padding: 16px !important;
    border-radius: 20px !important;

    background: rgba(10, 29, 18, .48) !important;
    border-color: rgba(115, 210, 150, .24) !important;

    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

   
  #safTopupPage .sftp-title-row {
    gap: 8px !important;
    padding-right: 66px !important;
  }

   
  body:has(#safTopupPage.active-page)
  #balancePage.active-page {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

   
  body:has(#safTopupPage.active-page)::before {
    background: rgba(0, 0, 0, .16) !important;

    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

}




 
body.saf-ambient-ready:not(.light):not(.light-theme)
#safAmbientBackground .saf-ambient-glow {
    filter: brightness(1.12);
}

 
@media (max-width: 1023px) {
    body.saf-ambient-ready:not(.light):not(.light-theme)
    #safAmbientBackground .saf-ambient-glow {
        opacity: .54 !important;
        filter: brightness(1.12);
    }
}

 
@media (prefers-reduced-motion: reduce) {
    #safAmbientBackground .saf-ambient-glow {
        animation: none !important;
    }
}




 
body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme) {
    --saf-soft-glass:
        rgba(27, 35, 32, .54);
    --saf-soft-border:
        rgba(143, 191, 161, .15);
}

 
html.saf-ambient-ready {
    background: #101713 !important;
}

body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
#safAmbientBackground {
    background:
        radial-gradient(
            ellipse at 48% 42%,
            rgba(31, 80, 55, .15),
            transparent 75%
        ),
        linear-gradient(
            145deg,
            #111815,
            #151b18 55%,
            #101713
        ) !important;
}

 
body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
.page.active-page > .card,

body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
.page.active-page > .list-card,

body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
.saf-tariff-card-v13,

body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
.saf-info-card,

body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
.saf-install-panel {

    background:
        linear-gradient(
            145deg,
            rgba(36, 49, 41, .52),
            rgba(18, 29, 24, .48)
        ) !important;

    border-color:
        var(--saf-soft-border) !important;

    -webkit-backdrop-filter:
        blur(16px) saturate(110%) !important;

    backdrop-filter:
        blur(16px) saturate(110%) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 10px 30px rgba(0,0,0,.10) !important;
}

 
@media (max-width: 1023px) {

    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    .app {
        background: transparent !important;
        background-color: transparent !important;
    }

    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    .page.active-page {
        background-color: transparent !important;
    }

     
    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    #safAmbientBackground .saf-ambient-glow {
        width: 105vw !important;
        height: 105vw !important;
        min-width: 340px !important;
        min-height: 340px !important;
        opacity: .48 !important;
        filter: blur(22px) saturate(75%) !important;
    }

    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    #safAmbientBackground .saf-ambient-glow-one {
        left: 5% !important;
        top: 10% !important;
    }

    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    #safAmbientBackground .saf-ambient-glow-two {
        left: 15% !important;
        top: 40% !important;
    }

    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    #safAmbientBackground .saf-ambient-glow-three {
        left: -10% !important;
        top: 65% !important;
    }

     
    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    .page.active-page > .card,

    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    .page.active-page > .list-card,

    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    .saf-tariff-card-v13 {
        background:
            linear-gradient(
                145deg,
                rgba(39, 45, 42, .55),
                rgba(20, 29, 25, .50)
            ) !important;
    }
}

 
@media (prefers-reduced-motion: reduce) {
    #safAmbientBackground .saf-ambient-glow {
        animation: none !important;
    }
}




@media (max-width: 699px) {

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground {
    background:
      radial-gradient(
        ellipse at 50% 45%,
        rgba(31, 65, 49, .12),
        transparent 78%
      ),
      linear-gradient(
        155deg,
        #111815,
        #151b18 55%,
        #101713
      ) !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow {
    width: 85vw !important;
    height: 85vw !important;
    min-width: 280px !important;
    min-height: 280px !important;
    max-width: 460px !important;
    max-height: 460px !important;

    opacity: .64 !important;
    filter: blur(28px) saturate(78%) !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow-one {
    left: 2% !important;
    top: 8% !important;
    animation: safMobileGlowOne 23s ease-in-out
      infinite alternate !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow-two {
    left: 20% !important;
    top: 36% !important;
    animation: safMobileGlowTwo 29s ease-in-out
      infinite alternate !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow-three {
    left: -8% !important;
    top: 63% !important;
    animation: safMobileGlowThree 26s ease-in-out
      infinite alternate !important;
  }

  @keyframes safMobileGlowOne {
    0% {
      transform: translate3d(-4%, -3%, 0) scale(1);
    }
    100% {
      transform: translate3d(13%, 12%, 0) scale(1.12);
    }
  }

  @keyframes safMobileGlowTwo {
    0% {
      transform: translate3d(8%, -5%, 0) scale(1.05);
    }
    100% {
      transform: translate3d(-12%, 10%, 0) scale(1.16);
    }
  }

  @keyframes safMobileGlowThree {
    0% {
      transform: translate3d(-5%, 8%, 0) scale(1);
    }
    100% {
      transform: translate3d(14%, -12%, 0) scale(1.13);
    }
  }
}

 
@media (prefers-reduced-motion: reduce) {
  #safAmbientBackground .saf-ambient-glow {
    animation: none !important;
  }
}




@media (max-width: 1023px) {

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme) {
    background: transparent !important;
  }

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground {
    z-index: 0 !important;
    pointer-events: none !important;
  }

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  .app {
    position: relative !important;
    z-index: 1 !important;
    background: transparent !important;
  }

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow {
    opacity: 1 !important;
    filter: blur(52px) saturate(78%) !important;
  }

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  :is(
    #homePage,
    #balancePage,
    #supportPage,
    #referralsPage,
    #profilePage
  ) > :is(.card, .list-card) {
    background: rgba(17, 28, 23, .35) !important;
    -webkit-backdrop-filter: blur(10px) saturate(110%) !important;
    backdrop-filter: blur(10px) saturate(110%) !important;
  }

}



@media (max-width:1023px) {

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground {
    position: fixed !important;
    inset: 0 !important;
    z-index: 0 !important;
    overflow: hidden !important;
    background: #151b19 !important;
    pointer-events: none !important;
  }

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow {
    position: absolute !important;
    width: 115vmax !important;
    height: 115vmax !important;
    min-width: 440px !important;
    min-height: 440px !important;
    max-width: none !important;
    max-height: none !important;
    border-radius: 50% !important;
    opacity: .88 !important;
    filter: blur(54px) saturate(75%) !important;
    pointer-events: none !important;
  }

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow-one {
    left: -45% !important;
    top: -15% !important;
    right: auto !important;
    bottom: auto !important;
    background: radial-gradient(circle,
      rgba(28,151,99,.32) 0%,
      rgba(29,105,82,.15) 38%,
      transparent 76%) !important;
    animation: safAmbientV6A 33s ease-in-out infinite alternate !important;
  }

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow-two {
    left: 8% !important;
    top: 25% !important;
    right: auto !important;
    bottom: auto !important;
    background: radial-gradient(circle,
      rgba(111,136,79,.25) 0%,
      rgba(67,101,82,.13) 42%,
      transparent 78%) !important;
    animation: safAmbientV6B 39s ease-in-out infinite alternate !important;
  }

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow-three {
    left: -30% !important;
    top: 58% !important;
    right: auto !important;
    bottom: auto !important;
    background: radial-gradient(circle,
      rgba(24,135,120,.27) 0%,
      rgba(36,91,90,.14) 40%,
      transparent 78%) !important;
    animation: safAmbientV6C 36s ease-in-out infinite alternate !important;
  }

  @keyframes safAmbientV6A {
    from { transform:translate3d(-8%,-5%,0) scale(1); }
    to { transform:translate3d(25%,18%,0) scale(1.1); }
  }
  @keyframes safAmbientV6B {
    from { transform:translate3d(12%,-12%,0) scale(1); }
    to { transform:translate3d(-22%,15%,0) scale(1.08); }
  }
  @keyframes safAmbientV6C {
    from { transform:translate3d(-8%,12%,0) scale(1); }
    to { transform:translate3d(23%,-18%,0) scale(1.12); }
  }
}

@media (prefers-reduced-motion:reduce) {
  #safAmbientBackground .saf-ambient-glow {
    animation:none !important;
  }
}



@media (max-width: 1023px) {

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground {
    background: #171c19 !important;
  }

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow {
    opacity: .95 !important;
    filter: blur(45px) saturate(82%) !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow-one {
    background: radial-gradient(
      circle,
      rgba(29, 165, 93, .40) 0%,
      rgba(29, 115, 78, .22) 36%,
      rgba(27, 83, 65, .07) 60%,
      transparent 80%
    ) !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow-two {
    background: radial-gradient(
      circle,
      rgba(123, 151, 51, .34) 0%,
      rgba(91, 118, 49, .20) 38%,
      rgba(62, 89, 51, .06) 62%,
      transparent 82%
    ) !important;
  }

   
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #safAmbientBackground .saf-ambient-glow-three {
    background: radial-gradient(
      circle,
      rgba(23, 151, 117, .34) 0%,
      rgba(31, 104, 91, .19) 40%,
      rgba(31, 79, 76, .06) 64%,
      transparent 82%
    ) !important;
  }

}




@media (max-width: 1023px) {

  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  :is(
    #homePage,
    #balancePage,
    #supportPage,
    #referralsPage,
    #profilePage
  ) > :is(.card, .list-card) {

    background: rgba(23, 32, 28, .38) !important;

    border: 1px solid
      rgba(115, 185, 145, .17) !important;

    box-shadow:
      0 12px 32px rgba(0, 0, 0, .12),
      inset 0 1px 0 rgba(255,255,255,.035)
      !important;

    -webkit-backdrop-filter:
      blur(12px) saturate(110%) !important;

    backdrop-filter:
      blur(12px) saturate(110%) !important;
  }

}



@media (max-width: 1023px) {
  body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
  #balancePage.active-page
  :is(.saf-new-section, .saf-new-history-section) {
    background: rgba(24, 32, 29, .38) !important;
    border: 1px solid rgba(145, 185, 160, .16) !important;
    border-radius: 22px !important;

    -webkit-backdrop-filter: blur(10px) saturate(108%) !important;
    backdrop-filter: blur(10px) saturate(108%) !important;

    box-shadow:
      0 12px 32px rgba(0, 0, 0, .12),
      inset 0 1px 0 rgba(255, 255, 255, .035) !important;
  }
}





#safAmbientBackground .saf-ambient-glow {
    animation: none !important;
    will-change: auto !important;
}

 
@media (min-width: 1024px) {
    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    .page.active-page > :is(.card, .list-card),
    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    #safInfoPage .saf-info-card {
        -webkit-backdrop-filter: blur(7px) saturate(108%) !important;
        backdrop-filter: blur(7px) saturate(108%) !important;
    }
}

 
@media (max-width: 1023px) {
    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    :is(#homePage, #balancePage, #supportPage, #referralsPage, #profilePage)
    > :is(.card, .list-card) {
        -webkit-backdrop-filter: blur(4px) saturate(105%) !important;
        backdrop-filter: blur(4px) saturate(105%) !important;
    }

    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    #balancePage.active-page
    :is(.saf-new-section, .saf-new-history-section) {
        -webkit-backdrop-filter: blur(4px) saturate(105%) !important;
        backdrop-filter: blur(4px) saturate(105%) !important;
    }

    body.saf-ambient-ready:not(.guest-mode):not(.light):not(.light-theme)
    #safAmbientBackground .saf-ambient-glow {
        filter: blur(16px) saturate(75%) !important;
        will-change: auto !important;
    }
}



@media (max-width: 1023px) {
  body:has(#safTopupPage.active-page)::before {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    background: rgba(0, 0, 0, .38) !important;
  }

  body:not(.light):not(.light-theme)
  #safTopupPage.active-page {
    background: rgba(11, 27, 17, .94) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    filter: none !important;
    color: #f2f7f3 !important;
  }

  #safTopupPage.active-page * {
    filter: none !important;
  }
}


@media (max-width: 1023px) {
  body:not(.guest-mode)
  :is(#homePage,#balancePage,#referralsPage,#profilePage).active-page {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
  }

  body:not(.guest-mode)
  :is(#homePage,#balancePage,#referralsPage,#profilePage).active-page
  > * {
    animation: safContentRevealV1 550ms cubic-bezier(.22, 1, .36, 1) both !important;
  }

  @keyframes safContentRevealV1 {
    from { opacity: 0; }
    to { opacity: 1; }
  }
}

@media (prefers-reduced-motion: reduce) {
  body:not(.guest-mode)
  :is(#homePage,#balancePage,#referralsPage,#profilePage).active-page
  > * {
    animation: none !important;
  }
}


 
@media (max-width:1023px) {
body:not(.light):not(.light-theme) #safTopupPage.active-page {
  background:linear-gradient(155deg,#112d1e 0%,#10251a 55%,#0c2016 100%)!important;
  border:1px solid rgba(77,218,132,.36)!important;
  box-shadow:0 18px 55px rgba(0,0,0,.24),inset 0 1px 0 rgba(150,255,185,.09)!important;
}
body:has(#safTopupPage.active-page)::before {
  background:rgba(3,13,8,.27)!important;
}
#safTopupPage .sftp-title-icon {
  background:rgba(31,210,105,.14)!important;
  border:1px solid rgba(49,225,119,.24)!important;
  color:#36ef91!important;
}
#safTopupPage .sftp-title-text h1 {
  color:#f2fff6!important;
}
#safTopupPage .sftp-title-text p {
  color:#a0b8a8!important;
}
#safTopupPage .sftp-label {
  color:#d5e9db!important;
}
#safTopupPage .sftp-method.active {
  background:rgba(19,108,58,.27)!important;
  border-color:rgba(30,223,109,.62)!important;
}
#safTopupPage .sftp-quick-button {
  background:rgba(255,255,255,.045)!important;
  border-color:rgba(120,220,150,.18)!important;
}
#safTopupPage .sftp-quick-button strong {
  color:#f0fff4!important;
}
}



 

#balancePage .saf-new-section:has(#promoInput),
#balancePage .saf-new-section.saf-topup-final {
  background:transparent!important;
  border:1px solid rgba(105,215,145,.27)!important;
  border-radius:22px!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),
             0 10px 30px rgba(0,0,0,.07)!important;
}

#balancePage .saf-new-promo-input {
  background:rgba(5,24,14,.06)!important;
  border:1px solid rgba(32,210,105,.48)!important;
  color:#effff3!important;
}

#balancePage .saf-new-promo-input:focus {
  border-color:#24e77c!important;
  box-shadow:0 0 0 3px rgba(30,220,110,.09)!important;
}

#balancePage .saf-new-promo-button {
  background:rgba(25,135,70,.12)!important;
  border:1px solid rgba(55,205,110,.25)!important;
}

#balancePage .saf-topup-final .saf-balance-topup {
  background:rgba(10,35,21,.06)!important;
  border-color:rgba(80,210,125,.20)!important;
}

@media(max-width:1023px) {
  #balancePage .saf-new-section:has(#promoInput),
  #balancePage .saf-new-section.saf-topup-final {
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    background:transparent!important;
  }
}



 

#balancePage .saf-new-promo-input,
#balancePage #promoInput {
  background:rgba(5,24,14,.08)!important;
  border:1px solid rgba(34,232,117,.38)!important;
  box-shadow:none!important;
}

#balancePage .saf-new-promo-button,
#balancePage #promoButton {
  background:rgba(24,115,65,.10)!important;
  border:1px solid rgba(65,205,115,.22)!important;
}

#balancePage .saf-topup-final-button,
#balancePage #safBalanceTopup {
  background:rgba(5,24,14,.08)!important;
  border:1px solid rgba(75,180,115,.22)!important;
  box-shadow:none!important;
}

#balancePage .saf-new-promo-input:focus {
  border-color:#22e875!important;
  box-shadow:0 0 0 2px rgba(34,232,117,.08)!important;
}



 

#balancePage .saf-new-history-section {
  background:transparent!important;
  border:1px solid rgba(105,215,145,.23)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

#balancePage .saf-history-filter {
  background:rgba(8,32,19,.08)!important;
  border:1px solid rgba(105,215,145,.20)!important;
  box-shadow:none!important;
}

#balancePage .saf-history-filter.is-active {
  background:rgba(30,190,95,.15)!important;
  border-color:rgba(45,225,115,.38)!important;
}

#balancePage #safBalanceHistory .saf-balance-operation {
  background:rgba(8,32,19,.07)!important;
  border:1px solid rgba(105,215,145,.15)!important;
  box-shadow:none!important;
}

#balancePage #safBalanceEmpty {
  background:transparent!important;
  box-shadow:none!important;
}

#balancePage .saf-new-refresh {
  background:rgba(8,32,19,.08)!important;
  border:1px solid rgba(105,215,145,.20)!important;
}



 

#balancePage .saf-topup-final #safBalanceTopup,
#balancePage .saf-topup-final .saf-topup-final-button {
  background:transparent!important;
  border:1px solid rgba(105,215,145,.20)!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  transition:background .2s ease,border-color .2s ease!important;
}

@media(hover:hover) {
  #balancePage .saf-topup-final-button:hover {
    background:rgba(34,232,117,.07)!important;
    border-color:rgba(34,232,117,.38)!important;
  }
}



 

#safDeviceDeleteModal .saf-delete-modal-card {
  background:rgba(13,32,21,.22)!important;
  border:1px solid rgba(105,215,145,.24)!important;
  border-radius:24px!important;
  box-shadow:0 24px 65px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.05)!important;
}

#safDeviceDeleteModal .saf-delete-modal-title {
  color:#f2fff5!important;
}

#safDeviceDeleteModal .saf-delete-modal-text {
  color:#a9bdb0!important;
}

#safDeviceDeleteModal .saf-delete-modal-cancel {
  background:rgba(100,150,115,.07)!important;
  border:1px solid rgba(130,190,150,.22)!important;
  color:#e8f5eb!important;
}

#safDeviceDeleteModal .saf-delete-modal-confirm {
  background:rgba(190,55,55,.09)!important;
  border:1px solid rgba(255,100,100,.28)!important;
  color:#ff7777!important;
}

@media(max-width:1023px) {
  #safDeviceDeleteModal .saf-delete-modal-card {
    background:rgba(13,32,21,.28)!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }
}



 
#safSubscriptionResetModal {
  background:rgba(0,0,0,.30)!important;
  backdrop-filter:none!important;
}
#safSubscriptionResetModal .saf-reset-modal-card {
  background:rgba(13,32,21,.24)!important;
  border:1px solid rgba(105,215,145,.25)!important;
  box-shadow:0 22px 55px rgba(0,0,0,.20)!important;
}
#safSubscriptionResetModal .saf-reset-modal-cancel {
  background:rgba(100,150,115,.07)!important;
  border:1px solid rgba(105,215,145,.22)!important;
}
#safSubscriptionResetModal .saf-reset-modal-confirm {
  background:rgba(190,55,55,.09)!important;
  border:1px solid rgba(255,100,100,.28)!important;
}

