/* ========================================
   AuthServer - 清爽 UI 主题
   ======================================== */

/* --- 基础排版 --- */
:root {
    --color-primary: #4f6ef7;
    --color-primary-light: #eef1fe;
    --color-primary-hover: #3d5bd9;
    --color-success: #34c38f;
    --color-success-light: #eafaf3;
    --color-warning: #f1b44c;
    --color-warning-light: #fef8ec;
    --color-info: #50a5f1;
    --color-info-light: #edf5fe;
    --color-danger: #f46a6a;
    --color-text: #495057;
    --color-text-muted: #878a99;
    --color-heading: #343a40;
    --color-bg: #f8f9fc;
    --color-card: #ffffff;
    --color-border: #e9ebf0;
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.04);
    --shadow-md: 0 2px 8px rgba(0,0,0,0.06);
    --shadow-lg: 0 4px 24px rgba(0,0,0,0.08);
    --radius: 0.625rem;
    --radius-lg: 0.875rem;
}

html { font-size: 15px; }

body {
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
    background-color: var(--color-bg);
    color: var(--color-text);
    line-height: 1.6;
    min-height: 100vh;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: var(--color-heading);
    font-weight: 600;
    line-height: 1.3;
}
h1, .h1 { font-size: 1.65rem; }
h2, .h2 { font-size: 1.35rem; }
h3, .h3 { font-size: 1.15rem; }
h4, .h4 { font-size: 1.05rem; }
h5, .h5 { font-size: 0.95rem; }

p { margin-bottom: 0.75rem; }

/* --- 导航栏 --- */
.navbar {
    background: var(--color-card) !important;
    border-bottom: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    padding: 0.5rem 0;
}

.navbar .navbar-brand {
    color: var(--color-primary) !important;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}
.navbar .navbar-brand svg { color: var(--color-primary); }

.navbar .nav-link {
    color: var(--color-text) !important;
    font-size: 0.875rem;
    font-weight: 500;
    padding: 0.5rem 0.85rem !important;
    border-radius: 0.375rem;
    transition: background 0.15s, color 0.15s;
}
.navbar .nav-link:hover {
    background: var(--color-primary-light);
    color: var(--color-primary) !important;
}

.navbar .dropdown-toggle::after { opacity: 0.5; }
.navbar .dropdown-menu {
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-md);
    border-radius: var(--radius);
    padding: 0.35rem;
    font-size: 0.85rem;
}
.navbar .dropdown-item {
    border-radius: 0.375rem;
    padding: 0.4rem 0.75rem;
    font-size: 0.85rem;
}
.navbar .dropdown-item:hover { background: var(--color-primary-light); color: var(--color-primary); }

.navbar .btn-link { text-decoration: none; }
.navbar .user-name {
    color: var(--color-text-muted) !important;
    font-size: 0.82rem;
}

.navbar-toggler { border-color: var(--color-border); }
.navbar-toggler-icon { filter: invert(0.5); }

/* --- 容器与主体 --- */
.container { max-width: 1100px; }
main { padding-top: 0.5rem; }

/* --- 卡片 --- */
.card {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    background: var(--color-card);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.card-header {
    background: transparent;
    border-bottom: 1px solid var(--color-border);
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--color-heading);
    padding: 0.75rem 1rem;
}
.card-body { padding: 1rem; }

.card.hover-shadow:hover, a .card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

/* --- 表格 --- */
.table { font-size: 0.85rem; }
.table th {
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-text-muted);
    border-bottom-width: 1px;
    padding: 0.65rem 0.75rem;
    white-space: nowrap;
}
.table td { padding: 0.65rem 0.75rem; vertical-align: middle; }
.table-hover tbody tr:hover { background-color: #f8f9ff; }
.table-light { background-color: #fafbfd !important; }
thead.table-light th { background-color: #fafbfd !important; }

/* --- 按钮 --- */
.btn {
    font-size: 0.82rem;
    font-weight: 500;
    border-radius: 0.5rem;
    padding: 0.4rem 0.95rem;
    transition: all 0.15s ease;
}
.btn-sm { font-size: 0.76rem; padding: 0.28rem 0.7rem; border-radius: 0.375rem; }
.btn-lg { font-size: 0.92rem; padding: 0.6rem 1.5rem; }

.btn-primary {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}
.btn-primary:hover { background-color: var(--color-primary-hover); border-color: var(--color-primary-hover); }

.btn-success { background-color: var(--color-success); border-color: var(--color-success); }
.btn-warning { background-color: var(--color-warning); border-color: var(--color-warning); }
.btn-info { background-color: var(--color-info); border-color: var(--color-info); color: #fff; }
.btn-info:hover { color: #fff; }
.btn-danger { background-color: var(--color-danger); border-color: var(--color-danger); }

.btn-outline-primary { color: var(--color-primary); border-color: #d0d7fe; }
.btn-outline-primary:hover { background: var(--color-primary); border-color: var(--color-primary); }
.btn-outline-secondary { color: var(--color-text-muted); border-color: var(--color-border); }
.btn-outline-secondary:hover { background: #f0f1f3; color: var(--color-text); border-color: #ccc; }
.btn-outline-danger { color: var(--color-danger); border-color: #fdd; }
.btn-outline-danger:hover { background: var(--color-danger); border-color: var(--color-danger); }

/* --- 表单 --- */
.form-label {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--color-heading);
    margin-bottom: 0.3rem;
}
.form-control, .form-select {
    font-size: 0.85rem;
    border-color: var(--color-border);
    border-radius: 0.5rem;
    padding: 0.45rem 0.75rem;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.form-control:focus, .form-select:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(79, 110, 247, 0.1);
}
.form-text { font-size: 0.76rem; color: var(--color-text-muted); }
.form-check-label { font-size: 0.85rem; }
.form-check-input:checked {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

textarea.form-control { line-height: 1.5; }
.input-group-text {
    font-size: 0.85rem;
    border-color: var(--color-border);
    background: #fafbfd;
}

/* --- Badge --- */
.badge {
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.3em 0.6em;
    border-radius: 0.35rem;
    letter-spacing: 0.02em;
}
.bg-primary { background-color: var(--color-primary) !important; }
.bg-success { background-color: var(--color-success) !important; }
.bg-warning { background-color: var(--color-warning) !important; }
.bg-info { background-color: var(--color-info) !important; }
.bg-danger { background-color: var(--color-danger) !important; }

/* --- Code --- */
code {
    color: var(--color-primary);
    font-size: 0.82em;
    background: var(--color-primary-light);
    padding: 0.15em 0.4em;
    border-radius: 0.25rem;
}

/* --- Alert --- */
.alert {
    font-size: 0.85rem;
    border-radius: var(--radius);
    border: none;
    padding: 0.65rem 1rem;
}
.alert-primary { background: var(--color-primary-light); color: #3d5096; }
.alert-success { background: var(--color-success-light); color: #1e7a56; }
.alert-warning { background: var(--color-warning-light); color: #946a1a; }
.alert-info { background: var(--color-info-light); color: #2b6ca3; }
.alert-danger { background: #fef0f0; color: #a34040; }

/* --- 页脚 --- */
.footer {
    background: var(--color-card);
    border-top: 1px solid var(--color-border);
    font-size: 0.78rem;
    color: var(--color-text-muted);
}

/* --- 登录 / 授权页 --- */
.auth-icon-circle {
    width: 56px; height: 56px;
    border-radius: 50%;
    background: var(--color-primary-light);
    display: flex; align-items: center; justify-content: center;
    color: var(--color-primary);
}
.auth-icon-circle.auth-icon-warning {
    background: var(--color-warning-light);
    color: #b8860b;
}

/* --- 下拉菜单（全局） --- */
.dropdown-menu {
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-md);
    border-radius: var(--radius);
    padding: 0.35rem;
    font-size: 0.85rem;
}
.dropdown-item {
    border-radius: 0.375rem;
    padding: 0.45rem 0.85rem;
    font-size: 0.82rem;
    color: var(--color-text);
}
.dropdown-item:hover { background: var(--color-primary-light); color: var(--color-primary); }
.dropdown-item .badge { font-size: 0.65rem; }
.dropdown-item small { font-size: 0.72rem; }
.dropdown-divider { margin: 0.2rem 0; border-color: var(--color-border); }

/* --- 首页特性图标 --- */
.feature-icon {
    flex-shrink: 0;
    width: 42px; height: 42px;
    font-size: 0.9rem;
}

/* --- 作用域确认列表 --- */
.scope-badge { color: var(--color-success); }

/* --- 选中态（dl 列表） --- */
dl.row dt { font-size: 0.82rem; color: var(--color-text-muted); }
dl.row dd { font-size: 0.85rem; }

/* --- 管理表格空状态 --- */
.empty-state { padding: 3rem 1rem; }
.empty-state p { font-size: 0.88rem; }

/* --- 面包屑返回按钮 --- */
.btn-back {
    font-size: 0.78rem;
    color: var(--color-text-muted);
    border-color: var(--color-border);
    padding: 0.25rem 0.65rem;
}
.btn-back:hover { background: #f0f1f3; color: var(--color-text); }

/* --- 响应式微调 --- */
@media (max-width: 768px) {
    html { font-size: 13px; }
    .container { padding-left: 1rem; padding-right: 1rem; }
    .card-body { padding: 0.85rem; }
    .table { font-size: 0.8rem; }
}