/* ========================================
   CDZX Admin Global Styles
   ======================================== */

/* 日期/时间控件小图标颜色：白色（深色背景下可见） */
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator {
  filter: invert(1) brightness(2);
  cursor: pointer;
}

/* ========================================
   CDZX Admin Mobile Adapter
   纯CSS窄屏适配，所有规则在 max-width:768px 内
   桌面端(>768px)完全不触发，零影响
   ======================================== */

@media screen and (max-width: 768px) {

  /* ── 通用：页面body ── */
  body {
    padding: 12px 10px !important;
  }

  /* ── 页面标题区 ── */
  .page-header {
    flex-wrap: wrap !important;
    gap: 10px !important;
  }
  .page-title {
    font-size: 16px !important;
  }
  .toolbar {
    flex-wrap: wrap !important;
    gap: 6px !important;
    width: 100% !important;
  }
  .search-box,
  input[type="text"].search-box,
  input.search-box {
    width: 100% !important;
    max-width: 100% !important;
  }
  .filter-select {
    max-width: 45% !important;
  }

  /* ── 统计卡片 ── */
  .stat-cards {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .stat-card {
    flex: 1 1 45% !important;
    min-width: 140px !important;
    padding: 12px !important;
  }
  .stat-value {
    font-size: 18px !important;
  }

  /* ── 表格容器：横向可滚动 ── */
  .table-container {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* ── 表格列：保证最小宽度不被压扁 ── */
  table {
    min-width: 600px !important;
    width: 100% !important;
  }
  th, td {
    padding: 8px 10px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  /* ── 操作按钮区 ── */
  td.actions,
  td .actions {
    white-space: nowrap !important;
  }
  .btn {
    padding: 6px 10px !important;
    font-size: 12px !important;
  }

  /* ── 弹窗/模态框 ── */
  .modal-content,
  .modal-box,
  #detailModal .modal-body,
  div[style*="modal"] {
    max-width: 95vw !important;
    margin: 10px auto !important;
    padding: 15px !important;
  }
  .modal-overlay,
  .modal-mask {
    padding: 10px !important;
  }

  /* ── 分页 ── */
  .pagination {
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 4px !important;
  }
  .pagination button,
  .pagination .page-btn {
    min-width: 32px !important;
    padding: 4px 8px !important;
    font-size: 12px !important;
  }

  /* ── 表单 ── */
  .form-group {
    margin-bottom: 15px !important;
  }
  input, select, textarea {
    font-size: 16px !important; /* 防止iOS自动缩放 */
  }
}
