/* 全局按钮样式 */
button, .btn {
    background-color: #007bff; /* 默认背景色：蓝色 */
    color: #ffffff; /* 默认文字颜色：白色 */
    font-size: 14px; /* 文字大小 */
    padding: 10px 20px; /* 内边距 */
    border: none; /* 去掉默认边框 */
    border-radius: 5px; /* 圆角边框 */
    cursor: pointer; /* 鼠标悬停时显示手形 */
    transition: background-color 0.3s, transform 0.2s, box-shadow 0.2s; /* 平滑过渡动画 */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* 默认阴影效果 */
}

/* 悬浮效果 */
button:hover, .btn:hover {
    background-color: #0056b3; /* 悬浮时背景色：深蓝色 */
    transform: translateY(-2px); /* 按钮微微上移 */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* 阴影增强 */
}

/* 点击效果 */
button:active, .btn:active {
    background-color: #004494; /* 点击时背景色：更深蓝色 */
    transform: translateY(1px); /* 按钮微微下移 */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* 阴影减弱 */
}

/* 禁用按钮样式 */
button:disabled, .btn:disabled {
    background-color: #d6d6d6; /* 禁用背景色：灰色 */
    color: #999999; /* 禁用文字颜色：灰色 */
    cursor: not-allowed; /* 禁用时显示不可点击的指针 */
    box-shadow: none; /* 移除阴影 */
}

/* 自定义按钮类的特殊效果（如果需要区分不同按钮类型） */

/* 主要按钮 */
.btn-primary {
    background-color: #007bff; /* 主色调 */
    color: white;
}

.btn-primary:hover {
    background-color: #0056b3;
}

.btn-primary:active {
    background-color: #004494;
}

/* 成功按钮 */
.btn-success {
    background-color: #28a745; /* 绿色背景 */
    color: white;
}

.btn-success:hover {
    background-color: #218838;
}

.btn-success:active {
    background-color: #1e7e34;
}

/* 危险按钮 */
.btn-danger {
    background-color: #dc3545; /* 红色背景 */
    color: white;
}

.btn-danger:hover {
    background-color: #c82333;
}

.btn-danger:active {
    background-color: #bd2130;
}