/**
 * 自定义样式 - 首页加载优化
 */

/* 隐藏加载更多按钮和容器 */
.load-more-container,
#load-more-btn,
.load-more-button {
    display: none !important;
}

/* 确保底部有足够的间距用于滚动触发 */
.home-grid-container {
    padding-bottom: 50px;
}

/* 保留加载指示器的显示 */
#loading-indicator {
    position: fixed !important;
    bottom: 80px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: rgba(0,0,0,0.7) !important;
    color: white !important;
    padding: 8px 16px !important;
    border-radius: 20px !important;
    z-index: 999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 1 !important;
    transition: opacity 0.3s ease !important;
}

#loading-indicator.hidden {
    opacity: 0 !important;
}

#loading-indicator .spinner {
    width: 16px !important;
    height: 16px !important;
    border: 2px solid rgba(255,255,255,0.3) !important;
    border-radius: 50% !important;
    border-top-color: white !important;
    animation: spin 1s linear infinite !important;
    margin-right: 8px !important;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* 隐藏加载成功和失败的提示消息 */
.load-success-message,
.load-error-message,
.ajax-success-message,
.ajax-error-message {
    display: none !important;
}

/* 隐藏与加载相关的所有提示和通知 */
.loading-notification,
.post-load-status,
.load-status-message {
    display: none !important;
}

/* 隐藏所有通知元素，但保留加载指示器 */
.notification,
.wallpaper-notification,
.notification.success,
.notification.error,
.notification.info,
.notification.warning,
.notification.fade-out {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* 图片延迟加载过渡效果 - 修复灰蒙蒙问题 */
.wallpaper-card img.wp-post-image,
.wallpaper-card img.placeholder-image {
    transition: opacity 0.3s ease-in-out !important;
    opacity: 1 !important; /* 确保所有图片默认完全不透明 */
}

/* 仅对通过JavaScript添加了data-src属性的图片应用加载效果 */
.wallpaper-card img[data-src]:not(.lazy-loaded) {
    opacity: 0.2 !important;
}

.wallpaper-card img.lazy-loaded {
    opacity: 1 !important;
}

/* 优化卡片加载动画 */
.wallpaper-card {
    animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* 优化图片容器 */
.wallpaper-card .image-container {
    background-color: #f0f0f0 !important; /* 图片加载中显示的背景色 */
}

/**
 * 禁用首页文章卡片悬浮动画
 */
/* 移除卡片悬浮动画效果 */
.wallpaper-card {
    transition: none !important;
}

/* 防止鼠标悬停时的变换效果 */
.wallpaper-card:hover {
    transform: none !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important; /* 保持原始阴影效果 */
}

/* 确保加载动画结束后不会再有动画效果 */
.wallpaper-card.loaded {
    animation: none !important;
    transition: none !important;
}

/* 移除所有可能存在的其他hover状态变换 */
.wallpaper-link:hover .wallpaper-card,
.home-grid a:hover .wallpaper-card,
.wallpaper-grid a:hover .wallpaper-card {
    transform: none !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
}