/* Final customer-area overrides loaded after every legacy page stylesheet. */

/* Compact navigation */
.el-aside {
  width: 214px !important;
}

.el-aside > .menu-top {
  margin-top: 8px !important;
}

.el-aside > .line {
  margin: 10px 18px !important;
  border-color: rgba(105, 160, 244, .16) !important;
}

.el-aside .menu-top .menu-alink {
  display: block !important;
  margin: 3px 0 !important;
}

.el-aside .el-menu-item {
  height: 48px !important;
  margin: 0 !important;
  color: #fff !important;
  border-radius: 10px !important;
  line-height: 48px !important;
}

.el-aside .aside-menu-text {
  color: #fff !important;
}

.el-aside .el-menu-item .iconfont {
  color: #64d2ff !important;
}

.el-aside .el-menu-item:hover {
  background: rgba(55, 201, 255, .1) !important;
}

.el-aside .el-menu-item.is-active {
  color: #fff !important;
  background: linear-gradient(135deg, #256cff, #13a8ff) !important;
  box-shadow: 0 10px 26px rgba(30, 107, 255, .28) !important;
}

.el-aside .el-menu-item.is-active .iconfont {
  color: #fff !important;
}

/* Finance balance */
body:has(.finance-balance) .finance-balance {
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 90% 18%, rgba(55, 201, 255, .13), transparent 30%),
    linear-gradient(145deg, #102b58, #081a38) !important;
}

body:has(.finance-balance) :is(.balance-left-title, .balance-left-num, .tx-list, .el-badge) {
  color: #fff !important;
}

body:has(.finance-balance) .balance-left-num {
  font-size: 40px !important;
  font-weight: 780 !important;
  letter-spacing: -.035em;
}

body:has(.finance-balance) .balance-left-num .prefix {
  color: #64d2ff !important;
  font-size: 22px !important;
}

body:has(.finance-balance) .balance-right .el-button {
  min-width: 92px;
  height: 42px;
  color: #fff !important;
  border-color: rgba(100, 210, 255, .5) !important;
  border-radius: 10px !important;
  background: rgba(55, 201, 255, .08) !important;
}

body:has(.finance-balance) .balance-right .el-button--primary {
  border: 0 !important;
  background: linear-gradient(135deg, #256cff, #13a8ff) !important;
}

body:has(.finance-balance) :is(.balance-tx-btn, .tx-list) {
  display: none !important;
}

body:has(.goods-list-div) .shopping-item {
  min-height: 370px !important;
}

body:has(.goods-list-div) .goods-description,
body:has(.goods-list-div) .goods-description:empty,
body:has(.goods-list-div) .goods-description:not(:has(*)) {
  box-sizing: border-box;
  min-height: 152px !important;
  max-height: 152px !important;
  padding: 38px 20px 14px !important;
  overflow: hidden !important;
}

/* Recharge */
.recharge-dialog {
  width: min(750px, calc(100vw - 32px)) !important;
  overflow: hidden;
  color: #fff !important;
  border: 1px solid rgba(100, 210, 255, .42) !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, #102b58, #081a38) !important;
  box-shadow: 0 30px 80px rgba(0, 7, 24, .56) !important;
}

.recharge-dialog .el-dialog__header {
  display: none !important;
}

.recharge-dialog .el-dialog__body {
  padding: 26px !important;
  color: #fff !important;
  background: transparent !important;
}

.recharge-dialog .recharge-content {
  color: #fff !important;
  background: transparent !important;
}

.recharge-dialog .recharge-title {
  display: flex;
  margin-bottom: 20px;
  align-items: center;
  justify-content: space-between;
}

.recharge-dialog :is(.title-text, .close-btn, .el-icon-close) {
  color: #fff !important;
}

.recharge-dialog .close-btn {
  color: #64d2ff !important;
  font-size: 22px;
}

.recharge-dialog .recharge-box {
  padding: 18px;
  border: 1px solid rgba(105, 160, 244, .22);
  border-radius: 14px;
  background: rgba(5, 17, 39, .52) !important;
}

.recharge-dialog .recharge-input {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 124px;
  gap: 14px;
}

.recharge-dialog :is(.el-input-number, .el-input, .el-input__inner) {
  width: 100% !important;
}

.recharge-dialog .el-input__inner {
  height: 48px !important;
  color: #fff !important;
  border-color: rgba(100, 210, 255, .48) !important;
  border-radius: 10px !important;
  background: #071a39 !important;
}

.recharge-dialog .el-input__inner::placeholder {
  color: #fff !important;
  opacity: .8;
}

.recharge-dialog .el-button--primary {
  height: 48px;
  color: #fff !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg, #256cff, #13a8ff) !important;
}

/* Payment */
.new-pay-dialog,
.pay-dialog,
.select-coin-dialog {
  width: min(1120px, calc(100vw - 40px)) !important;
  overflow: hidden;
  color: #fff !important;
  border: 1px solid rgba(100, 210, 255, .42) !important;
  border-radius: 20px !important;
  background: linear-gradient(145deg, #102b58, #081a38) !important;
  box-shadow: 0 34px 90px rgba(0, 7, 24, .6) !important;
}

:is(.new-pay-dialog, .pay-dialog, .select-coin-dialog) .el-dialog__header {
  display: none !important;
}

:is(.new-pay-dialog, .pay-dialog, .select-coin-dialog) .el-dialog__body {
  padding: 0 !important;
  color: #fff !important;
  background: transparent !important;
}

.new-pay-dialog :is(.pay-title, .pay-footer),
.pay-dialog :is(.dia-title, .dia-fotter),
.select-coin-dialog :is(.select-coin-title, .select-coin-footer) {
  color: #fff !important;
  border-color: rgba(105, 160, 244, .24) !important;
  background: rgba(5, 17, 39, .68) !important;
}

.new-pay-dialog .pay-content,
.pay-dialog .dia-content,
.select-coin-dialog .select-coin-box {
  color: #fff !important;
  background: transparent !important;
}

.new-pay-dialog :is(
  .title-text,
  .close-btn,
  .pay-order-tip-text,
  .pay-order-id,
  .pay-order-top-right,
  .pay-order-check,
  .pay-method-item-text,
  .type-dec,
  .pay-qr-text,
  .pay-footer-left,
  .pay-footer-right
),
.pay-dialog :is(.title-text, .close, .qr-money, .des, .item, .txt) {
  color: #fff !important;
}

.new-pay-dialog :is(.pay-order-price, .pay-order-total-price, .pay-order-balance, .pay-order-coin-num, .close-btn),
.pay-dialog :is(.pay-money, .font-26, .close) {
  color: #64d2ff !important;
}

.new-pay-dialog .pay-method-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.new-pay-dialog .pay-method-item,
.new-pay-dialog .pay-method-box {
  color: #fff !important;
  border: 1px solid rgba(105, 160, 244, .35) !important;
  border-radius: 11px !important;
  background: rgba(5, 17, 39, .56) !important;
}

.new-pay-dialog .pay-method-item.active {
  border-color: #37c9ff !important;
  background: rgba(37, 108, 255, .2) !important;
}

.new-pay-dialog .pay-qr-content {
  overflow: hidden;
  color: #fff !important;
  border: 1px solid rgba(100, 210, 255, .3) !important;
  border-radius: 12px !important;
  background: #071a39 !important;
}

.new-pay-dialog .pay-qr-text {
  color: #fff !important;
  background: transparent !important;
}

.new-pay-dialog .pay-qr-content .qr-content:not(:empty) {
  margin: 12px;
  padding: 8px;
  border-radius: 8px;
  background: #fff !important;
}

.new-pay-dialog .cancel-btn,
.pay-dialog .cancel-btn,
.select-coin-dialog .cancel-btn {
  color: #fff !important;
  border-color: rgba(100, 210, 255, .5) !important;
  border-radius: 10px !important;
  background: rgba(55, 201, 255, .08) !important;
}

.new-pay-dialog .el-button--primary,
.pay-dialog .submit-btn,
.select-coin-dialog .el-button--primary {
  color: #fff !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg, #256cff, #13a8ff) !important;
}

/* Operating system */
.goods .common-config .op-sysyem {
  display: grid !important;
  width: min(920px, 100%) !important;
  grid-template-columns: minmax(230px, .8fr) minmax(430px, 1.7fr) !important;
  gap: 16px !important;
}

.goods .common-config .op-sysyem > .el-select,
.goods .common-config .op-sysyem .system,
.goods .common-config .op-sysyem .el-input,
.goods .common-config .op-sysyem .el-input__inner {
  box-sizing: border-box;
  width: 100% !important;
}

.goods .common-config .op-sysyem .el-input__inner {
  overflow: visible !important;
  padding-right: 44px !important;
  color: #fff !important;
  border-color: rgba(100, 210, 255, .42) !important;
  border-radius: 10px !important;
  background: #071a39 !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
  font-size: 16px !important;
}

.goods .common-config .op-sysyem .el-input__suffix {
  right: 12px !important;
}

.el-select-dropdown__item {
  box-sizing: border-box;
  height: auto !important;
  min-height: 40px;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  overflow: visible !important;
  color: #fff !important;
  line-height: 1.45 !important;
  text-overflow: clip !important;
  white-space: normal !important;
}

@media (max-width: 760px) {
  .el-aside {
    width: 100% !important;
  }

  .new-pay-dialog .pay-method-list,
  .goods .common-config .op-sysyem,
  .recharge-dialog .recharge-input {
    grid-template-columns: 1fr !important;
  }
}

/* Catch every remaining legacy modal. */
body:not(:has(#login)):not(:has(#regist)):not(:has(#forget)) .el-dialog {
  color: #fff !important;
  border: 1px solid rgba(100, 210, 255, .34) !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, #102b58, #081a38) !important;
  box-shadow: 0 30px 80px rgba(0, 7, 24, .56) !important;
}

body:not(:has(#login)):not(:has(#regist)):not(:has(#forget)) .el-dialog__header,
body:not(:has(#login)):not(:has(#regist)):not(:has(#forget)) .el-dialog__body,
body:not(:has(#login)):not(:has(#regist)):not(:has(#forget)) .el-dialog__footer {
  color: #fff !important;
  border-color: rgba(105, 160, 244, .22) !important;
  background: transparent !important;
}

body:not(:has(#login)):not(:has(#regist)):not(:has(#forget)) :is(.el-dialog__title, .el-dialog__close) {
  color: #fff !important;
}

body:not(:has(#login)):not(:has(#regist)):not(:has(#forget)) .el-dialog .el-button--default {
  color: #fff !important;
  border-color: rgba(100, 210, 255, .5) !important;
  border-radius: 10px !important;
  background: rgba(55, 201, 255, .08) !important;
}

body:not(:has(#login)):not(:has(#regist)):not(:has(#forget)) .el-dialog .el-button--primary {
  color: #fff !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg, #256cff, #13a8ff) !important;
}

/* Compact authenticated workspace — avoid oversized outer cards. */
body:has(.el-aside a[href="/account.htm"]) .el-main > .main-card {
  min-height: 0 !important;
  padding: 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body:has(.statistics-box) .info-box {
  min-height: 108px !important;
  padding: 20px 22px !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

body:has(.statistics-box) .name-first {
  width: 52px !important;
  height: 52px !important;
  flex-basis: 52px !important;
  font-size: 28px !important;
}

body:has(.statistics-box) .divider-box {
  height: 44px !important;
}

body:has(.statistics-box) .statistics-box,
body:has(.statistics-box) .product-list-box {
  margin-top: 14px !important;
}

body:has(.statistics-box) .statistics-content {
  gap: 10px !important;
}

body:has(.statistics-box) .money-box {
  min-height: 158px !important;
  padding: 18px !important;
  border-radius: 13px !important;
  box-shadow: none !important;
}

body:has(.statistics-box) .credit-num {
  margin-top: 10px !important;
  font-size: 31px !important;
}

body:has(.statistics-box) .statistics-bottom {
  margin-top: 14px !important;
}

body:has(.statistics-box) .progress-box {
  display: none !important;
}

body:has(.statistics-box) .statistics-bottom-right {
  margin-left: 0 !important;
}

body:has(.statistics-box) .order-box {
  gap: 10px !important;
}

body:has(.statistics-box) .order-box > div {
  min-height: 158px !important;
}

body:has(.statistics-box) .order-item {
  gap: 8px !important;
  border-radius: 13px !important;
  box-shadow: none !important;
}

body:has(.statistics-box) .order-type-img img {
  width: 40px !important;
  height: 40px !important;
}

body:has(.statistics-box) .order-nums {
  font-size: 28px !important;
}

body:has(.statistics-box) .goods-box {
  min-height: 210px !important;
  border-radius: 13px !important;
  box-shadow: none !important;
}

body:has(.statistics-box) .no-product {
  min-height: 170px !important;
}

body:has(.statistics-box) .right-box {
  gap: 12px !important;
}

body:has(.statistics-box) :is(.recommend-box, .recommend-box-open, .WorkOrder-box, .notice-box) {
  margin-bottom: 12px !important;
  padding: 16px !important;
  border-radius: 13px !important;
  box-shadow: none !important;
}

body:has(.statistics-box) .recommend-box img {
  max-height: 140px !important;
}

body:has(.finance-balance) .finance-balance {
  min-height: 132px !important;
  padding-top: 20px !important;
  padding-bottom: 20px !important;
  box-shadow: none !important;
}

@media (max-width: 760px) {
  body:has(.el-aside a[href="/account.htm"]) .el-main > .main-card {
    padding: 10px !important;
  }
}