@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700&display=swap');

.toplist-nysportsday__wrapper {
    margin-bottom: 24px;
}

.toplist-nysportsday__offers {
    display: flex;
    flex-direction: column;
    counter-reset: bm-toplist-nysportsday-counter;
    gap: 12px;
}

.toplist-nysportsday__offer-fifa {
    position: relative;
    display: flex;
    align-items: center;
    height: 48px;
    padding: 12px 64px;
    border-radius: 8px 8px 0 0;
    background-color: #006fbf;
    background-image: url('../images/fifa-banners/nysportsday-banner.png');
    background-repeat: no-repeat;
    background-position: right;
    background-size: auto 48px;
}

.toplist-nysportsday__offer-fifa:before {
    position: absolute;
    top: 9px;
    left: 17px;
    width: 30px;
    height: 47px;
    content: '';
    background-image: url('../images/fifa-banners/nysportsday-logo.png');
    background-repeat: no-repeat;
    background-size: contain;
}

.toplist-nysportsday__offer-fifa-title {
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    font-weight: 600;
    font-style: normal;
    line-height: 22px;
    color: #fff;
}

.toplist-nysportsday__offer {
    border-radius: 8px;
    background: #082038;
}

.toplist-nysportsday__offer:first-child {
    margin-bottom: -4px;
    background: linear-gradient(0deg, #4a81baff 50%, #afcceaff 100%);
}

.toplist-nysportsday__offer:first-child .toplist-nysportsday__offer-fifa:before {
    top: 8px;
}

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

.toplist-nysportsday__offer-inner {
    position: relative;
    display: grid;
    padding: 24px;
    counter-increment: bm-toplist-nysportsday-counter;
    border-radius: inherit;
    background: #082038;
    gap: 24px;
    grid-template-areas: 'logo main actions';
    grid-template-columns: 216px auto 300px;
    grid-template-rows: 1fr;
}

.toplist-nysportsday__offer:first-child .toplist-nysportsday__offer-inner {
    margin: 4px;
}

.toplist-nysportsday__offer:hover .toplist-nysportsday__offer-inner {
    background: linear-gradient(0deg, #082038 50%, #163658 100%);
}

.toplist-nysportsday__offer-top-rated {
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    line-height: 18px;
    position: absolute;
    top: 6px;
    left: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2px 8px;
    letter-spacing: 0.48px;
    text-transform: uppercase;
    color: #082038;
    border-radius: 2px;
    background: #ffcb40;
}

.toplist-nysportsday__offer-logo-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    grid-area: logo;
}

.toplist-nysportsday__offer-logo-wrapper:before {
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    font-weight: 700;
    font-style: normal;
    line-height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    min-width: 36px;
    height: 88px;
    padding: 8px;
    content: counter(bm-toplist-nysportsday-counter);
    text-align: center;
    letter-spacing: 0.16px;
    color: #f2f7fd;
    border-radius: 4px 0 0 4px;
    background: #234e7b;
}

.toplist-nysportsday__offer-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 180px;
    height: 88px;
    border-radius: 0 4px 4px 0;
    background: #163658;
}

.toplist-nysportsday__offer-logo img {
    width: 168px;
    height: 80px;
    border-radius: 4px;
    object-fit: contain;
}

.toplist-nysportsday__offer-main {
    display: flex;
    flex-direction: column;
    gap: 4px;
    grid-area: main;
}

.toplist-nysportsday__offer-brand {
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    line-height: 18px;
    letter-spacing: 0.48px;
    text-transform: uppercase;
    color: #83b1e1;
}

.toplist-nysportsday__offer-title {
    font-family: Montserrat, sans-serif;
    font-size: 24px;
    font-weight: 700;
    font-style: normal;
    line-height: 28px;
    letter-spacing: 0.24px;
    color: #f2f7fd;
}

.toplist-nysportsday__offer-coupon-code-wrapper {
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    line-height: 18px;
    width: max-content;
    max-width: 100%;
    margin-top: 4px;
    padding: 6px 12px;
    cursor: pointer;
    letter-spacing: 0.48px;
    text-transform: uppercase;
    color: #f2f7fd;
    border: 1px dashed #4a81ba;
    border-radius: 4px;
    background: #082038;
}

.toplist-nysportsday__offer-coupon-code {
    display: flex;
    align-items: center;
    justify-content: center;
}

.toplist-nysportsday__offer-coupon-code:before {
    display: block;
    width: 16px;
    height: 16px;
    margin-right: 4px;
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M12.7725 5C13.098 5 13.4105 5.12922 13.6406 5.35938C13.8708 5.58953 14 5.90205 14 6.22754V12.7725C14 13.098 13.8708 13.4105 13.6406 13.6406C13.4105 13.8708 13.098 14 12.7725 14H6.22754C5.90205 14 5.58953 13.8708 5.35938 13.6406C5.12922 13.4105 5 13.098 5 12.7725V11.5459H9.5C10.0425 11.5459 10.5627 11.3299 10.9463 10.9463C11.3299 10.5627 11.5459 10.0425 11.5459 9.5V5H12.7725ZM9.125 2C9.74632 2 10.25 2.50368 10.25 3.125V9.125C10.25 9.74632 9.74632 10.25 9.125 10.25H3.125C2.50368 10.25 2 9.74632 2 9.125V3.125C2 2.50368 2.50368 2 3.125 2H9.125Z' fill='%2383B1E1'/%3E%3C/svg%3E");
}

.coupon-code-copied .toplist-nysportsday__offer-coupon-code:before {
    display: none;
}

.toplist-nysportsday__offer-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    grid-area: actions;
}

.toplist-nysportsday__offer-cta-btn {
    font-family: Montserrat, sans-serif;
    font-size: 20px;
    font-weight: 700;
    font-style: normal;
    line-height: 1;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 48px;
    padding: 4px 60px 4px 40px;
    text-align: center;
    text-decoration: unset;
    letter-spacing: 0.2px;
    text-transform: capitalize;
    color: #082038;
    border-radius: 4px;
    background: linear-gradient(180deg, #ffcb40 50%, #f19412 100%);
}

.toplist-nysportsday__offer-cta-btn:after {
    position: absolute;
    right: 4px;
    width: 40px;
    height: 40px;
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='40' height='40' rx='2' fill='url(%23paint0_linear_164_255)'/%3E%3Cpath d='M27.32 19.3021C27.6983 19.6904 27.6983 20.3096 27.32 20.6979L21.9315 26.2278C21.5191 26.651 20.8389 26.6509 20.4266 26.2277C20.0293 25.8197 20.0293 25.1695 20.4267 24.7616L24.0378 21.0548H13.0548C12.4722 21.0548 12 20.5825 12 20C12 19.4175 12.4722 18.9452 13.0548 18.9452H24.0378L20.4267 15.2384C20.0293 14.8305 20.0293 14.1803 20.4266 13.7723C20.8389 13.3491 21.5191 13.349 21.9315 13.7722L27.32 19.3021Z' fill='%23FFCB40'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_164_255' x1='20' y1='0' x2='20' y2='40' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%232E69A5'/%3E%3Cstop offset='1' stop-color='%23082038'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
}

.toplist-nysportsday__offer-cta-btn:hover {
    text-decoration: unset;
    color: #082038;
    background: linear-gradient(180deg, #ffeab3 0%, #ffcb40 60%, #f19412 100%);
}

.toplist-nysportsday__offer-rating {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px 12px;
    border-radius: 4px;
    background: #163658;
    gap: 8px;
}

.toplist-nysportsday__offer-rating-value {
    font-family: Montserrat, sans-serif;
    font-size: 18px;
    font-weight: 600;
    font-style: normal;
    line-height: 24px;
    flex-shrink: 0;
    letter-spacing: 0.18px;
    color: #f2f7fd;
}

.toplist-nysportsday__offer-rating-value:after {
    position: relative;
    top: 1px;
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: 8px;
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cg clip-path='url(%23clip0_164_342)'%3E%3Cpath d='M7.08633 0.583219C7.4496 -0.194406 8.5504 -0.194407 8.91367 0.583219L10.807 4.63624L15.1421 5.30173C15.9541 5.4264 16.2857 6.42162 15.712 7.01242L12.5419 10.2771L13.2795 14.8203C13.4151 15.6558 12.5324 16.2806 11.795 15.8711L8 13.7633L4.20498 15.8711C3.46761 16.2806 2.58491 15.6558 2.72055 14.8203L3.45812 10.2771L0.287967 7.01242C-0.285735 6.42162 0.0458598 5.4264 0.857945 5.30173L5.19297 4.63624L7.08633 0.583219Z' fill='url(%23paint0_linear_164_342)'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_164_342' x1='8' y1='-1.37262' x2='8' y2='16.8814' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23FFCA3F'/%3E%3Cstop offset='1' stop-color='%23F19512'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_164_342'%3E%3Crect width='16' height='16' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.toplist-nysportsday__offer-rating-tier {
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-weight: 600;
    font-style: normal;
    line-height: 18px;
    flex-shrink: 0;
    letter-spacing: 0.12px;
    color: #f2f7fd;
}

.toplist-nysportsday__offer-review-link {
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-weight: 600;
    font-style: normal;
    line-height: 18px;
    text-decoration: underline;
    letter-spacing: 0.12px;
    color: #83b1e1;
}

.toplist-nysportsday__offer-review-link:hover {
    text-decoration: unset;
    color: #83b1e1;
}

.toplist-nysportsday__show-more-btn {
    font-family: Montserrat, sans-serif;
    font-size: 20px;
    font-weight: 700;
    font-style: normal;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-width: 200px;
    height: 48px;
    margin: 16px auto 0;
    padding: 4px 8px;
    cursor: pointer;
    letter-spacing: 0.2px;
    color: #fff;
    border-radius: 4px;
    background: linear-gradient(180deg, #2e69a5 50%, #082038 100%);
}

.toplist-nysportsday__show-more-btn:hover {
    color: #fff;
    background: linear-gradient(180deg, #7aa6d6 0%, #2e69a5 60%, #082038 100%);
}

@media (max-width: 1024px) {
    .toplist-nysportsday__wrapper {
        margin-bottom: 32px;
    }

    .toplist-nysportsday__offer-fifa {
        height: 56px;
        padding: 10px 64px;
        background-image: url('../images/fifa-banners/nysportsday-banner-mobile.png');
        background-size: auto 56px;
    }

    .toplist-nysportsday__offer-fifa:before,
    .toplist-nysportsday__offer:first-child .toplist-nysportsday__offer-fifa:before {
        top: 50%;
        transform: translateY(-50%);
        background-image: url('../images/fifa-banners/nysportsday-logo-mobile.png');
    }

    .toplist-nysportsday__offer-fifa-title {
        font-size: 14px;
        line-height: 18px;
        width: 80%;
    }

    .toplist-nysportsday__offer-inner {
        padding: 16px;
        gap: 16px;
        grid-template-areas:
            'logo'
            'main'
            'actions';
        grid-template-columns: auto;
    }

    .toplist-nysportsday__offer-logo-wrapper:before {
        height: 80px;
    }

    .toplist-nysportsday__offer-logo {
        width: 100%;
        height: 80px;
    }

    .toplist-nysportsday__offer-logo img {
        margin-left: -36px;
    }

    .toplist-nysportsday__offer-main {
        align-items: center;
        text-align: center;
    }

    .toplist-nysportsday__offer-brand {
        letter-spacing: 0.96px;
    }

    .toplist-nysportsday__offer-title {
        font-size: 22px;
        line-height: 26px;
        letter-spacing: 0.22px;
    }

    .toplist-nysportsday__offer-coupon-code-wrapper {
        margin-top: 12px;
    }
}