/* =====================================================================
   智眸 / Face-ABC 管理后台 · 统一主题
   基准：后台首页 adminindex（浅蓝 #4a7cf7）
   作用：让全部后台管理页面（Bootstrap 4 列表页/表单页/导航页）观感统一
   ===================================================================== */

:root {
    --t-primary: #4a7cf7;
    --t-primary-dark: #2d5dd7;
    --t-primary-light: #eaf1fd;
    --t-bg: #f0f5fe;
    --t-border: #e4ecf7;
    --t-text: #1e293b;
    --t-text-sub: #64748b;
    --t-radius: 14px;
    --t-radius-sm: 9px;
    --t-shadow: 0 4px 18px rgba(0, 20, 40, 0.05);
    --t-hover-shadow: 0 10px 28px rgba(26, 67, 113, 0.12);
}

/* ---------- 全局 ---------- */
body {
    background: var(--t-bg);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
        'Helvetica Neue', 'PingFang SC', 'Microsoft YaHei', sans-serif;
    color: var(--t-text);
    padding: 20px 14px 40px;
    min-height: 100vh;
    font-size: 0.95rem;
}

.container, .container-fluid {
    max-width: 1400px;
}

a { color: var(--t-primary); }
a:hover { color: var(--t-primary-dark); }

/* ---------- 页面主容器卡片化 ---------- */
.container > .table,
.container > table,
.container > form,
.container > .row > .col > .card,
.container > .card,
.table-wrap {
    background: #fff;
    border-radius: var(--t-radius);
    box-shadow: var(--t-shadow);
    border: 1px solid var(--t-border);
}
.container > table { padding: 6px 0; }

/* ---------- 导航条 ---------- */
.navbar {
    background: #fff;
    border-radius: 999px;
    padding: 6px 18px;
    box-shadow: var(--t-shadow);
    border: 1px solid var(--t-border);
    margin-bottom: 22px;
}
.navbar .nav-link { color: #4a5a7a; border-radius: 999px; padding: 8px 16px; transition: all .2s; }
.navbar .nav-link:hover { background: var(--t-primary-light); color: var(--t-primary-dark); }
.navbar .nav-link.active, .navbar .nav-link.active:hover { background: var(--t-primary); color: #fff; }

.nav {
    background: #fff;
    border-radius: 999px;
    padding: 6px 12px;
    box-shadow: var(--t-shadow);
    border: 1px solid var(--t-border);
    margin-bottom: 22px;
}
.nav .nav-link { color: #4a5a7a; border-radius: 999px; padding: 8px 16px; transition: all .2s; }
.nav .nav-link:hover { background: var(--t-primary-light); color: var(--t-primary-dark); text-decoration: none; }
.nav .nav-link.active { background: var(--t-primary); color: #fff; }
.nav .nav-link.disabled { color: #94a3b8; }

/* ---------- 表格 ---------- */
.table {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}
.table thead th {
    background: var(--t-primary-light);
    color: var(--t-primary-dark);
    font-weight: 600;
    font-size: 0.85rem;
    border-bottom: none;
    padding: 12px 14px;
    white-space: nowrap;
}
.table thead th:first-child { border-top-left-radius: var(--t-radius-sm); }
.table thead th:last-child { border-top-right-radius: var(--t-radius-sm); }
.table tbody td {
    padding: 10px 14px;
    border-color: #eef3fa;
    vertical-align: middle;
    color: #33415c;
}
.table tbody tr { transition: background .15s; }
.table tbody tr:hover { background: #f6f9ff; }
.table tbody tr:nth-of-type(even) { background: #fbfdff; }
.table tbody tr:nth-of-type(even):hover { background: #f6f9ff; }
.table thead:first-child tr:first-child th { border-top: none; }

.table img { border-radius: 8px; object-fit: cover; }
.table a { color: var(--t-primary); text-decoration: none; }
.table a:hover { color: var(--t-primary-dark); text-decoration: underline; }

/* 列表页标题行（老模板常把标题放在表头第一行） */
.table thead tr:first-child th { text-align: center; }

/* ---------- 分页 ---------- */
.pagination {
    display: flex;
    justify-content: center;
    margin: 18px 0 8px;
    flex-wrap: wrap;
    gap: 4px;
    padding-left: 0;
}
.pagination > li { list-style: none; }
.pagination > li > a,
.pagination > li > span {
    display: inline-block;
    padding: 6px 13px;
    color: var(--t-primary);
    background: #fff;
    border: 1px solid var(--t-border);
    border-radius: 8px;
    text-decoration: none;
    font-size: 0.88rem;
    transition: all .15s;
    line-height: 1.4;
}
.pagination > li > a:hover,
.pagination > li > a:focus { background: var(--t-primary-light); border-color: var(--t-primary); color: var(--t-primary-dark); }
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover {
    background: var(--t-primary);
    border-color: var(--t-primary);
    color: #fff;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > a,
.pagination > .disabled > a:hover {
    color: #b6c2d4;
    background: #f8fafc;
    border-color: var(--t-border);
    cursor: not-allowed;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span,
.pagination > li:last-child > a,
.pagination > li:last-child > span {
    border-radius: 8px;
}

/* ---------- 按钮 ---------- */
.btn { border-radius: var(--t-radius-sm); font-size: 0.9rem; padding: 7px 16px; }
.btn-primary {
    background: var(--t-primary);
    border-color: var(--t-primary);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled):active {
    background: var(--t-primary-dark);
    border-color: var(--t-primary-dark);
}
.btn-outline-primary { color: var(--t-primary); border-color: var(--t-primary); }
.btn-outline-primary:hover { background: var(--t-primary); border-color: var(--t-primary); }
.btn-link { color: var(--t-primary); }

/* ---------- 表单 ---------- */
.form-control {
    border-radius: var(--t-radius-sm);
    border-color: #dbe4f0;
    color: var(--t-text);
    font-size: 0.9rem;
    padding: 8px 12px;
}
.form-control:focus {
    border-color: var(--t-primary);
    box-shadow: 0 0 0 3px rgba(74, 124, 247, 0.15);
}
select.form-control { padding-right: 28px; }
label { font-weight: 500; color: #41506e; }
.form-group { margin-bottom: 1rem; }

/* ---------- 卡片 ---------- */
.card {
    background: #fff;
    border: 1px solid var(--t-border);
    border-radius: var(--t-radius);
    box-shadow: var(--t-shadow);
}
.card-header {
    background: var(--t-primary-light);
    border-bottom: 1px solid var(--t-border);
    border-radius: var(--t-radius) var(--t-radius) 0 0 !important;
    font-weight: 600;
    color: var(--t-primary-dark);
}
.card-title { font-weight: 600; color: var(--t-text); }

/* ---------- 徽章 / 提示 ---------- */
.badge { border-radius: 999px; padding: 4px 10px; font-weight: 500; }
.alert { border-radius: var(--t-radius-sm); border: none; }
.alert-primary { background: var(--t-primary-light); color: var(--t-primary-dark); }
.alert-success { background: #e6f7ee; color: #1a9e5c; }
.alert-danger { background: #feecec; color: #d64545; }
.alert-warning { background: #fff7e0; color: #b07c16; }
.alert-info { background: #e8f4fe; color: #1c7ed6; }

/* ---------- 模态框 ---------- */
.modal-content {
    border-radius: var(--t-radius);
    border: none;
    box-shadow: 0 20px 60px rgba(0, 20, 40, 0.18);
}
.modal-header { border-bottom: 1px solid var(--t-border); border-radius: var(--t-radius) var(--t-radius) 0 0; background: #fafcff; }
.modal-footer { border-top: 1px solid var(--t-border); }

/* ---------- 杂项 ---------- */
h1, h2, h3, h4, h5 { color: var(--t-text); }
.page-header, .page-title { font-weight: 700; color: var(--t-text); margin-bottom: 18px; }
.center, center { text-align: center; }
hr { border-color: var(--t-border); }
.breadcrumb { background: #fff; border-radius: var(--t-radius-sm); border: 1px solid var(--t-border); }
