/* 按钮文字可见性增强 - 全站按钮优化 */

/* ======================== 主页Hero按钮优化 ======================== */

/* 立即阅读按钮（主按钮） */
.hero-btn-primary {
    background: linear-gradient(135deg, #F57F17, #E65100) !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    font-size: 1.15rem !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
    border: none !important;
    box-shadow: 0 8px 25px rgba(245, 127, 23, 0.5) !important;
}

.hero-btn-primary:hover {
    background: linear-gradient(135deg, #E65100, #D84315) !important;
    color: #FFFFFF !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 12px 35px rgba(230, 81, 0, 0.6) !important;
}

/* 开始创作按钮（次要按钮） */
.hero-btn-secondary {
    background: #FFFFFF !important;
    color: #F57F17 !important;
    font-weight: 700 !important;
    font-size: 1.15rem !important;
    border: 3px solid #F57F17 !important;
    text-shadow: none !important;
}

.hero-btn-secondary:hover {
    background: linear-gradient(135deg, #F57F17, #E65100) !important;
    color: #FFFFFF !important;
    border-color: #E65100 !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
}

/* 按钮图标优化 */
.hero-btn i {
    font-size: 1.2rem !important;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2));
}

/* ======================== 创作者中心页面按钮优化 ======================== */

/* 覆盖旧的红色按钮样式为黄色系 */
.red-btn {
    background: linear-gradient(135deg, #F57F17, #E65100) !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
    padding: 14px 32px !important;
    border-radius: 50px !important;
    border: none !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
    box-shadow: 0 6px 20px rgba(245, 127, 23, 0.4) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.red-btn:hover {
    background: linear-gradient(135deg, #E65100, #D84315) !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 30px rgba(230, 81, 0, 0.5) !important;
}

/* 立即登录按钮 */
.login-btn,
.auth-required-btn,
button[onclick*="login"],
a[href*="login"].btn,
.btn-login {
    background: linear-gradient(135deg, #F57F17, #E65100) !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
    padding: 14px 32px !important;
    border-radius: 50px !important;
    border: none !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
    box-shadow: 0 6px 20px rgba(245, 127, 23, 0.4) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.login-btn:hover,
.auth-required-btn:hover,
button[onclick*="login"]:hover,
a[href*="login"].btn:hover,
.btn-login:hover {
    background: linear-gradient(135deg, #E65100, #D84315) !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 30px rgba(230, 81, 0, 0.5) !important;
}

/* ======================== 创作者中心导航栏优化 ======================== */

/* 创作者中心特殊导航栏 */
.author-header .nav a,
.author-header .logo-text,
body.author-page .header .nav a,
body.author-page .header .logo-text {
    color: #3E2723 !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.4) !important;
}

.author-header .nav a:hover,
body.author-page .header .nav a:hover {
    background: rgba(62, 39, 35, 0.15) !important;
    color: #1A1A1A !important;
}

/* ======================== 通用按钮优化 ======================== */

/* 主要按钮（橙黄色背景） */
.btn-primary,
.primary-btn,
.submit-btn,
button[type="submit"]:not(.btn-secondary) {
    background: linear-gradient(135deg, #F57F17, #E65100) !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25) !important;
    border: none !important;
}

.btn-primary:hover,
.primary-btn:hover,
.submit-btn:hover,
button[type="submit"]:not(.btn-secondary):hover {
    background: linear-gradient(135deg, #E65100, #D84315) !important;
    color: #FFFFFF !important;
    box-shadow: 0 6px 20px rgba(230, 81, 0, 0.4) !important;
}

/* 次要按钮（白色背景） */
.btn-secondary,
.secondary-btn,
.cancel-btn {
    background: #FFFFFF !important;
    color: #F57F17 !important;
    font-weight: 600 !important;
    border: 2px solid #F57F17 !important;
    text-shadow: none !important;
}

.btn-secondary:hover,
.secondary-btn:hover,
.cancel-btn:hover {
    background: #F57F17 !important;
    color: #FFFFFF !important;
    border-color: #E65100 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

/* ======================== 警告和危险按钮 ======================== */

/* 警告按钮 */
.btn-warning {
    background: linear-gradient(135deg, #FFCA28, #FBC02D) !important;
    color: #3E2723 !important;
    font-weight: 700 !important;
    border: none !important;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) !important;
}

/* 危险按钮 */
.btn-danger,
.delete-btn,
.remove-btn {
    background: linear-gradient(135deg, #F57F17, #E65100) !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
}

/* ======================== 操作按钮组 ======================== */

/* 编辑按钮 */
.edit-btn,
.btn-edit,
button[onclick*="edit"] {
    background: #FFFFFF !important;
    color: #F57F17 !important;
    font-weight: 600 !important;
    border: 2px solid #F57F17 !important;
}

.edit-btn:hover,
.btn-edit:hover,
button[onclick*="edit"]:hover {
    background: #F57F17 !important;
    color: #FFFFFF !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

/* ======================== 分类按钮优化 ======================== */

/* 主页分类导航按钮 */
.category-item {
    font-weight: 600 !important;
}

.category-item:hover {
    background: linear-gradient(135deg, #F57F17, #FBC02D) !important;
    color: #FFFFFF !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

.category-item:hover span {
    color: #FFFFFF !important;
    font-weight: 700 !important;
}

/* ======================== 表单提交按钮 ======================== */

/* 表单提交按钮 */
form button[type="submit"],
form input[type="submit"],
.form-submit-btn {
    background: linear-gradient(135deg, #F57F17, #E65100) !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    font-size: 1.05rem !important;
    padding: 12px 28px !important;
    border: none !important;
    border-radius: 8px !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25) !important;
    cursor: pointer !important;
}

form button[type="submit"]:hover,
form input[type="submit"]:hover,
.form-submit-btn:hover {
    background: linear-gradient(135deg, #E65100, #D84315) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 20px rgba(230, 81, 0, 0.4) !important;
}

/* ======================== 链接按钮优化 ======================== */

/* 链接样式的按钮 */
a.btn,
a.button,
.btn-link {
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}

/* ======================== 小按钮优化 ======================== */

/* 小尺寸按钮 */
.btn-sm,
.btn-small,
button.small {
    font-size: 0.9rem !important;
    padding: 8px 16px !important;
    font-weight: 600 !important;
}

/* 大尺寸按钮 */
.btn-lg,
.btn-large,
button.large {
    font-size: 1.2rem !important;
    padding: 16px 40px !important;
    font-weight: 700 !important;
}

/* ======================== 禁用状态 ======================== */

/* 禁用按钮 */
button:disabled,
.btn:disabled,
.btn.disabled {
    background: #CCCCCC !important;
    color: #666666 !important;
    cursor: not-allowed !important;
    opacity: 0.6 !important;
    text-shadow: none !important;
}

/* ======================== 加载状态 ======================== */

/* 加载中的按钮 */
.btn-loading,
button.loading {
    position: relative;
    color: transparent !important;
    text-shadow: none !important;
}

.btn-loading::after,
button.loading::after {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    top: 50%;
    left: 50%;
    margin-left: -8px;
    margin-top: -8px;
    border: 2px solid #ffffff;
    border-radius: 50%;
    border-top-color: transparent;
    animation: button-spin 0.6s linear infinite;
}

@keyframes button-spin {
    to { transform: rotate(360deg); }
}

/* ======================== 响应式优化 ======================== */

@media (max-width: 768px) {
    /* 移动端按钮优化 */
    .hero-btn {
        font-size: 1rem !important;
        padding: 12px 24px !important;
    }
    
    .hero-btn-primary,
    .hero-btn-secondary {
        font-weight: 700 !important;
    }
    
    .login-btn,
    .auth-required-btn {
        font-size: 1rem !important;
        padding: 12px 24px !important;
    }
}

@media (max-width: 576px) {
    /* 小屏幕按钮优化 */
    .hero-btn {
        font-size: 0.95rem !important;
        padding: 10px 20px !important;
    }
    
    .hero-btn i {
        font-size: 1rem !important;
    }
}

/* ======================== 无障碍优化 ======================== */

/* 焦点状态 */
button:focus,
.btn:focus,
a.btn:focus {
    outline: 3px solid #F57F17 !important;
    outline-offset: 2px;
}

/* 高对比度模式 */
@media (prefers-contrast: high) {
    .hero-btn-primary,
    .btn-primary,
    .login-btn {
        background: #F57F17 !important;
        color: #FFFFFF !important;
        border: 3px solid #000000 !important;
        font-weight: 900 !important;
    }
    
    .hero-btn-secondary,
    .btn-secondary {
        background: #FFFFFF !important;
        color: #000000 !important;
        border: 3px solid #000000 !important;
        font-weight: 900 !important;
    }
}

/* ======================== 打印样式 ======================== */

@media print {
    .hero-btn,
    .btn,
    button {
        background: #FFFFFF !important;
        color: #000000 !important;
        border: 2px solid #000000 !important;
        text-shadow: none !important;
        box-shadow: none !important;
    }
}

/* ======================== 性能优化 ======================== */

/* 硬件加速 */
.hero-btn,
.btn,
button,
.login-btn {
    will-change: transform, box-shadow;
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* ======================== 特殊场景优化 ======================== */

/* 模态框中的按钮 */
.modal button,
.modal .btn {
    min-width: 100px;
}

/* 工具栏中的按钮 */
.toolbar button,
.toolbar .btn {
    font-size: 0.9rem !important;
}

/* 卡片中的按钮 */
.card button,
.card .btn {
    width: 100%;
}

/* ======================== 结束 ======================== */

