/* ============================================================
   卡乐售 · huolijincheng 模板（PC 端）首页
   商品墙纯 JS 加载 + 骨架屏：.item 卡片由 index.php?ajax=1 片段填充，
   首屏/切分类先由 index.js 铺一层几何对齐真实卡片的骨架占位，替换时不跳动。
   真实卡片几何见 style.css：.item 固定高 335、内层 a padding 15、图片 170×170、
   标题两行(高 50)、价格(高 30)、标签行(高 22)。
   ============================================================ */

/* 骨架整体：占位不可点，卡片尺寸完全复用 style.css 的 .public-index-list-wrap .item */
.public-index-list-wrap .item.hl-sk-item {
    pointer-events: none;
}

.public-index-list-wrap .item.hl-sk-item .hl-sk-box {
    display: flex;
    flex-direction: column;
    padding: 15px;
    background-color: #fff;
}

/* 微光扫过：统一一块 shimmer 背景 + 动画 */
.public-index-list-wrap .hl-sk {
    display: block;
    background: linear-gradient(90deg, #eef1f5 25%, #e3e8ef 50%, #eef1f5 75%);
    background-size: 200% 100%;
    animation: hl-sk-shimmer 1.2s infinite;
    border-radius: 4px;
    pointer-events: none;
}

/* 各区块几何对齐真实卡片，避免片段替换时的抖动 */
.public-index-list-wrap .hl-sk-pic {
    width: 170px;
    height: 170px;
}

.public-index-list-wrap .hl-sk-title {
    margin-top: 6px;
    width: 100%;
    height: 20px;
}

.public-index-list-wrap .hl-sk-title.short {
    width: 60%;
    margin-top: 5px;
}

.public-index-list-wrap .hl-sk-money {
    margin-top: 9px;
    width: 84px;
    height: 22px;
}

.public-index-list-wrap .hl-sk-row {
    display: flex;
    margin-top: 9px;
}

.public-index-list-wrap .hl-sk-mode {
    width: 66px;
    height: 22px;
    border-radius: 4px;
}

.public-index-list-wrap .hl-sk-stock {
    width: 56px;
    height: 22px;
    border-radius: 4px;
    margin-left: 8px;
}

@keyframes hl-sk-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}