:root {
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

html {
  box-sizing: border-box;
  -webkit-text-size-adjust: 100%;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

img,
svg,
video,
canvas {
  max-width: 100%;
  height: auto;
}

input,
select,
textarea,
button {
  max-width: 100%;
}

body {
  overflow-x: hidden;
}

table {
  width: 100%;
  max-width: 100%;
}

.main-content,
.hero-section {
  max-width: 1350px;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 1200px) {
  .main-content {
    padding-left: 12px;
    padding-right: 12px;
  }
  .hero-section {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media (max-width: 992px) {
  .main-content {
    max-width: none;
    padding-left: 12px;
    padding-right: 12px;
  }
  body {
    padding-left: 0 !important;
  }
}

@media (max-width: 768px) {
  .main-content {
    padding-left: 10px;
    padding-right: 10px;
  }
  .hero-section {
    padding-left: 10px;
    padding-right: 10px;
  }
}

@media (max-width: 480px) {
  .main-content {
    padding-left: 8px;
    padding-right: 8px;
  }
  .hero-section {
    padding-left: 8px;
    padding-right: 8px;
  }
}

.mcw-header .header-container {
  flex-wrap: wrap;
}

.mcw-header .header-left {
  width: auto;
  min-width: 0;
}

.mcw-header .header-right {
  margin-left: auto;
}

.mcw-header .nav-list {
  scroll-snap-type: x proximity;
}

.mcw-header .nav-link {
  scroll-snap-align: start;
}

@media (max-width: 992px) {
  .mcw-header .header-top {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .mcw-header .header-container {
    padding-left: 12px;
    padding-right: 12px;
    gap: 10px;
  }
  .mcw-header .nav-list {
    padding-left: 10px;
    padding-right: 10px;
    gap: 0;
  }
  .mcw-header .nav-link {
    padding: 9px 14px;
    font-size: 13px;
  }
}

@media (max-width: 768px) {
  .mcw-header .btn-signup,
  .mcw-header .btn-login,
  .mcw-header .btn-deposit {
    padding: 8px 14px;
    font-size: 12px;
  }
  .mcw-header .user-balance {
    padding: 6px 10px;
  }
}

@media (max-width: 480px) {
  .mcw-header .logo-icon {
    height: 40px;
  }
  .mcw-header .btn-signup,
  .mcw-header .btn-login,
  .mcw-header .btn-deposit {
    padding: 7px 12px;
  }
}

.provider-tabs {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
}

.provider-tab {
  scroll-snap-align: start;
}

.bottom-nav,
.bottom-nav-guest,
.tabbar__container {
  padding-bottom: var(--safe-bottom);
}

.chat-widget-btn {
  bottom: calc(80px + var(--safe-bottom));
}

@media (max-width: 480px) {
  .chat-widget-btn {
    bottom: calc(70px + var(--safe-bottom));
    right: 14px;
    width: 56px;
    height: 56px;
  }
}

