/* ============================================================
   许鲜集采 · 三后台设计系统 v6 — 组件层
   卡片 / 表格 / 筛选 / 表单 / 按钮 / 标签 / 下拉 / 弹窗 / 分页 /
   统计卡(info-box,small-box) / 登录页 / 响应式
   依赖 v5-design-system.css 的 token；角色色经 --xx-brand* 注入。
   ============================================================ */

/* ========== 卡片 / 盒子 ========== */
.card,
.box,
.content-box,
.grid-box,
.table-card,
.dcat-box {
  border: 1px solid var(--xx-border);
  border-radius: var(--xx-radius-lg);
  background: var(--xx-surface);
  box-shadow: var(--xx-shadow-sm);
}
.card-header,
.box-header,
.grid-header {
  border-bottom: 1px solid var(--xx-border);
  background: var(--xx-surface);
  padding: 15px 20px;
}
.card-title,
.box-title { color: var(--xx-text); font-size: 15px; font-weight: 700; }

/* ========== 统计卡（仪表盘 info-box / small-box）========== */
.info-box,
.small-box {
  border: 1px solid var(--xx-border);
  border-radius: var(--xx-radius-lg);
  box-shadow: var(--xx-shadow-sm);
  background: var(--xx-surface);
  overflow: hidden;
  transition: .18s;
}
.info-box:hover,
.small-box:hover { box-shadow: var(--xx-shadow-md); transform: translateY(-2px); }
.small-box > .inner h3,
.info-box .info-box-number { font-weight: 800; letter-spacing: .3px; color: var(--xx-text); }
.small-box .icon,
.info-box .info-box-icon { color: var(--xx-brand-strong); opacity: .85; }
.info-box .info-box-icon { background: var(--xx-brand-soft) !important; border-radius: var(--xx-radius-md); }

/* ========== 表格 ========== */
.table { margin-bottom: 0; color: var(--xx-text); }
.table thead th,
.table th {
  height: 46px;
  color: var(--xx-text-soft);
  background: var(--xx-surface-soft);
  border-bottom: 1px solid var(--xx-border-strong);
  border-top: none;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0;
  white-space: nowrap;
  vertical-align: middle;
}
.table td {
  border-color: var(--xx-border);
  vertical-align: middle;
  font-size: 13px;
  padding-top: .85rem;
  padding-bottom: .85rem;
}
.table-hover tbody tr:hover,
.table tbody tr:hover { background: var(--xx-brand-tint); }
.grid-table .column-__actions__,
.table .grid-row-action,
.table .dropdown { white-space: nowrap; }

/* ========== 表单 ========== */
.form-control,
.custom-select,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple,
.input-group-text {
  min-height: var(--xx-control-height);
  border-color: var(--xx-border-strong);
  border-radius: var(--xx-radius-md);
  color: var(--xx-text);
  box-shadow: none;
}
.form-control:focus,
.custom-select:focus,
.select2-container--focus .select2-selection,
.select2-container--open .select2-selection {
  border-color: var(--xx-brand);
  box-shadow: 0 0 0 3.5px var(--xx-brand-ring);
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: var(--xx-brand);
}
label { color: var(--xx-text-soft); font-weight: 600; }
.filter-box,
.grid-filter,
.box-body .filter {
  border: 1px solid var(--xx-border);
  border-radius: var(--xx-radius-lg);
  background: var(--xx-surface-soft);
}

/* 开关 */
.la-checkbox .icheckbox_minimal-blue.checked,
.switchery { border-radius: 20px; }

/* ========== 按钮 ========== */
.btn {
  min-height: 36px;
  border-radius: var(--xx-radius-md);
  font-weight: 600;
  letter-spacing: 0;
  box-shadow: none;
  transition: .15s;
}
.btn-primary,
.btn-success {
  background: linear-gradient(135deg, var(--xx-brand), var(--xx-brand-strong)) !important;
  border-color: var(--xx-brand) !important;
  color: #fff !important;
  box-shadow: 0 6px 16px var(--xx-brand-ring);
}
.btn-primary:hover,
.btn-success:hover { filter: brightness(1.05); transform: translateY(-1px); }
.bg-primary, .label-primary, .badge-primary {
  background-color: var(--xx-brand) !important;
  border-color: var(--xx-brand) !important;
  color: #fff !important;
}
.btn-warning, .bg-warning {
  background-color: var(--xx-warning) !important;
  border-color: var(--xx-warning) !important;
  color: #fff !important;
}
.btn-danger, .bg-danger, .grid-row-delete, .form-delete {
  background-color: var(--xx-danger) !important;
  border-color: var(--xx-danger) !important;
  color: #fff !important;
}
.btn-default,
.btn-secondary,
.btn-white {
  color: var(--xx-text-soft);
  background: var(--xx-surface);
  border-color: var(--xx-border-strong);
}
.btn-default:hover,
.btn-secondary:hover {
  color: var(--xx-brand-strong);
  border-color: var(--xx-brand);
  background: var(--xx-brand-tint);
}
.btn-outline-primary {
  color: var(--xx-brand-strong) !important;
  border-color: var(--xx-brand) !important;
}

/* ========== 标签 / 状态 ========== */
.badge, .label, .tag, .status-tag {
  border-radius: 20px;
  font-weight: 700;
  letter-spacing: 0;
  padding: .34em .8em;
}
.badge-success, .label-success {
  color: var(--xx-brand-strong) !important;
  background: var(--xx-brand-soft) !important;
}
.badge-info, .label-info {
  color: var(--xx-info-ink) !important;
  background: var(--xx-info-soft) !important;
}
.badge-warning, .label-warning {
  color: var(--xx-warning-ink) !important;
  background: var(--xx-warning-soft) !important;
}
.badge-danger, .label-danger {
  color: var(--xx-danger-ink) !important;
  background: var(--xx-danger-soft) !important;
}

/* ========== 下拉菜单 ========== */
.dropdown-menu {
  border: 1px solid var(--xx-border);
  border-radius: var(--xx-radius-lg);
  box-shadow: var(--xx-shadow-md);
  padding: 6px;
}
.dropdown-item, .dropdown-menu a {
  color: var(--xx-text-soft);
  border-radius: var(--xx-radius-sm);
}
.dropdown-item:hover, .dropdown-menu a:hover {
  color: var(--xx-brand-strong);
  background: var(--xx-brand-soft);
}

/* ========== 弹窗 ========== */
.modal-content,
.swal2-popup {
  border: none;
  border-radius: var(--xx-radius-lg);
  box-shadow: var(--xx-shadow-lg);
}
.modal-header {
  border-bottom: 1px solid var(--xx-border);
  background: var(--xx-surface);
  border-radius: var(--xx-radius-lg) var(--xx-radius-lg) 0 0;
}
.swal2-styled.swal2-confirm {
  background: linear-gradient(135deg, var(--xx-brand), var(--xx-brand-strong)) !important;
}

/* ========== 分页 ========== */
.pagination .page-link {
  color: var(--xx-text-soft);
  border-color: var(--xx-border);
  border-radius: var(--xx-radius-sm) !important;
  margin: 0 3px;
  min-width: 33px;
  text-align: center;
}
.pagination .page-link:hover { color: var(--xx-brand-strong); border-color: var(--xx-brand); }
.pagination .active .page-link,
.page-item.active .page-link {
  background: var(--xx-brand);
  border-color: var(--xx-brand);
  color: #fff;
}

/* ========== 登录页 ========== */
.login-page,
.login-box,
.auth-wrapper,
body.login-page { background: var(--xx-page) !important; }
.login-box .card,
.login-page .card,
.login-box .login-box-body,
.login-page .login-box-body {
  border-radius: var(--xx-radius-lg);
  border: 1px solid var(--xx-border);
  box-shadow: var(--xx-shadow-lg);
  padding: 6px;
}
.login-page .btn-primary,
.login-box .btn-primary {
  width: 100%;
  height: 44px;
  font-size: 15px;
  border-radius: var(--xx-radius-md);
}

/* ========== 状态工具类 ========== */
.xx-status-success { background: var(--xx-brand-soft); color: var(--xx-brand-strong); }
.xx-status-warning { background: var(--xx-warning-soft); color: var(--xx-warning-ink); }
.xx-status-danger { background: var(--xx-danger-soft); color: var(--xx-danger-ink); }
.xx-status-info { background: var(--xx-info-soft); color: var(--xx-info-ink); }

/* ========== 响应式 ========== */
@media (max-width: 1440px) {
  body { font-size: 13px; }
  .table td, .table th { font-size: 12px; padding: .6rem .7rem; }
  .content-header h1, .content-header-title { font-size: 19px; }
}
@media (max-width: 768px) {
  .card, .box, .content-box { border-radius: var(--xx-radius-md); }
  .table-responsive { border-radius: var(--xx-radius-md); }
}