/*
 * ui-optimize.css - UI排版优化样式
 * 从 enhancements.js UIOptimize 模块提取，原通过 JS 运行时注入，现改为静态 CSS。
 * CSS 选择器和规则与原注入内容完全一致。
 */

/* ===== 表格响应式优化 (optimizeTableResponsive) ===== */
/* 表格容器统一水平滚动 */
        .table-container, .data-table-wrapper, .table-responsive {
          width: 100%;
          max-width: 100%;
          overflow-x: auto;
          -webkit-overflow-scrolling: touch;
        }
        .table-container table, .data-table-wrapper table, .table-responsive table {
          min-width: 600px;
        }
        /* 移动端表格转为卡片布局 */
        @media (max-width: 768px) {
          .table-container.mobile-card-view table,
          .data-table-wrapper.mobile-card-view table {
            min-width: 100%;
          }
        }

/* ===== 表单标签优化 (optimizeFormLabels) ===== */
/* 表单label统一样式 */
        .form-group label, .form-item label {
          display: block;
          margin-bottom: 6px;
          font-size: 13px;
          font-weight: 500;
          color: #475569;
        }
        /* 必填项标记 */
        .form-group label .required,
        .form-item label .required {
          color: #ef4444;
          margin-left: 2px;
        }
        /* 输入框统一高度 */
        .form-group input[type="text"],
        .form-group input[type="email"],
        .form-group input[type="password"],
        .form-group input[type="number"],
        .form-group input[type="tel"],
        .form-group input[type="date"],
        .form-group select,
        .form-group textarea,
        .form-item input[type="text"],
        .form-item input[type="email"],
        .form-item input[type="password"],
        .form-item input[type="number"],
        .form-item input[type="tel"],
        .form-item input[type="date"],
        .form-item select,
        .form-item textarea {
          min-height: 40px;
          padding: 8px 12px;
          border: 1px solid #e2e8f0;
          border-radius: 8px;
          font-size: 14px;
          transition: border-color 0.2s, box-shadow 0.2s;
          width: 100%;
          box-sizing: border-box;
        }
        .form-group input:focus,
        .form-group select:focus,
        .form-group textarea:focus,
        .form-item input:focus,
        .form-item select:focus,
        .form-item textarea:focus {
          border-color: #3b82f6;
          box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
          outline: none;
        }

/* ===== 触摸区域优化 (optimizeTouchTargets) ===== */
@media (max-width: 768px) {
          .btn, button.btn, a.btn, .btn-sm, .btn-xs {
            min-height: 44px !important;
            min-width: 44px !important;
            padding: 10px 16px !important;
            font-size: 14px !important;
          }
          /* 表格行内按钮也确保可点击 */
          .data-table td .btn,
          .data-table td button {
            min-height: 36px;
            padding: 6px 12px;
          }
          /* 链接触摸区域 */
          .data-table td a {
            min-height: 36px;
            display: inline-flex;
            align-items: center;
            padding: 4px 8px;
          }
        }

/* ===== 颜色对比度优化 (optimizeColorContrast) ===== */
/* 统一主色调 */
        :root {
          --primary: #3b82f6;
          --primary-dark: #2563eb;
          --primary-light: #dbeafe;
          --success: #10b981;
          --warning: #f59e0b;
          --danger: #ef4444;
          --gray-50: #f8fafc;
          --gray-100: #f1f5f9;
          --gray-200: #e2e8f0;
          --gray-400: #94a3b8;
          --gray-600: #475569;
          --gray-800: #1e293b;
        }
        /* 文字颜色对比度修复 */
        .text-muted, .text-secondary {
          color: #64748b !important;
        }
        /* 卡片投影统一 */
        .card, .panel, .info-card {
          box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.03) !important;
          border: 1px solid #f0f0f0 !important;
          border-radius: 12px !important;
        }
        /* 按钮统一风格 */
        .btn-primary {
          background: linear-gradient(135deg, #3b82f6, #2563eb) !important;
          border: none !important;
          color: #fff !important;
          border-radius: 8px !important;
          transition: transform 0.15s, box-shadow 0.15s !important;
        }
        .btn-primary:hover {
          transform: translateY(-1px);
          box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3) !important;
        }
        .btn-primary:active {
          transform: translateY(0);
        }
        /* 毛玻璃效果 */
        .glass-card {
          background: rgba(255, 255, 255, 0.7) !important;
          backdrop-filter: blur(10px) !important;
          -webkit-backdrop-filter: blur(10px) !important;
          border: 1px solid rgba(255, 255, 255, 0.3) !important;
        }

/* ===== 全局样式优化 (injectStyles) ===== */
/* 骨架屏加载占位 */
        .skeleton {
          background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
          background-size: 200% 100%;
          animation: skeleton-loading 1.5s infinite;
          border-radius: 6px;
        }
        @keyframes skeleton-loading {
          0% { background-position: 200% 0; }
          100% { background-position: -200% 0; }
        }
        /* 空状态样式 */
        .empty-state {
          text-align: center;
          padding: 60px 20px;
          color: #999;
        }
        .empty-state .empty-icon {
          font-size: 48px;
          margin-bottom: 12px;
          opacity: 0.3;
        }
        /* 状态标签统一 */
        .status-tag {
          display: inline-block;
          padding: 2px 10px;
          border-radius: 12px;
          font-size: 12px;
          font-weight: 500;
        }
        .status-tag.green { background: #d1fae5; color: #065f46; }
        .status-tag.orange { background: #fef3c7; color: #92400e; }
        .status-tag.blue { background: #dbeafe; color: #1e40af; }
        .status-tag.red { background: #fee2e2; color: #991b1b; }
        .status-tag.gray { background: #f3f4f6; color: #374151; }
        .status-tag.purple { background: #ede9fe; color: #5b21b6; }
        .status-tag.cyan { background: #cffafe; color: #155e75; }
        /* 分页器优化 */
        .pagination {
          display: flex;
          gap: 4px;
          justify-content: center;
          padding: 16px 0;
          flex-wrap: wrap;
        }
        .pagination button, .pagination a {
          min-width: 36px;
          height: 36px;
          display: inline-flex;
          align-items: center;
          justify-content: center;
          border: 1px solid #e2e8f0;
          border-radius: 8px;
          padding: 0 10px;
          font-size: 13px;
          cursor: pointer;
          background: #fff;
          color: #475569;
          transition: all 0.15s;
        }
        .pagination button:hover, .pagination a:hover {
          border-color: #3b82f6;
          color: #3b82f6;
        }
        .pagination button.active, .pagination a.active {
          background: #3b82f6;
          color: #fff;
          border-color: #3b82f6;
        }
        .pagination button:disabled {
          opacity: 0.5;
          cursor: not-allowed;
        }
        /* Toast通知优化 */
        .toast {
          position: fixed;
          top: 20px;
          left: 50%;
          transform: translateX(-50%);
          padding: 12px 24px;
          border-radius: 10px;
          font-size: 14px;
          z-index: 10000;
          animation: toast-slide-in 0.3s ease;
          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
          max-width: 90vw;
        }
        .toast.success { background: #10b981; color: #fff; }
        .toast.error { background: #ef4444; color: #fff; }
        .toast.info { background: #3b82f6; color: #fff; }
        .toast.warning { background: #f59e0b; color: #fff; }
        @keyframes toast-slide-in {
          from { opacity: 0; transform: translate(-50%, -20px); }
          to { opacity: 1; transform: translate(-50%, 0); }
        }

