@charset "utf-8";

/*
 * 利益众生后台主题
 * 视觉语言取自禅期管理：禅意青绿、浅绿灰背景、白色圆角卡片。
 * 本文件仅覆盖表现层，不改变任何页面结构和业务交互。
 */

:root {
    --zen-bg: #f6f8f5;
    --zen-surface: #ffffff;
    --zen-surface-soft: #fbfdfb;
    --zen-surface-muted: #f1f4f2;
    --zen-text: #364d3d;
    --zen-text-secondary: #52755c;
    --zen-text-muted: #7a9483;
    --zen-primary: #5da39d;
    --zen-primary-2: #70ae92;
    --zen-primary-dark: #4c8a85;
    --zen-border: rgba(82, 117, 92, .14);
    --zen-border-soft: rgba(82, 117, 92, .08);
    --zen-shadow: 0 4px 24px rgba(82, 117, 92, .08);
    --zen-shadow-hover: 0 10px 28px rgba(82, 117, 92, .14);
}

html,
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    color: var(--zen-text);
    background: var(--zen-bg);
}

body {
    line-height: 1.55;
}

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

a:hover,
a:focus {
    color: var(--zen-primary);
}

/* 顶部导航 */
.header {
    background: var(--zen-surface) !important;
    border-bottom: 1px solid var(--zen-border-soft);
    box-shadow: 0 4px 20px rgba(82, 117, 92, .06);
}

.header .site-logo {
    background: none !important;
}

.header .site-logo .logo-accent {
    width: 4px;
    height: 21px;
    flex: 0 0 auto;
    border-radius: 4px;
    background: linear-gradient(180deg, var(--zen-primary), var(--zen-primary-2));
}

.header .site-logo .logo-label {
    color: #263b2d;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 2px;
    white-space: nowrap;
}

.main-nav a {
    color: var(--zen-text-secondary) !important;
    font-weight: 600;
    transition: color .2s ease, background .2s ease, box-shadow .2s ease;
}

.main-nav a:hover {
    color: var(--zen-primary-dark) !important;
    background: rgba(93, 163, 157, .09) !important;
}

.main-nav .current,
.main-nav .current a {
    color: #fff !important;
    background: linear-gradient(135deg, var(--zen-primary), var(--zen-primary-2)) !important;
    box-shadow: 0 4px 14px rgba(93, 163, 157, .24);
}

.header .user-bar .user-entrance {
    width: 32px;
    height: 32px;
    margin-top: 9px;
    padding: 0;
    border-radius: 50%;
    background-color: var(--zen-primary);
    background-image: url(../images/bg_icon.png);
    background-repeat: no-repeat;
    background-position: -144px 6px;
    box-shadow: 0 3px 10px rgba(93, 163, 157, .28);
    transition: transform .2s ease, box-shadow .2s ease;
}

.header .user-bar .user-entrance:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 14px rgba(93, 163, 157, .34);
}

.header .user-menu {
    top: 55px;
    overflow: hidden;
    border: 1px solid var(--zen-border-soft);
    border-radius: 10px;
    background: var(--zen-surface);
    box-shadow: var(--zen-shadow);
}

.header .user-menu li {
    border-bottom-color: var(--zen-border-soft);
}

.header .user-menu a,
.header .user-menu .manager {
    color: var(--zen-text-secondary);
}

.header .user-menu a:hover {
    color: var(--zen-primary-dark);
    background: rgba(93, 163, 157, .08);
}

/* 左侧菜单卡片 */
.sidebar {
    top: 64px;
    left: 12px;
    width: 176px;
    height: calc(100vh - 78px);
    padding: 10px 0 18px;
    overflow-x: hidden;
    overflow-y: auto;
    border: 1px solid var(--zen-border-soft);
    border-radius: 12px;
    background: var(--zen-surface) !important;
    box-shadow: var(--zen-shadow);
}

.sidebar::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    border-radius: 12px 12px 0 0;
    background: linear-gradient(90deg, var(--zen-primary), var(--zen-primary-2));
    content: "";
}

.subnav {
    padding: 4px 9px 16px;
}

.subnav h3 {
    height: auto;
    min-height: 36px;
    margin: 3px 0;
    padding: 0 8px;
    border-radius: 8px;
    color: var(--zen-text) !important;
    font-size: 14px;
    line-height: 36px;
    transition: background .2s ease, color .2s ease;
}

.subnav h3:hover {
    color: var(--zen-primary-dark) !important;
    background: rgba(93, 163, 157, .07);
}

.subnav h3 a {
    color: inherit !important;
}

.subnav h3 .icon,
.subnav h3 .icon-fold,
.subnav h3 .recycle {
    position: relative;
    width: 14px;
    height: 14px;
    margin: 10px 7px 0 0;
    border: 1px solid rgba(82, 117, 92, .45);
    border-radius: 3px;
    background: none !important;
    color: var(--zen-text-secondary);
    font-size: 12px;
    line-height: 12px;
    text-align: center;
}

.subnav h3 .icon::before {
    content: "−";
}

.subnav h3 .icon-fold::before {
    content: "+";
}

.side-sub-menu {
    margin: 4px 0 8px;
}

.side-sub-menu > li {
    margin: 3px 0;
}

.side-sub-menu > li > .item {
    padding: 8px 10px 8px 28px;
    border: 0;
    border-radius: 8px;
    color: var(--zen-text-secondary) !important;
    line-height: 20px;
    transition: all .2s ease;
}

.side-sub-menu > li > .item:hover,
.side-sub-menu > li.hover > .item {
    margin-right: 0;
    color: var(--zen-primary-dark) !important;
    background: rgba(93, 163, 157, .08) !important;
}

.side-sub-menu > .current > .item,
.side-sub-menu > .current > .item:hover,
.side-sub-menu > .current.hover > .item {
    color: #fff !important;
    background: linear-gradient(135deg, var(--zen-primary), var(--zen-primary-2)) !important;
    box-shadow: 0 4px 12px rgba(93, 163, 157, .25);
}

.side-sub-menu li .subitem {
    overflow: hidden;
    border-color: var(--zen-border);
    border-radius: 9px;
    background: var(--zen-surface);
    box-shadow: var(--zen-shadow);
}

.side-sub-menu .subitem .item:hover {
    color: var(--zen-primary-dark);
    background: var(--zen-surface-muted) !important;
}

/* 主内容区 */
.main,
.index-main {
    color: var(--zen-text);
    background: var(--zen-bg) !important;
}

.main {
    min-height: calc(100vh - 50px);
    padding: 24px;
}

.main-title {
    padding-bottom: 18px;
}

.main-title h2,
.main-title h3,
.dashboard-title h2,
.panel-title {
    color: var(--zen-text) !important;
    font-weight: 650;
}

.main-title h2::after {
    display: block;
    width: 38px;
    height: 3px;
    margin-top: 8px;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--zen-primary), var(--zen-primary-2));
    content: "";
}

.breadcrumb,
.dashboard-title p,
.check-tips {
    color: var(--zen-text-muted) !important;
}

/* 首页数据卡片 */
.metric-card,
.kpi-card,
.dashboard-panel,
.columns-mod,
.show-num-mod {
    border: 1px solid var(--zen-border-soft) !important;
    border-radius: 12px !important;
    background: var(--zen-surface) !important;
    box-shadow: var(--zen-shadow) !important;
}

.metric-card,
.kpi-card,
.dashboard-panel {
    transition: transform .25s ease, box-shadow .25s ease;
}

.metric-card:hover,
.kpi-card:hover,
.dashboard-panel:hover {
    transform: translateY(-2px);
    box-shadow: var(--zen-shadow-hover) !important;
}

.metric-card::before,
.kpi-card::before {
    background: linear-gradient(90deg, var(--zen-primary), var(--zen-primary-2)) !important;
}

.kpi-title,
.kpi-desc {
    color: var(--zen-text-secondary) !important;
}

.kpi-value {
    color: var(--zen-text) !important;
}

.kpi-card .kpi-icon {
    color: var(--zen-primary-dark) !important;
    background: rgba(93, 163, 157, .09) !important;
}

.ga-metric-card {
    border-color: var(--zen-border-soft) !important;
    background: var(--zen-surface-soft) !important;
}

.metric-label,
.metric-description,
.ga-metric-label,
.article-views,
.chart-legend,
.badge {
    color: var(--zen-text-secondary) !important;
}

.metric-value,
.ga-metric-value,
.article-link {
    color: var(--zen-text) !important;
}

.date-selector-group,
.badge,
.article-views {
    border-color: var(--zen-border-soft) !important;
    background: var(--zen-surface-muted) !important;
}

.date-btn {
    color: var(--zen-text-secondary) !important;
}

.date-btn.active,
.date-btn:hover {
    color: var(--zen-primary-dark) !important;
    background: var(--zen-surface) !important;
    box-shadow: 0 2px 8px rgba(82, 117, 92, .12) !important;
}

.ga-enabled {
    color: #3b8761 !important;
    background: rgba(77, 166, 124, .12) !important;
}

.ga-console-link {
    border-radius: 8px !important;
    background: linear-gradient(135deg, var(--zen-primary), var(--zen-primary-2)) !important;
    box-shadow: 0 3px 10px rgba(93, 163, 157, .28) !important;
}

.columns-mod {
    overflow: hidden;
}

.columns-mod .hd {
    border-color: var(--zen-border-soft);
    background: var(--zen-surface-soft);
}

.columns-mod .bd {
    background: var(--zen-surface);
}

/* 表格 */
.data-table {
    overflow: hidden;
    margin: 12px 0 18px;
    border: 1px solid var(--zen-border-soft);
    border-radius: 12px;
    background: var(--zen-surface);
    box-shadow: var(--zen-shadow);
}

.data-table table {
    margin: 0;
    background: transparent;
}

.data-table thead th {
    padding: 12px 10px;
    border: 0;
    color: var(--zen-text-secondary) !important;
    background: var(--zen-surface-muted) !important;
    font-weight: 600;
}

.data-table tbody tr {
    color: #4a5c51;
    background: var(--zen-surface) !important;
    transition: background .18s ease;
}

.data-table tbody tr:nth-child(even) {
    background: #fafbfa !important;
}

.data-table tbody tr:hover {
    background: rgba(93, 163, 157, .055) !important;
}

.data-table tbody td {
    padding: 11px 10px;
    border-bottom: 1px solid rgba(82, 117, 92, .065);
}

.data-table tbody tr:last-child td {
    border-bottom: 0;
}

/* 按钮和工具栏 */
.btn {
    border: 0 !important;
    border-radius: 8px !important;
    color: #fff !important;
    background: linear-gradient(135deg, var(--zen-primary), var(--zen-primary-2)) !important;
    box-shadow: 0 2px 8px rgba(93, 163, 157, .22);
    font-weight: 500;
    transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}

.btn:hover,
.btn:focus {
    color: #fff !important;
    background: linear-gradient(135deg, var(--zen-primary-dark), #5e947b) !important;
    box-shadow: 0 4px 12px rgba(93, 163, 157, .32);
    transform: translateY(-1px);
}

.btn-danger,
.btn.confirm {
    background: #d16e6c !important;
    box-shadow: 0 2px 8px rgba(209, 110, 108, .22);
}

.btn-danger:hover,
.btn.confirm:hover {
    background: #ba605e !important;
}

.btn-return {
    color: var(--zen-text-secondary) !important;
    border: 1px solid var(--zen-border) !important;
    background: var(--zen-surface) !important;
    box-shadow: none;
}

.btn-return:hover {
    color: var(--zen-text) !important;
    background: var(--zen-surface-muted) !important;
}

.btn-toolbar .btn {
    margin-right: 8px;
    margin-left: 0;
    border-radius: 8px !important;
}

.btn[disabled],
.btn.disabled {
    background: #9caaa0 !important;
    box-shadow: none;
    opacity: .65;
}

.btn-group .dropdown,
.btn-group-click .dropdown,
.search-form .drop-down ul {
    overflow: hidden;
    border-color: var(--zen-border);
    border-radius: 8px;
    background: var(--zen-surface);
    box-shadow: var(--zen-shadow);
}

.btn-group .dropdown a:hover,
.btn-group-click .dropdown a:hover,
.search-form .drop-down ul a:hover {
    color: var(--zen-primary-dark);
    background: var(--zen-surface-muted);
}

/* 搜索和表单 */
.search-form .sleft {
    overflow: hidden;
    border: 1px solid var(--zen-border) !important;
    border-radius: 8px;
    background: var(--zen-surface);
    transition: border-color .2s ease, box-shadow .2s ease;
}

.search-form .sleft:focus-within {
    border-color: var(--zen-primary) !important;
    box-shadow: 0 0 0 3px rgba(93, 163, 157, .12);
}

.search-form .search-input,
.text,
.textarea,
select {
    border: 1px solid var(--zen-border) !important;
    border-radius: 8px !important;
    color: var(--zen-text);
    background: var(--zen-surface) !important;
    box-shadow: none;
}

.search-form .search-input {
    border: 0 !important;
}

.text:focus,
.textarea:focus-within,
select:focus,
.focus {
    border-color: var(--zen-primary) !important;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(93, 163, 157, .13) !important;
}

.form-horizontal {
    padding: 24px;
    border: 1px solid var(--zen-border-soft);
    border-radius: 12px;
    background: var(--zen-surface);
    box-shadow: var(--zen-shadow);
}

.form-horizontal .form-item {
    margin-bottom: 12px;
}

.form-horizontal .item-label,
.form-horizontal label {
    color: var(--zen-text-secondary);
}

.form-horizontal .controls {
    padding-top: 7px;
    padding-bottom: 7px;
}

/* 标签与分页 */
.tab-nav {
    border-bottom-color: var(--zen-border);
}

.tab-nav li a,
.tab-nav li a:hover {
    color: var(--zen-text-secondary);
    border: 0;
    border-radius: 8px 8px 0 0;
}

.tab-nav li a:hover {
    color: var(--zen-primary-dark);
    background: rgba(93, 163, 157, .07);
}

.tab-nav .current a,
.tab-nav .current a:hover {
    color: var(--zen-primary-dark);
    border: 0 !important;
    border-bottom: 3px solid var(--zen-primary) !important;
    background: var(--zen-surface);
}

.page a,
.page span {
    height: 32px;
    margin: 0 3px 4px 0;
    padding: 0 12px;
    border: 1px solid var(--zen-border) !important;
    border-radius: 6px;
    color: var(--zen-text-secondary);
    background: var(--zen-surface);
    line-height: 32px;
}

.page a:hover,
.page .current {
    color: #fff;
    border-color: var(--zen-primary) !important;
    background: var(--zen-primary) !important;
}

/* 分类树、提示框及其他通用容器 */
.category,
.checkmod,
.widget-box,
.upload-img-box,
.sort_option select {
    border: 1px solid var(--zen-border-soft) !important;
    border-radius: 10px;
    background: var(--zen-surface) !important;
    box-shadow: 0 3px 16px rgba(82, 117, 92, .06);
}

.category {
    overflow: hidden;
}

.category .hd,
.checkmod dt,
.widget-title {
    color: var(--zen-text-secondary) !important;
    border-color: var(--zen-border-soft) !important;
    background: var(--zen-surface-muted) !important;
}

.category .cate-item dt {
    border-color: var(--zen-border-soft);
}

.alert {
    border-radius: 8px;
    box-shadow: 0 3px 14px rgba(82, 117, 92, .08);
}

.alert-info {
    color: var(--zen-text-secondary);
    border-color: rgba(93, 163, 157, .2);
    background: rgba(93, 163, 157, .09);
}

/* 用户行为页的共修统计模块 */
.action-stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
    gap: 22px;
    margin-bottom: 28px;
}

.action-stat-card,
.action-summary-card {
    min-width: 0;
    padding: 22px;
    border: 1px solid var(--zen-border-soft);
    border-radius: 12px;
    background: var(--zen-surface);
    box-shadow: var(--zen-shadow);
}

.action-stat-title,
.action-summary-card h2 {
    position: relative;
    width: auto !important;
    margin: 0 0 18px !important;
    padding-bottom: 12px;
    color: var(--zen-text);
    font-size: 19px;
    font-weight: 650;
    text-align: left !important;
}

.action-stat-title::after,
.action-summary-card h2::after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 36px;
    height: 3px;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--zen-primary), var(--zen-primary-2));
    content: "";
}

.action-stat-filter {
    display: flex;
    width: 100% !important;
    align-items: flex-end;
    gap: 12px;
    margin-bottom: 12px;
}

.action-stat-filter label {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
    gap: 6px;
    color: var(--zen-text-secondary);
    font-size: 13px;
    font-weight: 500;
}

.action-stat-filter input[type="date"] {
    width: 100%;
    height: 36px;
    padding: 0 9px;
    border: 1px solid var(--zen-border);
    border-radius: 8px;
    box-sizing: border-box;
    color: var(--zen-text);
    background: var(--zen-surface);
    outline: 0;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.action-stat-filter input[type="date"]:focus {
    border-color: var(--zen-primary);
    box-shadow: 0 0 0 3px rgba(93, 163, 157, .13);
}

.action-filter-submit {
    height: 36px;
    padding: 0 17px;
    border: 0;
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(135deg, var(--zen-primary), var(--zen-primary-2));
    box-shadow: 0 2px 8px rgba(93, 163, 157, .24);
    cursor: pointer;
}

.action-filter-submit:hover {
    background: linear-gradient(135deg, var(--zen-primary-dark), #5e947b);
}

.action-export-btn {
    height: 36px;
    padding: 0 14px;
    border: 1px solid rgba(93, 163, 157, .45);
    border-radius: 8px;
    color: var(--zen-primary-dark);
    background: var(--zen-surface);
    white-space: nowrap;
    cursor: pointer;
    transition: color .18s ease, background .18s ease, border-color .18s ease;
}

.action-export-btn:hover {
    color: #fff;
    border-color: var(--zen-primary);
    background: var(--zen-primary);
}

.action-stat-card .selecttime {
    display: flex;
    min-height: 20px;
    gap: 10px;
    margin: 0 0 10px;
    color: var(--zen-text-muted);
    font-size: 12px;
}

.action-stat-card .selecttime span + span::before {
    margin-right: 10px;
    content: "至";
}

.action-stat-table {
    margin: 0;
    border-radius: 9px;
    box-shadow: none;
}

.action-stat-table table {
    width: 100% !important;
    margin: 0 !important;
}

.action-stat-table tbody tr:first-child {
    background: var(--zen-surface-muted) !important;
}

.action-stat-table tbody tr:first-child td {
    color: var(--zen-text-secondary) !important;
    background: var(--zen-surface-muted) !important;
    font-weight: 600;
}

.action-stat-table td {
    text-align: center;
}

.action-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    margin: 0 0 28px;
}

.action-summary-filter {
    max-width: 460px;
}

.action-summary-values {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    color: var(--zen-text-secondary);
}

.action-summary-values span,
.action-summary-values strong {
    padding: 7px 11px;
    border-radius: 7px;
    background: var(--zen-surface-muted);
    font-weight: 500;
}

.action-list-toolbar {
    margin-bottom: 12px;
}

.footer,
.copyright {
    color: #94ae9b;
    background: transparent !important;
}

/* 登录页 */
#login-page {
    min-height: 100vh;
    min-width: 0;
    overflow-x: hidden;
    color: var(--zen-text);
    background: var(--zen-bg) !important;
}

#login-page .login-header {
    position: relative;
    z-index: 10;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    height: 51px;
    border-bottom: 1px solid var(--zen-border-soft);
    background: var(--zen-surface);
    box-shadow: 0 4px 20px rgba(82, 117, 92, .06);
}

#login-page .login-site-logo {
    display: flex;
    align-items: center;
    gap: 9px;
    box-sizing: border-box;
    height: 50px;
    padding: 0 16px;
    color: #263b2d;
    text-decoration: none;
    transition: opacity .2s ease;
}

#login-page .login-site-logo:hover {
    color: #263b2d;
    text-decoration: none;
    opacity: .82;
}

#login-page .login-site-logo .logo-accent {
    width: 4px;
    height: 21px;
    flex: 0 0 auto;
    border-radius: 4px;
    background: linear-gradient(180deg, var(--zen-primary), var(--zen-primary-2));
}

#login-page .login-site-logo .logo-label {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 2px;
    white-space: nowrap;
}

#login-page #main-content {
    min-height: calc(100vh - 51px);
}

#login-page .login-body {
    min-height: calc(100vh - 51px);
    margin: 0;
    background:
        radial-gradient(circle at 20% 20%, rgba(112, 174, 146, .13), transparent 34%),
        radial-gradient(circle at 80% 75%, rgba(93, 163, 157, .12), transparent 32%),
        var(--zen-bg);
}

#login-page .login-main {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    min-height: calc(100vh - 51px);
    padding: 48px 20px;
}

#login-page .login-body .pr {
    height: auto;
}

#login-page .login-form {
    position: relative;
    overflow: hidden;
    box-sizing: content-box;
    max-width: calc(100% - 60px);
    margin: 0;
    border: 1px solid var(--zen-border-soft);
    border-top: 0;
    border-radius: 14px;
    background: var(--zen-surface);
    box-shadow: 0 14px 40px rgba(82, 117, 92, .15);
}

#login-page .login-form::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 5px;
    background: linear-gradient(90deg, var(--zen-primary), var(--zen-primary-2));
    content: "";
}

#login-page .login-form h3 {
    color: var(--zen-text);
}

#login-page .login-form .item {
    border-color: var(--zen-border);
    border-radius: 8px;
    background: var(--zen-surface);
}

#login-page .login-form .focus {
    border-color: var(--zen-primary);
    box-shadow: 0 0 0 3px rgba(93, 163, 157, .13);
}

#login-page .login-form .login-btn {
    border-radius: 8px;
    background: linear-gradient(135deg, var(--zen-primary), var(--zen-primary-2));
    box-shadow: 0 4px 14px rgba(93, 163, 157, .28);
}

#login-page .login-form .login-btn:hover {
    background: linear-gradient(135deg, var(--zen-primary-dark), #5e947b);
}

#login-page .reloadverify {
    color: var(--zen-primary-dark);
}

#login-page img.verifyimg {
    border-color: var(--zen-border);
    border-radius: 8px;
}

@media (max-width: 1100px) {
    .main-nav li {
        width: 74px;
    }

    .header .logo.site-logo {
        width: 174px;
    }

    .action-stat-grid,
    .action-summary-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .action-stat-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .action-stat-filter {
        align-items: stretch;
        flex-direction: column;
    }
}
