/* ==========================================
   统一按钮设计系统（AgentDNA 风格）
   主按钮：白底黑字 pill
   次按钮：ghost 描边 pill
   选中/Tab：绿色强调，禁止蓝紫渐变
   ========================================== */
:root {
    --btn-radius-pill: 999px;
    --btn-radius-md: 12px;
    --btn-radius-icon: 10px;
    --btn-primary-bg: #ededed;
    --btn-primary-fg: #000000;
    --btn-primary-hover-bg: #ffffff;
    --btn-secondary-bg: rgba(255, 255, 255, 0.04);
    --btn-secondary-border: rgba(255, 255, 255, 0.08);
    --btn-secondary-fg: #ededed;
    --btn-secondary-hover-bg: rgba(255, 255, 255, 0.08);
    --btn-secondary-hover-border: rgba(255, 255, 255, 0.16);
    --btn-accent-bg: rgba(74, 222, 128, 0.12);
    --btn-accent-border: rgba(74, 222, 128, 0.35);
    --btn-accent-fg: #4ade80;
    --btn-accent-hover-bg: rgba(74, 222, 128, 0.18);
    --btn-danger-bg: rgba(248, 113, 113, 0.12);
    --btn-danger-border: rgba(248, 113, 113, 0.35);
    --btn-danger-fg: #f87171;
    --btn-danger-hover-bg: rgba(248, 113, 113, 0.2);
    --btn-focus-ring: 0 0 0 3px rgba(74, 222, 128, 0.15), 0 0 0 1px rgba(74, 222, 128, 0.45);
}

/* ---------- 主操作按钮（白 pill） ---------- */
.unified-right .quick-action-btn,
.quick-action-btn,
.login-btn-modal,
.register-btn-modal,
.quick-create-buttons .create-btn-quick,
.create-btn-panel,
.create-btn-quick,
.generate-btn-panel,
.voice-generate-btn,
.copy-link-btn,
.create-same-btn,
.feature-card-btn,
.confirm-btn,
.clone-buttons .clone-submit-btn,
.motion-submit-btn,
.ai-novel-submit-btn,
.voice-clone-submit-btn,
.anime-create-panel .create-btn-quick,
.mint-start-btn,
.sidebar .login-btn,
.login-btn,
.use-btn,
.create-video-btn,
.panel-buttons .create-btn-panel,
.text-panel-buttons .generate-btn-panel,
.create-video-buttons #generateAudioBtn,
.create-video-buttons #confirmCreateVideo,
.payment-modal .pay-confirm-btn,
.payment-modal .amount-card.selected,
.payment-modal .method-card.selected {
    background: var(--btn-primary-bg) !important;
    color: var(--btn-primary-fg) !important;
    border: none !important;
    border-radius: var(--btn-radius-pill) !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    background-image: none !important;
    transform: none;
}

.unified-right .quick-action-btn:hover,
.quick-action-btn:hover,
.login-btn-modal:hover,
.register-btn-modal:hover,
.quick-create-buttons .create-btn-quick:hover,
.create-btn-panel:hover,
.generate-btn-panel:hover:not(:disabled),
.voice-generate-btn:hover,
.copy-link-btn:hover,
.create-same-btn:hover,
.feature-card-btn:hover,
.confirm-btn:hover,
.clone-buttons .clone-submit-btn:hover:not(:disabled),
.motion-submit-btn:hover:not(:disabled),
.ai-novel-submit-btn:hover:not(:disabled),
.voice-clone-submit-btn:hover:not(:disabled),
.anime-create-panel .create-btn-quick:hover:not(:disabled),
.mint-start-btn:hover,
.sidebar .login-btn:hover,
.login-btn:hover,
.use-btn:hover,
.create-video-btn:hover,
.panel-buttons .create-btn-panel:hover,
.text-panel-buttons .generate-btn-panel:hover:not(:disabled),
.create-video-buttons #generateAudioBtn:hover,
.create-video-buttons #confirmCreateVideo:hover {
    background: var(--btn-primary-hover-bg) !important;
    color: var(--btn-primary-fg) !important;
    box-shadow: none !important;
    transform: none !important;
}

.generate-btn-panel:disabled,
.create-btn-panel.loading,
.create-btn-quick:disabled,
.motion-submit-btn:disabled,
.ai-novel-submit-btn:disabled,
.voice-clone-submit-btn:disabled,
.clone-buttons .clone-submit-btn:disabled,
.anime-create-panel .create-btn-quick:disabled {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

/* ---------- 次操作按钮（ghost pill） ---------- */
.unified-right .login-btn-header,
.cancel-btn-modal,
.cancel-btn-panel,
.cancel-btn,
.clone-buttons .clone-cancel-btn,
.sidebar .logout-btn,
.logout-btn,
.transcode-btn:not(.active),
.voice-my-voices-btn,
.voice-card-btn,
.voice-clone-btn-play {
    background: var(--btn-secondary-bg) !important;
    color: var(--btn-secondary-fg) !important;
    border: 1px solid var(--btn-secondary-border) !important;
    border-radius: var(--btn-radius-pill) !important;
    box-shadow: none !important;
    background-image: none !important;
}

.unified-right .login-btn-header:hover,
.cancel-btn-modal:hover,
.cancel-btn-panel:hover,
.cancel-btn:hover,
.clone-buttons .clone-cancel-btn:hover,
.sidebar .logout-btn:hover,
.logout-btn:hover,
.transcode-btn:not(.active):hover,
.voice-my-voices-btn:hover,
.voice-card-btn:hover,
.voice-clone-btn-play:hover {
    background: var(--btn-secondary-hover-bg) !important;
    border-color: var(--btn-secondary-hover-border) !important;
    color: var(--btn-primary-hover-bg) !important;
    box-shadow: none !important;
    transform: none !important;
}

/* ---------- 强调次按钮（绿色 ghost pill） ---------- */
.signin-btn:not(.disabled) {
    background: var(--btn-accent-bg) !important;
    color: var(--btn-accent-fg) !important;
    border: 1px solid var(--btn-accent-border) !important;
    border-radius: var(--btn-radius-pill) !important;
    box-shadow: none !important;
    background-image: none !important;
}

.signin-btn:not(.disabled):hover {
    background: var(--btn-accent-hover-bg) !important;
    color: var(--btn-accent-fg) !important;
    transform: none !important;
}

.signin-btn.disabled {
    opacity: 0.45 !important;
    border-radius: var(--btn-radius-pill) !important;
}

/* ---------- 危险按钮 ---------- */
.delete-btn,
.confirm-buttons .delete-btn,
.voice-clone-btn-delete,
.work-action-btn[data-action="delete"],
.anime-action-btn.delete,
.menu-item.delete {
    background: var(--btn-danger-bg) !important;
    color: var(--btn-danger-fg) !important;
    border: 1px solid var(--btn-danger-border) !important;
    border-radius: var(--btn-radius-pill) !important;
    box-shadow: none !important;
    background-image: none !important;
}

.delete-btn:hover,
.confirm-buttons .delete-btn:hover,
.voice-clone-btn-delete:hover,
.work-action-btn[data-action="delete"]:hover {
    background: var(--btn-danger-hover-bg) !important;
    color: var(--btn-danger-fg) !important;
    transform: none !important;
}

/* ---------- Tab / 切换按钮 ---------- */
.quick-tab-btn,
.quick-tab,
.voice-tab,
.ratio-option,
.transcode-btn,
.toolbar-btn,
.video-create-content .transcode-btn,
.script-tab {
    border-radius: var(--btn-radius-md) !important;
    background: var(--btn-secondary-bg) !important;
    color: var(--btn-secondary-fg) !important;
    border: 1px solid var(--btn-secondary-border) !important;
    box-shadow: none !important;
    background-image: none !important;
}

.script-tab:hover,
.quick-tab-btn:hover,
.voice-tab:hover,
.ratio-option:hover,
.transcode-btn:hover,
.toolbar-btn:hover {
    background: var(--btn-secondary-hover-bg) !important;
    border-color: var(--btn-secondary-hover-border) !important;
    color: var(--btn-secondary-fg) !important;
    transform: none !important;
}

.quick-tab-btn.active,
.quick-tab.active,
.voice-tab.active,
.script-tab.active,
.ratio-option.selected,
.transcode-btn.active,
.toolbar-btn.active,
.anime-create-panel .quick-tab-btn.active {
    background: var(--btn-accent-bg) !important;
    border-color: var(--btn-accent-border) !important;
    color: var(--btn-accent-fg) !important;
    box-shadow: none !important;
    background-image: none !important;
}

.quick-tab-btn.active i,
.quick-tab.active i,
.anime-create-panel .quick-tab-btn.active > i {
    color: var(--btn-accent-fg) !important;
}

/* ---------- 分页按钮 ---------- */
.pagination-btn,
.pagination-btn-mini,
.voice-clone-pagination-btn {
    border-radius: var(--btn-radius-md) !important;
    background: var(--btn-secondary-bg) !important;
    color: var(--btn-secondary-fg) !important;
    border: 1px solid var(--btn-secondary-border) !important;
    box-shadow: none !important;
    background-image: none !important;
}

.pagination-btn:hover:not(:disabled),
.pagination-btn-mini:hover:not(:disabled),
.voice-clone-pagination-btn:hover:not(:disabled) {
    background: var(--btn-secondary-hover-bg) !important;
    border-color: var(--btn-secondary-hover-border) !important;
    color: var(--btn-primary-hover-bg) !important;
    transform: none !important;
}

.pagination-btn:disabled,
.pagination-btn-mini:disabled,
.voice-clone-pagination-btn:disabled {
    opacity: 0.35 !important;
}

/* ---------- 语言切换 ---------- */
.lang-switch-btn {
    border-radius: var(--btn-radius-pill) !important;
}

.lang-switch-btn.active {
    background: var(--btn-accent-bg) !important;
    color: var(--btn-accent-fg) !important;
    box-shadow: none !important;
    background-image: none !important;
}

/* ---------- 图标 / 关闭 / 播放类小按钮 ---------- */
.close-panel-btn,
.close-recharge-btn,
.close-profile-btn,
.close-voice-panel-btn,
.mint-close-btn,
.modal-close-btn,
.create-video-header .modal-close-btn,
.remove-video-btn,
.quick-create-content .remove-video-btn,
.anime-create-panel .remove-video-btn,
.voice-clone-remove-btn,
.showcase-nav-btns .slider-btn,
.social-login-icon-btn,
.work-play-btn,
.work-action-btn,
.anime-action-btn,
.voice-play-btn,
.voice-play-btn-small,
.audio-play-btn,
.audio-download-btn,
.play-audio-btn,
.pause-btn,
.preview-btn,
.more-menu-btn,
.avatar-nav-btn,
.voice-select-btn,
.reset-btn,
.voice-select-dropdown .voice-select-btn,
.payment-modal .modal-close {
    border-radius: var(--btn-radius-icon) !important;
    background: var(--btn-secondary-bg) !important;
    color: var(--btn-secondary-fg) !important;
    border: 1px solid var(--btn-secondary-border) !important;
    box-shadow: none !important;
    background-image: none !important;
}

.close-panel-btn:hover,
.close-recharge-btn:hover,
.close-profile-btn:hover,
.close-voice-panel-btn:hover,
.mint-close-btn:hover,
.modal-close-btn:hover,
.create-video-header .modal-close-btn:hover,
.remove-video-btn:hover,
.quick-create-content .remove-video-btn:hover,
.anime-create-panel .remove-video-btn:hover,
.voice-clone-remove-btn:hover,
.showcase-nav-btns .slider-btn:hover:not(:disabled),
.social-login-icon-btn:hover:not(:disabled),
.work-play-btn:hover,
.work-action-btn:hover,
.anime-action-btn:hover,
.voice-play-btn:hover,
.voice-play-btn-small:hover,
.audio-play-btn:hover,
.audio-download-btn:hover,
.play-audio-btn:hover,
.pause-btn:hover,
.preview-btn:hover,
.more-menu-btn:hover,
.avatar-nav-btn:hover,
.voice-select-btn:hover,
.reset-btn:hover,
.voice-select-dropdown .voice-select-btn:hover,
.payment-modal .modal-close:hover {
    background: var(--btn-secondary-hover-bg) !important;
    border-color: var(--btn-secondary-hover-border) !important;
    color: var(--btn-primary-hover-bg) !important;
    transform: none !important;
    box-shadow: none !important;
}

.audio-play-btn.playing,
.play-audio-btn.playing,
.voice-select-btn.active,
.toolbar-btn.active {
    background: var(--btn-accent-bg) !important;
    border-color: var(--btn-accent-border) !important;
    color: var(--btn-accent-fg) !important;
}

.showcase-nav-btns .slider-btn:disabled,
.social-login-icon-btn:disabled {
    opacity: 0.35 !important;
}

/* 社交登录保留品牌色，仅统一圆角 */
.social-login-icon-btn--google,
.social-login-icon-btn--wechat,
.social-login-icon-btn--alipay {
    border-radius: var(--btn-radius-md) !important;
}

/* ---------- 分享广场「制作同款」 ---------- */
.create-same-btn {
    min-height: 36px;
    padding: 8px 16px !important;
}

/* ---------- 焦点态 ---------- */
button:focus-visible,
.lang-switch-btn:focus-visible,
.unified-right .login-btn-header:focus-visible,
.unified-right .quick-action-btn:focus-visible,
.quick-create-buttons .create-btn-quick:focus-visible,
.copy-link-btn:focus-visible,
.pagination-btn:focus-visible,
.create-same-btn:focus-visible {
    outline: none !important;
    box-shadow: var(--btn-focus-ring) !important;
}

/* ---------- 清除 index.css 末尾 polish 层的蓝紫渐变残留 ---------- */
.unified-right .quick-action-btn,
.quick-create-buttons .create-btn-quick,
.copy-link-btn,
.lang-switch-btn.active,
.quick-tab-btn.active,
.signin-btn:not(.disabled) {
    background-image: none !important;
}

.header-user-points {
    border-radius: var(--btn-radius-pill) !important;
    background: var(--btn-accent-bg) !important;
    border: 1px solid var(--btn-accent-border) !important;
    color: var(--btn-accent-fg) !important;
    box-shadow: none !important;
    background-image: none !important;
}

/* ---------- 支付弹窗 ---------- */
.payment-modal {
    border: 1px solid var(--btn-secondary-border) !important;
    border-radius: 22px !important;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.7) !important;
}

.payment-left {
    background: linear-gradient(165deg, rgba(15, 15, 15, 0.98), rgba(5, 5, 5, 0.96)) !important;
    border-right: 1px solid var(--btn-secondary-border);
}

.amount-card,
.method-card {
    border-radius: var(--btn-radius-md) !important;
}

.amount-card.selected,
.method-card.selected {
    border-color: var(--btn-accent-border) !important;
    background: var(--btn-accent-bg) !important;
    color: var(--btn-accent-fg) !important;
}

.amount-card:hover,
.method-card:hover {
    border-color: var(--btn-accent-border) !important;
}

/* ---------- voice copy 成功态 ---------- */
.voice-copy-btn.copied {
    background: var(--btn-accent-bg) !important;
    border-color: var(--btn-accent-border) !important;
    color: var(--btn-accent-fg) !important;
    border-radius: var(--btn-radius-pill) !important;
}

.work-action-btn[data-action="share"].work-action-btn--shared {
    background: var(--btn-accent-bg) !important;
    border-color: var(--btn-accent-border) !important;
    color: var(--btn-accent-fg) !important;
}

.work-action-btn[data-action="share"].work-action-btn--shared:hover {
    background: var(--btn-accent-bg) !important;
    border-color: var(--btn-accent-border) !important;
    color: var(--btn-accent-fg) !important;
}

.work-action-btn[data-action="mint"] {
    background: var(--btn-secondary-bg) !important;
    border: 1px solid var(--btn-secondary-border) !important;
    color: var(--btn-secondary-fg) !important;
    border-radius: var(--btn-radius-icon) !important;
}

.work-action-btn[data-action="mint"]:hover {
    background: var(--btn-accent-bg) !important;
    border-color: var(--btn-accent-border) !important;
    color: var(--btn-accent-fg) !important;
}

.work-action-btn[data-action="mint"]:hover .work-action-icon-nft-svg {
    color: var(--btn-accent-fg);
}

.banner-item .banner-icon i,
.banner-icon i {
    color: var(--btn-accent-fg) !important;
}

.share-square-title i,
.showcase-section-title i,
.share-square-empty i {
    color: var(--btn-accent-fg) !important;
}

/* 创建数字人页 — 数字人卡片：禁用悬停蓝色/高亮边框（最高优先级覆盖） */
.my-avatars-section .video-card,
.my-avatars-section .video-card:hover,
.my-avatars-section .video-card:focus,
.my-avatars-section .video-card:focus-within {
    transform: none !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 14px 26px rgba(0, 0, 0, 0.35) !important;
    outline: none !important;
}

.my-avatars-section .video-card video:focus,
.my-avatars-section .video-card .video-thumbnail:focus {
    outline: none !important;
}

.right-section.my-avatars-section:hover {
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3) !important;
}

/* 创建数字人页 — 我的作品：禁用悬停蓝色/高亮边框 */
.my-works-section .work-card-mini,
.my-works-section .work-card-mini:hover,
.my-works-section .work-card-mini:focus,
.my-works-section .work-card-mini:focus-within {
    transform: none !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 14px 26px rgba(0, 0, 0, 0.35) !important;
    outline: none !important;
}

.my-works-section .work-card-mini:hover .work-play-overlay-mini {
    opacity: 0 !important;
}

.my-works-section .work-card-mini video:focus {
    outline: none !important;
}

.right-section.my-works-section:hover {
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3) !important;
}