//css for RecommandList
@import 'cbkfe-assets/dist/css/control.less';

@keyframes icon_rotate {
    from {
        transform: rotate(0);
    }

    to {
        transform: rotate(360deg);
    }
}

.cbkfe__recommandCard {
    .recommands__endText {
        padding-top: 1.5rem;
        padding-bottom: 1.75rem;
        .font(0.7rem, #9d9d9d, 0.9rem);
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .recommands__endText__icon {
        width: 0.8rem;
        height: 0.8rem;
        margin-right: 0.5rem;
        animation-name: icon_rotate;
        animation-duration: 0.8s;
        animation-iteration-count: infinite;
        animation-fill-mode: both;
        animation-timing-function: linear;
    }

    .recommands__iphonex {
        display: block;
        width: 100%;
        height: 0;
        min-height: constant(safe-area-inset-bottom);
        min-height: env(safe-area-inset-bottom);
    }

    .template__header {
        position: relative;
        .font(0.9rem, #000, 1.1rem);
        padding: 0.9rem 0;
        padding-left: 0.6rem;
        font-weight: 500;

        &:before {
            content: '';
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
            width: 0.15rem;
            height: 0.75rem;
            background: #ff2244;
            border-radius: 0.08rem;
        }

    }
}