.toplist-cardplayer__wrapper {
    margin: 24px 0;
}

.toplist-cardplayer__offers {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.toplist-cardplayer__offer {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.toplist-cardplayer__offer.hidden {
    display: none;
}

.toplist-cardplayer__offer-fact-min-deposit,
.toplist-cardplayer__offer-fact-payout {
    padding-left: 12px;
    border-left: 1px solid #cbcbcb;
}

.toplist-cardplayer__offer-inner {
    position: relative;
    display: grid;
    width: 100%;
    padding: 20px;
    border: 1px solid #4f4f4f;
    border-radius: 2px;
    background: #fff;
    gap: 6px 24px;
    grid-auto-flow: row;
    grid-template-areas:
        'logo brand-name actions'
        'logo title actions'
        'logo features actions';
    grid-template-columns: 130px auto 153px;
    grid-template-rows: auto auto 1fr;
}

.toplist-cardplayer__casino .toplist-cardplayer__offer-inner {
    gap: 8px 24px;
    grid-template-areas:
        'logo brand-name actions'
        'logo title actions'
        'logo facts actions';
}

.toplist-cardplayer__offer-inner:first-of-type {
    border-color: #060606;
}

.toplist-cardplayer__offer-label-wrapper {
    position: absolute;
    top: 13px;
    left: -6px;
    display: flex;
    align-items: center;
    width: fit-content;
    height: 20px;
    padding: 0 8px 0 9px;
    user-select: none;
    border-radius: 3px 3px 3px 0;
    background: #070707;
    gap: 8px;
}

.toplist-cardplayer__title-prefix-icon {
    width: 27px;
    height: 27px;
}

.toplist-cardplayer__offer-label-highlight {
    font-family: Arial, sans-serif;
    font-size: 8px;
    font-weight: 700;
    line-height: 120%;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #fff;
}

.toplist-cardplayer__offer-label-wrapper:after {
    position: absolute;
    bottom: -8px;
    left: 0;
    width: 6px;
    height: 8px;
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='6' height='9' viewBox='0 0 6 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 8.5L0 0.5H6V8.5Z' fill='%234E4E4E'/%3E%3C/svg%3E%0A");
    background-position: center;
}

.toplist-cardplayer__offer-logo-wrapper {
    grid-area: logo;
}

.toplist-cardplayer__offer-logo {
    display: block;
}

.toplist-cardplayer__offer-logo img {
    width: 130px;
    height: 62px;
    object-fit: contain;
}

.toplist-cardplayer__offer-rating {
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    height: 18px;
    padding: 3px 5px 3px 0;
    border-top: 0.5px solid #e8e8e8;
    border-right: 0.5px solid #e8e8e8;
    border-bottom: 0.5px solid #e8e8e8;
    border-left: 0.5px solid transparent;
    border-radius: 8px 4px 4px 8px;
    gap: 2px;
    justify-self: center;
}

.toplist-cardplayer__offer-rating-score {
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 100%;
    display: flex;
    align-items: center;
    color: #060606;
    gap: 3.5px;
}

.toplist-cardplayer__offer-rating-score:before {
    position: relative;
    width: 24px;
    height: 24px;
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12.25' cy='12.3348' r='12' fill='%23E8E8E8'/%3E%3Cpath d='M16.3481 18.6664C16.2443 18.6668 16.142 18.6423 16.0496 18.595L12.7403 16.8625L9.43091 18.595C9.32346 18.6515 9.2023 18.6767 9.08122 18.6678C8.96013 18.6589 8.84398 18.6162 8.74597 18.5445C8.64795 18.4728 8.572 18.3752 8.52676 18.2625C8.48151 18.1498 8.46879 18.0267 8.49002 17.9072L9.13891 14.2539L6.46548 11.6584C6.38207 11.5751 6.3229 11.4707 6.29432 11.3564C6.26574 11.2421 6.26883 11.1222 6.30326 11.0095C6.34087 10.8941 6.41005 10.7917 6.50296 10.7137C6.59586 10.6357 6.70876 10.5853 6.82886 10.5682L10.5275 10.0296L12.1563 6.70083C12.2094 6.59111 12.2924 6.49859 12.3956 6.43385C12.4989 6.36911 12.6184 6.33478 12.7403 6.33478C12.8622 6.33478 12.9816 6.36911 13.0849 6.43385C13.1882 6.49859 13.2712 6.59111 13.3243 6.70083L14.9724 10.0231L18.6711 10.5617C18.7913 10.5788 18.9041 10.6292 18.997 10.7072C19.09 10.7852 19.1591 10.8877 19.1968 11.003C19.2312 11.1157 19.2343 11.2356 19.2057 11.3499C19.1771 11.4643 19.1179 11.5686 19.0345 11.6519L16.3611 14.2474L17.01 17.9007C17.0332 18.0223 17.021 18.1481 16.975 18.263C16.929 18.3781 16.8511 18.4774 16.7504 18.5496C16.6329 18.6319 16.4914 18.673 16.3481 18.6664Z' fill='%230F9960'/%3E%3C/svg%3E%0A");
}

.toplist-cardplayer__offer-rating-max {
    font-family: Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
    line-height: 114%;
    color: #718096;
}

.toplist-cardplayer__offer-position {
    flex-shrink: 0;
}

.toplist-cardplayer__offer-brand-name-wrapper {
    font-family: Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
    line-height: 100%;
    display: flex;
    text-transform: uppercase;
    color: #718096;
    gap: 6px;
    grid-area: brand-name;
}

.toplist-cardplayer__brand-name {
    box-sizing: border-box;
}

.toplist-cardplayer__offer-title {
    grid-area: title;
}

.toplist-cardplayer__offer-title,
.toplist-cardplayer__offer-title p {
    font-family: Arial, sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 21px;
    margin: 0;
    padding: 0;
    color: #333;
}

.toplist-cardplayer__offer-title span {
    color: #900;
}

.toplist-cardplayer__offer-key-features {
    display: flex;
    flex-direction: column;
    margin: 0 !important;
    list-style: none;
    gap: 2px;
    grid-area: features;
}

.toplist-cardplayer__offer-key-features li {
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 125%;
    display: flex;
    align-items: center;
    padding-bottom: 0 !important;
    padding-left: 16px;
    color: #434959;
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='9' viewBox='0 0 10 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.78271 8.17029C3.74646 8.17029 3.71085 8.16081 3.67939 8.1428C3.64793 8.12479 3.62173 8.09887 3.60339 8.06761C2.91247 6.89054 1.07051 4.38422 1.052 4.35904C1.02241 4.31881 1.00829 4.26928 1.01221 4.2195C1.01613 4.16972 1.03784 4.12301 1.07336 4.08791L1.63976 3.52819C1.67435 3.49401 1.71983 3.47303 1.76829 3.46891C1.81674 3.46479 1.86511 3.47778 1.90498 3.50563L3.73944 4.78652C4.96697 3.21244 6.10721 2.12493 6.85737 1.48321C7.70192 0.760884 8.23954 0.435692 8.26204 0.422301C8.29436 0.402911 8.33134 0.392669 8.36902 0.39267H9.28536C9.32751 0.392667 9.36867 0.405477 9.40338 0.429401C9.43809 0.453324 9.46471 0.487232 9.4797 0.526629C9.4947 0.566026 9.49737 0.60905 9.48736 0.649998C9.47735 0.690946 9.45512 0.727884 9.42364 0.755914C6.82146 3.07366 3.99167 8.01561 3.96339 8.06526C3.94533 8.09696 3.91926 8.12334 3.88778 8.14177C3.85631 8.1602 3.82054 8.17003 3.78406 8.17027L3.78271 8.17029Z' fill='%230F9960'/%3E%3Cpath d='M3.74286 9.03663C1.67905 9.03663 0 7.3576 0 5.29377C0 3.22993 1.67905 1.55091 3.74286 1.55091C4.15667 1.55045 4.56768 1.61875 4.9591 1.75302C5.01126 1.77094 5.05417 1.80885 5.07837 1.85841C5.10258 1.90796 5.10612 1.96511 5.08819 2.01727C5.07027 2.06943 5.03236 2.11233 4.9828 2.13654C4.93325 2.16075 4.8761 2.16428 4.82395 2.14635C4.47596 2.02702 4.11056 1.96634 3.74267 1.96678C1.90815 1.96678 0.415686 3.45927 0.415686 5.29377C0.415686 7.12827 1.90815 8.62075 3.74267 8.62075C5.5772 8.62075 7.06966 7.12827 7.06966 5.29377C7.06972 5.06867 7.04711 4.84413 7.00217 4.62357C6.9967 4.5968 6.99655 4.56923 7.00174 4.54241C7.00693 4.5156 7.01735 4.49007 7.03241 4.46728C7.04746 4.44449 7.06686 4.42489 7.08949 4.40959C7.11212 4.3943 7.13754 4.38362 7.1643 4.37815C7.19107 4.37268 7.21864 4.37254 7.24546 4.37773C7.27227 4.38291 7.2978 4.39333 7.32059 4.40839C7.34338 4.42345 7.36298 4.44284 7.37828 4.46547C7.39357 4.4881 7.40425 4.51353 7.40972 4.54029C7.46025 4.78826 7.48569 5.04069 7.48564 5.29377C7.48572 7.3576 5.80668 9.03663 3.74286 9.03663Z' fill='%230F9960'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: top 3px left 0;
}

.toplist-cardplayer__offer-actions {
    margin-top: 10px;
    grid-area: actions;
}

.toplist-cardplayer__offer-cta-btn {
    font-family: Arial, sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 48px;
    padding: 0 12px;
    color: #fff;
    border-radius: 5px;
    background: #900;
    gap: 8px;
}

.toplist-cardplayer__offer-cta-btn:before {
    position: relative;
    width: 16px;
    height: 16px;
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.5 8.49998L0.499999 15.4282L0.5 1.57178L12.5 8.49998Z' fill='white'/%3E%3C/svg%3E%0A");
}

.toplist-cardplayer__offer-cta-btn:hover {
    text-decoration: none;
    color: #fff;
    background: #780000;
}

.toplist-cardplayer__show-more-btn {
    font-family: Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    margin: 24px auto 0;
    padding: 13px 16px;
    color: #101214;
    border: 2px solid #101214;
    border-radius: 7px;
    gap: 8px;
}

.toplist-cardplayer__show-more-btn:hover {
    cursor: pointer;
    color: #fff;
    background: #101214;
}

.toplist-cardplayer__show-more-btn:hover svg path {
    stroke: #fff;
}

.toplist-cardplayer__offer-facts {
    display: flex;
    gap: 16px;
    grid-area: facts;
}

.toplist-cardplayer__offer-fact-wagering-req,
.toplist-cardplayer__offer-fact-min-deposit,
.toplist-cardplayer__offer-fact-payout {
    display: flex;
    height: 14px;
    gap: 8px;
}

.toplist-cardplayer__offer-fact-character,
.toplist-cardplayer__offer-fact-head {
    font-family: var(--bm-font-family);
    font-size: 10px;
    font-weight: 400;
    line-height: 100%;
    margin: auto;
    color: #718096;
}

.toplist-cardplayer__offer-fact-character {
    padding-left: 2px;
    letter-spacing: 0.2px;
}

.toplist-cardplayer__offer-fact-head {
    flex-shrink: 0;
    text-transform: uppercase;
}

.toplist-cardplayer__offer-fact-body {
    font-family: var(--bm-font-family);
    font-size: 14px;
    font-weight: 700;
    line-height: 100%;
    display: flex;
    color: #333;
}

.toplist-cardplayer__offer-terms,
.toplist-cardplayer__offer-terms * {
    font-family: Arial, sans-serif;
    font-size: 10px;
    font-weight: 400;
    font-style: normal;
    line-height: 120%;
    color: #8f8f8f;
}

@media screen and (width >= 992px) {
    .toplist-cardplayer__offer-inner {
        height: auto;
        min-height: 90px;
    }

    .toplist-cardplayer__offer.w-label .toplist-cardplayer__offer-inner {
        min-height: 105px;
    }

    .toplist-cardplayer__offer-rating {
        margin-top: 71px;
        grid-area: logo;
    }

    .toplist-cardplayer__offer.w-label .toplist-cardplayer__offer-logo {
        margin-top: 15px;
    }

    .toplist-cardplayer__offer.w-label .toplist-cardplayer__offer-rating {
        margin-top: 86px;
    }
}

@media screen and (width <= 991px) {
    .toplist-cardplayer__wrapper {
        margin: 32px 0;
    }

    .toplist-cardplayer__offer-inner {
        gap: 8px 12px;
        grid-auto-flow: row;
        grid-template-areas:
            'logo brand-name'
            'logo rating'
            'title title'
            'actions actions'
            'features features';
        grid-template-columns: 146px auto;
        grid-template-rows: auto auto 1fr;
    }

    .toplist-cardplayer__offer-facts {
        justify-content: space-between;
    }

    .toplist-cardplayer__casino .toplist-cardplayer__offer-inner {
        gap: 12px;
        grid-template-areas:
            'logo brand-name'
            'logo rating'
            'title title'
            'facts facts'
            'actions actions';
    }

    .toplist-cardplayer__offer-label-wrapper {
        top: -11px;
    }

    .toplist-cardplayer__offer-logo img {
        width: 180px;
        height: 70px;
        object-position: left;
    }

    .toplist-cardplayer__offer-brand-name-wrapper {
        align-self: end;
        text-align: right;
        justify-self: end;
    }

    .toplist-cardplayer__offer-rating {
        position: relative;
        align-self: start;
        margin-top: 2px;
        grid-area: rating;
        justify-self: end;
    }

    .toplist-cardplayer__offer-title,
    .toplist-cardplayer__offer-title p {
        font-size: 18px;
    }

    .toplist-cardplayer__offer-key-features li {
        line-height: 140%;
    }

    .toplist-cardplayer__offer-cta-btn {
        height: 50px;
    }
}