/* MoneySolution: shared public-site design system. Loaded after legacy page styles. */
:root {
  --ms-green:#0b4436;
  --ms-deep:#072e26;
  --ms-gold:#d6ae55;
  --ms-ink:#173b32;
  --ms-muted:#728079;
  --ms-line:#dfe7e1;
  --ms-bg:#f5f7f3;
  --ms-soft:#edf3ec;
  --ms-radius:20px;
  --bs-primary:#0b4436;
  --bs-warning:#d6ae55;
  --bs-link-color:#0b4436
}

* {
  box-sizing:border-box
}

html {
  min-height:100%;
  scroll-behavior:smooth
}

body {
  margin:0!important;
  padding:0!important;
  background:var(--ms-bg)!important;
  color:var(--ms-ink)!important;
  font-family:Inter,"Segoe UI",Arial,sans-serif!important;
  font-size:14px;
  line-height:1.6;
  min-height:100vh
}

a {
  color:var(--ms-green);
  text-decoration:none
}

a:hover {
  color:#926915
}

button,input,select,textarea {
  font:inherit
}

button,a,input,select,textarea {
  touch-action:manipulation
}

img {
  max-width:100%
}

h1,h2,h3,h4,h5,h6 {
  color:inherit;
  letter-spacing:-.035em
}

button:disabled {
  opacity:.55;
  cursor:not-allowed
}

a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible {
  outline:3px solid #b88c2c!important;
  outline-offset:4px
}

::selection {
  background:#e6ce94;
  color:var(--ms-deep)
}

.ms-skip {
  position:fixed;
  top:-80px;
  left:20px;
  background:var(--ms-green);
  color:#fff;
  padding:12px 20px;
  z-index:2000
}

.ms-skip:focus {
  top:10px;
  color:#fff
}

.ms-topbar {
  height:92px;
  background:#fff;
  border-bottom:1px solid var(--ms-line);
  position:fixed;
  inset:0 0 auto;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 38px 0 28px
}

.ms-brand {
  display:inline-flex;
  gap:12px;
  align-items:center;
  color:var(--ms-green)!important;
  font-size:25px;
  font-weight:750;
  letter-spacing:-1.2px;
  line-height:1.2
}

.ms-brand strong {
  font-weight:400
}

.ms-brand small {
  display:block;
  font-size:7px;
  letter-spacing:1.5px;
  font-weight:600;
  margin-top:7px
}

.ms-logo-crop {
  display:block;
  position:relative;
  overflow:hidden;
  width:48px;
  height:48px;
  background:#fff;
  border-radius:50%;
  flex-shrink:0
}

.ms-logo-crop img {
  position:absolute;
  max-width:none;
  width:99px;
  height:99px;
  left:-26px;
  top:-16px
}

.ms-top-actions {
  display:flex;
  align-items:center;
  gap:24px
}

.ms-help {
  display:flex;
  align-items:center;
  gap:9px;
  font-size:13px;
  font-weight:600
}

.ms-help i {
  font-size:20px
}

.ms-top-divider {
  height:26px;
  width:1px;
  background:var(--ms-line)
}

.ms-avatar {
  width:40px;
  height:40px;
  background:var(--ms-soft);
  border:1px solid var(--ms-line);
  border-radius:50%;
  display:grid;
  place-items:center;
  font-size:22px
}

.ms-sidebar {
  position:fixed;
  top:92px;
  bottom:0;
  left:0;
  width:252px;
  padding:32px 20px 22px;
  background:#fff;
  border-right:1px solid var(--ms-line);
  display:flex;
  flex-direction:column;
  overflow-y:auto;
  z-index:90
}

.ms-nav-label {
  font-size:10px;
  font-weight:700;
  letter-spacing:1.7px;
  color:#8a958e;
  margin:0 18px 16px
}

.ms-nav-link {
  display:flex;
  align-items:center;
  gap:14px;
  padding:13px 17px;
  margin-bottom:7px;
  border-radius:10px;
  color:#64746c;
  font-weight:600;
  font-size:14px;
  transition:background .15s
}

.ms-nav-link i {
  font-size:19px
}

.ms-nav-link:hover {
  background:var(--ms-soft);
  color:var(--ms-green)
}

.ms-nav-link.is-active {
  color:#fff;
  background:var(--ms-green);
  box-shadow:0 6px 12px #0b443614
}

.ms-nav-dot {
  margin-left:auto;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--ms-gold)
}

.ms-sidebar-bottom {
  margin-top:auto;
  padding-top:38px
}

.ms-help-card {
  background:var(--ms-soft);
  padding:20px 16px;
  border-radius:14px
}

.ms-help-card>i {
  display:block;
  font-size:23px;
  margin-bottom:10px
}

.ms-help-card strong {
  display:block;
  font-size:13px
}

.ms-help-card p {
  font-size:11px;
  color:var(--ms-muted);
  margin:5px 0 16px
}

.ms-help-card a {
  font-size:12px;
  font-weight:700;
  display:flex;
  justify-content:space-between
}

.ms-about-link {
  display:flex;
  justify-content:space-between;
  margin:24px 7px 12px;
  font-size:12px;
  color:var(--ms-muted)
}

.ms-sidebar-bottom>small {
  font-size:9px;
  color:#8a958e;
  margin:0 7px
}

.ms-main {
  margin-left:252px;
  padding:128px clamp(24px,4vw,64px) 24px;
  max-width:1600px;
  min-height:100vh
}

.ms-page-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:28px
}

.ms-eyebrow {
  display:block;
  font-size:10px;
  font-weight:700;
  letter-spacing:2px;
  color:#7a8d80;
  margin-bottom:10px
}

.ms-page-heading h1 {
  font-size:34px;
  line-height:1.2;
  font-weight:650;
  margin:0 0 9px
}

.ms-page-heading p {
  color:var(--ms-muted);
  font-size:13px;
  margin:0
}

.ms-history-link {
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid var(--ms-line);
  background:#fff;
  border-radius:9px;
  padding:10px 15px;
  font-size:12px;
  white-space:nowrap
}

.ms-history-link>i:last-child {
  font-size:10px;
  margin-left:12px
}

.ms-footer {
  border-top:1px solid var(--ms-line);
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding-top:22px;
  margin-top:40px;
  color:#849088;
  font-size:11px
}

.ms-main>.container {
  max-width:none;
  width:100%;
  padding:0;
  margin-top:20px!important
}

.ms-main>.container:first-of-type {
  margin-top:0!important
}

.ms-main>br {
  display:none
}

.ms-main>.topHeader,.ms-main>.settings-header,.ms-page-about>.container-fluid {
  display:none!important
}

.ms-main .container .container {
  max-width:100%
}

/* Cards and data surfaces */
.product-card,.payment-container,.bank-card,.account-card,.custom-card,.reward-card,.details-card,.coupon-card,.bonus-card,.about-container,.support-container,.card,.setting-item,.option-box {
  background:#fff!important;
  border:1px solid var(--ms-line)!important;
  color:var(--ms-ink)!important;
  border-radius:var(--ms-radius)!important;
  box-shadow:0 3px 12px #173b3203!important
}

.payment-container,.bank-card,.coupon-card,.details-card {
  width:100%;
  max-width:620px;
  padding:30px!important;
  margin:24px auto!important
}

.bank-card {
  border-top:3px solid var(--ms-gold)!important
}

.about-container {
  max-width:900px;
  padding:36px!important;
  margin:0 auto!important
}

.support-container {
  max-width:720px;
  padding:32px!important;
  margin:0 auto!important
}

.custom-card {
  padding:28px!important
}

.custom-card h5,.highlight,.about-header h2,.support-item i,.support-item a,.success-icon {
  color:var(--ms-green)!important
}

.reward-card {
  padding:22px 15px!important
}

.reward-card i,.gift-icon {
  color:#ab7f27!important
}

.info-text,.bonus-date {
  color:var(--ms-muted)!important
}

.support-item {
  border-color:var(--ms-line)!important;
  border-radius:12px!important;
  gap:10px;
  padding:20px!important
}

.support-item:hover {
  transform:none!important;
  background:var(--ms-soft)!important
}

.support-item span {
  font-size:14px!important
}

.support-item a {
  background:var(--ms-soft);
  padding:6px 14px;
  border-radius:8px;
  font-size:12px
}

.bonus-container {
  max-width:900px!important;
  margin:0 auto!important
}

.bonus-card {
  padding:22px!important
}

.empty-msg {
  background:#fff;
  border:1px dashed #cddbd0;
  border-radius:16px;
  padding:45px 20px!important;
  text-align:center;
  color:var(--ms-muted)!important
}

.balance-card {
  position:relative!important;
  bottom:auto!important;
  background:var(--ms-green)!important;
  color:#fff!important;
  border:1px solid #245b49!important;
  border-radius:var(--ms-radius)!important;
  padding:27px!important;
  box-shadow:none!important;
  width:100%!important
}

.balance-card p {
  color:#d0e0d4!important;
  font-size:13px
}

.balance-card .text-secondary,.balance-card .text-muted,.balance-card small {
  color:#cfddd4!important
}

.balance-amount,.balance-card .amount {
  color:#efd18a!important;
  font-size:32px;
  font-weight:650;
  letter-spacing:-1px;
  font-variant-numeric:tabular-nums
}

.balance-card .text-warning {
  color:#efd18a!important
}

.balance-card .text-dark {
  color:#fff!important
}

.balance-card .text-success {
  color:#a4e5c4!important
}

.balance-card .text-danger {
  color:#ffb3ad!important
}

.balance-card .inner {
  min-width:0
}

.balance-card .left {
  min-width:0
}

.balance-card .right {
  flex-shrink:0;
  margin-left:14px
}

.balance-card .balance-amount {
  overflow-wrap:anywhere
}

.balance-amount.d-flex {
  background:#eaf0e9!important;
  border:1px solid var(--ms-line);
  border-radius:12px!important;
  padding:10px!important;
  margin-top:15px;
  gap:5px
}

.balance-amount.d-flex input {
  min-width:0;
  font-size:12px
}

.text-warning {
  color:#926915!important
}

.text-primary,.text-info {
  color:var(--ms-green)!important
}

.border-warning {
  border-color:var(--ms-gold)!important
}

.bg-info {
  background:#e9f1ea!important;
  color:var(--ms-green)!important
}

.progress {
  background:#e6ede4!important
}

.progress-bar-yellow {
  background:linear-gradient(90deg,#b99038,#e2c777)!important
}

.topTitle {
  border-radius:10px;
  padding:13px!important
}

.tips-area {
  background:#edf2e9;
  border:1px solid var(--ms-line);
  padding:24px;
  border-radius:16px;
  color:#53685a
}

.tips-area p {
  color:inherit!important
}

/* Product browsing */
.product-card {
  display:flex;
  gap:26px;
  align-items:center;
  padding:24px!important;
  margin-bottom:18px!important;
  overflow:hidden
}

.product-card .left {
  width:32%!important;
  max-width:220px;
  flex-shrink:0;
  background:#f4f6f0;
  border-radius:14px;
  padding:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  align-self:stretch;
  min-height:180px
}

.product-card .left img {
  width:100%!important;
  max-width:170px;
  max-height:190px;
  object-fit:contain;
  mix-blend-mode:multiply;
  border-radius:8px
}

.product-card .right {
  width:auto!important;
  flex:1;
  min-width:0
}

.product-card h6 {
  font-size:20px;
  margin-bottom:12px;
  line-height:1.35
}

.product-card p {
  font-size:13px;
  color:#6b7e70;
  margin-bottom:7px
}

.product-card .price {
  display:inline-block;
  background:var(--ms-soft)!important;
  color:var(--ms-green);
  padding:5px 11px!important;
  border-radius:7px!important;
  font-size:12px;
  font-weight:650
}

.lease-btn {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  min-height:40px;
  min-width:128px;
  background:var(--ms-green)!important;
  color:#fff!important;
  border:0;
  border-radius:9px!important;
  padding:9px 22px!important;
  font-size:12px;
  font-weight:600;
  box-shadow:none!important
}

.product-details-card {
  background:#fff!important;
  border:1px solid var(--ms-line)!important;
  border-radius:20px!important;
  color:var(--ms-ink)!important;
  padding:28px!important
}

.product-details-card img {
  display:block;
  max-height:310px;
  object-fit:contain;
  margin:auto
}

.ms-main .d-flex.justify-content-around.bg-white {
  background:#e9eee6!important;
  border:1px solid var(--ms-line);
  padding:6px!important;
  gap:5px!important;
  border-radius:12px!important
}

.ms-main .d-flex.justify-content-around.bg-white .btn {
  border:0!important;
  font-size:12px!important;
  min-height:42px
}

.ms-main .d-flex.justify-content-around.bg-white .btn-light {
  background:transparent!important;
  color:#6a7b6f!important
}

.ms-main .d-flex.justify-content-around.bg-white .btn-warning {
  background:#fff!important;
  color:var(--ms-green)!important;
  box-shadow:0 2px 5px #173b3209!important
}

/* Forms and controls */
.form-label {
  font-size:12px!important;
  font-weight:650!important;
  color:#3b5647;
  margin-bottom:9px
}

.form-control,.form-select,.gift-input {
  background:#f9faf7!important;
  border:1px solid #dce5db!important;
  color:var(--ms-ink)!important;
  border-radius:10px!important;
  padding:13px 15px!important;
  min-height:48px;
  box-shadow:none!important
}

.form-control::placeholder,.gift-input::placeholder {
  color:#98a198;
  opacity:1
}

.form-control:focus,.gift-input:focus {
  border-color:#799c80!important;
  box-shadow:0 0 0 3px #0b44360b!important
}

.form-control[readonly] {
  background:#edf1eb!important
}

.form-control.bg-dark {
  background:#f1f5ee!important;
  color:var(--ms-ink)!important
}

.gift-input {
  width:100%;
  letter-spacing:2px;
  font-size:16px!important
}

.btn {
  border-radius:9px;
  font-weight:600
}

.btn-warning,.btn-primary,.btn-info,.btn-gold,.btn-recharge,.btn-confirm,.btn-login,.btn-register,.btn-continue,.btn-submit,.gift-button,.invite-btn,.btn-claim,.btn-yellow,.btn-otp {
  background:var(--ms-green)!important;
  color:#fff!important;
  border:1px solid var(--ms-green)!important;
  border-radius:10px!important;
  box-shadow:none!important;
  font-weight:600!important;
  min-height:42px;
  padding:10px 18px;
  transition:background .18s,box-shadow .18s
}

.btn-warning:hover,.btn-primary:hover,.lease-btn:hover,.btn-gold:hover,.btn-confirm:hover,.btn-login:hover,.btn-register:hover,.btn-continue:hover,.gift-button:hover,.invite-btn:hover,.btn-claim:hover,.btn-otp:hover {
  background:#155c46!important;
  color:#fff!important;
  transform:none!important;
  box-shadow:0 4px 10px #0b44361a!important
}

.balance-card .btn-warning,.balance-card .btn-gold,.balance-card .btn-recharge,.profile-card .btn-yellow {
  background:#e3c477!important;
  border-color:#e3c477!important;
  color:var(--ms-deep)!important
}

.btn-withdraw,.btn-outline {
  background:transparent!important;
  border:1px solid #779e88!important;
  color:#fff!important;
  border-radius:10px!important;
  min-height:42px;
  padding:10px 18px
}

.btn-quit {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:#fff!important;
  border:1px solid #dfd5cf!important;
  color:#a45745!important;
  border-radius:12px!important;
  padding:13px 22px!important;
  max-width:360px;
  margin:28px auto!important;
  font-weight:600;
  width:100%!important
}

.btn-quit:hover {
  background:#fff4f0!important;
  transform:none!important
}

.payment-option {
  padding:18px!important;
  border:1px solid var(--ms-line)!important;
  border-radius:12px!important;
  background:#fff!important
}

.payment-option.active {
  background:var(--ms-soft)!important;
  border-color:#85a687!important
}

.payment-option .icon,.payment-option.active .checkmark {
  color:var(--ms-green)!important
}

.payment-option .checkmark {
  position:static!important;
  font-size:22px;
  flex-shrink:0
}

.payment-option span {
  font-size:13px!important;
  color:var(--ms-ink)!important
}

.tab-btn {
  background:#fff!important;
  color:var(--ms-ink)!important;
  border:1px solid var(--ms-line)!important;
  min-height:46px;
  border-radius:9px!important
}

.tab-btn.active {
  background:var(--ms-green)!important;
  color:#fff!important;
  border-color:var(--ms-green)!important
}

.ms-password-wrap {
  position:relative
}

.ms-password-wrap input {
  padding-right:54px!important
}

.ms-password-toggle {
  position:absolute;
  right:8px;
  top:5px;
  height:38px;
  width:38px;
  background:none;
  border:0;
  border-radius:6px;
  color:#6c8071;
  display:grid;
  place-items:center;
  font-size:18px
}

.input-group .ms-password-wrap {
  flex:1
}

.coupon-card h3 {
  font-size:24px;
  color:var(--ms-green)!important
}

.coupon-card p {
  color:var(--ms-muted)!important
}

.coupon-card h5 {
  font-size:14px
}

/* Dashboard hero */
.header-banner {
  background:none!important;
  height:auto!important;
  padding:0!important;
  display:block!important
}

.header-card {
  background:var(--ms-green)!important;
  color:#fff!important;
  position:relative;
  height:auto!important;
  min-height:245px;
  padding:34px 38px!important;
  overflow:hidden;
  border-radius:22px!important;
  text-align:left!important;
  display:flex;
  flex-direction:column;
  justify-content:center
}

.header-card:after {
  content:"";
  position:absolute;
  right:-90px;
  top:-130px;
  width:430px;
  height:430px;
  border:1px solid #d7b96540;
  border-radius:50%;
  box-shadow:0 0 0 40px #d7b9650a,0 0 0 80px #d7b96508;
  pointer-events:none
}

.header-card>* {
  position:relative;
  z-index:1
}

.header-card h5 {
  font-family:Georgia,"Times New Roman",serif;
  font-size:38px!important;
  line-height:1.15;
  font-weight:400!important;
  max-width:75%;
  letter-spacing:-1px
}

.header-card h5 em {
  color:#e7c87c;
  font-style:normal
}

.header-card p {
  color:#ccdbcf!important;
  width:auto!important;
  max-width:62%;
  font-size:13px!important;
  font-weight:400!important;
  line-height:1.7
}

.header-card .ms-eyebrow {
  color:#d9c584;
  font-size:9px;
  margin-bottom:15px
}

.ms-hero-link {
  align-self:flex-start;
  display:inline-flex;
  gap:25px;
  align-items:center;
  background:#e5c77e;
  color:var(--ms-deep)!important;
  border-radius:8px;
  padding:9px 16px;
  margin-top:22px;
  font-size:12px;
  font-weight:650
}

.ms-hero-logo {
  position:absolute;
  width:144px;
  height:144px;
  right:45px;
  top:50%;
  transform:translateY(-50%);
  background:#fff;
  border-radius:50%;
  overflow:hidden;
  box-shadow:0 0 0 12px #ffffff07
}

.ms-hero-logo img {
  max-width:none;
  position:absolute;
  width:280px;
  height:280px;
  top:-44px;
  left:-69px
}

.ms-page-home .balance-card {
  text-align:left!important;
  background:#fff!important;
  border-color:var(--ms-line)!important;
  color:var(--ms-ink)!important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px
}

.ms-page-home .balance-card>.row {
  width:58%;
  margin:0!important
}

.ms-page-home .balance-card .col-6 {
  text-align:left!important;
  padding-left:0
}

.ms-page-home .balance-card .col-6+.col-6 {
  padding-left:24px;
  border-left:1px solid var(--ms-line)
}

.ms-page-home .balance-card p {
  color:var(--ms-muted)!important;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:1px;
  margin-bottom:5px
}

.ms-page-home .balance-card .balance-amount {
  color:var(--ms-green)!important;
  font-size:30px
}

.ms-page-home .balance-card .btn-recharge {
  background:var(--ms-green)!important;
  color:#fff!important;
  border-color:var(--ms-green)!important
}

.ms-page-home .balance-card .btn-withdraw {
  color:var(--ms-green)!important;
  border-color:#cfdacc!important
}

.contact-btns {
  display:flex;
  justify-content:flex-end;
  gap:8px;
  align-items:center
}

.contact-btns:before {
  content:"LET’S CONNECT";
  font-size:9px;
  font-weight:700;
  letter-spacing:1.5px;
  color:var(--ms-muted);
  margin-right:8px
}

.contact-btns img {
  width:25px!important;
  margin:3px!important
}

.contact-btns a {
  border:1px solid var(--ms-line);
  background:#fff;
  border-radius:50%;
  padding:5px
}

.ms-notice {
  display:flex;
  align-items:center;
  gap:10px;
  background:#f1eddf;
  border:1px solid #e8dfc6;
  border-radius:10px;
  padding:11px 15px;
  color:#78622e;
  font-size:12px;
  overflow-wrap:anywhere
}

.ms-notice i {
  color:#9b7c31
}

.ms-section-title {
  font-size:20px!important;
  margin-top:20px!important
}

.ms-page-home .d-flex.gap-2.justify-content-center {
  justify-content:flex-start!important
}

.ms-page-home .d-flex.gap-2 .btn {
  background:#fff!important;
  color:var(--ms-green)!important;
  border-color:var(--ms-line)!important;
  font-size:12px!important
}

.ms-page-home .d-flex.gap-2 .btn i {
  color:#ae8430
}

/* Account, history and task layouts */
.profile-card {
  background:var(--ms-green)!important;
  color:#fff!important;
  border:1px solid #245b49;
  border-radius:22px!important;
  margin:0 0 20px!important;
  padding:32px!important;
  box-shadow:none!important
}

.profile-card h5 {
  color:#fff!important;
  font-size:17px
}

.profile-card p {
  color:#d7e3d8!important
}

.profile-card .balance {
  color:#e6c87e!important
}

.profile-card img,.balance-card>img {
  object-fit:cover;
  border-radius:50%!important;
  border:4px solid #ffffff38!important;
  width:80px!important;
  height:80px!important
}

.profile-card>.d-flex {
  max-width:420px;
  margin:20px auto 0!important
}

.account-card {
  margin:20px 0!important;
  padding:25px!important
}

.account-card p {
  font-size:13px
}

.account-card span {
  color:var(--ms-green)!important;
  font-weight:650
}

.quick-options {
  display:grid!important;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin:20px 0!important;
  padding:0!important
}

.option-box {
  width:auto!important;
  padding:25px 12px!important;
  text-align:center
}

.option-box i {
  color:var(--ms-green)!important;
  font-size:25px!important;
  background:var(--ms-soft);
  padding:10px;
  border-radius:12px;
  display:inline-block;
  line-height:1
}

.option-box p {
  margin:12px 0 0!important;
  font-size:12px;
  color:var(--ms-ink)!important
}

.settings-list {
  margin:24px 0!important;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px
}

.setting-item {
  margin:0!important;
  padding:20px!important;
  gap:8px
}

.setting-item:hover {
  transform:none!important;
  background:var(--ms-soft)!important
}

.setting-item .icon,.setting-item .arrow {
  color:var(--ms-green)!important
}

.setting-item span {
  font-size:13px!important
}

.ms-page-account_list>.container>.balance-card {
  max-width:620px;
  margin:auto
}

.ms-page-task>.balance-buttons,.ms-page-task2>.balance-buttons {
  position:static!important;
  display:flex;
  gap:10px;
  background:none!important;
  box-shadow:none!important;
  padding:0!important;
  justify-content:flex-start!important;
  flex-wrap:wrap;
  flex-direction:row!important
}

.ms-page-task>.balance-buttons .btn,.ms-page-task2>.balance-buttons .btn {
  width:auto!important;
  transform:none!important;
  background:#fff!important;
  color:var(--ms-green)!important;
  border-color:var(--ms-line)!important;
  font-size:12px
}

.ms-page-task>.balance-buttons .active,.ms-page-task2>.balance-buttons .active {
  background:var(--ms-green)!important;
  color:#fff!important
}

.ms-page-task>.container,.ms-page-task2>.container {
  margin-top:24px!important
}

.ms-page-details .balance-card,.ms-page-recharge-records .balance-card,.ms-page-withdrawal-records .balance-card {
  background:#fff!important;
  border-color:var(--ms-line)!important;
  color:var(--ms-ink)!important;
  padding:23px!important
}

.ms-page-details .balance-card .text-secondary,.ms-page-recharge-records .balance-card .text-secondary,.ms-page-withdrawal-records .balance-card .text-secondary {
  color:#728079!important
}

.ms-page-details .balance-card .text-success {
  color:#217549!important
}

.ms-page-details .balance-card .text-danger {
  color:#b5493c!important
}

.ms-page-details .balance-card .text-warning,.ms-page-recharge-records .balance-card .text-warning,.ms-page-withdrawal-records .balance-card .text-warning {
  color:#916b1b!important
}

.ts-button {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:14px
}

.ms-main .modal-content {
  background:var(--ms-green)!important;
  color:#fff;
  border:1px solid #d2b971;
  border-radius:20px!important
}

.ms-main .modal-body {
  background:transparent!important
}

.ms-main .modal-title {
  text-shadow:none!important;
  font-family:Georgia,serif
}

.swal2-popup {
  border-radius:20px!important
}

.swal2-confirm {
  background:var(--ms-green)!important
}

/* Authentication */
.ms-auth-layout {
  min-height:100vh;
  display:grid;
  grid-template-columns:minmax(400px,47%) 1fr
}

.ms-auth-story {
  position:relative;
  overflow:hidden;
  background:var(--ms-deep);
  color:#fff;
  padding:48px 56px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  min-height:100vh
}

.ms-auth-story:after {
  content:"";
  position:absolute;
  width:560px;
  height:560px;
  right:-340px;
  top:27%;
  border:1px solid #d4b36940;
  border-radius:50%;
  box-shadow:0 0 0 55px #d4b36909,0 0 0 110px #d4b36906;
  pointer-events:none
}

.ms-brand-light {
  color:#fff!important;
  position:relative;
  z-index:1
}

.ms-brand-light small {
  color:#a2b9a8
}

.ms-auth-message {
  position:relative;
  z-index:1;
  padding:80px 0
}

.ms-auth-message .ms-eyebrow {
  color:#d2ba79;
  font-size:9px
}

.ms-auth-message h1 {
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(44px,4.5vw,72px);
  line-height:1.08;
  font-weight:400;
  letter-spacing:-2px;
  margin:24px 0
}

.ms-auth-message h1 em {
  color:#e2c17b;
  font-style:normal
}

.ms-auth-message p {
  color:#a8c0b0;
  font-size:13px;
  line-height:1.9;
  margin-top:28px
}

.ms-auth-bottom {
  display:flex;
  gap:20px;
  align-items:center
}

.ms-small-mark {
  font-family:Georgia,serif;
  font-size:44px;
  color:#e2c17b;
  line-height:1
}

.ms-small-mark span {
  font-family:Arial,sans-serif;
  font-size:35px;
  margin-left:3px
}

.ms-auth-bottom p {
  font-size:11px;
  color:#9cb5a5;
  line-height:1.8;
  margin:0
}

.ms-auth-main {
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  padding:45px;
  background:#fcfcf9
}

.ms-auth-main .login-container,.ms-auth-main .register-container {
  width:100%;
  max-width:410px;
  background:transparent;
  box-shadow:none;
  border:0;
  border-radius:0;
  margin:0!important;
  padding:15px 0!important;
  text-align:left
}

.ms-auth-main .logo-section {
  background:none!important;
  border-radius:0;
  padding:0!important;
  color:var(--ms-ink)!important;
  margin-bottom:32px
}

.ms-auth-main .logo-section:before {
  content:"YOUR NEXT STEP STARTS HERE";
  display:block;
  font-size:9px;
  font-weight:700;
  letter-spacing:1.8px;
  color:#a18137;
  margin-bottom:16px
}

.ms-auth-main .logo-section h3 {
  font-size:32px;
  margin-bottom:12px;
  font-weight:650
}

.ms-auth-main .logo-section p {
  color:var(--ms-muted);
  font-size:13px
}

.ms-auth-main .btn-login,.ms-auth-main .btn-register {
  height:49px;
  margin-top:14px!important;
  letter-spacing:.2px;
  width:100%;
  display:block
}

.ms-auth-main .mb-3 {
  margin-bottom:19px!important
}

.ms-auth-main .text-muted {
  font-size:13px;
  text-align:center;
  margin-top:25px!important
}

.ms-auth-main .text-muted a {
  color:var(--ms-green)!important;
  font-weight:650;
  text-decoration:underline;
  text-underline-offset:3px
}

.ms-auth-main .btn-otp {
  font-size:11px!important;
  white-space:nowrap
}

.ms-auth-main .input-group {
  gap:6px;
  flex-wrap:nowrap
}

.ms-auth-main .input-group .form-control {
  min-width:0
}

.ms-auth-main #txtHint {
  font-size:12px;
  margin-bottom:0
}

.ms-auth-main form {
  margin-bottom:10px
}

.bottom-nav {
  display:none!important
}

.form-control::placeholder,.gift-input::placeholder {
  color:#839080!important
}

.account-card a {
  color:var(--ms-green)!important;
  text-decoration:underline;
  text-underline-offset:3px
}

.balance-card .topTitle small {
  color:var(--ms-green)!important
}

.ms-page-team .balance-amount.mb-3 {
  background:#ffffff0d!important;
  border:1px dashed #73977e;
  padding:12px 18px!important;
  border-radius:12px!important;
  letter-spacing:3px
}

.ms-page-pay input[name="refrence"],.ms-page-pay2 input[name="refrence"],.ms-page-pay3 input[name="refrence"] {
  border:1px solid #bdcdbf!important;
  border-radius:10px!important;
  background:#f7faf3!important;
  color:var(--ms-ink)!important;
  padding:13px!important;
  min-height:48px
}

.ms-main input[type="file"] {
  max-width:100%;
  font-size:12px;
  padding:12px 0
}

.ms-main input[type="file"]::file-selector-button {
  background:#e4c87f;
  color:var(--ms-green);
  border:0;
  border-radius:7px;
  padding:9px 12px;
  margin-right:12px
}

.ms-main button[name="upload_pay"] {
  background:#e3c477!important;
  color:var(--ms-deep)!important;
  border-radius:10px!important;
  min-height:44px;
  padding:10px!important;
  font-weight:650
}

.ms-page-pay center img,.ms-page-pay2 center img,.ms-page-pay3 center img {
  max-width:300px;
  display:block;
  background:#fff;
  padding:12px;
  border-radius:12px
}

.ms-page-pay .balance-card,.ms-page-pay2 .balance-card,.ms-page-pay3 .balance-card {
  max-width:720px;
  margin-left:auto;
  margin-right:auto
}

.ms-page-withdrawal form .balance-card .left {
  flex:1
}

.ms-page-withdrawal .balance-card .text-warning.px-4 {
  padding-left:8px!important;
  padding-right:8px!important
}

@media(max-width:767px) {
  .ms-page-home .header-card {
    padding-right:24px!important
  }
  .ms-page-home .header-card h5 {
    max-width:100%;
    font-size:30px!important
  }
  .ms-page-home .ms-hero-logo {
    top:auto;
    bottom:26px;
    transform:none;
    width:60px;
    height:60px;
    right:22px
  }
  .ms-page-home .ms-hero-logo img {
    width:122px;
    height:122px;
    left:-31px;
    top:-20px
  }
  .ms-page-home .header-card p {
    max-width:100%
  }
  .ms-page-home .ms-hero-link {
    max-width:calc(100% - 65px)
  }
}

@media(min-width:1500px) {
  .ms-main {
    margin-right:auto
  }
}

@media(max-width:1100px) {
  .ms-sidebar {
    width:220px;
    padding:28px 14px
  }
  .ms-main {
    margin-left:220px;
    padding-left:28px;
    padding-right:28px
  }
  .ms-topbar {
    padding-left:20px
  }
  .ms-brand {
    font-size:23px
  }
  .ms-auth-story {
    padding:40px
  }
  .ms-page-home .balance-card {
    flex-wrap:wrap
  }
  .ms-page-home .balance-card>.row {
    width:100%
  }
  .ms-hero-logo {
    width:112px;
    height:112px;
    right:30px
  }
  .ms-hero-logo img {
    width:222px;
    height:222px;
    left:-54px;
    top:-35px
  }
  .header-card h5 {
    font-size:34px!important
  }
  .ms-page-heading h1 {
    font-size:30px
  }
}

@media(max-width:767px) {
  .ms-topbar {
    height:76px;
    padding:0 20px
  }
  .ms-brand {
    font-size:21px;
    gap:9px
  }
  .ms-brand small {
    font-size:5.6px;
    letter-spacing:1.05px;
    margin-top:6px
  }
  .ms-logo-crop {
    width:40px;
    height:40px
  }
  .ms-logo-crop img {
    width:83px;
    height:83px;
    left:-22px;
    top:-14px
  }
  .ms-top-actions {
    gap:12px
  }
  .ms-help {
    font-size:20px
  }
  .ms-help span,.ms-top-divider {
    display:none
  }
  .ms-avatar {
    width:34px;
    height:34px;
    font-size:20px
  }
  .ms-sidebar {
    display:none
  }
  .ms-main {
    margin-left:0;
    padding:102px 20px 104px;
    max-width:none
  }
  .ms-page-heading {
    margin-bottom:23px;
    gap:12px
  }
  .ms-page-heading h1 {
    font-size:27px
  }
  .ms-page-heading p {
    font-size:12px;
    max-width:270px
  }
  .ms-eyebrow {
    font-size:8px;
    letter-spacing:1.5px;
    margin-bottom:9px
  }
  .ms-history-link {
    padding:9px 11px
  }
  .ms-history-link span,.ms-history-link>i:last-child {
    display:none
  }
  .ms-footer {
    margin-top:32px;
    font-size:10px
  }
  .ms-footer span:last-child {
    display:none
  }
  .bottom-nav {
    display:flex!important;
    position:fixed;
    inset:auto 0 0;
    background:#fff!important;
    border-top:1px solid var(--ms-line);
    padding:9px 9px max(12px,env(safe-area-inset-bottom))!important;
    z-index:95;
    justify-content:space-around;
    box-shadow:0 -5px 20px #173b3205
  }
  .bottom-nav a {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    color:#8a968b!important;
    min-width:45px;
    min-height:46px;
    position:relative;
    font-size:9px!important;
    font-weight:600
  }
  .bottom-nav i {
    font-size:20px!important;
    line-height:1.1
  }
  .bottom-nav a.active {
    color:var(--ms-green)!important
  }
  .bottom-nav a.active:before {
    content:"";
    height:3px;
    width:22px;
    background:var(--ms-gold);
    border-radius:2px;
    position:absolute;
    top:-9px
  }
  .header-card {
    padding:27px!important;
    min-height:265px
  }
  .header-card h5 {
    font-size:32px!important;
    max-width:75%
  }
  .header-card p {
    max-width:67%;
    font-size:12px!important
  }
  .ms-hero-logo {
    width:79px;
    height:79px;
    right:22px;
    top:48%
  }
  .ms-hero-logo img {
    width:158px;
    height:158px;
    left:-39px;
    top:-25px
  }
  .ms-hero-link {
    margin-top:18px;
    font-size:11px
  }
  .header-card:after {
    right:-230px
  }
  .balance-card {
    padding:22px!important
  }
  .ms-page-home .balance-card {
    gap:14px
  }
  .ms-page-home .balance-card .balance-amount {
    font-size:26px
  }
  .ms-page-home .balance-card .btn {
    margin:0 5px 0 0;
    font-size:12px
  }
  .ms-page-home .balance-card .col-6+.col-6 {
    padding-left:22px
  }
  .product-card {
    padding:16px!important;
    gap:16px;
    border-radius:16px!important
  }
  .product-card .left {
    width:32%!important;
    min-height:145px;
    padding:8px
  }
  .product-card h6 {
    font-size:17px
  }
  .product-card p {
    font-size:11px
  }
  .product-card .price {
    font-size:10px
  }
  .lease-btn {
    min-height:36px;
    font-size:11px;
    min-width:110px;
    padding:8px 15px!important
  }
  .payment-container,.bank-card,.coupon-card,.details-card {
    padding:23px!important;
    margin:18px auto!important
  }
  .payment-option {
    padding:15px!important
  }
  .quick-options {
    grid-template-columns:repeat(2,1fr);
    gap:12px
  }
  .settings-list {
    grid-template-columns:1fr
  }
  .support-container,.about-container {
    padding:24px!important
  }
  .support-item {
    padding:15px!important
  }
  .support-item span {
    font-size:12px!important;
    margin-left:0!important
  }
  .support-item a {
    padding:5px 10px
  }
  .ms-auth-layout {
    display:block
  }
  .ms-auth-story {
    min-height:0;
    padding:25px 28px 30px
  }
  .ms-auth-story .ms-brand {
    font-size:23px
  }
  .ms-auth-message {
    padding:35px 0 0
  }
  .ms-auth-message h1 {
    font-size:38px;
    letter-spacing:-1px;
    margin:12px 0 0;
    line-height:1.1
  }
  .ms-auth-message h1 br:last-child {
    display:none
  }
  .ms-auth-message p,.ms-auth-bottom {
    display:none
  }
  .ms-auth-message .ms-eyebrow {
    font-size:8px
  }
  .ms-auth-main {
    padding:32px 28px 45px;
    min-height:0;
    align-items:stretch
  }
  .ms-auth-main .login-container,.ms-auth-main .register-container {
    margin:auto!important
  }
  .ms-auth-main .logo-section h3 {
    font-size:28px
  }
  .ms-auth-main .logo-section:before {
    display:none
  }
  .ms-auth-main .logo-section {
    margin-bottom:26px
  }
  .ms-page-task .balance-card,.ms-page-task2 .balance-card {
    gap:15px;
    align-items:flex-start!important
  }
  .ms-page-task .balance-card .left,.ms-page-task2 .balance-card .left {
    font-size:12px
  }
  .ms-page-task .balance-card .right,.ms-page-task2 .balance-card .right {
    font-size:11px;
    max-width:110px;
    white-space:normal
  }
  .ms-page-task>.balance-buttons .btn,.ms-page-task2>.balance-buttons .btn {
    font-size:10px;
    padding:10px!important;
    flex:1
  }
  .ms-page-team .balance-card {
    padding:20px!important
  }
  .ms-page-team .balance-card.p-4 {
    padding:20px!important
  }
  .ms-main .d-flex.justify-content-around.bg-white .btn {
    font-size:10px!important;
    padding:8px 4px!important
  }
  .ms-page-details .balance-card,.ms-page-recharge-records .balance-card,.ms-page-withdrawal-records .balance-card {
    font-size:12px;
    padding:18px!important
  }
  .ms-main .balance-card .right {
    margin-left:8px
  }
  .ms-main .balance-card .right small {
    overflow-wrap:anywhere
  }
  .ms-page-withdrawal .balance-card {
    gap:12px
  }
  .ms-page-withdrawal .balance-card .balance-amount {
    font-size:24px
  }
}

@media(max-width:360px) {
  .ms-main {
    padding-left:14px;
    padding-right:14px
  }
  .ms-topbar {
    padding:0 14px
  }
  .ms-brand {
    font-size:19px
  }
  .ms-brand small {
    font-size:5px
  }
  .ms-top-actions {
    gap:9px
  }
  .ms-help {
    display:none
  }
  .header-card {
    padding:22px!important
  }
  .header-card h5 {
    font-size:29px!important
  }
  .ms-hero-logo {
    width:65px;
    height:65px;
    right:18px
  }
  .ms-hero-logo img {
    width:131px;
    height:131px;
    left:-33px;
    top:-21px
  }
  .bottom-nav a {
    font-size:8px!important
  }
  .ms-page-heading h1 {
    font-size:24px
  }
  .ms-auth-main {
    padding:28px 22px
  }
  .ms-auth-story {
    padding:24px
  }
  .product-card {
    gap:12px;
    padding:13px!important
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*:before,*:after {
    animation:none!important;
    transition:none!important
  }
}

