/*
标题：Bootstrap本地精简版CSS（用于数据库页面）
摘要：为页面提供常用的Bootstrap 5风格（容器、栅格、卡片、按钮、表单、表格、工具类）。精简实现仅覆盖本页使用到的类，提升加载速度，避免CDN依赖。
*/

/* 基础 */
:root {
  --bs-primary: #0d6efd;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
  --bs-border-color: #dee2e6;
}

* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; line-height: 1.5; color: #212529; }

/* 容器与间距工具类 */
.container { width: 100%; padding-right: 1rem; padding-left: 1rem; margin-right: auto; margin-left: auto; max-width: 1200px; }
.py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.pt-2 { padding-top: .5rem !important; }
.mb-0 { margin-bottom: 0 !important; }
.mb-3 { margin-bottom: 1rem !important; }
.me-2 { margin-right: .5rem !important; }
.bg-light { background-color: var(--bs-light) !important; }
.border-bottom { border-bottom: 1px solid var(--bs-border-color) !important; }
.text-secondary { color: var(--bs-secondary) !important; }
.small { font-size: .875rem; }

/* Flex与布局工具类 */
.d-flex { display: flex !important; }
.flex-wrap { flex-wrap: wrap !important; }
.align-items-center { align-items: center !important; }
.align-middle { vertical-align: middle !important; }
.gap-2 { gap: .5rem !important; }

/* 卡片 */
.card { position: relative; display: block; background-color: #fff; border: 1px solid var(--bs-border-color); border-radius: .5rem; }
.card-body { padding: 1rem; }

/* 表单 */
.form-label { display: inline-block; margin-bottom: .25rem; font-weight: 500; }
.form-control, .form-select { display: block; width: 100%; padding: .375rem .5rem; font-size: .95rem; line-height: 1.5; color: #212529; background-color: #fff; border: 1px solid var(--bs-border-color); border-radius: .375rem; }
.form-control-sm { padding: .25rem .5rem; font-size: .875rem; }

/* 按钮 */
.btn { display: inline-block; font-weight: 400; line-height: 1.5; color: #212529; text-align: center; text-decoration: none; vertical-align: middle; cursor: pointer; user-select: none; background-color: transparent; border: 1px solid var(--bs-border-color); padding: .375rem .75rem; font-size: .95rem; border-radius: .375rem; transition: background-color .15s, color .15s, border-color .15s; }
.btn:disabled { opacity: .65; cursor: not-allowed; }
.btn-primary { color: #fff; background-color: var(--bs-primary); border-color: var(--bs-primary); }
.btn-primary:hover { background-color: #0b5ed7; border-color: #0a58ca; }
.btn-success { color: #fff; background-color: var(--bs-success); border-color: var(--bs-success); }
.btn-success:hover { background-color: #157347; border-color: #146c43; }
.btn-outline-primary { color: var(--bs-primary); border-color: var(--bs-primary); }
.btn-outline-primary:hover { color: #fff; background-color: var(--bs-primary); }
.btn-outline-secondary { color: var(--bs-secondary); border-color: var(--bs-secondary); }
.btn-outline-secondary:hover { color: #fff; background-color: var(--bs-secondary); }
.btn-outline-danger { color: var(--bs-danger); border-color: var(--bs-danger); }
.btn-outline-danger:hover { color: #fff; background-color: var(--bs-danger); }

/* 表格 */
.table { width: 100%; margin-bottom: 1rem; color: #212529; border-collapse: collapse; }
.table th, .table td { padding: .5rem .75rem; border-bottom: 1px solid var(--bs-border-color); }
.table-striped tbody tr:nth-child(odd) { background-color: #f8f9fc; }
.table-hover tbody tr:hover { background-color: #f1f3f5; }
.table-sm th, .table-sm td { padding: .25rem .5rem; }
.table-light th { background-color: #f8f9fa; }
.table-responsive { width: 100%; overflow-x: auto; }

/* 行列栅格（精简版） */
.row { display: flex; flex-wrap: wrap; margin-right: -0.5rem; margin-left: -0.5rem; }
.row > [class^="col-"] { padding-right: .5rem; padding-left: .5rem; }
.col-12 { flex: 0 0 100%; max-width: 100%; }
.col-6 { flex: 0 0 50%; max-width: 50%; }
.col-sm-3 { flex: 0 0 25%; max-width: 25%; }
.col-sm-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }

/* 间距工具（用于g-2） */
.g-2 { --g: .5rem; }
.row.g-2 > [class^="col-"] { padding-right: var(--g); padding-left: var(--g); }

/* 断点：小屏以下按col-规则，大于576px应用col-sm-规则 */
@media (max-width: 575.98px) {
  .col-sm-3, .col-sm-4 { flex: 0 0 100%; max-width: 100%; }
}

/* 其他 */
.table .align-middle { vertical-align: middle; }

/* 辅助分隔符 */
.divider-text { color: var(--bs-secondary); margin: 0 .25rem; }