/*
 * 全局暗黑主题样式表
 *
 * 该文件定义了在夜间模式下的通用外观，包括背景色、
 * 文本颜色、卡片容器、输入框和按钮等。
 * 当 html 或 body 元素包含 `night` 类时，这些规则生效。
 * 通过集中定义全局颜色和样式，可以方便地统一维护
 * 暗黑主题，并避免各个页面内联样式颜色过亮的问题。
 */

/* 页面基础背景和默认文本颜色 */
.night html,
.night body {
    background-color: #0a2140; /* 深海蓝，避免过亮的纯蓝色 */
    color: #e5eefc;           /* 柔和的浅色字体 */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* 通用容器样式：适用于需要突出显示的卡片区域 */
.night .container,
.night .delete-container,
.night .mui-margin-20,
.night .lock-container,
.night .order-container,
.night .notice-container,
.night .question-container,
.night .traffic-container,
.night .user-container {
    background-color: #11284f !important;             /* 比页面背景稍亮的深蓝色 */
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    color: #e5eefc !important;
}

/* 默认文本的次级颜色 */
.night .secondary-text,
.night .container .secondary-text,
.night .delete-container .secondary-text,
.night .mui-margin-20 .secondary-text,
.night .lock-container .secondary-text,
.night .order-container .secondary-text {
    color: #9aaed0;
}

/* 表单输入框 */
.night input,
.night textarea,
.night select {
    background-color: #172e59 !important;
    border: 1px solid #25466b !important;
    color: #e5eefc !important;
    border-radius: 8px;
}
.night input::placeholder,
.night textarea::placeholder,
.night select::placeholder {
    color: #7a8faf !important;
}

/* 通用按钮样式 */
.night button,
.night .mui-btn,
.night .layui-btn,
.night .btn-primary {
    background-image: linear-gradient(90deg, #2a4e8a 0%, #173566 100%) !important;
    color: #ffffff !important;
    border: none;
    border-radius: 12px;
    transition: background-color 0.2s, box-shadow 0.2s;
}
.night button:hover,
.night .mui-btn:hover,
.night .layui-btn:hover,
.night .btn-primary:hover {
    background-image: linear-gradient(90deg, #25467a 0%, #123058 100%) !important;
}
.night button:active,
.night .mui-btn:active,
.night .layui-btn:active,
.night .btn-primary:active {
    background-image: linear-gradient(90deg, #1e3c6e 0%, #0e2a50 100%) !important;
}
.night button:disabled,
.night .mui-btn:disabled,
.night .layui-btn:disabled,
.night .btn-primary:disabled {
    background-color: #25466b !important;
    background-image: none !important;
    color: #777777 !important;
}

/* 警告或提示条样式 */
.night .alert,
.night .notice,
.night .warning-box {
    background-color: #1b3366;
    border-left: 4px solid #d95463;
    color: #d95463;
    border-radius: 6px;
    padding: 10px;
}
.night .alert span,
.night .notice span,
.night .warning-box span {
    color: #f27b83;
    font-weight: bold;
}

/* Tabs、菜单选项卡的背景与选中颜色调整 */
.night .tabs,
.night .nav-tabs,
.night .tab-bar {
    background-color: #11284f;
    border-radius: 8px;
}
.night .tabs a,
.night .nav-tabs a,
.night .tab-bar a {
    color: #9aaed0;
}
.night .tabs a.active,
.night .nav-tabs a.active,
.night .tab-bar a.active {
    color: #ffffff;
    background-color: #1c3970;
    border-radius: 8px;
}

/* 表格样式调整 */
.night table {
    background-color: #11284f;
    color: #e5eefc;
}
.night table th,
.night table td {
    border-color: #1d3a6b;
}

/* 链接颜色 */
.night a {
    color: #78a4f4;
}
.night a:hover {
    color: #a6c2f7;
    text-decoration: underline;
}

/* 分割线 */
.night hr {
    border-color: #1c3a6b;
}

/* layer 弹窗按钮覆盖样式（确保夜间模式统一） */
.night .layui-layer-btn a,
.night .layui-layer-btn span {
    background-image: linear-gradient(90deg, #2a4e8a 0%, #173566 100%);
    color: #ffffff !important;
    border: none;
    border-radius: 20px;
}
.night .layui-layer-btn .layui-layer-btn1 {
    background-color: #25466b !important;
    color: #cccccc !important;
}