/* =========================================
   1. 全局基础样式
   ========================================= */
body {
    font-family: 'Rubik', sans-serif;
    background-color: #050505;
    color: #ffffff;
    overflow-x: hidden;
}

/* 滚动条美化 */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #1a1a1a; }
::-webkit-scrollbar-thumb { background: #ea580c; border-radius: 4px; }

/* =========================================
   2. 丢失的动画定义 (找回这一部分！)
   ========================================= */
@keyframes glow-pulse {
    0%, 100% { filter: drop-shadow(0 0 20px rgba(249, 115, 22, 0.4)); transform: scale(1); }
    50% { filter: drop-shadow(0 0 50px rgba(249, 115, 22, 0.7)); transform: scale(1.02); }
}

@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-20px); }
    100% { transform: translateY(0px); }
}

/* 这个类名现在加在图片外层的 DIV 上 */
.bbox-animate-glow-float {
    animation: float 6s ease-in-out infinite, glow-pulse 3s ease-in-out infinite;
}

/* =========================================
   3. APP 模式深度修正 (Collection Page)
   ========================================= */
.collection-controls {
    background-color: #121212 !important;
    border: 1px solid #27272a !important;
    border-radius: 8px !important;
    padding: 15px 20px !important;
    margin-bottom: 30px !important;
    display: flex; flex-wrap: wrap; gap: 20px; align-items: center;
    box-shadow: 0 4px 20px rgba(0,0,0,0.5);
}
.collection-controls label {
    color: #71717a !important; font-weight: 700; text-transform: uppercase;
    font-size: 0.75rem; letter-spacing: 0.05em; margin-right: 8px;
}
.bcore-pills-container {
    display: inline-flex; background: #000; padding: 4px;
    border-radius: 6px; border: 1px solid #27272a;
}
.bcore-pill-btn {
    background-color: transparent !important; color: #a1a1aa !important;
    border: none !important; border-radius: 4px !important;
    padding: 6px 16px !important; font-size: 0.85rem !important;
    font-weight: 600 !important; transition: all 0.2s ease;
}
.bcore-pill-btn.active {
    background-color: #ea580c !important; color: #fff !important;
    box-shadow: 0 2px 10px rgba(234, 88, 12, 0.3);
}
.collection-controls select {
    background-color: #000 !important; color: #e4e4e7 !important;
    border: 1px solid #3f3f46 !important; padding: 6px 12px !important;
    border-radius: 4px !important; font-size: 0.9rem; outline: none;
}

/* 网格布局 */
.collection-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important; 
    gap: 20px !important;
}

/* 卡片主体 */
.collection-card {
    background-color: #18181b !important; border: 1px solid #27272a !important;
    border-radius: 12px !important; overflow: hidden; position: relative;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); display: flex; flex-direction: column;
}
.collection-card:hover {
    border-color: #ea580c !important; transform: translateY(-6px);
    box-shadow: 0 10px 30px -10px rgba(234, 88, 12, 0.3);
}
.collection-card .card-image {
    background-color: #000 !important; padding: 15px; display: flex;
    align-items: center; justify-content: center; aspect-ratio: 1 / 1;
}
.collection-card .card-image img {
    width: 100%; height: 100%; object-fit: contain; transition: transform 0.5s ease;
}

.collection-card:hover .card-image img { transform: scale(1.05); }

.collection-card .card-body {
    padding: 15px !important; text-align: center; flex-grow: 1;
    background: linear-gradient(to bottom, #18181b, #121212);
}
.collection-card .card-title {
    color: #fff !important; font-size: 1rem !important; font-weight: 700 !important;
    margin-bottom: 8px !important; line-height: 1.4 !important;
}
.collection-card .card-footer {
    padding: 12px 15px 15px !important; background-color: #121212;
}
/* 立即开启按钮 */
.collection-card button.open-blind-box-btn {
    background: linear-gradient(135deg, #ea580c, #c2410c) !important;
    color: #fff !important; border: none !important; border-radius: 6px !important;
    padding: 10px 0 !important; width: 100% !important; font-weight: 800 !important;
    text-transform: uppercase !important; box-shadow: 0 4px 6px rgba(0,0,0,0.2);
}
.collection-card.opened { border-top: 3px solid var(--rarity-color, #71717a) !important; }
.collection-card.opened .card-image { opacity: 0.8; }

/* =========================================
   4. 按钮终极美化 (图层覆盖法 - 完美复原)
   ========================================= */

/* 1. 底层：橙色 ADD (永远保持这个样子) */
.collection-card .ajax_add_to_cart {
    width: auto !important;
    height: 32px !important;
    min-width: 70px !important;
    margin-left: auto;
    
    /* 默认外观 */
    background: #ea580c !important; /* 橙色 */
    border: 1px solid #ea580c !important;
    color: #fff !important;
    border-radius: 4px !important;
    
    /* 布局 */
    display: flex !important;
    align-items: center;
    justify-content: center;
    font-size: 0 !important; /* 隐藏原生文字 */
    padding: 0 12px !important;
    
    /* 必须设置相对定位，为了让顶层贴纸能对齐 */
    position: relative !important; 
    overflow: hidden !important; /* 贴纸不能溢出 */
    
    cursor: pointer !important;
    transition: transform 0.1s;
}

/* 底层文字：ADD */
.collection-card .ajax_add_to_cart::before {
    content: 'ADD';
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 1px;
    color: #fff !important;
}

/* 2. 加载层：灰色 ... (当点击时) */
.collection-card .ajax_add_to_cart.loading {
    background: #52525b !important; /* 灰色 */
    border-color: #52525b !important;
}
.collection-card .ajax_add_to_cart.loading::before {
    content: '...' !important;
    font-size: 18px !important;
    line-height: 10px;
}

/* =========================================
   ★★★ 顶层贴纸：绿色 ✔ (成功时出现) ★★★
   ========================================= */

.collection-card .ajax_add_to_cart.added::after {
    content: '✔'; /* 显示对号 */
    
    /* 绝对定位：强行盖在按钮最上面 */
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    
    /* 关键点：自带绿色背景，挡住底下的橙色和ADD */
    background-color: #10b981 !important; 
    color: #fff !important;
    
    /* 居中对齐 */
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px !important;
    font-weight: bold;
    z-index: 10; /* 确保层级最高 */
    
    /* 动画：存在 1.5秒，然后消失 */
    animation: success-mask 1.5s ease-in-out forwards;
    
    /* 关键点：让鼠标点击能穿透这张贴纸，点到下面的按钮 */
    /* 这样你就可以无限连点了！ */
    pointer-events: none !important; 
}

/* 允许底下的按钮在 .added 状态下继续响应点击 */
.collection-card .ajax_add_to_cart.added {
    pointer-events: auto !important;
}

/* 定义贴纸消失的动画 */
@keyframes success-mask {
    0%   { opacity: 1; } /* 刚开始完全不透明 (绿色) */
    50%  { opacity: 1; } /* 保持绿色一会 */
    100% { opacity: 0; } /* 慢慢变透明，露出底下的橙色 ADD */
}

/* 3. 清理干扰元素 */
.collection-card a.added_to_cart.wc-forward, 
.collection-card .wc-forward,
.collection-card .ajax_add_to_cart i,
.collection-card .ajax_add_to_cart svg {
    display: none !important;
}

/* =========================================
   14. 详情页清理 (隐藏 View Cart 链接)
   ========================================= */

/* 既然不想要，就彻底隐藏，保持界面干净 */
.bcore-custom-add-btn ~ a, 
.bcore-custom-add-btn ~ .wc-forward {
    display: none !important;
}