/* QQG.NET v17 storefront regression fixes.
   Presentation only: the original Mofang pricing, inventory and order
   bindings remain unchanged. */

/* The native DCIM stylesheet caps the Element table at 3.22rem. Its rows were
   later made visible, so they escaped that short box and covered the following
   network section. Let the table and every generated wrapper grow together. */
.dy8-config-page .mf-dcim .el-table,
.dy8-config-page .mf-dcim .el-table__header-wrapper,
.dy8-config-page .mf-dcim .el-table__body-wrapper,
.dy8-config-page .mf-dcim .el-scrollbar,
.dy8-config-page .mf-dcim .el-scrollbar__wrap {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}

.dy8-config-page .mf-dcim .el-table {
  overflow: visible !important;
}

.dy8-config-page .mf-dcim .el-table__header-wrapper,
.dy8-config-page .mf-dcim .el-table__body-wrapper,
.dy8-config-page .mf-dcim .el-scrollbar,
.dy8-config-page .mf-dcim .el-scrollbar__wrap {
  position: relative !important;
  overflow: visible !important;
}

.dy8-config-page .mf-dcim .el-table__body,
.dy8-config-page .mf-dcim .el-table__header {
  height: auto !important;
  table-layout: fixed !important;
}

.dy8-config-page .mf-dcim .el-table__row,
.dy8-config-page .mf-dcim .el-table td,
.dy8-config-page .mf-dcim .el-table th {
  height: auto !important;
  min-height: 0 !important;
}

/* Mobile configurators must scroll as a normal document. The old bottom order
   bar was promoted to a full summary card while retaining position:fixed,
   which made it permanently cover the lower half of the page. */
@media (max-width: 820px) {
  .dy8-config-page .config-box {
    padding-bottom: 24px !important;
  }

  .dy8-config-page .config-box > .content > .template,
  .dy8-config-page .config-box > .content > .template > .main-card,
  .dy8-config-page .template.common-config,
  .dy8-config-page .template.common-config .common-box {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .dy8-config-page .template .f-order,
  .dy8-config-page .config-box > .content > .template:not(.common-config) > .f-order,
  .dy8-config-page .template.common-config .f-order,
  .dy8-config-page .template.common-config .order-right,
  .dy8-config-page .template.qqg-finance-config > .main-card > .f-order {
    position: static !important;
    z-index: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    grid-column: auto !important;
    grid-row: auto !important;
    align-self: stretch !important;
    margin: 16px 0 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .dy8-config-page .template .f-order .l-empty {
    display: none !important;
  }

  .dy8-config-page .template .f-order .el-main {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .dy8-config-page .template .f-order .main-card {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
    border: 1px solid #dce6f2 !important;
    border-radius: 15px !important;
    box-shadow: 0 10px 28px rgba(27, 63, 108, .09) !important;
  }

  .dy8-config-page .template .f-order .qqg-summary-config,
  .dy8-config-page .template .f-order .qqg-v16-live-summary,
  .dy8-config-page .template .f-order .qqg-summary-fees,
  .dy8-config-page .template .f-order .left,
  .dy8-config-page .template .f-order .mid,
  .dy8-config-page .template .f-order .right,
  .dy8-config-page .template .f-order .qqg-summary-trust {
    flex: 0 0 auto !important;
  }

  .dy8-config-page .qqg-v16-summary-list {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}
