.sab {
    background-color: #f2f1f6;
    display: flex;
    align-items: center;
    padding: 6px 16px;
    gap: 10px;
}

.sab .s_btn--cross {
    padding: 0;
    display: flex;
    align-items: center;
    height: auto;
    line-height: 16px;
    font-weight: 600;
    box-shadow: none;
    border-radius: 5px;
    border: 1px solid rgba(0,0,0,0);
    font-size: 14px;
    text-decoration: none;
    background: hsl(0,0%,96%);
    transition: color 300ms ease-in-out,border-color 300ms ease-in-out,background-color 300ms ease-in-out,box-shadow 300ms ease-in-out,outline 300ms ease-in-out;
    white-space: nowrap;
    cursor: pointer;
    color: hsla(208,12%,30%,.8);
}
.sab .s_btn--cross:hover {
    background: hsl(0,0%,86%);
}
.sab .s_btn--cross .s_icon,
.sab .sab_info .sab_rating .s_icon {
    display: block;
    flex: 0 0 auto;
    background-color: currentColor;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}
.sab .s_btn--cross .s_icon {
    width: 10px;
    height: 10px;
    color: currentColor;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M31.708 25.708c-0-0-0-0-0-0l-9.708-9.708 9.708-9.708c0-0 0-0 0-0 0.105-0.105 0.18-0.227 0.229-0.357 0.133-0.356 0.057-0.771-0.229-1.057l-4.586-4.586c-0.286-0.286-0.702-0.361-1.057-0.229-0.13 0.048-0.252 0.124-0.357 0.228 0 0-0 0-0 0l-9.708 9.708-9.708-9.708c-0-0-0-0-0-0-0.105-0.104-0.227-0.18-0.357-0.228-0.356-0.133-0.771-0.057-1.057 0.229l-4.586 4.586c-0.286 0.286-0.361 0.702-0.229 1.057 0.049 0.13 0.124 0.252 0.229 0.357 0 0 0 0 0 0l9.708 9.708-9.708 9.708c-0 0-0 0-0 0-0.104 0.105-0.18 0.227-0.229 0.357-0.133 0.355-0.057 0.771 0.229 1.057l4.586 4.586c0.286 0.286 0.702 0.361 1.057 0.229 0.13-0.049 0.252-0.124 0.357-0.229 0-0 0-0 0-0l9.708-9.708 9.708 9.708c0 0 0 0 0 0 0.105 0.105 0.227 0.18 0.357 0.229 0.356 0.133 0.771 0.057 1.057-0.229l4.586-4.586c0.286-0.286 0.362-0.702 0.229-1.057-0.049-0.13-0.124-0.252-0.229-0.357z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M31.708 25.708c-0-0-0-0-0-0l-9.708-9.708 9.708-9.708c0-0 0-0 0-0 0.105-0.105 0.18-0.227 0.229-0.357 0.133-0.356 0.057-0.771-0.229-1.057l-4.586-4.586c-0.286-0.286-0.702-0.361-1.057-0.229-0.13 0.048-0.252 0.124-0.357 0.228 0 0-0 0-0 0l-9.708 9.708-9.708-9.708c-0-0-0-0-0-0-0.105-0.104-0.227-0.18-0.357-0.228-0.356-0.133-0.771-0.057-1.057 0.229l-4.586 4.586c-0.286 0.286-0.361 0.702-0.229 1.057 0.049 0.13 0.124 0.252 0.229 0.357 0 0 0 0 0 0l9.708 9.708-9.708 9.708c-0 0-0 0-0 0-0.104 0.105-0.18 0.227-0.229 0.357-0.133 0.355-0.057 0.771 0.229 1.057l4.586 4.586c0.286 0.286 0.702 0.361 1.057 0.229 0.13-0.049 0.252-0.124 0.357-0.229 0-0 0-0 0-0l9.708-9.708 9.708 9.708c0 0 0 0 0 0 0.105 0.105 0.227 0.18 0.357 0.229 0.356 0.133 0.771 0.057 1.057-0.229l4.586-4.586c0.286-0.286 0.362-0.702 0.229-1.057-0.049-0.13-0.124-0.252-0.229-0.357z'/%3E%3C/svg%3E");
}
.sab .s_btn--primary {
    padding: 6px 12px;
    border-radius: 22px;
    font-size: 14px;
    line-height: 18px;
    margin-left: auto;
    background: hsl(214.24,88.84%,57.84%);
    color: #fff;
    transition: color 300ms ease-in-out,border-color 300ms ease-in-out,background-color 300ms ease-in-out,box-shadow 300ms ease-in-out,outline 300ms ease-in-out;
}
.sab .s_btn--primary:hover {
    background: hsl(214.24,88.84%,47.84%);
}

.sab .sab_info {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.sab .sab_info .sab_title {
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
}

.sab .sab_info .sab_desc {
    color: #848489;
    font-size: 12px;
    line-height: 1;
}

.sab .sab_info .sab_rating {
    display: flex;
    align-items: center;
    gap: 1px;
    color: hsl(214.24deg 88.84% 57.84%);
}
.sab .sab_info .sab_rating .s_icon--star,
.sab .sab_info .sab_rating .s_icon--star-half {
    width: 10px;
    height: 10px;
}
.sab .sab_info .sab_rating .s_icon--star {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M32 12.408l-11.056-1.607-4.944-10.018-4.944 10.018-11.056 1.607 8 7.798-1.889 11.011 9.889-5.199 9.889 5.199-1.889-11.011 8-7.798z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M32 12.408l-11.056-1.607-4.944-10.018-4.944 10.018-11.056 1.607 8 7.798-1.889 11.011 9.889-5.199 9.889 5.199-1.889-11.011 8-7.798z'/%3E%3C/svg%3E");
}
.sab .sab_info .sab_rating .s_icon--star-half {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M32 12.408l-11.056-1.607-4.944-10.018-4.944 10.018-11.056 1.607 8 7.798-1.889 11.011 9.889-5.199 9.889 5.199-1.889-11.011 8-7.798zM16 23.547l-0.029 0.015 0.029-17.837 3.492 7.075 7.807 1.134-5.65 5.507 1.334 7.776-6.983-3.671z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M32 12.408l-11.056-1.607-4.944-10.018-4.944 10.018-11.056 1.607 8 7.798-1.889 11.011 9.889-5.199 9.889 5.199-1.889-11.011 8-7.798zM16 23.547l-0.029 0.015 0.029-17.837 3.492 7.075 7.807 1.134-5.65 5.507 1.334 7.776-6.983-3.671z'/%3E%3C/svg%3E");
}

.sab .sab_open .sab_appicon {
    width: 36px;
    height: 36px;
}