/**
 * FastAdmin 后台 — 全局 UI 覆盖（仅 CSS）
 * 须在 application/admin/view/common/meta.html 中于 skin-*.css **之后**引入，否则样式会被皮肤表盖掉。
 * ui-ux-pro-max：企业数据面板（蓝 + 琥珀强调）
 */

/* 顶部多标签：去掉菜单图标，只保留文字与关闭按钮 */
.nav-addtabs > li > a > i,
.nav-addtabs > li > a > .fa,
.nav-addtabs > li > a > .glyphicon,
.nav-addtabs li[role="presentation"] > a > i:not(.close-tab),
.nav-addtabs li[role="presentation"] > a > .fa:not(.close-tab) {
    display: none !important;
}

:root {
    --fa-ui-bg: #f1f5f9;
    --fa-ui-surface: #ffffff;
    --fa-ui-text: #0f172a;
    --fa-ui-muted: #64748b;
    --fa-ui-border: #e2e8f0;
    --fa-ui-primary: #1d4ed8;
    --fa-ui-primary-hover: #1e40af;
    --fa-ui-accent: #d97706;
    --fa-ui-accent-soft: #fffbeb;
    --fa-ui-radius: 12px;
    --fa-ui-radius-sm: 8px;
    --fa-ui-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.06);
    --fa-ui-transition: 0.2s ease;
}

body {
    background: var(--fa-ui-bg);
    color: var(--fa-ui-text);
    font-family: "Inter", "Segoe UI", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
    font-size: 14px;
}

/* 皮肤表在 meta 里会加载两次且在后：这里用 .skin-black-blue 提高优先级 */
.skin-black-blue .wrapper {
    background-color: #1e293b !important;
}

.skin-black-blue .content-wrapper,
.skin-black-blue .right-side {
    background-color: #f1f5f9 !important;
}

.skin-black-blue .main-footer {
    background: #fff !important;
    border-top: 1px solid var(--fa-ui-border) !important;
    color: var(--fa-ui-muted) !important;
}

/* ---------- 顶栏 ---------- */
.main-header {
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.06);
}

.main-header .logo {
    transition: background var(--fa-ui-transition);
}

.skin-black-blue .main-header .navbar {
    min-height: 54px;
    border-bottom: 1px solid var(--fa-ui-border);
    box-shadow: none;
}

.skin-black-blue .main-header .navbar .nav > li > a {
    padding-top: 16px;
    padding-bottom: 16px;
    font-size: 14px;
}

.skin-black-blue .main-header .navbar .sidebar-toggle {
    padding: 16px 18px;
    font-size: 18px;
}

/* ---------- 侧栏（保持 230 宽，只加内边距与层级） ---------- */
.main-sidebar,
.left-side {
    box-shadow: 2px 0 12px rgba(15, 23, 42, 0.08);
}

.sidebar-menu > li > a {
    padding: 13px 12px 13px 16px !important;
    font-size: 14px;
    border-radius: 0;
    transition: background-color var(--fa-ui-transition), color var(--fa-ui-transition);
}

.sidebar-menu .treeview-menu > li > a {
    padding: 10px 12px 10px 28px !important;
    font-size: 13px;
}

.sidebar-menu > li .label,
.sidebar-menu > li .badge {
    font-size: 11px;
    padding: 3px 7px;
    border-radius: 6px;
}

.user-panel {
    padding: 16px 12px !important;
}

.user-panel > .info > p {
    font-size: 13px;
}

/* ---------- 主内容区：更疏朗 ---------- */
.content {
    padding: 22px 28px 28px;
    min-height: calc(100vh - 120px);
}

.content-header {
    padding: 18px 24px 14px;
    margin: 0 0 18px;
    background: var(--fa-ui-surface);
    border-bottom: 1px solid var(--fa-ui-border);
    border-radius: var(--fa-ui-radius);
    box-shadow: var(--fa-ui-shadow);
}

.content-header > h1 {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    color: var(--fa-ui-text);
    letter-spacing: -0.02em;
}

.content-header > h1 > small {
    font-size: 14px;
    color: var(--fa-ui-muted);
    font-weight: 500;
}

.breadcrumb {
    margin-top: 10px;
    padding: 8px 14px;
    border-radius: var(--fa-ui-radius-sm);
    background: #f8fafc;
    border: 1px solid var(--fa-ui-border);
    font-size: 13px;
}

.breadcrumb > li + li::before {
    color: #cbd5e1;
}

.breadcrumb > li > a {
    color: #2563eb;
}

.breadcrumb > .active {
    color: var(--fa-ui-muted);
}

/* ---------- 卡片 / 面板 ---------- */
.box,
.panel,
.panel-default,
.card {
    border-radius: var(--fa-ui-radius);
    border: 1px solid var(--fa-ui-border);
    box-shadow: var(--fa-ui-shadow);
    background: var(--fa-ui-surface);
    overflow: hidden;
}

.box-header,
.panel-heading {
    padding: 16px 20px;
    min-height: auto;
    border-bottom: 1px solid var(--fa-ui-border);
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border-radius: var(--fa-ui-radius) var(--fa-ui-radius) 0 0;
}

.box-title,
.panel-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--fa-ui-text);
}

.box-body,
.panel-body {
    padding: 18px 20px;
}

.box-tools,
.panel-heading .panel-title .pull-right {
    margin-top: -2px;
}

/* ---------- 控制台统计卡（AdminLTE .small-box） ---------- */
.small-box {
    border-radius: var(--fa-ui-radius);
    overflow: hidden;
    box-shadow: var(--fa-ui-shadow);
    transition: transform var(--fa-ui-transition), box-shadow var(--fa-ui-transition);
}

.small-box > .inner {
    padding: 18px 18px 12px;
}

.small-box h3 {
    font-size: 32px;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.small-box .icon {
    font-size: 64px !important;
    opacity: 0.35;
}

.small-box > .small-box-footer {
    padding: 10px 14px;
    font-weight: 500;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.small-box:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
}

/* ---------- 控制台 Tab ---------- */
.nav-tabs-custom {
    border-radius: var(--fa-ui-radius);
    box-shadow: var(--fa-ui-shadow);
    background: var(--fa-ui-surface);
    border: 1px solid var(--fa-ui-border);
    overflow: hidden;
}

.nav-tabs-custom > .nav-tabs {
    border-bottom-color: var(--fa-ui-border);
}

.nav-tabs-custom > .nav-tabs > li > a {
    border-radius: 0;
    padding: 14px 20px;
    font-weight: 600;
    color: var(--fa-ui-muted);
}

.nav-tabs-custom > .nav-tabs > li.active {
    border-top-color: #3b82f6;
}

.nav-tabs-custom > .nav-tabs > li.active > a {
    color: var(--fa-ui-primary);
}

.nav-tabs-custom > .tab-content {
    padding: 20px;
    background: #fafbfc;
}

/* ---------- 多标签 iframe 区域 ---------- */
.skin-black-blue .tab-content.tab-addtabs {
    background-color: #f1f5f9 !important;
}

.skin-black-blue .tab-content.tab-addtabs > .tab-pane > iframe {
    border-radius: var(--fa-ui-radius-sm);
    box-shadow: var(--fa-ui-shadow);
    background: #fff;
}

/* ---------- 表格 ---------- */
.table {
    font-size: 13px;
}

.table > thead > tr > th {
    padding: 14px 12px;
    background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
    color: #1e3a8a;
    border-bottom: 2px solid #93c5fd;
    font-weight: 600;
    vertical-align: middle;
}

.table > tbody > tr > td {
    padding: 12px;
    vertical-align: middle;
}

.table > tbody > tr {
    transition: background-color var(--fa-ui-transition);
}

.table > tbody > tr:hover > td {
    background-color: #f8fafc;
}

.table-bordered {
    border-radius: var(--fa-ui-radius-sm);
    overflow: hidden;
}

/* bootstrap-table 工具栏 */
.fixed-table-toolbar .btn,
.bootstrap-table .fixed-table-toolbar .btn {
    padding: 8px 14px;
    border-radius: var(--fa-ui-radius-sm);
    font-weight: 500;
    margin-right: 6px;
    margin-bottom: 6px;
}

.fixed-table-toolbar .bars,
.bootstrap-table .fixed-table-toolbar .bars {
    margin-top: 6px;
}

/* ---------- 按钮全系 ---------- */
.btn {
    border-radius: var(--fa-ui-radius-sm);
    padding: 9px 16px;
    font-weight: 500;
    transition: background-color var(--fa-ui-transition), border-color var(--fa-ui-transition),
        box-shadow var(--fa-ui-transition), color var(--fa-ui-transition), transform 0.12s ease;
}

.btn-sm {
    padding: 7px 12px;
    font-size: 13px;
}

.btn-xs {
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 6px;
}

.btn-primary {
    background: linear-gradient(180deg, #3b82f6 0%, var(--fa-ui-primary) 100%);
    border-color: #1e40af;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.25);
}

.btn-primary:hover,
.btn-primary:focus {
    background: linear-gradient(180deg, #2563eb 0%, var(--fa-ui-primary-hover) 100%);
    border-color: #1e3a8a;
}

.btn-primary:active {
    transform: translateY(1px);
}

.btn-success {
    background: linear-gradient(180deg, #34d399 0%, #059669 100%);
    border-color: #047857;
}

.btn-warning {
    background: linear-gradient(180deg, #fbbf24 0%, var(--fa-ui-accent) 100%);
    border-color: #b45309;
    color: #1c1917;
}

.btn-danger {
    border-radius: var(--fa-ui-radius-sm);
}

.btn-default {
    background: #fff;
    border-color: var(--fa-ui-border);
    color: #334155;
}

.btn-default:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
}

/* ---------- 表单 ---------- */
.form-control {
    border-radius: var(--fa-ui-radius-sm);
    border-color: var(--fa-ui-border);
    min-height: 38px;
    padding: 8px 12px;
    transition: border-color var(--fa-ui-transition), box-shadow var(--fa-ui-transition);
}

.form-control:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

select.form-control {
    min-height: 38px;
}

.input-group-addon {
    border-radius: var(--fa-ui-radius-sm);
    background: #f1f5f9;
    border-color: var(--fa-ui-border);
}

/* ---------- 标签页 ---------- */
.nav-tabs > li > a {
    border-radius: var(--fa-ui-radius-sm) var(--fa-ui-radius-sm) 0 0;
    padding: 12px 18px;
    font-weight: 500;
    color: var(--fa-ui-muted);
    transition: border-color var(--fa-ui-transition), background var(--fa-ui-transition), color var(--fa-ui-transition);
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    color: var(--fa-ui-primary);
    font-weight: 600;
    border-top-color: #3b82f6;
    border-left-color: var(--fa-ui-border);
    border-right-color: var(--fa-ui-border);
}

/* ---------- 分页 ---------- */
.pagination > li > a,
.pagination > li > span {
    padding: 8px 14px;
    margin: 0 2px;
    border-radius: var(--fa-ui-radius-sm) !important;
    border-color: var(--fa-ui-border);
    color: #334155;
}

.pagination > .active > a,
.pagination > .active > span {
    background: var(--fa-ui-primary);
    border-color: #1e40af;
}

/* ---------- 下拉 ---------- */
.dropdown-menu {
    border-radius: var(--fa-ui-radius-sm);
    border: 1px solid var(--fa-ui-border);
    box-shadow: var(--fa-ui-shadow);
    padding: 6px 0;
}

.dropdown-menu > li > a {
    padding: 10px 18px;
    transition: background var(--fa-ui-transition);
}

/* ---------- 弹层按钮区 ---------- */
.layui-layer-btn a,
.layui-layer-btn .layui-layer-btn0 {
    border-radius: var(--fa-ui-radius-sm) !important;
}

/* ---------- 焦点 ---------- */
a:focus-visible,
.btn:focus-visible,
.form-control:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .btn,
    .form-control,
    .table > tbody > tr,
    .sidebar-menu > li > a,
    .nav-tabs > li > a,
    .pagination > li > a,
    .pagination > li > span,
    .small-box {
        transition-duration: 0.01ms !important;
    }

    .small-box:hover {
        transform: none;
    }

    .btn-primary:active {
        transform: none;
    }
}