/* 暗色模式 - 全局样式 */

/* 切换按钮样式 */
.dark-mode-toggle {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 99999;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    background: #ffffff;
    color: #555;
    padding: 0;
    outline: none;
}

.dark-mode-toggle:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    background: #f5f5f5;
}

html[data-theme="dark"] .dark-mode-toggle {
    background: #2a2a3e;
    color: #ffd43b;
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

html[data-theme="dark"] .dark-mode-toggle:hover {
    background: #3a3a4e;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

/* ==================== 暗色模式覆盖 ==================== */
html[data-theme="dark"] {
    color-scheme: dark;
}

/* Element Plus 暗色模式支持 */
html[data-theme="dark"] {
    --el-bg-color: #1a1a2e;
    --el-bg-color-overlay: #2a2a3e;
    --el-bg-color-page: #141422;
    --el-text-color-primary: #e0e0e0;
    --el-text-color-regular: #c8c8d0;
    --el-text-color-secondary: #a0a0b0;
    --el-text-color-placeholder: #6c6c7e;
    --el-border-color: #3a3a4e;
    --el-border-color-light: #2e2e42;
    --el-border-color-lighter: #262636;
    --el-fill-color: #2a2a3e;
    --el-fill-color-light: #242434;
    --el-fill-color-lighter: #1e1e2e;
    --el-fill-color-blank: #1a1a2e;
    --el-color-white: #1a1a2e;
    --el-mask-color: rgba(0, 0, 0, 0.7);
    --el-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
    --el-box-shadow-light: 0 2px 12px rgba(0, 0, 0, 0.3);
}

/* 基础页面背景 */
html[data-theme="dark"] body {
    background: #141422 !important;
    color: #e0e0e0;
}

html[data-theme="dark"] html {
    background: #141422 !important;
}

html[data-theme="dark"] #app {
    background: #141422 !important;
}

/* ===== 学生端暗色样式 ===== */

/* 登录容器 */
html[data-theme="dark"] .login-container {
    background-color: #0d0d1a;
}

html[data-theme="dark"] .login-card {
    background: rgba(30, 30, 50, 0.85);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(10px);
}

html[data-theme="dark"] .login-title {
    color: #e0e0e0;
}

/* 主容器 */
html[data-theme="dark"] .main-container {
    background: #141422 !important;
}

/* 头部卡片 */
html[data-theme="dark"] .header-card {
    background: linear-gradient(135deg, #3d4a7a 0%, #4a3566 100%);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] .user-name {
    color: #ffffff;
}

html[data-theme="dark"] .user-details {
    color: rgba(255, 255, 255, 0.7);
}

/* 统计卡片 */
html[data-theme="dark"] .stat-card {
    background: rgba(42, 42, 62, 0.95);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

html[data-theme="dark"] .stat-label {
    color: #a0a0b0;
}

/* 订单卡片 */
html[data-theme="dark"] .order-card {
    background: rgba(42, 42, 62, 0.95);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
    border-left-color: #3a3a4e;
}

html[data-theme="dark"] .order-card:hover {
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] .order-title {
    color: #e0e0e0;
}

/* 状态徽章 */
html[data-theme="dark"] .status-active {
    background-color: #1a3a2a;
    color: #6dd49e;
}

html[data-theme="dark"] .status-expired {
    background-color: #3a1a1e;
    color: #e87a7a;
}

html[data-theme="dark"] .status-expiring {
    background-color: #3a3018;
    color: #e6c65a;
}

/* 设置区域 */
html[data-theme="dark"] .settings-section {
    background: #1e1e2e;
}

html[data-theme="dark"] .settings-section:hover {
    background: #242436;
}

html[data-theme="dark"] .section-title {
    color: #c8c8d0;
}

html[data-theme="dark"] .form-label {
    color: #c8c8d0;
}

/* 日志区域 */
html[data-theme="dark"] .logs-section {
    background: #1e1e2e;
}

html[data-theme="dark"] .log-item {
    background: #242436;
    border-left-color: #3a3a4e;
}

html[data-theme="dark"] .log-time {
    color: #8888a0;
}

html[data-theme="dark"] .log-content {
    color: #c8c8d0;
}

/* 图片相关 */
html[data-theme="dark"] .image-item {
    background: #1e1e2e;
}

html[data-theme="dark"] .upload-area {
    border-color: #3a3a4e;
}

html[data-theme="dark"] .upload-area:hover {
    border-color: #409eff;
    background-color: #1e1e2e;
}

/* 人脸上传 */
html[data-theme="dark"] .face-upload-btn {
    border-color: #3a3a4e;
}

html[data-theme="dark"] .face-upload-btn:hover {
    border-color: #409eff;
}

html[data-theme="dark"] .face-upload-btn .el-icon {
    color: #6c6c7e;
}

html[data-theme="dark"] .face-upload-btn span {
    color: #8888a0;
}

html[data-theme="dark"] .face-status-success {
    background: #1a3a2a;
    color: #6dd49e;
}

html[data-theme="dark"] .face-status-exist {
    background: #3a3018;
    color: #e6a23c;
}

html[data-theme="dark"] .face-preview-box {
    border-color: #3a3a4e;
}

/* 打卡警告框 */
html[data-theme="dark"] .clock-warning-box {
    background: linear-gradient(135deg, #2a2818 0%, #2e2a18 100%);
    border-color: #7a5a10;
    border-left-color: #a07010;
}

html[data-theme="dark"] .clock-warning-text {
    color: #e6c65a;
}

/* 滚动条 */
html[data-theme="dark"] .logs-section::-webkit-scrollbar-track {
    background: #1a1a2e;
}

html[data-theme="dark"] .logs-section::-webkit-scrollbar-thumb {
    background: #3a3a4e;
}

html[data-theme="dark"] .logs-section::-webkit-scrollbar-thumb:hover {
    background: #4a4a5e;
}

/* Element Plus 组件暗色覆盖 */
html[data-theme="dark"] .el-input__wrapper {
    background-color: #1e1e2e;
    box-shadow: 0 0 0 1px #3a3a4e inset;
}

html[data-theme="dark"] .el-input__inner {
    color: #e0e0e0;
}

html[data-theme="dark"] .el-input__inner::placeholder {
    color: #6c6c7e;
}

html[data-theme="dark"] .el-select .el-input__wrapper {
    background-color: #1e1e2e;
}

html[data-theme="dark"] .el-dialog {
    background: #2a2a3e;
    border: 1px solid #3a3a4e;
}

html[data-theme="dark"] .el-dialog__title {
    color: #e0e0e0;
}

html[data-theme="dark"] .el-dialog__body {
    color: #c8c8d0;
}

html[data-theme="dark"] .el-message-box {
    background: #2a2a3e;
    border: 1px solid #3a3a4e;
}

html[data-theme="dark"] .el-message-box__title {
    color: #e0e0e0;
}

html[data-theme="dark"] .el-message-box__content {
    color: #c8c8d0;
}

html[data-theme="dark"] .el-checkbox__label {
    color: #c8c8d0;
}

html[data-theme="dark"] .el-switch__label {
    color: #a0a0b0;
}

html[data-theme="dark"] .el-divider {
    border-color: #3a3a4e;
}

html[data-theme="dark"] .el-pagination button,
html[data-theme="dark"] .el-pagination .el-pager li {
    background: #1e1e2e;
    color: #c8c8d0;
}

/* 公告弹窗 */
html[data-theme="dark"] .notice-content {
    color: #ff6b6b;
}

/* ===== 登录页暗色样式（Bootstrap + Layui 风格） ===== */

html[data-theme="dark"] .page-template-pagespage-login-php {
    background-color: #0d0d1a !important;
}

html[data-theme="dark"] .layui-form.js-validate.card,
html[data-theme="dark"] .layui-form.card,
html[data-theme="dark"] form.card {
    background: rgba(30, 30, 50, 0.85) !important;
    border: 1px solid rgba(60, 60, 80, 0.5) !important;
}

html[data-theme="dark"] .layui-form input[type="input"],
html[data-theme="dark"] .layui-form input[type="password"],
html[data-theme="dark"] .layui-form .form-control,
html[data-theme="dark"] input[name="user"],
html[data-theme="dark"] input[name="pass"] {
    background: rgba(30, 30, 50, 0.8) !important;
    border: 1px solid rgba(60, 60, 80, 0.6) !important;
    color: #e0e0e0 !important;
}

html[data-theme="dark"] .layui-form input::placeholder {
    color: rgba(180, 180, 200, 0.6) !important;
}

html[data-theme="dark"] .layui-form label,
html[data-theme="dark"] .text-muted {
    color: #a0a0b0 !important;
}

html[data-theme="dark"] .form-check-label {
    color: #a0a0b0 !important;
}