/* 模态框样式 */ .modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.4); } .modal-content { background-color: #fefefe; margin: 15% auto; padding: 20px; border: 1px solid #888; width: 80%; max-width: 400px; border-radius: 10px; text-align: center; } /* 按钮样式 */ .modal-content button { margin: 10px 0; padding: 10px 20px; background-color: #007BFF; border: none; border-radius: 4px; color: white; cursor: pointer; } .modal-content button:hover { background-color: #0056b3; } .modal-content button:active { background-color: #003f7f; } /* 夜间模式 */ .dark .modal-content { background-color: #333; color: #fff; } .dark .modal-content button { background-color: #444; color: #fff; } .dark .modal-content button:hover { background-color: #555; } .dark .modal-content button:active { background-color: #666; } .modal-content input { width: calc(100% - 40px); padding: 10px; margin: 10px 0; border-radius: 4px; border: 1px solid #ccc; } .dark .modal-content input { background-color: #555; color: #fff; border: 1px solid #666; } /* 验证按钮普通模式样式 */ #first-verify-btn { display: block; margin: 0 auto; padding: 10px 20px; background-color: #007BFF; color: #fff; border: none; border-radius: 4px; cursor: pointer; text-align: center; } #first-verify-btn:hover { background-color: #0056b3; } #first-verify-btn:active { background-color: #003f7f; } /* 夜间模式样式 */ .dark #first-verify-btn { background-color: #444; color: #fff; } .dark #first-verify-btn:hover { background-color: #555; } .dark #first-verify-btn:active { background-color: #333; }