.skeleton-index {
    display: block;
    height: initial;
}
@import "../common/index.acss";

.skeleton-index .van-skeleton {
    display: -webkit-flex;
    display: flex;
    box-sizing: border-box;
    width: 100%;
    padding: 0 16px;
    padding: var(--skeleton-padding, 0 16px);
}

.skeleton-index .van-skeleton__avatar {
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    margin-right: 16px;
    margin-right: var(--padding-md, 16px);
    background-color: #f2f3f5;
    background-color: var(--skeleton-avatar-background-color, #f2f3f5);
}

.skeleton-index .van-skeleton__avatar--round {
    border-radius: 100%;
}

.skeleton-index .van-skeleton__content {
    -webkit-flex: 1;
    flex: 1;
}

.skeleton-index .van-skeleton__avatar + .van-skeleton__content {
    padding-top: 8px;
    padding-top: var(--padding-xs, 8px);
}

.skeleton-index .van-skeleton__row,
.skeleton-index .van-skeleton__title {
    height: 16px;
    height: var(--skeleton-row-height, 16px);
    background-color: #f2f3f5;
    background-color: var(--skeleton-row-background-color, #f2f3f5);
}

.skeleton-index .van-skeleton__title {
    margin: 0;
}

.skeleton-index .van-skeleton__row:not(:first-child) {
    margin-top: 12px;
    margin-top: var(--skeleton-row-margin-top, 12px);
}

.skeleton-index .van-skeleton__title + .van-skeleton__row {
    margin-top: 20px;
}

.skeleton-index .van-skeleton--animate {
    -webkit-animation: van-skeleton-blink 1.2s ease-in-out infinite;
    animation: van-skeleton-blink 1.2s ease-in-out infinite;
}

@-webkit-keyframes van-skeleton-blink {
    50% {
        opacity: 0.6;
    }
}

@keyframes van-skeleton-blink {
    50% {
        opacity: 0.6;
    }
}
