#orders.vx-order-center-page{
  width:min(1500px,calc(100% - 36px))!important;
  margin:0 auto!important;
  padding:34px 0 54px!important;
  color:#f4fbfb!important;
}

#orders .vx-order-hero{
  min-height:210px!important;
  padding:34px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:24px!important;
  border:1px solid rgba(53,229,212,.18)!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 86% 18%,rgba(53,229,212,.16),transparent 32%),
    linear-gradient(145deg,rgba(17,30,35,.94),rgba(7,13,17,.88) 58%,rgba(13,19,24,.96))!important;
  box-shadow:0 28px 80px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.055)!important;
  overflow:hidden!important;
  position:relative!important;
}

#orders .vx-order-hero::after{
  content:""!important;
  position:absolute!important;
  right:32px!important;
  bottom:24px!important;
  width:96px!important;
  height:96px!important;
  border-radius:28px!important;
  background:conic-gradient(from 110deg,rgba(53,229,212,0),rgba(53,229,212,.5),rgba(255,255,255,.08),rgba(53,229,212,0))!important;
  filter:blur(.2px)!important;
  opacity:.55!important;
  animation:vxOrderFloat 8s ease-in-out infinite!important;
  pointer-events:none!important;
}

#orders .vx-order-hero span{
  color:#35e5d4!important;
  font-size:12px!important;
  font-weight:950!important;
  letter-spacing:4px!important;
}

#orders .vx-order-hero h1{
  margin:10px 0 12px!important;
  color:#f7fbfb!important;
  font-size:clamp(34px,4vw,58px)!important;
  line-height:1.05!important;
  letter-spacing:0!important;
}

#orders .vx-order-hero p{
  max-width:720px!important;
  margin:0!important;
  color:#98a9b3!important;
  font-size:15px!important;
  line-height:1.75!important;
}

#orders #vx-order-refresh{
  position:relative!important;
  z-index:1!important;
  min-width:138px!important;
  height:48px!important;
  padding:0 18px!important;
  border:1px solid rgba(128,255,242,.34)!important;
  border-radius:14px!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,0) 42%),
    rgba(53,229,212,.075)!important;
  color:#35e5d4!important;
  font-weight:950!important;
  cursor:pointer!important;
}

#orders .vx-order-summary{
  margin:18px 0!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
}

#orders .vx-order-summary article{
  min-height:138px!important;
  padding:20px!important;
  border:1px solid rgba(255,255,255,.075)!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 86% 12%,rgba(53,229,212,.11),transparent 32%),
    linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.018))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}

#orders .vx-order-summary span,
#orders .vx-order-summary em{
  display:block!important;
  color:#8fa0ab!important;
  font-style:normal!important;
  font-size:12px!important;
  font-weight:850!important;
}

#orders .vx-order-summary strong{
  display:block!important;
  margin:12px 0 9px!important;
  color:#f5fbfb!important;
  font-size:32px!important;
  line-height:1!important;
}

#orders .vx-order-panel{
  padding:18px!important;
  border:1px solid rgba(53,229,212,.16)!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 88% 8%,rgba(53,229,212,.10),transparent 30%),
    linear-gradient(145deg,rgba(17,28,34,.92),rgba(7,13,17,.86))!important;
  box-shadow:0 24px 68px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.045)!important;
  overflow:hidden!important;
}

#orders .vx-order-tabs{
  margin:0 0 16px!important;
  padding:6px!important;
  display:flex!important;
  gap:8px!important;
  border:1px solid rgba(255,255,255,.075)!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.035)!important;
}

#orders .vx-order-tabs button{
  flex:1 1 0!important;
  min-height:44px!important;
  border:0!important;
  border-radius:13px!important;
  background:transparent!important;
  color:#92a4af!important;
  font-weight:950!important;
  cursor:pointer!important;
}

#orders .vx-order-tabs button.is-active{
  background:rgba(53,229,212,.10)!important;
  color:#35e5d4!important;
  box-shadow:inset 0 0 0 1px rgba(53,229,212,.24)!important;
}

#orders .vx-order-table-wrap{
  overflow:auto!important;
  max-height:540px!important;
  border:1px solid rgba(255,255,255,.065)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.025)!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
}

#orders table{
  width:100%!important;
  border-collapse:collapse!important;
}

#orders th{
  padding:15px 16px!important;
  background:rgba(53,229,212,.045)!important;
  color:#7e8f9b!important;
  font-size:11px!important;
  font-weight:950!important;
  text-align:left!important;
  white-space:nowrap!important;
}

#orders td{
  padding:15px 16px!important;
  border-top:1px solid rgba(255,255,255,.045)!important;
  color:#dfe8eb!important;
  font-size:13px!important;
  white-space:nowrap!important;
}

#orders .vx-order-positive{color:#20d18b!important;}
#orders .vx-order-negative{color:#ff7887!important;}
#orders .vx-order-chain-text{
  max-width:320px!important;
  white-space:normal!important;
  word-break:break-all!important;
  color:#aab8c1!important;
}
#orders .vx-order-status{
  display:inline-flex!important;
  align-items:center!important;
  min-height:28px!important;
  padding:0 10px!important;
  border-radius:999px!important;
  font-size:12px!important;
  font-weight:900!important;
  white-space:nowrap!important;
  border:1px solid rgba(255,255,255,.08)!important;
  background:rgba(255,255,255,.05)!important;
  color:#aab8c1!important;
}
#orders .vx-order-status.is-pending{
  border-color:rgba(252,213,53,.22)!important;
  background:rgba(252,213,53,.08)!important;
  color:#f0d878!important;
}
#orders .vx-order-status.is-success{
  border-color:rgba(32,209,139,.24)!important;
  background:rgba(32,209,139,.08)!important;
  color:#20d18b!important;
}
#orders .vx-order-status.is-danger{
  border-color:rgba(255,120,135,.28)!important;
  background:rgba(255,120,135,.08)!important;
  color:#ff7887!important;
}
#orders .vx-order-cancel-btn{
  width:auto!important;
  min-width:58px!important;
  height:30px!important;
  padding:0 12px!important;
  border:1px solid rgba(246,70,93,.45)!important;
  border-radius:6px!important;
  background:rgba(246,70,93,.12)!important;
  color:#ff7887!important;
  font-size:11px!important;
  font-weight:850!important;
}
#orders .vx-order-cancel-btn:hover{
  background:rgba(246,70,93,.2)!important;
}
#orders .vx-order-empty{
  padding:44px 18px!important;
  text-align:center!important;
  color:#98a9b3!important;
  font-weight:850!important;
}

#orders .vx-order-pagination{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  margin:14px 2px 0!important;
  color:#8fa0ab!important;
  font-size:12px!important;
  font-weight:850!important;
}

#orders .vx-order-pagination[hidden]{
  display:none!important;
}

#orders .vx-order-page-info{
  margin-right:auto!important;
  color:#92a5b4!important;
}

#orders .vx-order-page-size{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
}

#orders .vx-order-page-size select,
#orders .vx-order-pagination button{
  height:36px!important;
  border:1px solid rgba(148,163,184,.22)!important;
  border-radius:8px!important;
  background:rgba(15,28,43,.78)!important;
  color:#dce8ee!important;
  font-size:12px!important;
  font-weight:900!important;
}

#orders .vx-order-page-size select{
  min-width:74px!important;
  padding:0 10px!important;
}

#orders .vx-order-pagination button{
  min-width:72px!important;
  padding:0 12px!important;
}

#orders .vx-order-pagination button:not(:disabled):hover{
  border-color:rgba(53,229,212,.45)!important;
  color:#35e5d4!important;
}

#orders .vx-order-pagination button:disabled{
  opacity:.42!important;
  cursor:not-allowed!important;
}

@keyframes vxOrderFloat{
  0%,100%{transform:translate3d(0,0,0) rotate(0deg);}
  50%{transform:translate3d(-12px,8px,0) rotate(12deg);}
}

@media(max-width:768px){
  #orders.vx-order-center-page{
    width:calc(100% - 28px)!important;
    padding:22px 0 44px!important;
  }

  #orders .vx-order-hero{
    min-height:0!important;
    padding:24px 20px!important;
    display:block!important;
    border-radius:24px!important;
  }

  #orders #vx-order-refresh{
    margin-top:18px!important;
    width:100%!important;
  }

  #orders .vx-order-summary{
    grid-template-columns:1fr 1fr!important;
    gap:12px!important;
  }

  #orders .vx-order-summary article{
    min-height:116px!important;
    padding:16px!important;
  }

  #orders .vx-order-summary strong{
    font-size:26px!important;
  }

  #orders .vx-order-panel{
    padding:14px!important;
    border-radius:24px!important;
  }

  #orders .vx-order-tabs{
    overflow-x:auto!important;
  }

  #orders .vx-order-tabs button{
    min-width:110px!important;
    flex:0 0 auto!important;
  }

  #orders .vx-order-table-wrap{
    max-height:560px!important;
    overflow:auto!important;
    border:1px solid rgba(255,255,255,.065)!important;
    border-radius:18px!important;
    background:rgba(255,255,255,.025)!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
  }

  #orders table,
  #orders tbody,
  #orders tr,
  #orders td{
    display:block!important;
    width:100%!important;
  }

  #orders thead{
    display:none!important;
  }

  #orders tr{
    margin:0 0 12px!important;
    padding:15px!important;
    border:1px solid rgba(255,255,255,.08)!important;
    border-radius:18px!important;
    background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.022))!important;
  }

  #orders td{
    display:grid!important;
    grid-template-columns:minmax(82px,34%) minmax(0,1fr)!important;
    gap:10px!important;
    padding:8px 0!important;
    border:0!important;
    text-align:right!important;
    white-space:normal!important;
    word-break:break-word!important;
  }

  #orders td::before{
    content:attr(data-label)!important;
    color:#8fa0ab!important;
    font-size:12px!important;
    font-weight:900!important;
    text-align:left!important;
  }

  #orders td[colspan]{
    display:flex!important;
    min-height:90px!important;
    justify-content:center!important;
    align-items:center!important;
    text-align:center!important;
  }

  #orders td[colspan]::before{
    display:none!important;
  }

  #orders .vx-order-pagination{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    justify-content:stretch!important;
    gap:9px!important;
    margin-top:12px!important;
  }

  #orders .vx-order-page-info{
    grid-column:1/-1!important;
    margin-right:0!important;
  }

  #orders .vx-order-page-size,
  #orders .vx-order-page-size select,
  #orders .vx-order-pagination button{
    width:100%!important;
  }
}
