.gate-otc-trade-container{
    display: flex;
    flex-direction: column;
    /* gap: 120px; */
}
.mb-16 {
    margin-bottom: 16px;
}

.mb-24 {
    margin-bottom: 24px;
}

.cursor-pointer {
    cursor: pointer;
}

.text-security-input input {
    -webkit-text-security: disc !important;
}

.d-inline-flex {
    display: inline-flex;
}

.classic-dark .gate-otc-main{
   background-color: var(--color-bg-1);
}

/* .classic-dark .trade-inputWrapper-title{
   color: var(--color-text-2);
} */



.otc-main {
    width: 100% ;
    padding-top: 120px;
}

.otc-main-info {
    word-break: break-all;
    height: 600px;
    justify-content: center;
    margin-right: 100px;
    max-width: 590px;
}

.otc-main-info-title {
    font-weight: 600;
    font-size: var(--font-h1);
    line-height: 150%;
    margin-bottom: 8px;
    color: var(--color-text-1);
    word-break: break-word;
}

.otc-info-desc {
    font-weight: 500;
    font-size: var(--font-body);
    line-height: 24px;
    margin-bottom: 40px;
    color: var(--color-text-1);
    word-break: break-word;
}

.otc-trade-advantage{
  display: flex;
  align-items: center;
  gap: 40px;
}

.otc-trade-advantage-item{
  display: flex;
  align-items: baseline;
  gap: 3px;
}

.otc-trade-advantage-item-text{
  word-break: break-word;
  font-weight: 500;
  font-size: var(--font-body-s);
  color: var(--color-text-1);
}
.otc-main-info-image {
    width: 100%;
    aspect-ratio: 16 / 6;
    opacity: 0.8;
    background-image: url(/images/gate_otc/otc_trade/otc_trade_header.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.classic-dark .otc-main-info-image {
    background-image: url(/images/gate_otc/otc_trade/otc_trade_header_dark.png);
}

.otc-main-trade {
    width: 510px;
    background: var(--color-card-2);
    border: solid 1px var(--color-divider-2);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: rgba(13, 31, 66, 0.07) 0px 7px 20px;
}

.otc-trade-oper-con {
    padding: 32px 40px 40px;
    background: var(--color-card-2);
}

.otc-trade-alert-text {
    display: flex;
    justify-content: space-between;
}

.trade-inputWrapper-title {
    width: 100%;
    color: var(--color-text-1);
    font-size: var(--font-body-m);
    font-weight: 500;
}

.trade-input-title {
    font-size: var(--font-body-m);
    color: var(--color-text-2) !important;
}

.inputWrapper-tips {
    cursor: pointer;
    color: var(--color-text-2);
    font-size: var(--font-body-m);
    font-weight: 400;
}

.inputWrapper-tipsSell {
    cursor: pointer;
    color: var(--color-text-2);
}

.inputWrapper-tips:hover {
    color: var(--color-text-5);
}

.sell-volume-max {
    color: var(--color-text-5);
    font-weight: 500;
    font-size: var(--font-h5);
    display: inline-block;
    cursor: pointer;
    line-height: 38px;
}

.sell-trade-funds {
    font-weight: 400;
    font-size: var(--font-body-s);
    color: var(--color-text-3);
}

.sell-trade-funds .gui-font-face {
    cursor: pointer;
}

.split {
    display: inline-block;
    width: 1px;
    height: 10px;
    background: var(--color-divider-1);
    margin: auto 8px;
}

.trade-faq-title {
    font-weight: 600;
    font-size: var(--font-h3);
    margin-bottom: 32px;
    color: var(--color-text-1);
}

.limited-content {
    color: var(--color-text-3);
    font-size: var(--font-body-m);
    margin-bottom: 36px;
    font-weight: 400;
}

.otc-input-box .mantine-GateInput-rightSection{
    font-size: var(--font-body-m);
    margin-right: 0;
}

.otc-input-box .mantine-Text-root{
    color: var(--color-text-5);
} 

.otc-input-box .brand-color{
    font-weight: 400;
}

.limited-btns button {
    width: calc(50% - 9px);
    margin-bottom: 12px;
}

.custom-modal-title {
    font-size: var(--font-h5);
    color: var(--color-text-1);
    font-weight: 600;
    line-height: 120%;
    margin-bottom: 24px;
}

.get-other-coin-desc {
    font-size: var(--font-body-m);
    line-height: 150%;
    color: var(--color-text-3);
    margin-bottom: 16px;
}

.get-coin-way {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.get-coin-way-item {
    background: var(--color-card-1);
    padding: 16px;
    border-radius: 4px;
    justify-content: space-between;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.get-coin-way-item .get-coin-way-item-left {
    display: flex;
    gap: 12px;
}

.get-coin-way-item .get-coin-way-con {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.get-coin-way-item .get-coin-way-con .title {
    font-size: var(--font-body);
    color: var(--color-text-1);
    font-weight: 600;
    line-height: 150%;
}

.get-coin-way-item .get-coin-way-con .description {
    font-size: var(--font-body-s);
    color: var(--color-text-3);
    font-weight: 400;
    line-height: 150%;
}

.gate-otc-main{
  display: flex;
  flex-direction: column;
  gap: 120px;
  /* padding-bottom: 120px; */
}



.otc-quote-con-box {
    width: 100%;
    height: auto;
    /* min-height: calc(100vh - 128px); */
    padding: 72px 0 120px;
    background: var(--color-bg-1);
    overflow: hidden;
}

.otc-quote-con {
    width: 588px;
    margin: auto;
}

.otc-quote-main {
    background: var(--color-card-6);
    padding: 24px;
    border-radius: 8px;
    border: 1px solid var(--color-divider-2);
}

.otc-quote-title {
    color: var(--color-text-1);
    font-size: var(--font-h5);
    font-weight: 600;
    margin-bottom: 24px;
}

.otc-quote-info-item {
    color: var(--color-text-1);
    font-size: var(--font-body);
    font-weight: 500;
}

.otc-quote-info-label {
    color: var(--color-text-3);
    font-size: var(--font-body);
}
.gate-otc-trade-preview-content{
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.otc-quote-footer {
    margin-top: 32px;
}

.gate-otc-hide-con {
    display: none;
}

/* OTC订单详情页 */
.otc-order-detail-content {
    margin: 0 auto;
    width: 540px;
    margin-top: 72px;
    padding-bottom: 120px;
}

.otc-order-paid-content {
    margin: 0 auto;
    width: 540px;
    margin-top: 72px;
    padding-bottom: 120px;
}

.otc-order-no-paid-title {
    font-size: var(--font-h5);
    font-weight: 600;
    color: var(--color-text-1);
    margin-bottom: 16px;
}

.otc-order-no-paid-disc {
    font-size: var(--font-body-m);
    font-weight: 400;
    color: var(--color-text-3);
    margin-bottom: 24px;
    line-height: 21px;
}

.otc-order-no-paid-disc span {
    color: var(--color-text-1);
}

.otc-order-detail-item {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    font-size: var(--font-body);
    font-weight: 400;
}

.otc-order-detail-item-left {
    color: var(--color-text-3);
    font-size: var(--font-body);
}

.otc-order-detail-item-right {
    color: var(--color-text-1);
    display: flex;
    font-size: var(--font-body);
    font-weight: 500;
}

.otc-order-detail-item-right-svg {
    color: var(--color-text-1);
    cursor: pointer;
    margin-top: 1.5px;
}

.otc-order-detail-item-right-svg:hover {
    color: var(--color-brand-1);
}

.otc-order-split-line {
    width: 100%;
    height: 1px;
    background-color: var(--color-divider-2);
    margin: 24px 0;
}

.otc-order-warn-message {
    padding: 12px;
    height: 18px;
    display: flex;
    justify-content: left;
    font-size: var(--font-body-s);
    line-height: 18px;
    font-weight: 400;
    color: #04091A;
    background-color: var(--color-cmpt-3);
    margin-top: 16px;
}

.otc-order-warn-message span {
    color: var(--color-brand-1);
}

.otc-order-warn-message-svg svg {
    margin-top: 1px;
}

.otc-order-buttons {
    display: flex;
    justify-content: space-between;
    margin-top: 32px;
}

.otc-order-paid-content-order-detail {
    padding: 24px;
}

.otc-order-paid-content-payment-detail {
    padding: 24px;
    background-color: var(--color-card-1);
    border-radius: 8px;
}

.otc-order-paid-content-status {
    width: 100%;
}

.otc-order-paid-content-status-icon {
    width: 60px;
    height: 60px;
    margin: 0 auto;
}

.otc-order-paid-content-status-title {
    font-weight: 600;
    font-size: var(--font-subtitle);
    text-align: center;
    color: var(--color-text-1);
    margin-top: 24px;
}

.otc-order-paid-content-status-disc {
    font-weight: 400;
    font-size: var(--font-body);
    text-align: center;
    color: var(--color-text-3);
    margin-top: 12px;
}

.otc-trade-faq {
    width: 100%;
}

.otc-trade-faq a {
    color: var(--color-text-5)
}

html[lang=ar] .sell-volume-max.mr-16 {
    margin-left: unset;
    margin-right: 16px;
}


 .otc-trade-main-input-wrapper{
   background: var( --color-neutral-2);
   padding: 24px 16px;
   border-radius: 8px;
 }

 .otc-trade-main-input-wrapper-title{
  font-weight: 400;
  font-size: var(--font-body-m);
  color: var(--color-text-3);
 }

.clear-icon {
    color: var(--color-text-4);
}

.promo-label {
    width: auto;
    display: inline-flex;
}

.promo-label:hover {
    color: var(--color-brand-1);
}
.promo-label-show svg path:hover {
  color: var(--color-brand-1);
}

.promo-label-show .promo-icon {
    transform: rotate(180deg);
}


.promo-icon-arrow {
  color: var(--color-icon-1);
}


.promo-code-input{
  height: 48px;
}
.promo-code-input-error .mantine-Input-input {
    border-color: rgb(204, 61, 85);
}

.gate-otc-billing-address-form-item-container .gate-file-upload-container .gate-file-upload-box-container{
 background: var(--color-bg-3);
}
/* 3.0改版 */
.icon-bg {
    padding: 10px 12px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--font-body);
    color: var(--color-text-1);
    font-weight: 500;
}

.otc-icon-fiat {
    width: 40px;
    height: 40px;
    display: flex;
    margin-left: -12px;
}

.otc-icon-fiat-single {
  width: 40px;
  height: 40px;
  display: flex;
  margin-left: -6px;
}

.otc-fiat-select-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.custom-select-icon {
    margin: 0 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.faq-title {
    color: var(--color-text-1);
    font-size: var(--font-subtitle);
    font-weight: 600;
}

.faq-box {
    flex: 100%;
    box-sizing: border-box;
}

.about-account-icon {
    cursor: pointer;
    margin-left: 8px;
}

.otc-quote-info-label-tooltip {
    border-bottom: 1px dashed var(--color-divider-4);
    cursor: pointer;
}

.trade-button {
    width: 116px;
    float: right;
}

.otc-send {
    color: var(--color-text-4);
}

.trade-security {
    color: var(--color-text-5);
    font-size: var(--font-body-s);
    font-weight: 400;
    cursor: pointer;
    margin: 16px 0 32px 0;
}

.otc-trade-alert-box {
    position: relative;
    cursor: pointer;
    margin-bottom: 24px;
}

.otc-trade-alert-box-arrow {
    position: absolute;
    top: 12px;
    right: 14px;
    color: var(--color-text-3);
    transform: rotate(270deg);
}

.otc-Faq-content-icon {
    color: var(--color-brand-1);
    margin-right: 4px;
}

.gate-otc-footer-button-container {
    display: flex;
    justify-content: flex-end;
}

.otc-promo-input-tg {
    color: var(--color-text-5);
    font-size: var(--font-body-m);
    font-weight: 500;
    margin:8px 0 22px 0;
    cursor: pointer;
    text-align: right;
}
.otc-trade-quote-btn{
  margin-top: 40px;
}

.otc-show-password{
    cursor: pointer;
    color: var(--color-text-4);
}

.limited-content .brand-color{
    color: var(--color-text-3);
    font-weight: 400;
    border-bottom: 1px solid var(--color-text-3);
}

.otc-quote-button{
  height: 48px;
}

/* otc交易 */
.otc-trade-fund-action{
  display: flex;
  align-items: flex-end;
  color: var(--color-text-1);
}
.otc-trade-user-available{
  margin:0 8px 0 4px;
}
.otc-trade-deposit{
  cursor: pointer;
  color: var(--color-text-1);
  font-weight: 500;
  font-size: var(--font-body-m);
  margin-right: 6px;
}
.otc-trade-transfer{
  cursor: pointer;
  color: var(--color-text-1);
  font-weight: 500;
  font-size: var(--font-body-m);
}



/* banner */ 
.otc-banner-container-wrapper{
  width: 100%;
}
.otc-banner-container {
  cursor: pointer;
  width: 100%;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  
}

.otc-banner-wrapper {
  width: 100%;
  display: flex;
  /* gap: 16px; */
  transition: transform 1s ease;
  /* padding: 0 16px; */
}


.otc-banner-item {
  padding:  24px;
  flex: 1 0 auto; /* 使每个项平分空间 */
  min-width: 0; /* 防止溢出 */
  height: 144px;
  border-radius: 8px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--color-card-3);
  border: 1px solid var(--color-divider-2);
  margin-right: 16px; /* 设置右边距 */
}

.otc-banner-item:nth-child(4n){
  margin-right: 0; /* 移除最后一个Banner的右边距 */
}

/* 当Banner数量少于或等于4个时，移除最后一个Banner的右边距 */
.otc-banner-item:last-child {
  margin-right: 0;
}

.otc-banner-item-left{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.otc-banner-item-left-title{
  font-weight: 600;
  font-size: var(--font-subtitle);
  color: var(--color-text-1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  
}
.otc-banner-second-item-width{
  max-width: 409px;
}
.otc-banner-item-width{
  max-width: 200px;
  word-break: break-all;
}

.otc-banner-item-left-desc{
  font-weight: 400;
  font-size: var(--font-body-s);
  color: var(--color-text-2);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; /* 限制为 3 行 */
  overflow: hidden;
  text-overflow: ellipsis; /* 省略号 */
}
.otc-banner-item-img{
  width: 96px;
  height: 96px;
  background-size: 100% 100%;
}


/* 展示超过3个banner样式 */
.otc-more-banner{
  display: flex;
  flex-direction: column;
  height: 166px;
}

.line-ellispse{
  display: -webkit-box; 
  -webkit-box-orient: vertical;    
  -webkit-line-clamp: 3;             
  overflow: hidden;
  text-overflow: ellipsis; 
}

.otc-more-banner-item-left{
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 8px;
}
.otc-more-banner-item-left-title{
  width: 100%;
  height: 24px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 600;
  font-size: var(--font-body);
  color: var(--color-text-1);
}

.otc-more-banner-item-left-desc{
  font-weight: 400;
  font-size: var(--font-body-s);
  color: var(--color-text-2);
  max-width: 150px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3; /* 限制为 3 行 */
  overflow: hidden;
  text-overflow: ellipsis; /* 省略号 */
  margin-right: 30px;
}
.otc-more-banner-item-img{
  width: 80px;
  height: 80px;
  background-size: 100% 100%;
}

.otc-banner-arrow{
  cursor: pointer;
  position: absolute;
  z-index: 10;
  /* opacity: 0; */
  opacity: 1;
  transition: opacity 0.3s ease;
}
.otc-banner-arrow-padding{
  /* padding: 0 16px; */
}

.otc-banner-left-arrow{
  left: 10px;
}

.otc-banner-right-arrow {
  right: 10px;
}

.otc-banner-container:hover .otc-banner-arrow {
  opacity: 1; /* 悬浮时显示箭头 */
}


/* otc申请步骤引导 */
.gate-otc-guide-container {
  margin-top: 40px;
  display: flex;
  align-items: center;
}

.gate-otc-guide-item {
  box-sizing: border-box;
  flex: 1;
  max-width: 352px;
  height: 237px;
  background: var(--color-card-3);
  padding: 24px;
  border: 1px solid var(--color-divider-2);
  border-radius: 8px;
}

.gate-otc-guide-arrow-icon {
  width: 20px;
  height: 20px;
  margin: 0 20px;
}

.gate-otc-guide-arrow-icon .iconpark-icon {
  width: 100%;
  height: 100%;
}

html[lang=ar] .gate-otc-guide-arrow-icon {
  transform: scale(-1);
}

.gate-otc-guide-item-content {
  border-radius: 8px;
}

.gate-otc-guide-item-icon {

}

.gate-otc-guide-item-icon .iconpark-icon {
  width: 72px;
  height: 72px;
  color: var(--color-icon-1);
}

.gate-otc-start-trade-guide {
  padding: 120px 0;
  background: var(--color-card-2);
  width: 100%;
}

.gate-otc-guide-item-title {
  font-weight: 500;
  color: var(--color-text-1);
  font-size: var(--font-subtitle);
  margin-top: 16px;
}

.gate-otc-guide-item-describe-container {
}

.gate-otc-guide-item-describe {
  margin-top: 8px;
}

.gate-otc-guide-title{
  font-weight: 600;
  font-size: var(--font-h2);
  color: var(--color-text-1);
}
.gate-otc-guide-item-describe .target-text {
  font-weight: 400;
  color: var(--color-text-3);
  line-height: 150%;
  font-size: var(--font-body-m);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gate-otc-guide-item-describe .target-text span {
  margin: 0;
  display: math;
}

.tooltip-target[data-tooltip]:hover .gate-otc-tooltip-container {
  opacity: 1;
}

.gate-otc-tooltip-container {
  background: var(--color-cmpt-6);
  border-radius: 4px;
  position: absolute;
  font-weight: 400;
  font-size: 12px;
  line-height: 150%;
  color: #fff;
  width: 220px;
  opacity: 0;
  transition: opacity .3s ease-in-out;
  display: flex;
  text-align: left;
  z-index: 1;
}

.gate-otc-tooltip-content {
  padding: 12px;
}

.gate-otc-tooltip-arrow {
  height: 10px;
  width: 10px;
  background: linear-gradient(135deg, var(--color-cmpt-6) 52%, transparent 0px);
  z-index: 1;
  top: -4px;
  transform: rotate(53deg) skewX(16deg) scale(1, 0.961) !important;
  border-radius: 17% 0 !important;
  border: 0;
  left: 16px;
  position: absolute;
}

/* otc介绍 */
.otc-trade-desc-container{
  width: 100%;
  background: var(--color-card-1);
  padding: 80px 0;
}
.otc-trade-desc-wrapper{
  display: flex;
  justify-content: space-between;
}
.otc-trade-desc-left{
  flex: 1.263;
  display: flex;
  flex-direction: column;
}
.otc-trade-desc-title{
  font-weight: 600;
  font-size: var(--font-h2);
  color: var(--color-text-1);
}

.otc-trade-desc-tips{
  font-size: var(--font-subtitle);
  color:var(--color-text-3);
  font-weight: 400;
  line-height: 30px;
  padding: 32px 0 72px 0;
  word-break: break-word;
}

.otc-trade-desc-btns{
  display: flex;
  align-items: center;
  gap: 24px;
}

.otc-trade-desc-right{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 468px;
  height: auto;
}
.otc-trade-desc-right-bg{
  width: 268px;
  height: 250px;
  background: url('https://gimg2.gateimg.com/cdn_files/images/web/gate_otc/otc_desc_banner.webp');
  background-size: 100% 100%;
}


/* otc referral */
.otc-trade-referral-container{
  width: 100%;
  background: #000000;
  padding: 80px 0;
}
.otc-trade-referral-wrapper{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.otc-trade-referral-left{
  flex: 1.835;
  display: flex;
  flex-direction: column;
}
.otc-trade-referral-title{
  font-weight: 600;
  font-size: var(--font-h3);
  color: var(--color-text-6);
}

.otc-trade-referral-tips{
  font-size: var(--font-subtitle);
  color:var(--color-text-3);
  font-weight: 400;
  line-height: 30px;
  padding: 24px 0 40px 0;
}

.otc-trade-referral-btns{
  display: flex;
  align-items: center;
  gap: 24px;
}

.otc-trade-referral-right{
  flex: 1;
  max-width: 388px;
  height: 360px;
  background: url('https://gimg2.gateimg.com/cdn_files/images/web/gate_otc/otc_referral_light.webp');
  background-size: 100% 100%;
}


 /* otc features */
.otc-fetures-container{
  width: 100%;
  padding: 120px 0;
  background: var(--color-bg-1);
}

.otc-fetures-title{
  font-weight: 600;
  font-size: var(--font-h2);
  color: var(--color-text-1);
  margin-bottom: 40px;
}

.otc-fetures-item-wrapper{
  display: flex;
  flex-wrap: wrap;
  gap: 24px;

}

.otc-fetures-item{
  display: flex;
  align-items: center;
  max-width: 588px;
  flex-basis: 50%;
}


.otc-fetures-item:nth-last-child(1) {
  margin-top: 16px;
}
.otc-fetures-item:nth-last-child(2) {
  margin-top: 16px;
}

.otc-fetures-item-icon {
  width: 72px;
  height: 72px;
  margin-right: 12px;
  color: var(--color-icon-1);
}
.otc-fetures-item-icon .iconpark-icon {
  width: 72px;
  height: 72px;
  color: var(--color-icon-1);
}

.otc-fetures-item-title{
  font-weight: 500;
  font-size: var(--font-subtitle);
  color: var(--color-text-1);
  margin-bottom: 8px;
}

.otc-fetures-item-tips{
  font-weight: 400;
  font-size: var(--font-body-m);
  color: var(--color-text-3);
}


/* otc交易面板 */
.otc-trade-operation{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.otc-trade-coin-input-wrapper{
  display: flex;
  align-items: center;
}


.otc-trade-exchange{
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--color-card-3);
  padding: 10px;
  box-sizing: border-box;
}
.otc-trade-circle-top{
  margin-bottom: -14px;
}
.otc-trade-circle-bottom{
  margin-top: -14px;
}

/* html button样式 */
.gate-otc-banner-button {
  padding: 0 24px;
  height: 52px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--color-text-6);
  font-size: 16px;
  font-weight: 500;
  text-align: center;
  background: var(--color-brand-1);
  cursor: pointer;
  border-radius: 27px;
}

.gate-otc-banner-button:hover {
  background-color: var(--gui-color-brand-2);
  color: var(--gui-color-text-6);
}

.gate-otc-secondary-button {
  padding: 0 24px;
  height: 52px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--color-text-1);
  font-size: 16px;
  font-weight: 500;
  text-align: center;
  background: var(--color-neutral-1);
  cursor: pointer;
  border-radius: 27px;
}

.gate-otc-secondary-button:hover {
  background-color: var(--color-neutral-3);
}




/* faq */

.gate-otc-faq-container {
  width: 100%;
  background: var(--color-card-2);
  padding: 120px 0 140px;
}

.gate-otc-faq-container .faq-title {
  color: var(--color-text-1);
  font-size: var(--font-h3);
  font-weight: 600;
  margin-bottom: 32px
}


.gate-otc-help-center {
  width: 100%;
}

.gate-otc-help-center li {
  padding: 32px 0;
  position: relative;
  border-bottom: 1px solid var(--color-divider-2);
}

.gate-otc-help-center li p {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0;
  width: calc(100% - 32px);
}

.gate-otc-help-center li p b {
  font-weight: 500;
  font-size: var(--font-subtitle);
  color: var(--color-text-1);
}

.gate-otc-help-center li:hover .icon.raw {
  color: var(--color-brand-1);
}

.gate-otc-help-center li label {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.gate-otc-help-center li .gate-otc-help-content {
  display: none;
  font-style: normal;
  font-size: var(--font-body);
  line-height: 150%;
  color: var(--color-text-3);
  margin-top: 16px;
}

.gate-otc-help-content a {
  color: var(--color-text-5);
}

.gate-otc-help-content .gate-otc-help-content-detail {
  margin-top: 30px;
}

.gate-otc-help-center .raw {
  cursor: pointer;
  display: block;
  color: var(--color-text-1);
  width: 24px;
  height: 24px;
  font-size: 24px;
  overflow: visible;
}

.gate-otc-help-center label {
  cursor: pointer;
}

.gate-otc-help-center-arrow .raw:nth-child(2) {
  display: none;
}

.gate-otc-faq-arrow-up{
  width: 24px;
  height: 24px;
  color: var(--color-icon-1);
}

.gate-otc-faq-arrow-down{
  width: 24px;
  height: 24px;
  color: var(--color-icon-1);
}

input:checked ~ label .gate-otc-help-center-arrow .raw:nth-child(1) {
  display: none;
}

input:checked ~ label .gate-otc-help-center-arrow .raw:nth-child(2) {
  display: block;
  color: var(--color-text-5);
}

input:checked ~ span.gate-otc-help-content {
  display: block;
}

.gate-otc-help-content-wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
}


.gate-otc-help-content-wrapper .gate-otc-help-click {
  display: flex;
  gap: 8px;
  cursor: pointer;
  color: var(--color-text-5);
}

.gate-otc-help-content-wrapper .gate-otc-help-click-icon {
  width: 16px;
  height: 16px;
}

.gate-otc-help-content-wrapper .gate-otc-help-click-icon .iconpark-icon {
  width: 16px;
  height: 16px;
}

.otc-trade-menu{
  padding-right: 24px;
}

.otc-trade-menu.otc-trade-menu-app {
  top: 0;
}

.otc-trade-menu-text {
  font-size: var(--font-body-m);
}

.otc-trade-menu-info{
  display: flex;
  justify-content: flex-end;
  gap: 16px;
}

.otc-trade-advantage-icon {
  width: 15px;
  height: 15px;
}


.otc-trade-exchange-icon{
  width: 15px;
  height: 15px;
  transform: rotate(90deg);
  color: var(--color-icon-1);
}

.otc-transfer-modal-content{
  font-size: var(--font-body-m);
  color: var(--color-text-2);
  font-weight: 400;
}

.otc-trade-menu-con.otc-trade-menu-info-con {
  height: 20px;
  line-height: 20px;
}
.otc-trade-menu-disabled{
  cursor: not-allowed;
}


/* otc补提顶部提示 */
.otc-supplementary-alert-content{
  display: flex;
  justify-content: space-between;
  padding-right: 16px;
}

/* 阶梯报价 */
.otc-ladder-quote{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  font-size: var(--font-body-s);
  margin-bottom: 8px;
}

.otc-ladder-quote-label{
  font-weight: 400;
  color: var(--color-text-3);
}

.otc-ladder-quote-value{
  font-weight: 400;
  color: var(--color-text-1);
}

/* 阶梯报价 */
.otc-trade-error-tips{
  text-align: right;
}



/* H5 */
@media screen and (max-width: 991.9px) {
    /* .gate-otc-trade-container{
      gap: 40px;
    } */
    .otc-main {
        display: block;
        padding-top: 0px !important;
    }

    .otc-main-info-title {
        font-size: var(--font-h1);
        font-weight: 700;
    }

    .gate-otc-main{
      gap: 40px;
    }
    .otc-trade-menu {
      box-sizing: border-box;
      z-index: 10;
      position: sticky;
      left: 0;
      right: 0;
      padding: 0 12px;
       /* position: sticky; */
      display: flex;
      justify-content: space-between; 
      top: 48px;
      height: 48px;
      line-height: 48px;
      background: var(--color-bg-1);
      border-bottom: 1px solid var(--color-divider-2);
  }
   .otc-trade-menu-info{
    height: 100%;
   }
    .otc-info-desc {
        font-size: var(--font-body) !important;
        font-weight: 500;
    }

    .otc-main-info-image {
        display: none;
    }

    .trade-button {
        width: 100%;
    }

    .kyc-table-td-item {
        min-height: 46px;
    }

    .otc-trade-oper-con {
      padding: 24px 0 0 !important;
    }

   
    .otc-main-info{
      display: none;
    }
    
    .faq-box {
      padding: 4px 0;
    }
    .otc-trade-referral-container{
      padding: 40px 0;
    }
    .otc-trade-referral-wrapper{
      display: flex;
      flex-direction: column-reverse;
      align-items: flex-start;
    }
    .otc-trade-referral-right{
      flex: unset;
      width: 100%;
      height: 326px;
      margin-bottom: 40px;
    }
    .gate-otc-guide-title{
      font-size: var(--font-h1);
    }
    .gate-otc-guide-container{
      flex-direction: column;
      gap: 12px;
      margin-top: 24px;
    }
    .gate-otc-guide-item {
      width: 100%;
      max-width: unset;
      padding: 12px;
    }
    .gate-otc-guide-item-icon{
      display: none;
    }
    .gate-otc-guide-item-title {
      margin-top: unset;
    }
    .gate-otc-guide-arrow-icon {
      transform: rotate(90deg);
      margin: unset;
   }
   .otc-trade-desc-container{
    padding: 40px 0;
   }
   .otc-trade-desc-wrapper {
    display: flex;
    flex-direction: column-reverse;
   }
   .otc-trade-desc-right {
    flex: unset;
    width: 100%;
    height: 260px;
    margin-bottom: 40px;
  }
  .otc-trade-desc-title{
    font-size: var(--font-h1);
  }
  .otc-trade-desc-tips{
    padding:  24px 0 40px 0;
  }
  .otc-trade-desc-btns {
    display: flex;
    flex-direction: column;
    align-items: unset;
  }
  .otc-fetures-item {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: unset;
    flex-basis: unset;
    box-sizing: border-box;
    padding: 24px 12px;
    border: 1px solid var(--color-divider-2);
    border-radius: 8px;
  }
  .otc-fetures-item-icon{
    width: 32px;
    height: 32px;
    margin-right: unset;
  }
  .otc-fetures-item-icon .iconpark-icon {
    width: 32px;
    height: 32px;
    margin-right: unset;
  }
  .otc-fetures-item-right{
    width: 100%;
    margin-top: 16px;
  }
  .otc-fetures-title{
    font-size: var(--font-h1);
    margin-bottom: 24px;
    /* white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; */
  }
  .otc-main-trade{
    width: 100%;
  }
  .sell-volume-max{
    font-size: var(--font-body-m);
  }
  .otc-trade-main-input-wrapper{
    width: 100%;
    box-sizing: border-box;
  }
  .otc-trade-main-input-wrapper-title{
    font-size: var(--font-body-s);
  }
  
  .otc-fetures-item-wrapper{
    gap: 12px;
  }
  .otc-fetures-item:nth-last-child(1),.otc-fetures-item:nth-last-child(2) {
    margin-top: unset;
  }

  .gate-otc-faq-container .faq-title{
    margin-bottom: 24px;
  }
  .gate-otc-help-center li p b{
    font-size: var(--font-body);
  }
  .gate-otc-help-center .raw{
    width: 16px;
    height: 16px;
    font-size: var(--font-body);
  }
  .gate-otc-help-center li .gate-otc-help-content{
    font-size: var(--font-body-s);
  }
  .gate-otc-help-center li {
    padding: 16px 0;
  }
  .gate-otc-help-center li .gate-otc-help-content{
    margin-top: 12px;
  }
  .otc-trade-alert-box{
    margin-bottom: 12px;
  }
  .otc-icon-fiat{
    display: flex;
    width: 32px;
    height: 32px;
    margin-left: 0;
  }

  .otc-icon-fiat-single{
    display: flex;
    width: 32px;
    height: 32px;
    margin-left: -6px;
  }
  .gate-otc-faq-container {
    padding: 40px 0;
  }
  .gate-otc-start-trade-guide{
    padding: 40px 0;
  }
  .otc-fetures-container{
    padding: 40px 0;
  }
  .otc-trade-quote-btn{
    margin-top: 24px;
  }

  .otc-trade-desc-right{
    width: 100%;
    height: 200px;
  }
  
  .otc-trade-desc-right-bg{
    height: 200px;
    background: url('https://gimg2.gateimg.com/cdn_files/images/web/gate_otc/otc_desc_banner_h5.webp');
    background-size: 100% 100%;
  }

  /* 询价 */
  .otc-quote-con-box {
    padding: 32px 0 48px;
    min-height: unset;
}

.otc-quote-con{
    width: auto;
    margin: 0 16px;
}

.otc-quote-main{
    padding: 24px 16px;
}

.otc-quote-title{
    font-size: var(--font-h5);
}

.otc-quote-info-item{
    flex-direction: column;
    align-items: start;
    font-size: 14px;
    margin-bottom: 24px;
}

.otc-quote-info-item:last-child,
.otc-order-detail-item:last-child{
    margin-bottom: 0;
}

.otc-quote-info-label{
    margin-bottom: 12px;
}

.otc-quote-footer button{
    display: flex;
    height: 38px;
    padding: 8px 16px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    font-weight: 600;
    width: calc(50% - 6px);
}

  .otc-banner-item {
    flex: 1 0 100%; 
    min-width: 0; /* 防止溢出 */
    margin-right: 0;
  }


  /* 旧的移动端样式 */
  #headLayout {
    padding: 10px var(--layout-padding);
  } 
  /* faq */
  .otc-trade-faq {
      padding-top: 48px;
  }

  .trade-faq-title {
      font-size: 20px;
      margin-bottom: 24px;
  }
  .otc-trade-faq .mantine-pildck.mantine-Accordion-label {
    font-size: 16px;
  }

  .otc-trade-faq .mantine-Text-root {
    font-size: 14px;
    font-weight: normal;
  }

  .otc-trade-faq .mantine-Accordion-chevron {
    margin-left: 8px;
  }

/* 
.mantine-Accordion-control,
.gui-mantine-rtl-Accordion-control {
    padding: 24px 0;
} */

/* .mantine-Accordion-content,
.gui-mantine-rtl-Accordion-content {
    padding: 0 0 24px 0;
} */


  .noty_modal.myaccount-transfer ~ #noty_center_layout_container{
    width: 95% !important;
    min-width: 95% !important;
  }


  .otc-order-no-paid-title{
    margin-bottom: 24px;
  }

  .otc-order-detail-item{
    flex-direction: column;
    line-height: normal;
    margin-bottom: 24px;
  }

  .otc-banner-item-left{
    max-width: 200px;
  }

  .otc-order-detail-item-left{
    margin-bottom: 12px;
  }

  .otc-supplementary-alert-container{
    margin-top: 48px;
  }

  .otc-ladder-quote{
    justify-content: flex-end;
  }
  

}