body.dark-mode { background: #2d3436; color: #e0e0e0; } body.dark-mode .status-box { background: linear-gradient(145deg, #2d3436, #3a3a3a); border: 1px solid #444; } body.dark-mode .time-display { color: #ecf0f1; } body.dark-mode .status-label { color: #bdc3c7; } body.dark-mode .schedule-table { background: #3a3a3a; } body.dark-mode .schedule-table th { background: #444; color: #ecf0f1; } body.dark-mode .schedule-table td { border-bottom: 1px solid #555; } body.dark-mode .current-class { background: #34495e !important; } body.dark-mode .future-class { background: #3a3a3a !important; } body.dark-mode .past-class { background: #2d3436 !important; color: #7f8c8d; } body.dark-mode .control-btn { background: linear-gradient(135deg, #2980b9, #3498db); } body.dark-mode .control-btn:hover { box-shadow: 0 6px 16px rgba(52, 152, 219, 0.35); } body.dark-mode .settings-panel { background: rgba(45, 52, 54, 0.95); border: 1px solid #444; } body.dark-mode .settings-panel h3 { color: #ecf0f1; } body.dark-mode .settings-panel label { color: #bdc3c7; } body.dark-mode .settings-panel input[type="number"] { background: #3a3a3a; color: #ecf0f1; border: 1px solid #555; } body.dark-mode .settings-panel input[type="file"] { background: #3a3a3a; color: #ecf0f1; border: 1px solid #555; } body.dark-mode .file-input-label { background: #27ae60; } body.dark-mode .file-input-label:hover { background: #219150; } body.dark-mode .info-container { background: #2980b9; } body.dark-mode .info-content:before { color: #2980b9; } body.dark-mode .error-container { background: #c0392b; } body.dark-mode .error-content:before { color: #c0392b; } body.dark-mode .reminder-table { background: #3a3a3a; } body.dark-mode .reminder-table th { background: #444; color: #ecf0f1; } body.dark-mode .reminder-table td { border-bottom: 1px solid #555; } body.dark-mode .reminder-table td input, body.dark-mode .reminder-table td select { background: #3a3a3a; color: #ecf0f1; border: 1px solid #555; } body.dark-mode .reminder-table td button { background: #e74c3c; } body.dark-mode .reminder-table td button:hover { background: #c0392b; } body.dark-mode .action-btn { background: #27ae60; } body.dark-mode .action-btn:hover { box-shadow: 0 6px 16px rgba(39, 174, 96, 0.35); } #return-btn { position: absolute; /* 绝对定位 */ top: 20px; /* 距离顶部 20px */ left: 20px; /* 距离左侧 20px */ background-color: #f5f7fa; /* 默认亮色模式背景颜色 */ color: #333333; /* 默认亮色模式文字颜色 */ border: 1px solid #cccccc; /* 默认亮色模式边框颜色 */ border-radius: 16px; /* 按钮圆角大小 */ padding: 10px 18px; /* 按钮内边距 */ font-size: 14px; /* 按钮字体大小 */ cursor: pointer; /* 鼠标悬停时显示为手型 */ box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); /* 按钮阴影 */ transition: background-color 0.3s ease, transform 0.3s ease; /* 背景颜色和缩放的过渡效果 */ z-index: 1001; /* 按钮层级 */ } #return-btn:hover { background-color: #e0e4e8; /* 默认亮色模式悬停背景颜色 */ transform: scale(1.05); /* 悬停时放大 5% */ } /* 暗色模式 */ body.dark-mode #return-btn { background-color: #4a4f55; /* 更浅的暗色模式背景颜色 */ color: #e0e0e0; /* 暗色模式文字颜色 */ border: 1px solid #555555; /* 更浅的暗色模式边框颜色 */ } body.dark-mode #return-btn:hover { background-color: #3b4046; /* 更浅的暗色模式悬停背景颜色 */ }