/**
 * 后台子页面 / 内嵌 iframe 三端自适应
 * PC >1180 不动；iPad 769–1180 收紧；Phone ≤768 单列+表格横滑
 */

/* —— iPad / 平板 —— */
@media (min-width: 769px) and (max-width: 1180px) {
  #app {
    padding: 10px !important;
    box-sizing: border-box;
  }

  .ap-card {
    margin-bottom: 10px;
  }

  .ap-card .ant-table-wrapper,
  .ant-table-wrapper {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .ant-table table {
    min-width: max-content;
  }

  .ant-space {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  /* 5 列开关类表单改为 2–3 列，避免挤成一团 */
  #app [style*="grid-template-columns: 1fr 1fr 1fr 1fr 1fr"],
  #app [style*="gridTemplateColumns"][style*="1fr 1fr 1fr 1fr 1fr"] {
    grid-template-columns: 1fr 1fr !important;
  }

  #app [style*="grid-template-columns: 1fr 1fr 1fr 1fr"],
  #app [style*="gridTemplateColumns"][style*="1fr 1fr 1fr 1fr"] {
    grid-template-columns: 1fr 1fr !important;
  }

  .ant-modal {
    max-width: min(640px, calc(100vw - 48px)) !important;
  }

  .ant-tabs-nav {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .ant-pagination {
    flex-wrap: wrap;
    row-gap: 6px;
  }
}

/* —— Phone —— */
@media (max-width: 768px) {
  html {
    -webkit-text-size-adjust: 100%;
  }

  body {
    overflow-x: auto;
  }

  #app {
    padding: 8px !important;
    max-width: 100vw;
    overflow-x: visible;
    box-sizing: border-box;
  }

  .ap-card {
    margin-bottom: 8px;
    border-radius: 6px;
  }

  .ap-card .ant-table-wrapper,
  .ant-table-wrapper {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x pan-y;
    overscroll-behavior-x: contain;
  }

  .ap-card .ant-table-container,
  .ap-card .ant-table-content,
  .ap-card .ant-table-body,
  .ant-table-content,
  .ant-table-body {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .ant-table table {
    min-width: max-content;
  }

  .ant-space {
    flex-wrap: wrap !important;
    gap: 8px !important;
    max-width: 100%;
  }

  .ant-space-item {
    max-width: 100%;
  }

  .ant-row {
    margin-left: 0 !important;
    margin-right: 0 !important;
    row-gap: 8px;
  }

  .ant-col {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  #app [style*="grid-template-columns"],
  #app [style*="gridTemplateColumns"] {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 12px !important;
  }

  #app [style*="grid-template-columns"] > *,
  #app [style*="gridTemplateColumns"] > * {
    width: 100% !important;
    max-width: 100% !important;
  }

  .ant-modal {
    max-width: min(400px, calc(100vw - 24px)) !important;
    width: min(400px, calc(100vw - 24px)) !important;
    margin: 12px auto !important;
    top: 24px !important;
    padding-bottom: 0;
  }

  .ant-modal-content {
    border-radius: 10px;
  }

  .ant-modal-header {
    padding: 12px 16px !important;
  }

  .ant-modal-title {
    font-size: 15px !important;
  }

  .ant-modal-body {
    padding: 12px 16px !important;
    max-height: calc(100dvh - 160px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    font-size: 13px;
  }

  .ant-modal-footer {
    padding: 10px 16px !important;
  }

  .ant-modal-footer .ant-btn {
    font-size: 13px;
  }

  .ant-modal-body [style*="grid-template-columns"],
  .ant-modal-body [style*="gridTemplateColumns"] {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 4px !important;
  }

  .ant-modal-body [style*="maxHeight"] {
    max-height: none !important;
  }

  .ant-drawer-content-wrapper {
    max-width: 100vw !important;
  }

  .ant-form-item {
    margin-bottom: 12px;
  }

  .ant-input,
  .ant-input-number,
  .ant-select,
  .ant-picker {
    max-width: 100% !important;
  }

  .ant-tabs-nav {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .ant-tabs-nav-wrap {
    flex-wrap: nowrap !important;
  }

  .ant-tabs-nav-list {
    flex-wrap: nowrap !important;
  }

  .ant-descriptions-view {
    overflow-x: auto;
  }

  .ant-descriptions-item-label,
  .ant-descriptions-item-content {
    padding: 8px !important;
  }

  .ant-pagination {
    flex-wrap: wrap;
    justify-content: center;
    padding: 8px 4px !important;
    row-gap: 6px;
  }

  .ant-pagination-options {
    display: none !important;
  }

  .ant-input-group-wrapper,
  .ant-input-search {
    width: 100% !important;
    max-width: 100% !important;
  }

  .ant-statistic {
    margin-bottom: 4px;
  }

  .ant-btn-group {
    flex-wrap: wrap;
  }

  .ant-segmented,
  .ant-radio-group {
    flex-wrap: wrap;
  }

  .ant-table-cell .ant-btn-link {
    padding: 0 4px;
    font-size: 12px;
  }

  .ant-upload-list {
    max-width: 100%;
  }

  .ql-toolbar,
  .ql-container {
    max-width: 100%;
  }

  body > .card {
    margin: 8px !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }
}

@media (max-width: 480px) {
  #app {
    padding: 6px !important;
  }

  .ant-table {
    font-size: 12px;
  }

  .ant-table-thead > tr > th,
  .ant-table-tbody > tr > td {
    padding: 8px 10px !important;
  }

  .ant-modal-title {
    font-size: 15px;
  }
}
