:root{
  --bg0:#1f140d !important;
  --bg1:#120b07 !important;
  --card:rgba(54,33,20,.74) !important;
  --card2:rgba(32,20,13,.56) !important;
  --stroke:rgba(236,214,178,.18) !important;
  --stroke2:rgba(255,223,162,.32) !important;
  --txt:#f8ead8 !important;
  --mut:#d2baa0 !important;
  --a:#d1a14a !important;
  --b:#8d6133 !important;
  --g:#65c18c !important;
  --r:#e78266 !important;
  --y:#efc56d !important;
  --c:#c89f62 !important;
  --acc:#d1a14a !important;
  --acc2:#8d6133 !important;
  --st:rgba(236,214,178,.18) !important;
  --st2:rgba(255,223,162,.32) !important;
  --sh:0 24px 80px rgba(8,4,1,.42) !important;
  --ring:0 0 0 4px rgba(209,161,74,.18) !important;
  --glowA:rgba(138,96,52,.28) !important;
  --glowB:rgba(239,197,109,.16) !important;
  --btn-grad:linear-gradient(135deg,#7c562a 0%,#d1a14a 50%,#f6de9a 100%) !important;
  --btn-grad-soft:linear-gradient(180deg,rgba(255,244,224,.12),rgba(92,61,35,.16)) !important;
  --btn-text:#24140a !important;
  --btn-text-soft:#f6e5cb !important;
  --btn-shadow:0 18px 44px rgba(14,8,2,.34),0 0 28px rgba(209,161,74,.18) !important;
  --btn-glow:0 0 0 4px rgba(209,161,74,.14),0 18px 48px rgba(209,161,74,.18) !important;
  --btn-border:rgba(255,223,162,.22) !important;
  --btn-border-strong:rgba(255,231,183,.38) !important;
  --btn-ic-bg:rgba(255,247,230,.34) !important;
  --btn-ic-br:rgba(124,86,42,.18) !important;
}

html[data-theme="light"]{
  --bg0:#f7efe4 !important;
  --bg1:#efe1d0 !important;
  --card:rgba(255,249,241,.82) !important;
  --card2:rgba(253,245,234,.66) !important;
  --stroke:rgba(98,64,33,.12) !important;
  --stroke2:rgba(124,86,42,.22) !important;
  --txt:#352012 !important;
  --mut:#7a5a40 !important;
  --st:rgba(98,64,33,.12) !important;
  --st2:rgba(124,86,42,.22) !important;
  --sh:0 20px 60px rgba(73,45,22,.12) !important;
  --ring:0 0 0 4px rgba(209,161,74,.15) !important;
  --btn-text:#2d1808 !important;
  --btn-text-soft:#4b2d18 !important;
  --btn-border:rgba(124,86,42,.14) !important;
  --btn-border-strong:rgba(124,86,42,.24) !important;
  --btn-ic-bg:rgba(255,248,233,.7) !important;
  --btn-ic-br:rgba(124,86,42,.14) !important;
}

html,body{
  overflow-x:hidden;
}

body{
  color:var(--txt) !important;
  background:
    radial-gradient(1200px 700px at 15% 10%, rgba(120,82,46,.28), transparent 58%),
    radial-gradient(900px 560px at 85% 15%, rgba(239,197,109,.16), transparent 60%),
    radial-gradient(800px 520px at 50% 100%, rgba(94,64,38,.28), transparent 56%),
    linear-gradient(180deg,var(--bg0),var(--bg1)) !important;
}

body::before{
  background:
    radial-gradient(900px 500px at 12% 10%, rgba(124,86,42,.22), transparent 58%),
    radial-gradient(700px 460px at 88% 18%, rgba(239,197,109,.14), transparent 56%),
    radial-gradient(840px 480px at 50% 100%, rgba(66,40,25,.32), transparent 58%) !important;
  filter:saturate(1.03) !important;
}

a,
.mut,
.alert a,
.rich a{
  color:var(--txt);
}

.nav,
.card,
.pCard,
.saItem,
.pagesHub,
.heroHelloCard,
.helloBar,
.helloPanel,
.modal,
.drawer,
.drawerPanel,
.tabCard,
.pkgCard,
.packCard,
.planCard,
.pricingCard,
.benefitItem,
.oBoard,
.oCard,
.oPanel,
.statCard,
.mkUpgraded,
fieldset[id$="_tab"],
#bank_tab,
#walit_tab,
#westron_tab,
#online_tab,
#paypal_tab,
#coupon_tab,
.alert,
.table-responsive-sm,
.pBoard,
.formCard,
.authCard,
.contactCard,
.glass-card,
.glass{
  background:
    linear-gradient(180deg, rgba(255,248,236,.11), rgba(92,61,35,.12)) !important;
  border:1px solid var(--stroke) !important;
  box-shadow:var(--sh) !important;
  backdrop-filter:blur(18px) saturate(1.04) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.04) !important;
}

.nav::after,
.btn::before,
.pill::before,
.tiny::before,
.miniBtn::before,
.card::before,
.glass-card::before,
.glass::before{
  background:linear-gradient(120deg,transparent 0%,rgba(255,248,232,.28) 32%,transparent 68%) !important;
}

.btn,
.pill,
.tiny,
.miniBtn,
.iconBtn,
.chip,
.aBtn,
.oTab,
.tab,
.nav-tabs .nav-link,
.nav-pills .nav-link,
[role="tab"],
.paymentBtn,
.toggleBtn,
.powerBtn,
.themeToggle{
  border:1px solid var(--btn-border) !important;
  color:var(--btn-text-soft) !important;
  background:linear-gradient(180deg,rgba(255,248,236,.1),rgba(72,46,28,.14)) !important;
  box-shadow:0 10px 30px rgba(14,8,2,.18) !important;
  backdrop-filter:blur(16px) !important;
  -webkit-backdrop-filter:blur(16px) !important;
}

.btn.primary,
.pill.primary,
.aBtn.primary,
.oTab.active,
.tab.active,
.nav-tabs .nav-link.active,
.nav-pills .nav-link.active,
[role="tab"].active,
[role="tab"][aria-selected="true"],
.paymentBtn.active,
.toggleBtn.active{
  color:var(--btn-text) !important;
  background:var(--btn-grad) !important;
  border-color:rgba(255,225,160,.42) !important;
  box-shadow:var(--btn-shadow) !important;
}

.btn.primary::after,
.pill.primary::after,
.aBtn.primary::after,
.oTab.active::after,
.tab.active::after,
.nav-tabs .nav-link.active::after,
.nav-pills .nav-link.active::after{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,.04) 46%,rgba(124,86,42,.06));
  mix-blend-mode:screen;
  pointer-events:none;
}

.btn.primary::before,
.pill.primary::before,
.aBtn.primary::before,
.oTab.active::before,
.tab.active::before,
.nav-tabs .nav-link.active::before,
.nav-pills .nav-link.active::before{
  content:"";
  position:absolute;
  inset:-60% -45% auto;
  height:170%;
  transform:rotate(14deg);
  background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.42) 34%,transparent 68%);
  opacity:.55;
  pointer-events:none;
}

.btn:hover,
.pill:hover,
.tiny:hover,
.miniBtn:hover,
.iconBtn:hover,
.chip:hover,
.aBtn:hover,
.oTab:hover,
.tab:hover,
.nav-tabs .nav-link:hover,
.nav-pills .nav-link:hover{
  transform:translateY(-2px);
  border-color:var(--btn-border-strong) !important;
  box-shadow:0 18px 38px rgba(14,8,2,.2),0 0 0 4px rgba(209,161,74,.08) !important;
}

.btn.primary:hover,
.pill.primary:hover,
.aBtn.primary:hover,
.oTab.active:hover,
.tab.active:hover,
.nav-tabs .nav-link.active:hover,
.nav-pills .nav-link.active:hover{
  box-shadow:var(--btn-shadow),var(--btn-glow) !important;
  filter:brightness(1.03) saturate(1.02) !important;
}

.btn i,
.pill i,
.tiny i,
.aBtn i,
.oTab i,
.tab i{
  color:inherit !important;
}

.btn.primary i,
.pill.primary i,
.aBtn.primary i{
  background:rgba(255,250,239,.32) !important;
  border-color:rgba(124,86,42,.2) !important;
}

.tickerBadge,
.hState.ok,
.status.ok,
.badge-primary,
.badge-warning,
.badge-success{
  background:rgba(209,161,74,.16) !important;
  border-color:rgba(239,197,109,.38) !important;
  color:var(--txt) !important;
}

.dot.active,
.swiper-pagination-bullet-active{
  background:#efc56d !important;
  box-shadow:0 0 18px rgba(239,197,109,.4) !important;
}

.slideOverlay{
  background:linear-gradient(90deg,rgba(33,20,12,.94) 0%,rgba(33,20,12,.64) 44%,rgba(33,20,12,.12) 100%) !important;
}

[data-theme="light"] .slideOverlay{
  background:linear-gradient(90deg,rgba(250,240,228,.95) 0%,rgba(250,240,228,.66) 46%,rgba(250,240,228,.18) 100%) !important;
}

.table,
table,
.oTable{
  color:var(--txt) !important;
}

.table thead th,
table thead th,
.oTable th{
  background:linear-gradient(90deg,rgba(209,161,74,.22),rgba(124,86,42,.12)) !important;
  border-color:var(--stroke) !important;
  color:var(--txt) !important;
}

.table tbody td,
table tbody td,
.oTable td{
  border-color:rgba(255,231,183,.08) !important;
}

input,
select,
textarea,
.form-control,
.form-select{
  background:rgba(36,22,14,.54) !important;
  color:var(--txt) !important;
  border:1px solid rgba(255,223,162,.18) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04) !important;
}

html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea,
html[data-theme="light"] .form-control,
html[data-theme="light"] .form-select{
  background:rgba(255,251,246,.86) !important;
}

input::placeholder,
textarea::placeholder{
  color:var(--mut) !important;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.form-select:focus{
  outline:none !important;
  border-color:rgba(239,197,109,.46) !important;
  box-shadow:var(--ring) !important;
}

.tabs,
#oTabs,
.nav-tabs,
.nav-pills,
.tabsWrap,
.tabActions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.tabs,
#oTabs,
.nav-tabs,
.nav-pills{
  padding:8px;
  border-radius:24px;
  border:1px solid var(--stroke);
  background:linear-gradient(180deg,rgba(255,248,236,.08),rgba(72,46,28,.12));
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.tab,
.oTab,
.nav-tabs .nav-link,
.nav-pills .nav-link,
[role="tab"]{
  min-height:48px;
  padding:12px 18px !important;
  border-radius:18px !important;
  font-weight:1000;
  position:relative;
  overflow:hidden;
  cursor:pointer;
}

.passToggle,
.iconBtn,
.miniBtn{
  background:linear-gradient(180deg,rgba(255,248,236,.1),rgba(72,46,28,.14)) !important;
}

#MyCart .mkCartBtn,
.mkCartBtn{
  background:var(--btn-grad) !important;
  color:var(--btn-text) !important;
  border:1px solid rgba(255,228,169,.38) !important;
  box-shadow:var(--btn-shadow) !important;
}

#MyCart .mkCartCount,
.mkCartCount{
  background:#f6de9a !important;
  color:#3a220f !important;
  box-shadow:0 8px 20px rgba(209,161,74,.2) !important;
}

.alert{
  color:var(--txt) !important;
}

.alert-warning,
.alert-primary,
.alert-info,
.alert-success{
  background:linear-gradient(180deg,rgba(209,161,74,.16),rgba(86,58,32,.16)) !important;
}

.alert-danger{
  background:linear-gradient(180deg,rgba(157,83,54,.22),rgba(86,40,28,.18)) !important;
}

.modalHead,
.cardTitle,
.head,
.pCard .head,
.helloBar,
.hTop{
  border-color:var(--stroke) !important;
}

.rich img,
.rich iframe,
.rich video,
.rich table{
  border-color:var(--stroke) !important;
}

.modernBenefits,
.pBoard,
.heroSlider,
.pagesHub{
  background:
    radial-gradient(120% 120% at 100% 0%, rgba(209,161,74,.18), transparent 44%),
    radial-gradient(100% 120% at 0% 100%, rgba(92,61,35,.22), transparent 44%),
    linear-gradient(180deg, rgba(255,248,236,.08), rgba(72,46,28,.12)) !important;
}

.heroSlider::before,
.feature::after,
.pkgCard::before,
.catCard::after,
.catOverlay,
.pageTile::before,
.pageTile::after,
.ptOverlay,
.bigPromo,
.support,
.iconCardInner,
.iconCardBadge,
.iconOrderBtn,
.catGo,
.catArrow,
.price,
.metaPill,
.cardBadge,
.aBtn.primary,
.btnHero,
.copyBtn.primary,
.copyBtn,
.okBtn.primary,
.errBtn.primary,
.appBtn.primary,
.btnX.primary,
.sBtn.primary,
.wBtn.primary,
.previewBtns a.primary,
.cardXBtn.primary,
.phBtn.primary,
.payCard.active,
.payCard:hover,
#calculatResult,
#calculatResult .table thead th,
#calculatResult .table tbody tr.table-primary td,
.table-primary td,
.alert-primary,
.alert-info{
  border-color:rgba(239,197,109,.32) !important;
}

.heroSlider::before,
.feature::after,
.pkgCard::before,
.pageTile::before,
.heroSocialCard::before,
.heroHelloCard::after,
.helloBar::before,
.helloPanel::before{
  background:radial-gradient(circle at 30% 30%, rgba(209,161,74,.22), transparent 60%) !important;
}

.catCard::after,
.ptOverlay,
.catOverlay{
  background:
    linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.42) 65%, rgba(0,0,0,.66)),
    radial-gradient(600px 220px at 20% 25%, rgba(209,161,74,.22), transparent 60%),
    radial-gradient(520px 220px at 80% 40%, rgba(141,97,51,.18), transparent 60%) !important;
}

[data-theme="light"] .catOverlay,
[data-theme="light"] .ptOverlay{
  background:
    linear-gradient(180deg, rgba(246,240,230,0), rgba(246,240,230,.55) 65%, rgba(246,240,230,.88)),
    radial-gradient(600px 220px at 20% 25%, rgba(209,161,74,.14), transparent 60%),
    radial-gradient(520px 220px at 80% 40%, rgba(141,97,51,.10), transparent 60%) !important;
}

.iconCardInner,
.bigPromo,
.support{
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(209,161,74,.16) 0%, rgba(209,161,74,0) 42%),
    linear-gradient(180deg, rgba(255,248,236,.05), rgba(72,46,28,.10)) !important;
}

.iconCardBadge,
.price,
.cardBadge,
.metaPill,
.catArrow,
.ptChip{
  background:linear-gradient(180deg, rgba(246,222,154,.92), rgba(209,161,74,.76)) !important;
  color:#24140a !important;
}

.iconOrderBtn,
.catGo,
.ptGo,
.aBtn.primary,
.btnHero,
.copyBtn.primary,
.okBtn.primary,
.errBtn.primary,
.appBtn.primary,
.btnX.primary,
.sBtn.primary,
.wBtn.primary,
.previewBtns a.primary,
.cardXBtn.primary,
.phBtn.primary,
.modalActions .btn.primary,
.noticeActions .btnHero{
  color:#24140a !important;
  background:linear-gradient(135deg, rgba(246,222,154,.98), rgba(209,161,74,.90)) !important;
  box-shadow:0 16px 38px rgba(124,86,42,.22) !important;
}

.pagesHub .phBtn.primary,
.pagesHub .ptGo,
.pageTile.is-bg .ptGo,
.pageTile:hover .ptGo{
  color:#24140a !important;
  background:linear-gradient(135deg, rgba(246,222,154,.98), rgba(209,161,74,.90)) !important;
  border-color:rgba(239,197,109,.42) !important;
  box-shadow:0 16px 38px rgba(124,86,42,.22) !important;
}

.pagesHub .ptChip,
.pageTile.is-bg .ptChip,
.pageTile:hover .ptChip{
  color:#24140a !important;
  background:linear-gradient(180deg, rgba(246,222,154,.92), rgba(209,161,74,.76)) !important;
  border-color:rgba(239,197,109,.36) !important;
}

.payCard.active{
  background:linear-gradient(135deg, rgba(209,161,74,.22), rgba(141,97,51,.14)) !important;
  box-shadow:0 18px 40px rgba(124,86,42,.14) !important;
}

.payCard:hover,
.copyBtn:hover{
  border-color:rgba(209,161,74,.40) !important;
}

#calculatResult{
  background:
    radial-gradient(900px 240px at 85% 0%, rgba(209,161,74,.22), transparent 60%),
    radial-gradient(800px 220px at 10% 20%, rgba(141,97,51,.18), transparent 55%),
    rgba(32,20,13,.88) !important;
}

#calculatResult .table thead th,
#calculatResult .table tbody tr.table-primary td,
.table-primary td{
  background:linear-gradient(90deg, rgba(209,161,74,.20), rgba(141,97,51,.12)) !important;
}

.benefitIcon,
.helloIcon,
.hBadge i{
  background:
    linear-gradient(180deg, rgba(239,197,109,.3), rgba(124,86,42,.14)),
    rgba(255,248,236,.05) !important;
  border-color:rgba(255,223,162,.24) !important;
  box-shadow:0 10px 22px rgba(124,86,42,.16) !important;
}

*{
  scrollbar-width:thin;
  scrollbar-color:rgba(239,197,109,.55) rgba(64,40,24,.24);
}

*::-webkit-scrollbar{
  width:10px;
  height:10px;
}

*::-webkit-scrollbar-track{
  background:rgba(64,40,24,.2);
}

*::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(239,197,109,.8),rgba(124,86,42,.72));
  border-radius:999px;
}

::selection{
  background:rgba(239,197,109,.34);
  color:#2a1608;
}

img,
video,
iframe{
  max-width:100%;
  height:auto;
}

@media (max-width: 980px){
  .container{
    padding-inline:12px !important;
  }

  .nav{
    gap:10px !important;
    padding:12px !important;
    border-radius:20px !important;
  }

  .tabs,
  #oTabs,
  .nav-tabs,
  .nav-pills{
    padding:8px !important;
    border-radius:22px !important;
  }

  .tab,
  .oTab,
  .nav-tabs .nav-link,
  .nav-pills .nav-link,
  [role="tab"]{
    flex:1 1 calc(50% - 10px);
    justify-content:center;
    text-align:center;
    min-width:0;
  }

  .btn,
  .pill,
  .tiny,
  .aBtn{
    min-height:46px;
  }

  .slideContent{
    max-width:100% !important;
  }

  .card,
  .pCard,
  .tabCard,
  .modal,
  .drawerPanel,
  .modernBenefits,
  .pBoard{
    border-radius:22px !important;
  }
}

@media (max-width: 640px){
  .container{
    padding-inline:10px !important;
    padding-bottom:28px !important;
  }

  .brand{
    min-width:0 !important;
    width:auto !important;
  }

  .brand h1{
    font-size:12px !important;
    line-height:1.4 !important;
  }

  .tabs,
  #oTabs,
  .nav-tabs,
  .nav-pills,
  .ctaRow,
  .navActions,
  .navLinks,
  .socialRow,
  .chips,
  .pActions,
  .modalActions{
    gap:8px !important;
  }

  .tab,
  .oTab,
  .nav-tabs .nav-link,
  .nav-pills .nav-link,
  [role="tab"],
  .btn,
  .pill,
  .tiny,
  .aBtn{
    width:100%;
    flex:1 1 100%;
  }

  .table-responsive,
  .table-responsive-sm,
  .tWrap{
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch;
    border-radius:18px;
  }

  table,
  .oTable{
    min-width:640px;
  }

  .slideContent h2{
    font-size:20px !important;
  }

  .slideContent p,
  .helloSub,
  .mut{
    font-size:13px !important;
    line-height:1.8 !important;
  }

  input,
  select,
  textarea,
  .form-control,
  .form-select{
    font-size:16px !important;
  }

  .tickerWrap{
    display:grid !important;
    grid-template-columns:1fr auto !important;
    grid-template-areas:
      "badge badge"
      "ticker toggle" !important;
    align-items:center !important;
    gap:8px !important;
    padding:10px !important;
  }

  .tickerBadge{
    grid-area:badge !important;
    width:max-content;
    max-width:100%;
  }

  .ticker{
    grid-area:ticker !important;
    min-width:0 !important;
    width:100% !important;
    height:32px !important;
  }

  #tickerToggle,
  .tickerWrap .tiny{
    grid-area:toggle !important;
    width:auto !important;
    min-width:74px !important;
    height:32px !important;
    padding:0 10px !important;
    flex:0 0 auto !important;
    white-space:nowrap !important;
    align-self:center !important;
  }

  .tickerItem,
  .tickerItem a,
  .tickerItem span{
    font-size:12px !important;
    line-height:1.6 !important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    display:block;
  }
}