/*
Theme Name: PokaTheme Child
Template: pokatheme
Theme URI: https://pokatheme.com
Description: Premium Affiliate WordPress Theme
Author: PokaTheme
Author URI: https://pokatheme.com
Version: 2026.07.26
License: Licensed theme
Tags: black, blue, white, two-columns
Text Domain:  poka
*/

/*
    Add your custom styles here
*/

.wysiwyg-part p {
    margin: 1.50rem 0;
}

.wp-block-table table[style*="border-top-style:none"] td,
.wp-block-table table[style*="border-top-style:none"] th {
    border-top: none;
    border-bottom-color: inherit;
    padding: 12px 8px;
}

.wp-block-table table[style*="border-right-style:none"] td,
.wp-block-table table[style*="border-right-style:none"] th {
    border-right: none;
    border-bottom-color: inherit;
    padding: 12px 8px;
}

.wp-block-table table[style*="border-left-style:none"] td,
.wp-block-table table[style*="border-left-style:none"] th {
    border-left: none;
    border-bottom-color: inherit;
    padding: 12px 8px;
}

.wp-block-table table[style*="border-bottom-style:none"] td,
.wp-block-table table[style*="border-bottom-style:none"] th {
    border-bottom: none;
    border-bottom-color: inherit;
    padding: 12px 8px;
}

.wp-block-table table td,
.wp-block-table table th {
    padding: 12px 8px;
}

.wp-block-table table td,
.wp-block-table table th {
    padding: 12px 8px;
}

.wp-block-table table td,
.wp-block-table table th {
    padding: 12px 8px;
}

.wp-block-table table td,
.wp-block-table table th {
    padding: 12px 8px;
}

.wp-block-table table,
.wp-block-table table thead {
    border: none!important;
    border-bottom-color: inherit;
}

.wp-block-table table tr:last-child td {
    border-bottom: 0!important;
}

.wp-block-table table tr,
.wp-block-table table tbody,
.wp-block-table table thead {
    border: none !important;
}

th {
    color: rgba(85, 85, 85, 1);
    text-transform: uppercase;
    font-size: var(--text-sm);
    line-height: 1.4;
    text-align: left;
    letter-spacing: 10%;
    align-content: center;
}

.wp-block-table table td > a {
    color: var(--primary-button-color);
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
    gap: 0px;
}

.wp-block-table table td > a:hover {
    gap: 12px;
}

/*p {
    display: flex;
    align-items: center;
    gap: 24px;
}*/

.wp-block-columns ul.wp-block-list {
    margin-top: 8px!important;
}

.wp-block-columns ul li {
    position: relative!important;
    margin-bottom: 6px!important;
    color: inherit!important;
}

.wp-block-columns ul li:last-child {
    margin-bottom: 0;
}

.wysiwyg-part ul li {
    position: relative;
    margin-bottom: 8px;
}

.wp-block-columns ul > li:not(.sec *)::before,
.wp-block-group ul > li:not(.sec *)::before {
    content: ""!important;
    position: absolute;
    left: -20px!important;
    top: 7px!important;
    font-family: pokatheme !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-variant: normal !important;
    text-transform: none !important;
    height: 6px;
    width: 6px;
    background: #222222;
    border-radius: 200px;
}

.poka-facebook:before {
    content: url("data:image/svg+xml;charset=utf-8,%3Csvg width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cg clip-path=%22url(%23clip0_7284_11936)%22%3E%3Cpath d=%22M24 12C24 5.37258 18.6274 0 12 0C5.37258 0 0 5.37258 0 12C0 17.9895 4.3882 22.954 10.125 23.8542V15.4688H7.07812V12H10.125V9.35625C10.125 6.34875 11.9166 4.6875 14.6576 4.6875C15.9701 4.6875 17.3438 4.92188 17.3438 4.92188V7.875H15.8306C14.34 7.875 13.875 8.80008 13.875 9.75V12H17.2031L16.6711 15.4688H13.875V23.8542C19.6118 22.954 24 17.9895 24 12Z%22 fill=%22%23222222%22/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id=%22clip0_7284_11936%22%3E%3Crect width=%2224%22 height=%2224%22 fill=%22white%22/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.poka-twitter:before {
    content: url("data:image/svg+xml;charset=utf-8,%3Csvg width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath d=%22M7.55016 21.7497C16.6045 21.7497 21.5583 14.2465 21.5583 7.74162C21.5583 7.53068 21.5536 7.31505 21.5442 7.10412C22.5079 6.40722 23.3395 5.54401 24 4.55505C23.1025 4.95436 22.1496 5.21514 21.1739 5.32849C22.2013 4.71266 22.9705 3.74523 23.3391 2.60552C22.3726 3.17831 21.3156 3.58237 20.2134 3.80037C19.4708 3.01132 18.489 2.48887 17.4197 2.31381C16.3504 2.13874 15.2532 2.32081 14.2977 2.83185C13.3423 3.3429 12.5818 4.15446 12.1338 5.14107C11.6859 6.12767 11.5754 7.23437 11.8195 8.29005C9.86249 8.19185 7.94794 7.68346 6.19998 6.79785C4.45203 5.91225 2.90969 4.66919 1.67297 3.14927C1.0444 4.233 0.852057 5.5154 1.13503 6.73585C1.418 7.95629 2.15506 9.0232 3.19641 9.71974C2.41463 9.69492 1.64998 9.48444 0.965625 9.10568V9.16662C0.964925 10.3039 1.3581 11.4063 2.07831 12.2865C2.79852 13.1667 3.80132 13.7703 4.91625 13.9947C4.19206 14.1929 3.43198 14.2218 2.69484 14.0791C3.00945 15.0572 3.62157 15.9126 4.44577 16.5261C5.26997 17.1395 6.26512 17.4804 7.29234 17.501C5.54842 18.8709 3.39417 19.6139 1.17656 19.6104C0.783287 19.6098 0.390399 19.5857 0 19.5382C2.25286 20.9835 4.87353 21.7511 7.55016 21.7497Z%22 fill=%22%23222222%22/%3E%3C/svg%3E");
}

.poka-linkedin:before {
    content: url("data:image/svg+xml;charset=utf-8,%3Csvg width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cg clip-path=%22url(%23clip0_7284_11933)%22%3E%3Cpath d=%22M22.2234 0H1.77187C0.792187 0 0 0.773438 0 1.72969V22.2656C0 23.2219 0.792187 24 1.77187 24H22.2234C23.2031 24 24 23.2219 24 22.2703V1.72969C24 0.773438 23.2031 0 22.2234 0ZM7.12031 20.4516H3.55781V8.99531H7.12031V20.4516ZM5.33906 7.43438C4.19531 7.43438 3.27188 6.51094 3.27188 5.37187C3.27188 4.23281 4.19531 3.30937 5.33906 3.30937C6.47813 3.30937 7.40156 4.23281 7.40156 5.37187C7.40156 6.50625 6.47813 7.43438 5.33906 7.43438ZM20.4516 20.4516H16.8937V14.8828C16.8937 13.5562 16.8703 11.8453 15.0422 11.8453C13.1906 11.8453 12.9094 13.2937 12.9094 14.7891V20.4516H9.35625V8.99531H12.7687V10.5609H12.8156C13.2891 9.66094 14.4516 8.70938 16.1813 8.70938C19.7859 8.70938 20.4516 11.0813 20.4516 14.1656V20.4516Z%22 fill=%22%23222222%22/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id=%22clip0_7284_11933%22%3E%3Crect width=%2224%22 height=%2224%22 fill=%22white%22/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}

.newsletter-wrapper {
    padding: 48px;
    border-radius: 16px !important;
    overflow: hidden;
    color: #fff;
    margin-bottom: 12px;
    margin-top: 80px;
    width: 100%;
    max-width: 100%!important;
}

.newsletter-wrapper .row {
    align-items: center;
}

.newsletter-wrapper .newsletter-title {
    margin: 0;
    font-size: var(--h2-font-size);
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.2;
}

.newsletter-wrapper p {
    font-size: var(--text-body);
    font-weight: 500;
    line-height: 28px;
    letter-spacing: 0;
    margin-bottom: 16px;
    margin-left: 48px;
}

.newsletter-wrapper .newsletter-form {
    display: flex;
    align-items: center;
}

.newsletter-wrapper .newsletter-form label {
    display: inline-flex;
    background: #fff;
    border-radius: var(--button-border-radius);
    overflow: hidden;
    margin-left: 48px;
    margin-right: 16px;
}

.newsletter-wrapper .newsletter-form label img{
    background: rgba(237, 235, 228, 1);
    padding: 12px;
}

.newsletter-wrapper .newsletter-form label input{
    border: none;
    padding: 8px 16px;
    outline: none;
}

.newsletter-wrapper .newsletter-form button {
    background-color: var(--primary-button-color);
    color: var(--primary-button-text-color);
    border-radius: var(--button-border-radius);
    font-weight: 500;
    text-align: center;
    padding: 6px 24px;
    margin: 0;
    position: relative;
    font-size: var(--text-body);
    border: 2px solid var(--primary-button-color);
    gap: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.newsletter-wrapper .newsletter-form button:hover {
    background: transparent;
    color: var(--primary-button-color);
}

.awareness-logos-flex {
    display: flex;
    gap: 38px;
}

.awareness-logos-flex .awareness-logos.awareness-logos--extra {
    gap: 12px !important;
    margin-left: auto;
    align-items: center;
    text-align: right;
    justify-content: right !important;
}

@media screen and (max-width: 992px) {
    p {
        padding: 0!important;
    }

    .footer-widgets .widget:first-child {
        flex-basis: 100%;
        min-width: 100%;
    }

    .newsletter-wrapper {
        background-position-x: left!important;
    }

    .newsletter-wrapper p {
        margin-left: 0px;
    }

    .newsletter-wrapper .newsletter-form label {
        margin-left: 0px;
    }
}

@media screen and (max-width: 768px) {
    .newsletter-wrapper {
        padding: 24px 16px;
    }

    .newsletter-wrapper .newsletter-title {
        font-size: var(--h2-font-size);
    }

    .newsletter-wrapper p {
        font-size: var(--text-sm);
        line-height: 23px;
    }

    .newsletter-wrapper .newsletter-form label {
        margin-right: 4px;
    }

    .newsletter-wrapper .newsletter-form label input {
        font-size: var(--text-sm);
    }

    .newsletter-wrapper .newsletter-form button {
        padding: 6px 16px;
        font-size: var(--text-sm);
    }
    .awareness-logos-flex {
        flex-direction: column;
        gap: 32px;
    }


    .awareness-logos-flex .awareness-logos.awareness-logos--extra {
        gap: 12px !important;
        margin-left: 0;
        align-items: center;
        text-align: left;
        justify-content: left !important;
    }

    .awareness-logos-flex .awareness-logos.awareness-logos--extra img {
        max-width: 42px;
    }
}

@media screen and (max-width: 500px) {
    .newsletter-wrapper {
        background-position-x: 20%!important;
        margin: 36px 0 0;
    }
    .newsletter-wrapper p {
        margin-left: 0px;
        max-width: 210px;
    }
}

@media screen and (max-width: 992px) {
    .section-newsletter-flex-part--left {
        margin-bottom: 0px;
    }

    .awareness-logos {
        gap: 12px 35px!important;
        justify-content: left!important;
    }

    .footer-widgets .widget ul:not(.review-pros, .faq-list) li a {
        padding: 0;
    }
}

@media screen and (max-width: 500px) {
    .awareness-logos img {
        margin: 0;
        flex: 26%;
        max-width: 26%;
    }
    /* Linked icons (social profiles): the 26% above would be measured against
       the link itself and shrink the icon to a few pixels. */
    .awareness-logos > a {
        display: inline-flex;
        flex: none;
    }
    .awareness-logos > a > img {
        flex: none;
        width: 32px;
        max-width: none;
        height: 32px;
    }
    .footer-widgets .widget.widget_nav_menu {
        margin-bottom: 6px;
    }


}

/* 1. Tablet: From 782px to 992px we want 2 columns (50%) */
@media screen and (min-width: 782px) and (max-width: 992px) {
    .wp-block-columns.stack-on-tablet:not(.is-not-stacked-on-mobile),
    .wp-block-columns.stacked-on-mobile:not(.is-not-stacked-on-mobile) {
        flex-wrap: wrap !important; /* Allows line wrapping */
    }

    .wp-block-columns.stack-on-tablet:not(.is-not-stacked-on-mobile) > .wp-block-column {
        /* Calculate 50% minus half the gap so they fit side by side */
        flex-basis: calc(50% - (var(--wp--style--block-gap, 2em) / 2)) !important;
        flex-grow: 0 !important;
        margin-block-start: 0 !important;
        margin-block-end: 0 !important;
    }
}

/* 2. Desktop: Above 992px they return to full width */
@media screen and (min-width: 993px) {
    .wp-block-columns.stack-on-tablet > .wp-block-column {
        flex-basis: 0 !important;
        flex-grow: 1 !important;
    }
}

/* 3. Mobile: Below 781px they become 100% (stack) */
@media screen and (max-width: 781px) {
    .wp-block-columns.stack-on-tablet:not(.is-not-stacked-on-mobile) > .wp-block-column {
        flex-basis: 100% !important;
    }
}

/* Clean up the margin only where needed */
.is-layout-flex.wp-block-columns.stack-on-tablet {
    gap: var(--wp--style--block-gap, 2em);
}

.mb-24 {
    display: inline-flex;
    margin-bottom: 24px!important;
}

@media screen and (max-width: 992px) {
    .mb-24 {
        margin-bottom: 16px!important;
    }
}

@media screen and (max-width: 500px) {
    .mb-24 {
        margin-bottom: 8px!important;
    }
    .smaller-on-mobile {
        max-width: 74px!important;
    }

    [style="height:80px"] {
        height: 36px !important;
    }

    .wysiwyg-part h2,
    h2 {
        font-size: var(--h2-font-size) !important;
        line-height: 32px !important;
    }

    br {
        display: none!important;
    }

    .wysiwyg-part p:not(.sec *, .sec-lead, .sec-intro),
    .wysiwyg-part ul li:not(.sec *) {
        font-size: var(--text-body)!important;
        line-height: var(--content-line-height)!important;
    }

    .wp-block-button__link {
        font-size: var(--text-body) !important;
        line-height: 23px!important;
    }
}

.post-element--s1 {
    height: 100%;
    background-color: var(--white);
}

.post-element--s1 .post-element-inner-wrapper {
    border-radius: 0;
    background-color: var(--white);
}



@media screen and (max-width: 992px) {

    .wp-block-table th,
    .wp-block-table td {
        width: 144px !important;
    }

    .wp-block-table th:first-child,
    .wp-block-table td:first-child {
        width: 144px !important;
        z-index: 1 !important;
        position: sticky!important;
        left: -1px!important;
        background: #fff!important;
    }

    .wp-block-table th:first-child:after,
    .wp-block-table td:first-child:after {
        content: ""!important;
        border: 1px solid rgba(0, 0, 0, 0.1)!important;
        position: absolute!important;
        top: 0!important;
        bottom: 0!important;
        right: 0!important;
        box-shadow: 1px -1px 1px 1px hsl(0deg 0% 0% / 3%)!important;
    }

    .wp-block-table td:nth-child(2),
    .wp-block-table th:nth-child(2) {
        padding-left: 24px !important;
        padding-right: 12px !important;
    }
}

.is-style-regular--not thead,
.is-style-regular--not thead tr,
.is-style-regular--not thead tr th {
    height: 0px !important;
    max-height: 0px !important;
    padding: 0px !important;
    width: 100%!important;
}

.is-style-regular--not tr {
    display: flex;
    width: 100%!important;
}

.is-style-regular--not tr td {
    display: inline-flex!important;
    width: calc(100% - 100px)!important;
    align-items: center!important;
    gap: 10px;
}

.is-style-regular--not tr td:nth-child(2) {
    width: 100px !important;
    max-width: 100px !important;
    min-width: 100px !important;
    word-break: break-all;
    overflow: hidden;
    display: inline-flex!important;
    margin-left: auto;
    gap: 10px;
    align-items: center!important;
    justify-content: end;
}

@media screen and (max-width: 992px) {
    .wp-block-table th:first-child, .wp-block-table td:first-child {
        width: 144px !important;
        z-index: 1 !important;
        position: sticky !important;
        left: -1px !important;
        background: #fff !important;
    }

    .is-style-regular--not tr td,
    .wp-block-table.is-style-regular--not th:first-child,
    .wp-block-table.is-style-regular--not td:first-child {
        display: inline-flex!important;
        width: calc(100% - 100px)!important;
        align-items: center!important;
        gap: 10px;
        position: relative !important;
        left: unset !important;
        background: transparent !important;
    }

    .wp-block-table.is-style-regular--not th:first-child:after,
    .wp-block-table.is-style-regular--not td:first-child:after {
        content: none!important;
    }

    .wp-block-table.is-style-regular--not td:nth-child(2),
    .wp-block-table.is-style-regular--not th:nth-child(2) {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

.post-element--s1 {
    height: 100%;
    background-color: var(--white);
    box-shadow: unset !important;
}

.post-element--s1 .post-element-inner-wrapper {
    padding: 24px !important;
}

.post-element--s1 .post-element-category-list {
    display: none;
}

.post-element--s1 .post-element-text a {
    font-size: var(--h4-font-size) !important;
    min-height: 48px;
    max-height: 48px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 0!important;
}

.post-element--s1 .post-element-text h3 {
    max-width: 50px !important;
    min-width: 50px !important;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 12px !important;
    gap: 12px;
}

.post-element--s1 .post-element-big-p {
    font-size: var(--text-sm) !important;
    line-height: 23px !important;
    margin-bottom: 12px !important;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    min-height: 46px;
    max-height: 46px;
}

.post-element--s1 img.size-post-wide,
.post-element--s1 img.size-post-thumb,
.post-element--s1 .link-on-img {
    -o-object-fit: cover;
    object-fit: cover;
    max-height: 200px;
    min-height: 200px;
    height: 100%;
    width: 100%;
    background: #f5f5f5;
}

.post-element-bottom-wrapper, .wysiwyg-part .post-element-bottom-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 20px;
    min-height: 38px;
    padding: 4px;
    background: rgba(245, 245, 245, 1);
    border-radius: 200px;
}

.post-element-author span,
.wysiwyg-part .post-element-author span,
.post-element-author a,
.wysiwyg-part .post-element-author a {
    display: inline-flex;
    flex-direction: column;
    margin-left: 8px;
    color: rgba(241, 110, 0, 1);
    font-size: var(--text-sm);
    font-weight: 500;
    text-transform: capitalize;
    position: relative;
}

.wysiwyg-part .post-element-author a:after {
    content: "";
    position: absolute;
    width: auto;
    height: 2px;
    background: rgba(241, 110, 0, 1);
    bottom: -11px;
    left: 0;
    right: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.post-element-author a:hover:after,
.wysiwyg-part .post-element-author a:hover:after {
    opacity: 1!important;
}

.reading-time {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 16px;
}

.reading-time span {
    font-size: var(--text-sm);
    font-weight: 500;
    line-height: 22px;
    color: rgba(217, 207, 192, 1);
}

/* Blog Page */

.blog-hero h1 {
    text-align: center;
}

.blog-updated {
    font-size: var(--text-xs);
    color: rgba(85, 85, 85, 1);
    margin-bottom: 44px;
    text-align: center;
}

.blog-intro.collapsed {
    max-height: 54px;
    overflow: hidden;
}

.blog-intro p {
    padding-right: 100px;
    padding-left: 100px;
    font-size: var(--text-body);
    line-height: 28px;
    text-align: center;
}

.blog-intro-toggle,
.btn-show-more {
    background: none;
    border: none;
    cursor: pointer;
    color: rgba(51, 51, 51, 1);
    font-size: var(--text-sm);
    font-weight: 500;
    margin: 40px auto 48px;
    display: flex;
    gap: 6px;
    align-items: center;
    transition: gap 0.3s ease;
}

.btn-show-more {
    margin: 12px auto 0;
}

.blog-intro-toggle:hover,
.btn-show-more:hover {
    gap: 18px;
}

.blog-intro-toggle .icon,
.btn-show-more .icon {
    font-size: var(--h4-font-size);
    font-weight: 400;
}

/* Filter tabs */
.blog-filters {
    display: flex;
    justify-content: center;
    margin: 32px 0 40px;
}

.filter-tabs {
    display: flex;
    gap: clamp(4px, 1.25vw, 24px);
    background: rgba(17, 17, 17, 1);
    border-radius: 50px;
    padding: 14px;
    width: 100%;
    justify-content: center;
}

@media (max-width: 900px) {
    .filter-tabs {
        display: flex;
        gap: 4px;
        background: rgba(17, 17, 17, 1);
        border-radius: 50px;
        padding: 14px;
        width: 100%;
        justify-content: left;
        overflow: hidden;
        white-space: nowrap;
        overflow-x: scroll;
    }
}

.filter-tab {
        background: transparent;
    border: none;
    color: rgba(153, 153, 153, 1);
    border-radius: 50px;
    padding: 6px 8px;
    cursor: pointer;
    font-size: var(--text-sm);
    font-weight: 500;
    line-height: 16px;
    transition: background 0.2s;
    border: 2px solid rgba(153, 153, 153, 1);
}

.filter-tab.active {
    background: #fff;
    border-color: #fff;
    color: rgba(51, 51, 51, 1);
    font-weight: 600;
}

/* Grid */
.blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

@media (max-width: 900px) {
    .blog-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
    .blog-grid { grid-template-columns: 1fr; }
}

/* Show More */
.blog-load-more {
    text-align: center!important;
    padding: 40px 0;
}

.affiliates-load-more {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin-top: 40px;
}

.showing-count {
    font-size: var(--text-xs)!important;
    color: #888!important;
    letter-spacing: 1px!important;
    margin-bottom: 12px!important;
}

.affiliates-load-more .showing-count {
    margin: 0 !important;
}

.affiliates-load-more .btn-show-more {
    margin: 10px auto 0 !important;
}

/* Full-SEO ranking mode: overflow rows are in the HTML (crawlable) but hidden
   until "Show More" reveals them client-side. The class is only ever output in
   full mode, so this rule is inherently scoped to it. */
.review-box.is-seo-collapsed {
    display: none !important;
}

.gap-24, .gap-24-y {
    margin-top: -24px;
}
.gap-24, .gap-24-x {
    margin-left: -24px;
}

.gap-24 > *, .gap-24-y > * {
    padding-top: 24px;
}
.gap-24 > *, .gap-24-x > * {
    padding-left: 24px;
}

@media screen and (max-width: 768px) {

    .gap-md-24, .gap-md-24-y {
        margin-top: -24px!important;
    }
    .gap-md-24, .gap-md-24-x {
        margin-left: -24px!important;
    }

    .gap-md-24 > *, .gap-md-24-y > * {
        padding-top: 24px!important;
    }
    .gap-md-24 > *, .gap-md-24-x > * {
        padding-left: 24px!important;
    }

}

.gap-40, .gap-40-y {
    margin-top: -40px;
}
.gap-40, .gap-40-x {
    margin-left: -40px;
}

.gap-40 > *, .gap-40-y > * {
    padding-top: 40px;
}
.gap-40 > *, .gap-40-x > * {
    padding-left: 40px;
}

/* Breadcrumbs */
.breadcrumb-trail {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #b0a99f; /* the gray from the image */
}

.breadcrumb-trail a,
.breadcrumb-trail .bread-current,
.breadcrumb-trail span {
    color: inherit;
    text-decoration: none;
}

.breadcrumb-trail a:hover {
    color: #333;
}

.breadcrumb-separator {
    color: #b0a99f;
}

/* Home icon */
.item-home .bread-home {
    font-size: 0;
    display: inline-flex;
    align-items: center;
}

.item-home .bread-home::before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath fill-rule=%22evenodd%22 clip-rule=%22evenodd%22 d=%22M5.00098 18.4247V10.9247H6.25098V18.4247C6.25098 18.5777 6.31682 18.7244 6.43403 18.8326C6.55125 18.9408 6.71022 19.0016 6.87598 19.0016H18.126C18.2917 19.0016 18.4507 18.9408 18.5679 18.8326C18.6851 18.7244 18.751 18.5777 18.751 18.4247V10.9247H20.001V18.4247C20.001 18.8837 19.8034 19.3239 19.4518 19.6485C19.1002 19.9731 18.6233 20.1555 18.126 20.1555H6.87598C6.3787 20.1555 5.90178 19.9731 5.55015 19.6485C5.19852 19.3239 5.00098 18.8837 5.00098 18.4247ZM18.751 5.73238V9.77084L16.251 7.46315V5.73238C16.251 5.57937 16.3168 5.43263 16.434 5.32443C16.5512 5.21624 16.7102 5.15546 16.876 5.15546H18.126C18.2917 5.15546 18.4507 5.21624 18.5679 5.32443C18.6851 5.43263 18.751 5.57937 18.751 5.73238Z%22 fill=%22%23999999%22/%3E%3Cpath fill-rule=%22evenodd%22 clip-rule=%22evenodd%22 d=%22M11.1526 4.53114C11.3777 4.29059 11.6828 4.15546 12.001 4.15546C12.3191 4.15546 12.6243 4.29059 12.8493 4.53114L20.825 13.0589C20.9377 13.1793 21.001 13.3427 21.001 13.5131C21.001 13.6834 20.9377 13.8468 20.825 13.9673C20.7124 14.0878 20.5596 14.1555 20.4003 14.1555C20.241 14.1555 20.0882 14.0878 19.9755 13.9673L12.001 5.43832L4.02645 13.9673C3.91379 14.0878 3.761 14.1555 3.60168 14.1555C3.44237 14.1555 3.28957 14.0878 3.17692 13.9673C3.06427 13.8468 3.00098 13.6834 3.00098 13.5131C3.00098 13.3427 3.06427 13.1793 3.17692 13.0589L11.1526 4.53114Z%22 fill=%22%23999999%22/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    vertical-align: middle;
}

.breadcrumbs-wrapper {
    background-color: var(--body-background);
    padding: 8px 0;
}

.breadcrumbs-wrapper span {
    font-size: var(--text-xs);
    line-height: 20px;
    padding: 12px 0;
}

.breadcrumbs-wrapper span.breadcrumb-separator {
    padding: 12px 0 13px;
}

.breadcrumbs-wrapper span.item-home {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    margin-bottom: 2px;
}

/* Phones: one slim line, so more of the first casino box shows without scrolling. */
@media screen and (max-width: 500px) {
    .breadcrumbs-wrapper {
        padding: 8px 0 0;
    }

    .breadcrumbs-wrapper span,
    .breadcrumbs-wrapper span.breadcrumb-separator {
        font-size: var(--text-2xs);
        line-height: 18px;
        padding: 0;
    }

    .breadcrumbs-wrapper span.item-home {
        width: 18px;
        height: 18px;
        margin-bottom: 0;
    }

    .item-home .bread-home::before {
        width: 18px;
        height: 18px;
    }
}

/* Author box */

.wp-block-poka-custom-author-card {
    max-width: 1080px;
    margin: 0 auto;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center -52px !important;
}

.wp-block-poka-custom-author-card .author-card-header {
    display: flex;
    gap: 16px;
    position: relative;
    margin-bottom: 16px;
}

.wp-block-poka-custom-author-card .author-card-main.is-style-2 .author-card-header {
    margin-bottom: 0px;
}

.wp-block-poka-custom-author-card .author-job {
    font-size: var(--text-body);
    line-height: 28px;
    margin: 0 !important;
    font-weight: 400;
    color: #fff;
}

.wp-block-poka-custom-author-card .author-tags-row {
    display: flex;
    gap: 8px;
}

.wp-block-poka-custom-author-card .tag-badge {
    background: rgba(217, 207, 192, 1);
    color: rgba(150, 81, 40, 1);
    padding: 7px 12px;
    border-radius: 20px;
    font-size: var(--text-sm);
    line-height: 16px;
    font-weight: 600;
    letter-spacing: -4%;
    margin-top: 24px;
}

.wp-block-poka-custom-author-card .author-card-main.is-style-2 .tag-badge {
    margin-bottom: 24px;
}

.wp-block-poka-custom-author-card .author-social-links {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    gap: 10px;
}

.wp-block-poka-custom-author-card .social-icon {
    color: #fff;
    text-decoration: none;
    transition: opacity 0.3s ease;
}

.wp-block-poka-custom-author-card .social-icon:hover {
    opacity: 0.8;
}

.wp-block-poka-custom-author-card .author-more-btn {
    color: rgba(215, 116, 57, 1);
    text-decoration: none;
    font-weight: 500;
    font-size: var(--text-sm);
    line-height: 23px;
    transition: gap 0.3s ease;
    gap: 6px;
    display: inline-flex;
    align-items: center;
    margin-top: 24px;
}

.wp-block-poka-custom-author-card .author-more-btn:hover {
    gap: 18px;
}

.wp-block-poka-custom-author-card .author-name,
.wp-block-poka-custom-author-card .author-name a {
    font-size: var(--text-body);
    line-height: 28px;
    margin: 0 !important;
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 500!important;
}

.wp-block-poka-custom-author-card .author-avatar-box {
    min-width: 115px;
    min-height: 115px;
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: cover;
    overflow: hidden;
    border-radius: 16px;
    width: 115px;
    height: 115px;
}

.wp-block-poka-custom-author-card .author-card-main.is-style-2 .author-avatar-box {
    min-width: 200px;
    min-height: 200px;
    width: 200px;
    height: 200px;
}

.wp-block-poka-custom-author-card .author-avatar-box img {
    width: 100%!important;
    height: 100%!important;
    object-fit: cover;
}

.wp-block-poka-custom-author-card .author-bio-p {
    font-size: var(--text-sm)!important;
    line-height: 23px!important;
    color: #fff!important;
    margin: 0!important;
}

/* Single Post */

.single-post-wrapper .wp-block-poka-custom-author-card {
    margin: 32px auto;
}

.single-post-wrapper h1 {
    text-align: center;
    font-size: var(--h1-font-size);
    color: rgba(34, 34, 34, 1);
    margin: 20px auto;
}

.post-element-info {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column;
    gap: 8px;
}

.single-post-wrapper .single-post-excerpt {
    max-width: 1080px;
    margin: 40px auto 80px;
    text-align: center;
    font-size: var(--text-body);
    color: rgba(85, 85, 85, 1);
}

.single-post-wrapper .single-post-excerpt * {
    font-size: var(--text-body);
    line-height: 26px;
}

.wp-block-buttons {
    box-sizing: border-box;
}

:root :where(.is-layout-flex) {
    gap: 24px;
}

.is-layout-flex {
    flex-wrap: wrap;
    align-items: center;
}

.wp-container-core-buttons-is-layout-a89b3969 {
    justify-content: center;
}

body .is-layout-flex {
    display: flex;
}

.wp-block-buttons.is-content-justification-center {
    justify-content: center;
}

.wysiwyg-part {
    font-size: var(--main-font-size);
}

:where(.wp-block-button__link) {
    border-radius: 9999px;
    box-shadow: none;
    padding: calc(.667em + 2px) calc(1.333em + 2px);
    text-decoration: none;
}

a {
    background-color: transparent;
}

a {
    text-decoration: none;
    color: inherit;
}

a {
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.wp-element-button {
    cursor: pointer;
}

.has-text-align-center {
    text-align: center;
}

.wp-block-button__link {
    align-content: center;
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    height: 100%;
    text-align: center;
    word-break: break-word;
}

.wp-block-button__link {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 13px 24px !important;
    border: 2px solid var(--secondary-button-color) !important;
    background: var(--secondary-button-color) !important;
    color: var(--secondary-button-text-color) !important;
    transition: all 0.3s ease;
}

:root :where(.wp-element-button, .wp-block-button__link) {
    background-color: #32373c;
    border-width: 0;
    color: #fff;
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    line-height: inherit;
    padding-top: calc(0.667em + 2px);
    padding-right: calc(1.333em + 2px);
    padding-bottom: calc(0.667em + 2px);
    padding-left: calc(1.333em + 2px);
    text-decoration: none;
    text-transform: inherit;
}

.wp-block-buttons .wp-block-button__link {
    width: 100%;
}

.post-element-info .post-element-info__authors a {
    color: rgba(241, 110, 0, 1);
    text-transform: capitalize;
    font-size: var(--text-xs);
}

.post-element-info .post-element-info__authors a:hover {
    text-decoration: underline;
}

.post-element-bottom-wrapper .post-element-author a {
    font-weight: 600;
}

.post-element-bottom-wrapper .post-element-author a:after {
    content: "";
    position: absolute;
    width: auto;
    height: 2px;
    background: rgba(241, 110, 0, 1);
    bottom: -11px;
    left: 0;
    right: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.post-element-bottom-wrapper .post-element-author a:hover:after {
    opacity: 1!important;
}

.poka-affiliate-card,
.wp-block-poka-affiliate-card {
    background: var(--boxes-background-color);
    border-radius: var(--border-radius);
    padding: 24px;
}

.poka-affiliate-card__sub {
    display: flex;
    justify-content: center;
    align-items: center;
    /*gap: 6px;*/
}

.poka-affiliate-card__sub img {
    margin-top: -1px;
}

.poka-affiliate-card__casino-info {
    display: flex;
    align-items: center;
    gap: 24px;
    flex: 400px;
    max-width: 400px;
}

.poka-affiliate-card__casino-actions {
    flex: 250px;
    max-width: 250px;
}

.poka-affiliate-card__casino-name {
    font-size: var(--h4-font-size);
    font-weight: 600;
}

.poka-affiliate-card__casino-logo {
    max-height: 50px;
}

.poka-affiliate-card__affiliate-row {
    margin-bottom: 16px;
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    justify-content: space-between;
    align-items: baseline;
    cursor: pointer;
}

.poka-affiliate-card__casino-actions .btn.btn-primary,
.btn.btn-primary,
.review-form__footer .btn.btn-primary {
    min-width: 250px;
    font-size: var(--text-body);
    line-height: 28px;
    padding: 9px 24px;
    background-color: var(--primary-button-color);
    border: 2px solid var(--primary-button-color);
    transition: all 0.3s ease;
}

.btn.btn-primary:hover {
    transform: none !important;
    border-color: var(--primary-button-color);
    color: var(--primary-button-color);
    background-color: transparent;
}

.btn:hover:after {
    opacity: 0!important;
}

.poka-affiliate-card__casino-actions .btn.btn-primary {
    margin-bottom: 12px;
}

.review-box-actions .btn {
    margin-bottom: 12px;
}

.review-box--style2 .review-extra-links-item a {
    font-size: var(--text-sm);
    font-weight: 600;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: gap 0.3s ease;
    color: var(--boxes-secondary-text-color);
}

.review-extra-links-item a:hover {
    gap: 18px;
}

.review-box--style2 .review-box-name {
    color: var(--boxes-secondary-text-color)!important;
}

@media screen and (max-width: 768px) {
    .poka-affiliate-card__affiliate-row {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }

    .poka-affiliate-card__casino-info {
        display: flex;
        align-items: center;
        gap: 8px;
        flex: 100%;
        max-width: 100%;
        justify-content: space-between;
        width: 100%;
    }

    .poka-affiliate-card__casino-actions {
        flex: 100%;
        max-width: 100%;
        width: 100%;
    }

    .poka-affiliate-card .is-layout-flex,
    .wp-block-poka-affiliate-card .is-layout-flex {
        flex-direction: column;
        gap: 8px;
    }
}

/* ----------------------------------------------------------
 * poka/report-form — Frontend Styles
 * Uses CSS custom properties injected by the block:
 *   --poka-rf-bg              (wrapper background)
 *   --poka-rf-text            (text color)
 *   --poka-rf-field-bg        (fields background)
 *   --poka-rf-field-secondary (file row / secondary elements)
 * ---------------------------------------------------------- */

.poka-report-form {
    --poka-rf-radius-card : var(--border-radius);
    --poka-rf-radius-field: var(--border-radius);
    --poka-rf-error-color : #c0392b;
    font-family: inherit;
}

/* ----------------------------------------------------------
 * Title
 * ---------------------------------------------------------- */
.poka-report-form__title {
    text-align : center;
    font-size  : 28px!important;
    font-weight: 600!important;
    margin     : 0 0 24px!important;
    color      : var(--poka-rf-text);
}

/* ----------------------------------------------------------
 * Body — vertical stack of fields
 * ---------------------------------------------------------- */
.poka-report-form__body,
.review-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    background: var(--poka-rf-bg);
    color: var(--poka-rf-text);
    border-radius: var(--poka-rf-radius-card);
    padding: 32px;
    max-width: 1080px;
    margin: 0 auto;
    padding: clamp(20px, 2.1vw, 40px) clamp(20px, 5.8vw, 110px) clamp(20px, 1.25vw, 24px);
}

.review-form {
    background: rgba(217, 207, 192, 1);
    color: rgba(34, 34, 34, 1);
    border-radius: var(--border-radius);
}

/* ----------------------------------------------------------
 * Field wrapper
 * ---------------------------------------------------------- */
.poka-report-form__field,
.review-form__field {
    display       : flex;
    flex-direction: column;
    gap           : 4px;
}

/* ----------------------------------------------------------
 * Labels
 * ---------------------------------------------------------- */
.poka-report-form__label,
.review-form__label {
    display: block;
    font-size: var(--text-sm);
    font-weight: 400;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--poka-rf-text);
}

.poka-report-form__required,
.review-form__required {
    color      : #e05c5c;
    margin-left: 2px;
}

/* ----------------------------------------------------------
 * Select
 * ---------------------------------------------------------- */
.poka-report-form__select,
.review-form__select {
    width: 100%;
    background: var(--poka-rf-field-bg);
    border: none;
    border-radius: var(--button-border-radius);
    padding: 8px 40px 8px 16px;
    font-size: var(--text-body);
    color: var(--poka-rf-text);
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg width='9' height='12' viewBox='0 0 9 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.146894 7.14689C0.193339 7.10033 0.248515 7.06339 0.30926 7.03818C0.370005 7.01298 0.435127 7 0.500894 7C0.566661 7 0.631782 7.01298 0.692528 7.03818C0.753273 7.06339 0.808448 7.10033 0.854894 7.14689L4.50089 10.7939L8.14689 7.14689C8.24078 7.05301 8.36812 7.00026 8.50089 7.00026C8.63367 7.00026 8.76101 7.05301 8.85489 7.14689C8.94878 7.24078 9.00152 7.36812 9.00152 7.50089C9.00152 7.63367 8.94878 7.76101 8.85489 7.85489L4.85489 11.8549C4.80845 11.9015 4.75327 11.9384 4.69253 11.9636C4.63178 11.9888 4.56666 12.0018 4.50089 12.0018C4.43513 12.0018 4.37001 11.9888 4.30926 11.9636C4.24852 11.9384 4.19334 11.9015 4.14689 11.8549L0.146894 7.85489C0.10033 7.80845 0.0633878 7.75327 0.0381813 7.69253C0.0129749 7.63178 0 7.56666 0 7.50089C0 7.43513 0.0129749 7.37001 0.0381813 7.30926C0.0633878 7.24852 0.10033 7.19334 0.146894 7.14689V7.14689ZM0.146894 4.85489C0.193339 4.90146 0.248515 4.9384 0.30926 4.96361C0.370005 4.98881 0.435127 5.00179 0.500894 5.00179C0.566661 5.00179 0.631782 4.98881 0.692528 4.96361C0.753273 4.9384 0.808448 4.90146 0.854894 4.85489L4.50089 1.20789L8.14689 4.85489C8.24078 4.94878 8.36812 5.00153 8.50089 5.00153C8.63367 5.00153 8.76101 4.94878 8.85489 4.85489C8.94878 4.76101 9.00152 4.63367 9.00152 4.50089C9.00152 4.36812 8.94878 4.24078 8.85489 4.14689L4.85489 0.146894C4.80845 0.100331 4.75327 0.0633878 4.69253 0.0381813C4.63178 0.0129749 4.56666 0 4.50089 0C4.43513 0 4.37001 0.0129749 4.30926 0.0381813C4.24852 0.0633878 4.19334 0.100331 4.14689 0.146894L0.146894 4.14689C0.10033 4.19334 0.0633878 4.24852 0.0381813 4.30926C0.0129749 4.37001 0 4.43513 0 4.50089C0 4.56666 0.0129749 4.63178 0.0381813 4.69253C0.0633878 4.75327 0.10033 4.80845 0.146894 4.85489V4.85489Z' fill='%23965128'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 18px center;
    cursor: pointer;
    font-family: inherit;
    box-sizing: border-box;
}

.review-form__select {
    background: rgba(255, 255, 255, 1);
    color: rgba(85, 85, 85, 1);
}

.poka-report-form__select:focus,
.review-form__select:focus {
    outline: 2px solid rgba(34, 34, 34, 0.25);
    outline-offset: 0;
}

/* ----------------------------------------------------------
 * Textarea
 * ---------------------------------------------------------- */
.poka-report-form__textarea,
.review-form__textarea {
    width: 100%;
    background: var(--poka-rf-field-bg);
    border: none;
    border-radius: var(--poka-rf-radius-field);
    padding: 8px 16px;
    font-size: var(--text-body);
    color: var(--poka-rf-text);
    resize: vertical;
    min-height: 200px;
    font-family: inherit;
    box-sizing: border-box;
}

.review-form__textarea {
    background: rgba(255, 255, 255, 1);
    color: rgba(85, 85, 85, 1);
    min-height: 138px;
    border-radius: 16px;
}

.poka-report-form__textarea:focus,
.review-form__textarea:focus {
    outline: 2px solid rgba(34, 34, 34, 0.25);
    outline-offset: 0;
}

/* ----------------------------------------------------------
 * File row
 * ---------------------------------------------------------- */
.poka-report-form__file-row,
.review-form__file-row {
    display: flex;
    align-items: center;
    gap: 16px;
    background: var(--poka-rf-field-bg);
    border-radius: var(--button-border-radius);
    padding: 0;
    overflow: hidden;
    position: relative;
}

.review-form__file-row {
    background: rgba(255, 255, 255, 1);
}

/* Hide the actual file input — JS triggers it via the + button */
.poka-report-form__file-input,
.review-form__file-input {
    display: none;
}

.poka-report-form__file-icon,
.review-form__file-icon {
    opacity: 0.7;
    font-size: var(--text-body);
    color: var(--poka-rf-text);
    flex-shrink: 0;
    line-height: 1;
    height: 100%;
    min-height: 40px;
    min-width: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--poka-rf-field-secondary);
}

.poka-report-form__file-name,
.review-form__file-name {
    flex         : 1;
    font-size    : 14px;
    color        : var(--poka-rf-text);
    opacity      : 0.5;
    white-space  : nowrap;
    overflow     : hidden;
    text-overflow: ellipsis;
}

.poka-report-form__file-btn,
.review-form__file-btn {
    background: var(--poka-rf-field-bg);
    border: none;
    border-radius: var(--button-border-radius);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--h3-font-size);
    line-height: 1;
    cursor: pointer;
    color: var(--poka-rf-text);
    flex-shrink: 0;
    transition: opacity 0.15s;
}

.poka-report-form__file-btn:after {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    right: 0;
    left: 0;
}

.poka-report-form__file-btn svg,
.review-form__file-btn svg {
    width: 22px;
    height: 22px;
}

.poka-report-form__file-btn:hover,
.review-form__file-btn:hover {
    opacity: 0.75;
}

/* ----------------------------------------------------------
 * Name + Email row
 * ---------------------------------------------------------- */
.poka-report-form__row,
.review-form__row {
    display              : grid;
    grid-template-columns: 1fr 1fr;
    gap                  : 10px;
}

/* ----------------------------------------------------------
 * Text inputs
 * ---------------------------------------------------------- */
.poka-report-form__input,
.review-form__input {
    width: 100%;
    background: var(--poka-rf-field-bg);
    border: none;
    border-radius: var(--button-border-radius);
    padding: 8px 20px 8px 16px;
    font-size: var(--text-body);
    color: var(--poka-rf-text);
    font-family: inherit;
    box-sizing: border-box;
}

.review-form__input {
    background: rgba(255, 255, 255, 1);
    color: rgba(85, 85, 85, 1);
}

.poka-report-form__input:focus,
.review-form__input:focus {
    outline: 2px solid rgba(34, 34, 34, 0.25);
    outline-offset: 0;
}

/* ----------------------------------------------------------
 * Email wrapper (@ icon + input)
 * ---------------------------------------------------------- */
.poka-report-form__email-wrap,
.review-form__email-wrap,
.review-form__input-icon-wrap {
    display: flex;
    align-items: center;
    background: var(--poka-rf-field-bg);
    border-radius: var(--button-border-radius);
    padding: 0;
    gap: 0px;
    position: relative;
}

.review-form__email-wrap {
    background: rgba(255, 255, 255, 1);
}

.poka-report-form__email-icon,
.review-form__email-icon,
.review-form__input-icon {
    font-size: var(--text-body);
    color: var(--poka-rf-text);
    flex-shrink: 0;
    line-height: 1;
    height: 100%;
    min-height: 40px;
    min-width: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 2px;
    background: var(--poka-rf-field-secondary);
    position: absolute;
    border-top-left-radius: var(--button-border-radius);
    border-bottom-left-radius: var(--button-border-radius);
}

.review-form__email-icon,
.review-form__input-icon {
    background: rgba(237, 235, 228, 1);
    color: rgba(85, 85, 85, 1);
}

.poka-report-form__input--email,
.review-form__input--email,
#review-email {
    background  : transparent;
    padding-left: 56px;
    padding-right: 20px;
}

#review-email {
    background: rgba(255, 255, 255, 1);
}

.poka-report-form__input--email:focus,
.review-form__input--email:focus {
    outline: none;
}

.poka-report-form__email-wrap:focus-within,
.review-form__email-wrap:focus-within {
    outline       : 2px solid rgba(34, 34, 34, 0.25);
    outline-offset: 0;
    border-radius : var(--button-border-radius);
}

/* ----------------------------------------------------------
 * Error state
 * ---------------------------------------------------------- */
.poka-report-form__input--error,
.review-form__input--error {
    outline: 2px solid var(--poka-rf-error-color) !important;
}

/* ----------------------------------------------------------
 * Placeholders
 * ---------------------------------------------------------- */
.poka-report-form__select option[value=""],
.review-form__select option[value=""] {
    color: rgba(34, 34, 34, 0.45);
}

.poka-report-form__textarea::placeholder,
.poka-report-form__input::placeholder,
.review-form__textarea::placeholder,
.review-form__input::placeholder {
    color  : var(--poka-rf-text);
    opacity: 0.45;
}

/* ----------------------------------------------------------
 * Actions + Button
 * ---------------------------------------------------------- */
.poka-report-form__actions,
.review-form__actions {
    display        : flex;
    justify-content: flex-end;
    margin-top     : 4px;
}

.poka-report-form__btn,
.review-form__btn {
    font-size: var(--text-body);
    line-height: 28px;
    background-color: var(--primary-button-color);
    padding: 9px 24px;
    border: 2px solid var(--primary-button-color);
    color: var(--primary-button-text-color);
    transition: 0.3s;

    display: inline-block;
    text-align: center;
    text-transform: var(--buttons-text-transform);
    font-weight: var(--button-font-weight);
    position: relative;
    text-decoration: none;
    border-radius: var(--button-border-radius);

    cursor: pointer;
}

.poka-report-form__btn:hover:not(:disabled),
.review-form__btn:hover:not(:disabled) {
    background-color: transparent;
    border: 2px solid var(--primary-button-color);
    color: var(--primary-button-color);
}

.poka-report-form__btn:disabled,
.review-form__btn:disabled {
    opacity: 0.5;
    cursor : not-allowed;
}

/* ----------------------------------------------------------
 * Success / Error messages
 * ---------------------------------------------------------- */
.poka-report-form__message,
.review-form__message,
.review-form__notice {
    font-size    : 14px;
    font-weight: 600;
    border-radius: var(--button-border-radius);
    text-align   : center;
}

.poka-report-form__message--success,
.review-form__message--success {
    color     : #2d7a2d;
    background: #edfaed;
    padding   : 10px 16px;
}

.poka-report-form__message--error,
.review-form__message--error,
.review-form__notice.is-error  {
    color     : var(--poka-rf-error-color);
    background: #fdecea;
    padding   : 10px 16px;
}

.review-form__notice {
    margin-bottom: 24px;
}

/* ----------------------------------------------------------
 * Mobile
 * ---------------------------------------------------------- */
@media ( max-width: 600px ) {
    .poka-report-form__wrapper,
    .review-form__wrapper {
        padding: 20px 16px;
    }

    .poka-report-form__row,
    .review-form__row {
        grid-template-columns: 1fr;
    }
}

/* REVIEWS STYLES */

.review-box--style2 {
    background-color: var(--boxes-secondary-background-color);
    border-radius: var(--border-radius);
    overflow: unset;
    position: relative;
    padding-bottom: 32px;
}

.review-box-name,
.wysiwyg-part .review-box-name,
.editor-styles-wrapper .review-box-name,
.wp-block-cover .review-box-name,
.wp-block-cover .review-box-name:not(.has-text-color) {
    margin-right: 24px;
    font-size: var(--h3-font-size);
    color: var(--boxes-text-color);
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 0;
}

.review-box--style2 .review-box-info {
    flex-direction: column;
    justify-content: left;
    align-items: baseline;
}

.review-box--style2 .review-box-thumb {
    background-color: transparent;
    border-radius: 0;
    flex: 100%;
    max-width: 100%;
    width: 100%;
    justify-content: start;
    align-items: center;
    gap: 8px;
    padding: 38px 12px 12px;
}

.review-box--style2 .review-box-thumb--counter {
    padding: 0;
    display: flex;
    justify-content: left;
    align-items: center;
    font-size: var(--h3-font-size);
    font-weight: 600;
    color: var(--primary-button-color);
}

.review-box--style2 .review-box-thumb--counter:before {
    content: "#";
    color: var(--primary-button-color);
}

.review-box--style2 .review-box-thumb--counter:after {
    position: relative;
    top: unset;
    left: unset;
    background-color: transparent;
    color: var(--primary-button-color);
    width: auto;
    height: auto;
    text-align: center;
    line-height: inherit;
    border-radius: unset;
    font-size: var(--h3-font-size);
    font-weight: 600;
}

.review-box--style2 .review-box-actions {
    padding: 12px;
    flex: auto;
    max-width: max-content;
    width: auto;
}

.review-box--style2 .review-badge,
.review-box--style2 .review-box-name {
    margin: 0;
}

.review-box--style2 .review-logo:not(.review-logo--rounded) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 100%;
    min-height: 140px;
    min-height: 20px;
    width: auto;
    margin: 0;
    margin-left: clamp(0px, 1vw, 16px);
}

.review-box--style2 .review-box-disclaimer {
    border-radius: 0;
    padding: 12px;
    color: rgba(153, 153, 153, 1);
}

/* Ranking rows: every logo sits in an identical 180×60 box — object-fit
   scales the graphic inside it with its own proportions intact, so logos of
   any source size line up uniformly. */
.review-box--style2 .review-logo > img {
    display: block;
    width: 180px!important;
    height: 60px!important;
    max-width: 100%;
    min-width: auto!important;
    -o-object-fit: contain;
    object-fit: contain;
}

/* Picture-wrapped logos elsewhere: natural size, capped to the thumb footprint
   (SVGs and full-size imports have no 110px thumb and would render huge). */
.review-logo > picture > img {
    display: block;
    height: auto!important;
    min-width: auto!important;
    width: auto!important;
    max-width: 110px;
    max-height: 60px;
    -o-object-fit: contain;
    object-fit: contain;
}

/* In RANKING rows a picture-wrapped logo must still get the exact 180×60 box —
   without this, an optimiser plugin wrapping the img in <picture> makes the
   rule above win and every logo renders at its own natural size. */
.review-box--style2 .review-logo > picture > img {
    display: block;
    width: 180px!important;
    height: 60px!important;
    max-width: 100%;
    max-height: none;
    min-width: auto!important;
    -o-object-fit: contain;
    object-fit: contain;
}

.review-badge-wrap {
    position: absolute;
    top: -5px;
    left: 30px;
}

.review-box3__expanded {
    padding: 12px;
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    margin-top: 20px;
}

.review-box3__info-box {
    background: rgba(245, 245, 245, 1);
    padding: 0 16px 16px;
    border-radius: 16px;
    flex: 20%;
    max-width: 25%;
    width: 100%;
}

.review-box3__info-box-body {
    overflow: hidden;
}

.review-box3__games-list,
.review-box3__feature-list,
.review-box3__overview-list {
    list-style: none !important;
    padding: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0 8px !important;
}

.wp-block-columns ul > li:not(.sec *)::before, .wp-block-group ul > li:not(.sec *)::before {
    content: unset;
    display: none;
}

.review-box3__game-item,
.review-box3__feature-item,
.review-box3__overview-list-item {
    flex: calc(50% - 4px);
    max-width: 50%;
    width: 100%;
    margin: 0 !important;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 3px 0;
    font-size: var(--text-sm);
}

.review-box3__game-item--inactive {
    opacity: 0.5;
}

.review-box3__feature-item,
.review-box3__overview-list-item {
    flex: 100%;
    max-width: 100%;
}

.review-box3__feature-subheader {
    font-weight: 600;
    margin-top: 8px;
}

.review-box3__overview-list-item {
    justify-content: space-between;
}

.review-box3__overview-list-item-value {
    font-weight: 600;
    text-align: right;
}

.review-box3__info-box-header {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 8px 0;
    justify-content: space-between;
    font-size: var(--text-sm);
    font-weight: 600;
}

.review-box--style2 .review-bonus {
    font-size: var(--h4-font-size);
    font-weight: 600;
    display: flex;
    align-items: center; /* gift icon sits on the bonus text line, not above it */
    gap: 8px 16px;
    margin-bottom: 20px;
    text-align: left;
}

.review-box--style2 .review-bonus .info {
    display: flex;
    flex-direction: column;
    justify-content: left;
    align-items: baseline;
    text-align: left;
    color: var(--boxes-secondary-text-color)!important;
}

.review-box--style2 .review-bonus .info .label {
    font-size: var(--text-xs);
    line-height: 14px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    opacity: 0.8;
    text-align: left;
}

.review-box--style2 .review-bonus .info .desc {
    font-size: var(--text-sm);
    font-weight: 400;
    text-align: left;
}

.review-box--style2 .review-bonus .icon {
    margin-top: 0;
    display: flex;
    align-items: center;
}

/* "No bonus for this deposit" note (bonus for a deposit amount, inc/deposit-bonus.php):
   the same panel, greyed gift, the database's note in place of the bonus title. */
.review-box--style2 .review-bonus--none .icon {
    opacity: 0.4;
    filter: grayscale(1);
}

.review-box--style2 .review-bonus--none .info {
    font-size: var(--text-body);
    font-weight: 500;
    opacity: 0.85;
}

.review-box3__payments {
    display: flex;
    gap: 4px;
}

.review-box3__payments .review-box3__payment-icon {
    height: 32px;
    min-width: 56px;
    box-sizing: border-box;
    padding: 0 12px;
    background: rgba(51, 51, 51, 1);
    border-radius: 6px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.review-box3__payment-icon.review-box3__payment-icon--text {
    padding: 0 12px;
}

/* No icon: the label, sized like the logos instead of body text */
.review-box3__payments .review-box3__payment-text {
    font-size: var(--text-sm);
    font-weight: 600;
    line-height: 1;
    color: #f2f2f2;
}

/* "+N" as tall as the chips */
.review-box3__payments .review-box3__payment-badge {
    height: 32px;
    min-width: 44px;
    box-sizing: border-box;
    padding: 0 10px;
    border-radius: 6px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.review-box3__payments .review-box3__payment-more {
    font-size: var(--text-sm);
    font-weight: 600;
    line-height: 23px;
    color: var(--main-color);
    background: rgba(51, 51, 51, 1);
    border-radius: 4px;
    padding: 2px 6px;
    cursor: pointer;
    border: 0;
}

.review-box3__payment-badge {
    background: rgba(51, 51, 51, 1);
    color: var(--main-color);
    font-weight: 500;
    border: 0;
    padding: 2px 6px;
    border-radius: 4px;
    cursor: pointer;
}

.review-box3__payments .review-box3__payment-more > svg {
    width: 0px;
    height: 0px;
}

.review-box--style2 .review-badge,
.review-box--style2 .review-box-name {
    margin-right: 16px!important;
}

.review-box--style2 .review-logo {
    margin-left: 0!important;
}

.pokageo-flag-circle {
    position: absolute!important;
    top: unset!important;
    right: -32px!important;
}

/* Ranking box icons. The checks in Top features / Games are empty spans
   painted here, not inline <svg><use> — two elements less per icon, ~40 icons per casino row, 100 rows on a big ranking
   (inc/templates/affiliates/affiliates-row-style3.php). Shapes are the same
   as check-circle / circle-x / warning-circle in inc/svg-icons.php;
   the colour is currentColor, so the old pic-* colours carry over. A page
   still cached with the <svg> inside renders the same: the mask clips the
   svg to the very shape it draws. */
.review-box3__check {
    display: inline-block;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    background-color: currentColor;
    -webkit-mask: var(--rb3-icon) center / 24px 24px no-repeat;
    mask: var(--rb3-icon) center / 24px 24px no-repeat;
}
.review-box3__check--yes {
    color: #F16E00;
    --rb3-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.001 22.5005C14.786 22.5005 17.457 21.3943 19.4263 19.4251C21.3956 17.4559 22.5019 14.7851 22.5019 12.0003C22.5019 9.21544 21.3956 6.54466 19.4263 4.57549C17.457 2.60631 14.786 1.50003 12.001 1.50003C9.216 1.50003 6.54506 2.60631 4.57576 4.57549C2.60647 6.54466 1.50013 9.21544 1.50013 12.0003C1.50013 14.7851 2.60647 17.4559 4.57576 19.4251C6.54506 21.3943 9.216 22.5005 12.001 22.5005ZM12.001 24.0006C15.1839 24.0006 18.2364 22.7362 20.487 20.4858C22.7376 18.2353 24.002 15.183 24.002 12.0003C24.002 8.81761 22.7376 5.76529 20.487 3.5148C18.2364 1.26431 15.1839 0 12.001 0C8.81815 0 5.76564 1.26431 3.51502 3.5148C1.26439 5.76529 0 8.81761 0 12.0003C0 15.183 1.26439 18.2353 3.51502 20.4858C5.76564 22.7362 8.81815 24.0006 12.001 24.0006Z' /%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.4559 7.45524C16.6658 7.24715 16.9492 7.13003 17.2448 7.12922C17.5404 7.1284 17.8245 7.24395 18.0356 7.45089C18.2467 7.65782 18.3678 7.93952 18.3729 8.23507C18.3779 8.53061 18.2664 8.81627 18.0625 9.03028L12.074 16.5155C11.9711 16.6263 11.8469 16.7153 11.7088 16.777C11.5707 16.8388 11.4215 16.872 11.2703 16.8748C11.1191 16.8776 10.9688 16.8499 10.8285 16.7933C10.6882 16.7367 10.5608 16.6524 10.4539 16.5455L6.48602 12.5764C6.37548 12.4734 6.28682 12.3492 6.22533 12.2112C6.16384 12.0732 6.13077 11.9242 6.1281 11.7731C6.12544 11.6221 6.15323 11.472 6.20982 11.3319C6.2664 11.1919 6.35063 11.0646 6.45746 10.9578C6.5643 10.8509 6.69156 10.7667 6.83166 10.7101C6.97175 10.6536 7.12181 10.6258 7.27287 10.6284C7.42394 10.6311 7.57292 10.6642 7.71093 10.7256C7.84894 10.7871 7.97315 10.8758 8.07616 10.9863L11.2174 14.1259L16.4274 7.48825C16.4367 7.47663 16.4467 7.4656 16.4574 7.45524H16.4559Z' /%3E%3C/svg%3E");
}
.review-box3__check--no {
    color: #555555;
    --rb3-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.001 22.5005C14.786 22.5005 17.457 21.3943 19.4263 19.4251C21.3956 17.4559 22.5019 14.7851 22.5019 12.0003C22.5019 9.21544 21.3956 6.54466 19.4263 4.57549C17.457 2.60631 14.786 1.50003 12.001 1.50003C9.216 1.50003 6.54506 2.60631 4.57576 4.57549C2.60647 6.54466 1.50013 9.21544 1.50013 12.0003C1.50013 14.7851 2.60647 17.4559 4.57576 19.4251C6.54506 21.3943 9.216 22.5005 12.001 22.5005ZM12.001 24.0006C15.1839 24.0006 18.2364 22.7362 20.487 20.4858C22.7376 18.2353 24.002 15.183 24.002 12.0003C24.002 8.81761 22.7376 5.76529 20.487 3.5148C18.2364 1.26431 15.1839 0 12.001 0C8.81815 0 5.76564 1.26431 3.51502 3.5148C1.26439 5.76529 0 8.81761 0 12.0003C0 15.183 1.26439 18.2353 3.51502 20.4858C5.76564 22.7362 8.81815 24.0006 12.001 24.0006Z' /%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.97085 6.96906C7.04052 6.89922 7.12329 6.8438 7.21442 6.80599C7.30554 6.76818 7.40323 6.74872 7.50189 6.74872C7.60055 6.74872 7.69824 6.76818 7.78937 6.80599C7.88049 6.8438 7.96326 6.89922 8.03294 6.96906L12.0023 10.9397L15.9716 6.96906C16.0413 6.89933 16.1241 6.84401 16.2153 6.80627C16.3064 6.76854 16.404 6.74911 16.5027 6.74911C16.6013 6.74911 16.6989 6.76854 16.7901 6.80627C16.8812 6.84401 16.964 6.89933 17.0337 6.96906C17.1034 7.0388 17.1588 7.12158 17.1965 7.21269C17.2342 7.30381 17.2537 7.40146 17.2537 7.50008C17.2537 7.59869 17.2342 7.69635 17.1965 7.78746C17.1588 7.87857 17.1034 7.96135 17.0337 8.03109L13.0629 12.0002L17.0337 15.9693C17.1034 16.039 17.1588 16.1218 17.1965 16.2129C17.2342 16.304 17.2537 16.4017 17.2537 16.5003C17.2537 16.5989 17.2342 16.6966 17.1965 16.7877C17.1588 16.8788 17.1034 16.9616 17.0337 17.0313C16.964 17.101 16.8812 17.1563 16.7901 17.1941C16.6989 17.2318 16.6013 17.2512 16.5027 17.2512C16.404 17.2512 16.3064 17.2318 16.2153 17.1941C16.1241 17.1563 16.0413 17.101 15.9716 17.0313L12.0023 13.0607L8.03294 17.0313C7.9632 17.101 7.88041 17.1563 7.78929 17.1941C7.69817 17.2318 7.60052 17.2512 7.50189 17.2512C7.40327 17.2512 7.30561 17.2318 7.21449 17.1941C7.12338 17.1563 7.04058 17.101 6.97085 17.0313C6.90111 16.9616 6.84579 16.8788 6.80805 16.7877C6.77031 16.6966 6.75088 16.5989 6.75088 16.5003C6.75088 16.4017 6.77031 16.304 6.80805 16.2129C6.84579 16.1218 6.90111 16.039 6.97085 15.9693L10.9417 12.0002L6.97085 8.03109C6.901 7.96142 6.84558 7.87865 6.80776 7.78753C6.76995 7.69641 6.75049 7.59873 6.75049 7.50008C6.75049 7.40142 6.76995 7.30374 6.80776 7.21262C6.84558 7.1215 6.901 7.03873 6.97085 6.96906Z' /%3E%3C/svg%3E");
}
.review-box3__check--limitation {
    color: #A12321;
    --rb3-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 22.5C14.7848 22.5 17.4555 21.3938 19.4246 19.4246C21.3938 17.4555 22.5 14.7848 22.5 12C22.5 9.21523 21.3938 6.54451 19.4246 4.57538C17.4555 2.60625 14.7848 1.5 12 1.5C9.21523 1.5 6.54451 2.60625 4.57538 4.57538C2.60625 6.54451 1.5 9.21523 1.5 12C1.5 14.7848 2.60625 17.4555 4.57538 19.4246C6.54451 21.3938 9.21523 22.5 12 22.5ZM12 24C15.1826 24 18.2348 22.7357 20.4853 20.4853C22.7357 18.2348 24 15.1826 24 12C24 8.8174 22.7357 5.76516 20.4853 3.51472C18.2348 1.26428 15.1826 0 12 0C8.8174 0 5.76516 1.26428 3.51472 3.51472C1.26428 5.76516 0 8.8174 0 12C0 15.1826 1.26428 18.2348 3.51472 20.4853C5.76516 22.7357 8.8174 24 12 24Z' /%3E%3Cpath d='M10.5039 16.5002C10.5039 16.3032 10.5427 16.1081 10.6181 15.9262C10.6935 15.7442 10.804 15.5788 10.9432 15.4395C11.0825 15.3002 11.2479 15.1897 11.4299 15.1144C11.6119 15.039 11.8069 15.0002 12.0039 15.0002C12.2009 15.0002 12.3959 15.039 12.5779 15.1144C12.7599 15.1897 12.9253 15.3002 13.0646 15.4395C13.2039 15.5788 13.3143 15.7442 13.3897 15.9262C13.4651 16.1081 13.5039 16.3032 13.5039 16.5002C13.5039 16.898 13.3459 17.2795 13.0646 17.5608C12.7833 17.8421 12.4017 18.0002 12.0039 18.0002C11.6061 18.0002 11.2246 17.8421 10.9432 17.5608C10.6619 17.2795 10.5039 16.898 10.5039 16.5002ZM10.6509 7.49268C10.6309 7.30344 10.651 7.11211 10.7097 6.93112C10.7684 6.75012 10.8646 6.5835 10.9919 6.44206C11.1192 6.30062 11.2748 6.18752 11.4486 6.1101C11.6225 6.03268 11.8106 5.99268 12.0009 5.99268C12.1912 5.99268 12.3794 6.03268 12.5532 6.1101C12.727 6.18752 12.8826 6.30062 13.0099 6.44206C13.1372 6.5835 13.2334 6.75012 13.2921 6.93112C13.3508 7.11211 13.3709 7.30344 13.3509 7.49268L12.8259 12.7532C12.8083 12.9598 12.7137 13.1523 12.5609 13.2926C12.4082 13.4329 12.2083 13.5108 12.0009 13.5108C11.7935 13.5108 11.5936 13.4329 11.4409 13.2926C11.2881 13.1523 11.1935 12.9598 11.1759 12.7532L10.6509 7.49268Z' /%3E%3C/svg%3E");
}
.review-box3__expanded {
    overflow: hidden;
    transition: max-height 0.3s ease, opacity 0.3s ease, padding 0.3s ease, margin 0.3s ease;
}

.review-box3__toggle-btn svg {
    transition: transform 0.3s ease;
}

.review-box3--collapsed .review-box3__toggle-btn svg {
    transform: rotate(180deg);
}

.review-box3--collapsed .review-box3__expanded {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    margin: 0;
    padding: 0 12px;
}

/* A shut panel's contents stay in the HTML (indexable) but the browser skips
   styling and laying them out: they are ~60% of a ranking page's elements.
   --closing keeps them rendered while the panel animates shut (review-box3.js). */
.review-box3--collapsed .review-box3__expanded:not(.review-box3__expanded--closing) {
    content-visibility: hidden;
}

.review-box3__payments {
    position: relative;
}

.review-box3__payments-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    font-weight: 600;
}

.review-box3__payments-panel-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 4px;
}

.review-box3__ratings {
    display: flex;
    gap: 8px;
    padding: 0 12px;
    min-width: 304px;
}

.safety-index-widget,
.expert-rating-widget {
    padding: 28px 18px;
    background: rgba(51, 51, 51, 1);
    border-radius: 12px;
    color: rgba(153, 153, 153, 1);
    font-size: var(--text-2xs);
    line-height: 16px;
    text-align: center;
    text-transform: uppercase;
    min-width: 148px;
    position: relative;
    height: fit-content;
    min-height: 100px;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
    max-height: 100px;
}

.safety-index-widget button,
.expert-rating-widget button {
    position: absolute;
    top: 8px;
    right: 8px;
    padding: 0;
    display: flex;
    border-radius: 200px;
    background: transparent;
    border: 0;
    outline: none;
    width: 12px;
    height: 12px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.expert-rating-popup,
.safety-index-popup,
.ad-disclosure-popup__inner {
    background: rgba(245, 245, 245, 1);
    position: absolute;
    max-width: 344px;
    border-radius: 16px;
    left: 12px;
    top: 150px;
    z-index: 1;
    padding: 16px;
    text-align: left;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.5);
}

/* The rating/safety popups are printed once per page (wp_footer) and shared
   by every ranking row, so they can no longer sit absolutely inside a row —
   show them as a centered fixed overlay instead. */
.expert-rating-popup,
.safety-index-popup {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 40px);
    z-index: 10000;
}

.ad-disclosure-popup__inner {
    position: relative;
    z-index: 1;
    max-width: 800px;
    width: 100%;
    margin: 0 20px;
    top: unset;
    left: unset;
}

.ad-disclosure-popup__header {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    padding-top: 2px;
    font-weight: 600;
}

.ad-disclosure-popup__content p:last-child {
    margin-bottom: 0;
}

.ad-disclosure-widget__info-btn {
    background: transparent;
    border: 0;
    cursor: pointer;
}

.expert-rating-popup__title,
.safety-index-popup__title {
    display: flex;
    margin-bottom: 10px;
    font-size: var(--text-sm);
    line-height: 23px;
    color: #000;
    font-weight: 600;
    text-transform: initial;
    margin-top: 4px;
}

.expert-rating-popup__content, .safety-index-popup__content, .expert-rating-popup__content *, .safety-index-popup__content * {
    font-size: var(--text-sm) !important;
    line-height: 23px !important;
    color: rgba(0, 0, 0, 1);
    text-transform: initial;
}

.expert-rating-popup__content p:last-child,
.safety-index-popup__content p:last-child {
    margin-bottom: 0;
}

.expert-rating-popup__close,
.safety-index-popup__close {

    position: absolute;
    padding: 0;
    display: flex;
    border-radius: 200px;
    background: transparent;
    border: 0;
    outline: none;
    align-items: center;
    justify-content: center;
    cursor: pointer;

    min-width: 18px;
    min-height: 18px;
    top: 19px !important;
    right: 19px !important;
    font-weight: 600;
}

.review-box--style2 .review-box-info {
    padding: 0 24px;
}

.expert-rating-widget__number {
    font-size: var(--text-body);
    font-weight: 300;
}

.safety-index-widget__label-text,
.expert-rating-widget__number strong {
    font-size: var(--h4-font-size);
    line-height: 28px;
    font-weight: 600;
    text-transform: initial;
}

.expert-rating-widget__icon,
.safety-index-widget__icon {
    width: 21px;
    height: 13px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: 7.5px 4px 7.5px 0;
}

.safety-index-widget__icon {
    width: 12px;
    height: 16px;
}

.safety-index-widget__score {
    display: flex;
    align-items: center;
    justify-content: center;
}

.review-box3__toggle-btn {
    background: transparent;
    outline: none;
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 6px 24px;
    color: rgba(241, 110, 0, 1);
    font-weight: 600;
    border-radius: 200px;
    position: absolute;
    bottom: -18px;
    left: 50%;
    transform: translate(-50%, 0px);
    z-index: 1;
    background: #111111;
    cursor: pointer;
    transition: all 0.3s ease;
}

.review-box3__toggle-btn svg path {
    transition: all 0.3s ease;
}

/* The toggle arrow is a sprite <use> reference now — CSS can't reach the
   path inside it, so the color travels via currentColor on the <svg>. */
.review-box3__toggle-btn svg {
    color: #F16E00;
    transition: color 0.3s ease;
}

.review-box3__toggle-btn:hover {
    background: rgba(237, 235, 228, 1);
    color: #000;
}

.review-box3__toggle-btn:hover svg path {
    fill: #000;
}

.review-box3__toggle-btn:hover svg {
    color: #000;
}

.review-box--style2 + .review-box--style2 {
    margin-top: 48px;
}

.review-box3__bonus-card {
    background: rgba(237, 235, 228, 1);
    padding: 8px;
    border-radius: 8px;
    font-size: var(--text-xs);
    line-height: 16px;
}

.review-box3__info-box-body {
    display: flex!important;
    flex-direction: column!important;
    gap: 4px!important;
}

.review-box3__bonus-empty {
    background: rgba(237, 235, 228, 1);
    padding: 8px;
    border-radius: 8px;
    font-size: var(--text-xs)!important;
    line-height: 16px!important;
    margin: 0!important;
    color: rgba(85, 85, 85, 1)!important;
}

.review-box3__bonus-card-type {
    font-size: var(--text-xs)!important;
    line-height: 16px!important;
    margin: 0 !important;
    color: rgba(85, 85, 85, 1)!important;
}

.review-box3__bonus-card-title {
    font-size: var(--text-sm)!important;
    line-height: 16px!important;
    font-weight: 600!important;
    letter-spacing: -4%!important;
    margin: 0 0 9px!important;
}

.review-box3__bonus-card-row {
    display: flex!important;
    justify-content: space-between;
    margin-top: 3px!important;
    align-items: center;
}

.review-box3__bonus-code {
    color: rgba(241, 110, 0, 1);
    font-weight: 600;
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 0;
    transition: gap 0.3s ease;
}

.review-box3__bonus-code:hover {
    gap: 16px;
}

.review-box3__payment-text {
    color: #999999;
}

/* Collapsed state — extra icons hidden */
.review-box3__payments[data-collapsed="true"] {
    overflow: hidden;
}
.review-box3__payments[data-collapsed="true"] .review-box3__payment-icon--extra {
    display: none;
}
.review-box3__payments[data-collapsed="true"] .review-box3__payments-header {
    display: none;
}
.review-box3__payments[data-collapsed="false"] .review-box3__payment-badge {
    display: none;
}



.review-box3__payments-wrap {
    position: relative;
}

/* One payments block per ranking row. On desktop it sits under the bonus,
   inside the info column; on phones it belongs below the CTA button instead.

   It used to be printed twice and hidden per screen size, which cost ~274 KB
   of duplicate HTML on the home page. `order` cannot move it on its own,
   because the block is a grandchild of .review-box-wrap while the CTA is a
   direct child — so on mobile the two wrappers around it are collapsed with
   `display: contents`, which promotes the bonus and the payments to direct
   flex children and puts them all in one reorderable row. Their own layout
   (full width, 12px side padding, centred) is restored below, since a box
   with `display: contents` no longer applies its own.

   Verified at 375 / 800 / 1280 px against the previous markup: every element
   lands on the same pixel. */
@media screen and (max-width: 768px) {
    .review-box--style2 .review-box-info,
    .review-box--style2 .review-box-meta {
        display: contents !important;
    }
    .review-box--style2 .review-bonus {
        order: 1;
        flex: 0 0 100%;
        max-width: 100%;
        padding: 0 12px;
        justify-content: center;
        text-align: center;
    }
    .review-box--style2 .review-box-actions {
        order: 2;
    }
    .review-box--style2 .review-box3__payments-wrap {
        order: 3;
        flex: 0 0 100%;
        max-width: 100%;
        padding: 0 12px;
        margin-top: -4px; /* 16px gap to the review link (wrap gap is 20px) */
    }
    .review-box--style2 .review-box3__payments-wrap .review-box3__payments {
        justify-content: center;
        flex-wrap: wrap;
    }
}

/* Separate desktop / mobile limits for inline payment icons (Payments admin
   screen). Both sets are in the HTML; each screen size shows its own set and
   its own "+N" badge. */
.review-box3__payment-icon--mobile-only,
.review-box3__payment-badge--mobile {
    display: none !important;
}
@media screen and (max-width: 768px) {
    .review-box3__payment-icon--mobile-only,
    .review-box3__payment-badge--mobile {
        display: inline-flex !important;
    }
    .review-box3__payment-icon--desktop-only,
    .review-box3__payment-badge--desktop {
        display: none !important;
    }
}

.review-box3__payments {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

/* Absolute panel — opens upward over content above */
.review-box3__payments-panel {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 10;
    /* dark like the payments bar, so it shows the same logos */
    background: #1a1a1a;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
    color: #f2f2f2;
    border-radius: 16px;
    padding: 24px;
    transform-origin: center;
    transform: scaleY(0);
    opacity: 0;
    top: 50%;
    transform: translateY(-50%) scaleY(0);
    transition: transform 0.3s ease, opacity 0.25s ease;
    height: fit-content;
    overflow: auto;
}

.review-box3__payments-panel--open {
    transform: translateY(-50%) scaleY(1);
    opacity: 1;
}

.review-box3__payments-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
    margin-bottom: 16px;
    min-height: 35px;
}

.review-box3__payments-panel-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 4px;
    align-items: center;
}

.review-box3__payments-close {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: transparent;
    border: 0;
    cursor: pointer;
}

.review-box3__payments-panel-grid .review-box3__payment-icon {
    height: 32px;
    box-sizing: border-box;
    padding: 0 12px;
    background: rgba(51, 51, 51, 1);
    border-radius: 6px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.review-box3__payments-panel-grid .review-box3__payment-icon.review-box3__payment-icon--text {
    padding: 0 12px;
}

.review-box3__payments-panel-grid .review-box3__payment-text {
    font-size: var(--text-sm);
    font-weight: 600;
    line-height: 1;
    color: #f2f2f2;
}

/* Payment icon images. Hand-made icons are 14px-tall SVGs; the ones the
   IGI Payments sync imports are PNGs with a transparent margin of their
   own, which used to render at full size. The --raster class
   (poka_child_payment_icon_class) drops the chip padding and fits an
   untrimmed PNG into a 56x28 box. */
.review-box3__payment-icon img {
    height: 14px;
    width: auto;
    max-width: 64px;
}

.review-box3__payment-icon.review-box3__payment-icon--raster {
    padding: 0;
}

.review-box3__payment-icon--raster img {
    width: 56px;
    height: 28px;
    max-width: none;
    object-fit: contain;
}

/* Trimmed PNGs (margin cropped on import or by "Trim icon margins" on the
   Payments screen): the chip is as wide as the logo, the logo height
   follows its shape so marks and wordmarks look the same size. */
.review-box3__payment-icon.review-box3__payment-icon--trimmed {
    padding: 0 12px;
}

.review-box3__payment-icon--trimmed img {
    width: auto;
    height: 22px;
    max-width: 96px;
}

.review-box3__payment-icon--trimmed.review-box3__payment-icon--wide img {
    height: 15px;
}

.review-box3__payment-icon--trimmed.review-box3__payment-icon--xwide img {
    height: 12px;
}

.ad-disclosure-popup { display: flex; position: fixed; inset: 0; z-index: 9999; align-items: center; justify-content: center; }
.ad-disclosure-popup__close { position: absolute; top: 1rem; right: 1rem; background: none; border: none; cursor: pointer; color: currentColor; }

.table-header__filter-btn {
    display: flex;
    align-items: center;
    gap: 0px;
    transition: gap 0.3s ease;
    color: var(--main-color);
    font-weight: 500;
    cursor: pointer;
    background: transparent;
    border: 0;
    gap: 12px;
}

.table-header__filter-btn:hover {
    gap: 20px;
}

.table-header__left {
    font-weight: 500;
}

.affiliates-table__empty {
    padding: 2rem;
    text-align: center;
    opacity: 0.6;
}

.table-header__right.table-header__right--filter {
    position: relative;
}

.deposit-filter-dropdown {
    background: rgba(217, 207, 192, 1);
    border-radius: 16px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    align-items: baseline;
    min-width: 328px;
    position: absolute;
    z-index: 1;
    right: 0;
    top: calc(100% + 6px);
}

.deposit-filter-dropdown__header {
    font-size: var(--text-sm);
    line-height: 23px;
    font-weight: 600;
    width: 100%;
    max-width: 100%;
}

.deposit-filter-dropdown hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid rgba(153, 153, 153, 1);
    margin: 12px 0 0;
    padding: 0;
}

.deposit-filter-dropdown .btn {
    min-width: unset;
    width: auto;
    font-size: var(--text-body);
    line-height: 28px;
    padding: 8px 16px;
    background-color: var(--primary-button-color);
    border: 2px solid var(--primary-button-color);
    transition: all 0.3s ease;
    color: var(--primary-button-text-color);
    cursor: pointer;
}

.deposit-filter-dropdown .btn:hover {
    transform: none !important;
    border-color: var(--primary-button-color);
    color: var(--primary-button-color);
    background-color: transparent;
}

.deposit-filter-dropdown__list {
    padding: 0!important;
    width: 100%!important;
    max-width: 100%!important;
}

.deposit-filter-dropdown__item {
    font-size: var(--text-sm);
    line-height: 23px;
    display: flex;
    gap: 8px;
    justify-content: space-between;
}

.deposit-filter-dropdown__item label {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 100%;
    cursor: pointer;
}

.visual-checkbox {
    width: 24px;
    height: 24px;
    background: rgba(237, 235, 228, 1);
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 3px;
}

.visual-checkbox.checked {
    background: rgba(241, 110, 0, 1);
}

.deposit-filter-dropdown__item .visual-checkbox.checked ~ label span,
.deposit-filter-dropdown__item label:has(input:checked) span {
    font-weight: 600;
}

.review-box-meta {
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 100% !important;
}

.review-box-wrap {
    flex-wrap: wrap!important;
    gap: 20px 0!important;
}

@media screen and (max-width: 992px) {
    .table-header {
        display: flex!important;
    }
    .review-box3__ratings {
        max-width: 100%;
        flex: 100%;
    }
    .safety-index-widget,
    .expert-rating-widget {
        max-width: 100%;
        flex: 100%;
    }
    .review-box--style2 .review-box-info {
        padding: 0 12px;
    }
    .review-box3__info-box {
        flex: 48%;
        max-width: 50%;
    }
    .review-logo.review-logo--centered {
        margin-left: auto !important;
    }
    .header-search-hover-wrap {
        display: none!important;
    }
}

@media screen and (max-width: 768px) {
    .review-box-meta {
        justify-content: center!important;
        align-items: center!important;
        text-align: center!important;
        display: flex!important;
        flex-direction: column!important;
    }
    .review-box-actions {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        justify-content: center !important;
        align-items: center !important;
    }
    .review-box--style2 {
        padding-bottom: 28px; /* a little more air between payments and "Show More" */
    }
    /* CTA: slightly larger label, a bit more room before the review link */
    .review-box--style2 .review-box-actions .btn.btn-primary {
        font-size: var(--text-body);
        margin-bottom: 16px;
    }
    .review-box--style2 + .review-box--style2 {
        margin-top: 32px;
    }
    .review-box3__expanded {
        margin-top: 6px;
    }
    .review-box3__info-box {
        flex: 100%;
        max-width: 100%;
    }
    .review-box-meta {
        margin-bottom: 0 !important;
    }
    /* Rating tiles: compact, equal height, one-line value */
    .review-box3__ratings {
        align-items: stretch;
    }
    .safety-index-widget, .expert-rating-widget {
        padding: 12px 10px 10px;
        min-height: 72px;
        max-height: none;
        height: auto;
    }
    .safety-index-widget__label-text,
    .expert-rating-widget__number strong {
        font-size: var(--text-body);
        line-height: 22px;
    }
    .expert-rating-widget__number {
        font-size: var(--text-sm);
    }
    .safety-index-widget__label,
    .expert-rating-widget__label {
        font-size: var(--text-2xs);
        line-height: 14px;
    }
    /* Top row: bigger rank number, casino name (may wrap to 2 lines) and logo */
    .review-box--style2 .review-badge, .review-box--style2 .review-box-name {
        margin-right: 16px !important;
        font-size: var(--h4-font-size);
        line-height: 24px;
    }
    .review-box--style2 .review-box-name {
        flex: 1 1 auto;
        min-width: 0;
        text-align: left;
    }
    .review-box--style2 .review-box-thumb--counter,
    .review-box--style2 .review-box-thumb--counter:after {
        font-size: var(--h4-font-size);
    }
    .review-box--style2 .review-box-thumb--counter,
    .review-box--style2 .review-logo {
        flex: 0 0 auto;
    }

    .review-box--style2 .review-logo > img,
    .review-box--style2 .review-logo > picture > img {
        width: 150px!important;
        height: 50px!important;
    }
    .review-box--style2 .review-box-disclaimer {
        font-size: var(--text-2xs);
        line-height: 16px;
        padding: 8px 12px;
    }
    /* Main bonus: icon + text centred as one group */
    .review-box--style2 .review-bonus {
        justify-content: center;
        text-align: center;
        width: 100%;
    }
    .review-box--style2 .review-bonus .info {
        align-items: center;
        text-align: center;
    }
    .review-box--style2 .review-bonus .info .desc,
    .review-box--style2 .review-bonus .info .label {
        text-align: center;
    }

    .review-logo > picture > img {
        max-height: 60px;
    }

    .poka-affiliate-card__casino-logo {
        max-height: 40px;
    }

    .poka-affiliate-card__casino-name {
        font-size: var(--text-sm);
        font-weight: 600;
    }
}

.header-toc-wrapper a.toc-link.active {
    color: var(--primary-button-color)!important;
}

/* Remove existing ::after arrow */
.site-header--style2 .header-menu > li.menu-item-has-children > a::after {
    content: none;
}

/* SVG arrow alignment */
.header-menu > li > a,
.header-menu .sub-menu > li > a {
    display: flex;
    align-items: center;
    gap: 6px;
}

.header-menu > li.menu-item-has-children a {
    padding-right: 24px !important;
    gap: 8px;
    display: flex;
    align-items: center;
}

.menu-arrow--down {
    transform: rotate(180deg);
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    margin-bottom: -2px;
    transition: all 0.3s ease;
}

.header-menu > li.menu-item-has-children {
    padding-right: 0 !important;
}

.header-menu > li.menu-item-has-children:hover {
    cursor: pointer;
}

.header-menu > li.menu-item-has-children:hover .menu-arrow {
    transform: rotate(0deg)!important;
    margin-bottom: 0px!important;
    cursor: pointer;
}

.menu-arrow--right {
    flex-shrink: 0;
}

.header-menu .sub-menu a,
.header-menu > li.menu-item-has-children a a {
    padding-right: 0px !important;
}

.header-menu .sub-menu a
svg.menu-arrow.menu-arrow--right {
    width: 12px;
    height: 12px;
    margin-left: auto;
}

.header-menu .sub-menu a
svg.menu-arrow.menu-arrow--right path {
    fill: var(--header-text-color)!important;
    transition: fill 0.3s ease;
}

.header-menu .sub-menu a:hover
svg.menu-arrow.menu-arrow--right path {
    fill: var(--main-color)!important;
}

.header-menu .sub-menu a,
.header-menu > li.menu-item-has-children a a {
    padding-right: 0px !important;
}

.header-menu > li.menu-item-has-children > .sub-menu a {
    padding-right: 0 !important;
}

.header-menu > li.menu-item-has-children > .sub-menu {
    top: calc(100% + 14px);
}

.header-menu > li.menu-item-has-children > .sub-menu .menu-item-has-children .sub-menu {
    left: calc(100% + 24px);
    top: -15px;
}

.header-menu > li.menu-item-has-children > .sub-menu .menu-item-has-children > a::before,
.menu-item.menu-item-has-children > a:after {
    content: none!important;
    display: none!important;
}



/* Wrap containing icon + pill */
.header-search-hover-wrap {
    position: relative;
    display: flex;
    align-items: center;
    padding: 0.9375rem 0 0.9375rem 0;
    width: 65px;
    height: 65px;
}

/* The pill: under the icon, opened by a click (front.js, part 5) */
.header-search-pill {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    width: 280px;
    margin-top: 8px;
    border-radius: 999px;
    background: var(--header-text-color-hover);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

.header-search-hover-wrap.is-open .header-search-pill {
    display: block;
}

.site-header--style2 .header-search-form input[type=text] {
    padding: 0.9375rem 0 0.9375rem 0;
    border-bottom: 0;
}

.header-search-pill .header-search-form {
    display: flex;
    align-items: center;
    background: transparent;
    border-radius: 999px;
    padding: 0 24px;
    gap: 8px;
    white-space: nowrap;

}

.header-search-pill input[type="text"] {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font-size: var(--text-body);
    font-weight: 600;
    color: inherit;
    min-width: 0;
    color: #000;
}

.header-search-pill input[type="text"]::placeholder {
    opacity: 0.6;
}

button.icon-btn.icon-btn--gray.header-search-trigger {
    background: transparent !important;
    border: 0 !important;
    z-index: 1;
}

.header-search-trigger svg path {
    transition: fill 0.15s ease;
}

.header-search-trigger:hover svg path,
.header-search-trigger:focus-visible svg path,
.header-search-hover-wrap.is-open .header-search-trigger svg path {
    fill: var(--primary-button-color);
}

.site-header--style2 .header-search-form {
    -webkit-box-shadow: none!important;
    box-shadow: none!important;
}

.posts-archives-wrapper .post-element--s1 {
    border-radius: var(--border-radius)!important;
}

#pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    align-items: center;
}

#pagination .page-numbers {
    margin: 0!important;
}

.pagination a,
.pagination span {
    padding: 12px 20px;
    border-radius: 12px;
    -webkit-box-shadow: none!important;
    box-shadow: none!important;
}









/* ── Mobile menu panel ── */
.mobile-menu-panel {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: rgba(17, 17, 17, 1);
    z-index: 999;
    max-height: calc(100vh - 100%);
    overflow-y: auto;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
    padding: 24px;
}

.mobile-menu-panel.is-open {
    display: block;
}

/* Overlay */
.mobile-menu-overlay {
    display: none;
    /*position: fixed;
    inset: 0;
    z-index: 998;
    background: rgba(0,0,0,0.5);*/
}

.mobile-menu-overlay.is-open {
    display: block;
}

/* Menu list */
.mobile-menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mobile-menu-list li {
    border-bottom: 2px solid rgba(51, 51, 51, 1);
}

.mobile-menu-list li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0px;
    color: #fff;
    text-decoration: none;
    font-size: var(--text-sm);
}

.mobile-menu-list li a:hover {
    color: var(--primary-button-color);
}

/* Submenus — always visible, indented */
.mobile-menu-list .sub-menu {
    /*display: block !important;*/
    list-style: none;
    margin: 0;
    padding: 0;
    border-top: 2px solid rgba(255,255,255,0.08);
}

.mobile-menu-list .sub-menu li {
    margin-left: 24px;
}

.mobile-menu-list .sub-menu li:last-child {
    border: none;
}

.mobile-menu-list .sub-menu li a {
    padding-left: 0px;
    font-size: var(--text-sm);
    color: rgba(255,255,255,0.7);
}

.mobile-menu-list .sub-menu li a:hover {
    color: var(--primary-button-color);
}


/* Remove the ::after */
.mobile-menu-list li a::after {
    content: none;
}

/* SVG arrow */
.mobile-menu-arrow {
    flex-shrink: 0;
    transition: fill 0.2s ease;
}

.mobile-menu-list li a .mobile-menu-arrow path {
    fill: #fff;
}

.mobile-menu-list li a:hover .mobile-menu-arrow path {
    fill: var(--primary-button-color);
}

.menu-item:not(.menu-item-has-children) > a svg {
    display: none;
}

.menu-item.menu-item-has-children > a:after {
    content: ":";
    margin-right: auto;
    margin-left: 2px;
}

.header-right-btns {
    align-items: center;
    z-index: 1;
}

.header-top-flex-part--right .icon-btn {
    cursor: pointer;
    width: 40px;
    height: 40px;
    background: #fff;
    border: 0;
    margin: 8px 0;
}

.icon-btn:hover {
    opacity: 1;
}

.icon-btn[aria-expanded="true"] {
    background: var(--primary-button-color);
}

.section-review-content {
    padding: 0;
}

.section-review-content .table-header__right {
    display: none!important;
}

/* Reviews/Affiliates Single */

.review-success-popup {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.review-success-popup__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.4);
    cursor: pointer;
}

.review-success-popup__box {
    position: relative;
    z-index: 1;
    background: #fff;
    border-radius: 20px;
    padding: 48px 40px;
    max-width: 480px;
    width: 90%;
    text-align: center;
}

.review-success-popup__icons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin-bottom: 20px;
    color: var(--boxes-secondary-background-color, #D9CFC0);
}

.review-success-popup__message {
    font-size: var(--h5-font-size);
    font-weight: 600;
    line-height: 1.5;
    color: #222;
}

.review-card {
    background: #fff;
    padding: 24px 16px;
    border-radius: 16px;
}

.review-card__header {
    display: flex;
    gap: 12px;
    justify-content: space-between;
    align-items: center;
    font-size: var(--text-sm);
    font-weight: 500;
    flex-wrap: wrap;
}

.review-card__overall {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 12px 24px;
}

.review-card__content {
    font-size: var(--text-sm);
    line-height: 23px;
    padding: 8px 0;
    color: rgba(110, 119, 131, 1);
}

.review-card__date {
    color: rgba(163, 163, 163, 1);
    text-transform: uppercase;
    letter-spacing: 10%;
    font-size: var(--text-sm);
    margin-bottom: 24px;
    display: block;
}

.review-card__categories {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.review-card__category-row {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: space-between;
    font-size: var(--text-sm);
    font-weight: 500;
    line-height: 23px;
}

.review-card__proscons {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 24px;
}

.review-card__proscon {
    padding: 8px;
    background: rgba(232, 247, 239, 1);
    border-radius: 200px;
    display: flex;
    align-items: center;
    gap: 24px;
    font-size: var(--text-sm);
    line-height: 23px;
    font-weight: 500;
}

.review-card__proscon--pro {
    background: rgba(232, 247, 239, 1);
    color: rgba(51, 51, 51, 1);
}

.review-card__proscon--con {
    background: rgba(237, 235, 228, 1);
    color: rgba(161, 35, 33, 1);
}

.rating {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 1.8px;
}

.rating .icon {
    color: var(--main-color);
    display: inline-flex;
}

.affiliate-reviews__header {
    margin-bottom: 24px;
    text-align: center;
    position: relative;
}

#affiliate-reviews {
    padding: 0;
}

.rating .icon:before {
    font-size: var(--text-sm) !important;
}

.affiliate-reviews__overall {
    display: flex;
    flex-direction: column;
    justify-content: right;
    text-align: right;
    position: absolute;
    top: 0;
    right: 0;
}

.affiliate-reviews__overall-score {
    display: flex;
    text-align: right;
    justify-content: right;
    align-items: baseline;
    font-size: var(--h3-font-size);
    font-weight: 600;
    margin-top: -8px;
}

.affiliate-reviews__stars {
    margin-right: 16px;
    margin-top: 1.8px;
}

.affiliate-reviews__overall-max {
    margin-left: 6px;
    display: inline-flex;
    gap: 6px;
    font-size: var(--text-sm);
    font-weight: 400;
}

.affiliate-reviews__overall-label {
    letter-spacing: 10%;
    margin-right: -3px;
}

.affiliate-reviews__title {
    max-width: 75%;
    margin: 0 auto var(--h1-margin);
    font-size: var(--h2-font-size);
}

.review-form-wrap__title {
    text-align: center;
    font-size: var(--h2-font-size);
}

.review-form__ratings {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(24px, 2.4vw, 40px);
    justify-content: space-between;
}

.review-form__ratings-col {
    flex: 40%;
    max-width: 50%;
}

.review-form__rating-row {
    display: inline-flex;
    width: 100%;
    gap: 16px;
    justify-content: space-between;
    font-size: var(--text-sm);
}

.poka-star-o:before,
.poka-star:before {
    color: rgba(241, 110, 0, 1);
}

.review-star-input {
    display: flex;
    gap: 8px;
    align-items: center;
}

.review-star-input__star {
    background: transparent;
    border: 0;
    display: flex;
}

.review-form__footer .btn {
    cursor: pointer;
    min-width: unset!important;
    font-size: var(--text-body);
    gap: 8px;
    display: flex;
    align-items: end;
    margin-left: auto;
}

.review-form__footer .btn svg path {
    transition: fill 0.3s ease;
}

.review-form__footer .btn:hover svg path {
    fill: var(--primary-button-color);
}

.review-form__footer {
    margin-top: 12px;
}

@media screen and (max-width: 992px) {
    .affiliate-reviews__overall {
        display: none;
    }
}

@media screen and (max-width: 768px) {
    .review-form__ratings-col {
        flex: 100%;
        max-width: 100%;
    }
}

.wp-block-poka-faq {
    max-width: 1080px;
    margin: 0 auto;
}

.review-form__rating-label {
    font-weight: 500;
}

.wysiwyg-part ul > li::before {
    content: unset;
}

.wysiwyg-part ul {
    list-style: disc;
}

.affiliate-general-info {
    padding: 24px;
    background: var(--boxes-background-color, #fff);
    border-radius: 16px;
}

.affiliate-general-info__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 40px;
    max-width: 1080px;
    margin: 0 auto;
}

.affiliate-general-info__row {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 10px 0;
}

.affiliate-general-info__row > span {
    max-width: 250px;
    flex: 250px;
}

.affiliate-general-info__col:last-child .affiliate-general-info__row:last-child,
.affiliate-general-info__col:first-child .affiliate-general-info__row:last-child {
    border-bottom: none;
}

.affiliate-general-info__label {
    flex: 1;
    color: var(--boxes-text-color, #555);
    font-size: var(--text-sm);
}

.affiliate-general-info__value {
    font-weight: 700;
    font-size: var(--text-sm);
    color: var(--text-color, #222);
}

@media (max-width: 768px) {
    .affiliate-general-info__inner {
        grid-template-columns: 1fr;
    }

    .affiliate-general-info__row {
        justify-content: space-between;
    }

    .affiliate-general-info__row > span {
        max-width: unset;
        flex: unset;
    }
}

.affiliate-score-table tfoot,
.affiliate-score-table tfoot td {
    border-color: #d9cfc0!important;
}

.affiliate-score-table__score {
    display: flex;
    align-items: center;
    gap: 4px;
}

.affiliate-score-table__score svg {
    margin-right: 12px;
    margin-top: 1px;
}

.affiliate-score-badge__wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 24px;
}

.affiliate-score-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--boxes-secondary-background-color, #111);
    color: #fff;
    border-radius: 16px;
    padding: 12px 16px 11px;
    font-size: var(--h3-font-size);
    font-weight: 500;
    margin: 0 auto;
}

.affiliate-score-badge__score {
    white-space: nowrap;
    font-size: var(--text-xs);
    line-height: 23px;
    letter-spacing: 1px;
}

.single-post-wrapper img:not(.post-element-author img, .review-logo--rounded > img) {
    border-radius: 0;
}

.expert-take {
    background: rgba(217, 207, 192, 1);
    border-radius: 16px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.expert-take__header {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    max-width: 856px;
    margin: 0 auto;
}

.expert-take__header img {
    width: 50px;
    height: 50px;
    border-radius: 200px !important;
    background: #ddd;
    object-fit: cover;
}

.expert-take__avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.expert-take__label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--text-body);
    margin-bottom: 16px;
}

.expert-take__quote {
    margin: 0;
    font-style: italic;
    font-size: var(--text-body);
    line-height: 24px;
    padding-left: 0;
    border: none;
    color: rgba(34, 34, 34, 1);
}

/* Hide SSR header in editor since quote is shown separately */
.expert-take__quote--editor {
    border: 1px dashed rgba(0,0,0,0.15);
    padding: 8px;
    border-radius: 8px;
    margin-top: 4px;
}

@media screen and (max-width: 768px) {
    .expert-take {
        padding: 10px;
        gap: 10px;
    }
    .expert-take__header {
        gap: 10px;
    }
    .expert-take__header img {
        width: 24px;
        height: 24px;
    }
    .expert-take__label {
        font-size: var(--text-sm);
        margin-bottom: 4px;
    }
    .expert-take__quote {
        font-size: var(--text-sm);
        line-height: 23px;
    }
}

#menu-primary-menu .menu-item.menu-item-has-children > a svg {
    display: block;
}

.faq-wrapper .faq-list .faq-item .faq-item-question::after,
.faq-wrapper .faq-list .faq-item.open .faq-item-question::after {
	content: url("data:image/svg+xml;charset=utf-8,%3Csvg width=%2224%22 height=%2224%22 viewBox=%220 0 24 24%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cpath fill-rule=%22evenodd%22 clip-rule=%22evenodd%22 d=%22M12 6C12.1989 6 12.3896 6.07902 12.5303 6.21967C12.671 6.36032 12.75 6.55109 12.75 6.75V15.4395L15.969 12.219C16.0387 12.1493 16.1215 12.094 16.2126 12.0562C16.3037 12.0185 16.4014 11.9991 16.5 11.9991C16.5986 11.9991 16.6962 12.0185 16.7873 12.0562C16.8785 12.094 16.9612 12.1493 17.031 12.219C17.1007 12.2887 17.156 12.3715 17.1938 12.4626C17.2315 12.5537 17.2509 12.6514 17.2509 12.75C17.2509 12.8486 17.2315 12.9463 17.1938 13.0374C17.156 13.1285 17.1007 13.2113 17.031 13.281L12.531 17.781C12.4613 17.8508 12.3785 17.9063 12.2874 17.9441C12.1963 17.9819 12.0986 18.0013 12 18.0013C11.9013 18.0013 11.8036 17.9819 11.7125 17.9441C11.6214 17.9063 11.5386 17.8508 11.469 17.781L6.96897 13.281C6.89924 13.2113 6.84392 13.1285 6.80619 13.0374C6.76845 12.9463 6.74902 12.8486 6.74902 12.75C6.74902 12.6514 6.76845 12.5537 6.80619 12.4626C6.84392 12.3715 6.89924 12.2887 6.96897 12.219C7.1098 12.0782 7.30081 11.9991 7.49997 11.9991C7.59859 11.9991 7.69624 12.0185 7.78735 12.0562C7.87846 12.094 7.96124 12.1493 8.03097 12.219L11.25 15.4395V6.75C11.25 6.55109 11.329 6.36032 11.4696 6.21967C11.6103 6.07902 11.8011 6 12 6Z%22 fill=%22black%22/%3E%3C/svg%3E");
    top: 0.8rem;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

/* Mobile Panel Style */
.mobile-menu-panel {
    background: #111 !important; /* Black background */
    padding: 20px !important;
}

.mobile-menu-list li {
    border-bottom: 1px solid #333;
    list-style: none;
}

.mobile-menu-list li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    color: #fff;
    text-decoration: none;
}

/* --- THE IMPORTANT PART: Indent the children --- */
.mobile-menu-list .sub-menu {
    display: block !important; /* Always expanded in the mobile panel */
    padding-left: 25px !important; /* Pushes the sub-menus inward */
    border-top: 1px solid #222;
}

/* Parent that links to the current page (e.g. homepage): hide it, show only its sub-pages */
.mobile-menu-list > li.mobile-menu-item--here {
    border-bottom: 0;
}

.mobile-menu-list > li.mobile-menu-item--here > a {
    display: none !important;
}

.mobile-menu-list > li.mobile-menu-item--here > .sub-menu {
    padding-left: 0 !important;
    border-top: 0;
}

.mobile-menu-list > li.mobile-menu-item--here > .sub-menu > li {
    margin-left: 0;
}

.mobile-menu-list > li.mobile-menu-item--here > .sub-menu > li > a {
    color: #fff;
}

.menu-arrow {
    transition: transform 0.2s ease;
    pointer-events: all; /* So it catches the click */
}

/* Desktop Sub-Sub Menus (To the right) */
@media (min-width: 992px) {
    .header-menu .sub-menu .menu-item-has-children { position: relative; }
    .header-menu .sub-menu .sub-menu {
        position: absolute;
        top: 0;
        left: 100%;
        display: none;
    }
    .header-menu .sub-menu li:hover > .sub-menu { display: block; }
}

.mobile-submenu-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.25s ease;
}

/* when it opens → rotate */
.mobile-menu-list .menu-item-has-children.is-active > a .mobile-submenu-toggle {
	transform: rotate(180deg);
}

/* sticky header */
.site-header--sticky {
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 99999;
}

/* back-to-top css */
#back-to-top {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    border: 1px solid rgba(217, 207, 192, 1);
    background: rgba(255, 255, 255, 0.2);
    color: rgba(217, 207, 192, 1);
    font-size: var(--h4-font-size);
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s, transform 0.2s, color 0.2s, background 0.2s, border-color 0.2s;
    z-index: 999;

    @media screen and (max-width: 768px) {
        bottom: 9rem;
        right: 0;
    }

    &.visible {
        opacity: 1;
        visibility: visible;
    }

    &:hover {
        /* transform: translateY(-3px); */
        border-color: rgba(217, 207, 192, 1);
        background: rgba(217, 207, 192, 1);
        color: rgba(51, 51, 51, 1);
    }
}

/* Header TOC arrow */
.header-toc-arrow {
  transition: opacity 0.2s;

  &.is-disabled {
    opacity: 0.2;
    pointer-events: none;
  }
}

/* ── Ranking table header: sort dropdown ──────────────────────────────
   Moved here from an inline <style> printed in wp_footer — a <style>
   element inside <body> is invalid HTML (W3C validator error). */
.sort-filter-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 999;
    min-width: 220px;
    background: rgba(217, 207, 192, 1);
    border-radius: 12px;
    padding: 24px 24px 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}
.sort-filter-dropdown__header {
    margin-bottom: 12px;
}
.sort-filter-dropdown__header span {
    display: block;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var( --color-text, #1a1a1a );
    margin-bottom: 10px;
}
.sort-filter-dropdown__header hr {
    border: none;
    border-top: 1px solid rgba(0,0,0,.12);
    margin: 0;
}
.sort-filter-dropdown__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.sort-filter-dropdown__item {
    margin: 0;
    padding: 0;
}
.sort-filter-dropdown__option {
    display: block;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    padding: 8px 0;
    font-size: var(--text-sm);
    color: var( --color-text, #1a1a1a );
    cursor: pointer;
    transition: color .15s;
    font-family: inherit;
    font-weight: 600;
}
.sort-filter-dropdown__option:hover,
.sort-filter-dropdown__option--active {
    color: var( --color-primary, #F16E00 );
}
.table-header__right--filter {
    position: relative;
}
ul.sort-filter-dropdown__list {
    list-style: none;
    padding: 0;
    gap: 0;
}
li.sort-filter-dropdown__item {
    margin: 0 !important;
}

/* "Read more" on a paragraph (inc/read-more.php): two lines until opened */
.poka-read-more {
    position: relative;
    margin-bottom: 16px;
}
/* A plain block cut to two lines, not -webkit-box: in Safari (every iPhone
   browser) -webkit-box ignores the float below, and the text ran under the link */
.poka-read-more > p {
    display: block;
    max-height: 2lh;
    overflow: hidden;
    margin: 0;
}
.poka-read-more__toggle {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    opacity: 0;
    pointer-events: none;
}
/* Keeps the end of the second line free for the link; the first line stays full */
.poka-read-more > p::before {
    content: "";
    float: right;
    width: 6em;
    height: 2lh;
    shape-outside: inset( 1lh 0 0 0 );
}
.poka-read-more__toggle:checked ~ p {
    max-height: none;
    overflow: visible;
}
.poka-read-more__toggle:checked ~ p::before {
    display: none;
}
.poka-read-more__toggle:checked ~ .poka-read-more__label {
    position: static;
    margin-top: 4px;
}
.poka-read-more__label {
    position: absolute;
    right: 0;
    bottom: 3px;
    display: inline-block;
    margin: 0;
}
.poka-read-more__label,
.poka-read-more__link {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var( --color-primary, #F16E00 );
    text-decoration: underline;
    cursor: pointer;
}
.poka-read-more__toggle:focus-visible ~ .poka-read-more__label,
.poka-read-more__toggle:focus-visible ~ p .poka-read-more__link {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}
/* assets/js/read-more.js has put "…" and the link right after a word: no space
   to keep free, and the link under the text only shows once opened */
.poka-read-more__link {
    margin: 0;
    white-space: nowrap;
}
.poka-read-more.is-cut > p::before,
.poka-read-more.is-cut > .poka-read-more__label,
.poka-read-more__toggle:checked ~ p .poka-read-more__cut {
    display: none;
}
.poka-read-more.is-cut > .poka-read-more__toggle:checked ~ .poka-read-more__label {
    display: inline-block;
}
/* Browsers without the lh unit (Safari before 16.4): link on its own line under the text */
@supports not ( height: 1lh ) {
    .poka-read-more > p {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }
    .poka-read-more__toggle:checked ~ p {
        display: block;
    }
    .poka-read-more > p::before {
        display: none;
    }
    .poka-read-more__label {
        position: static;
        margin-top: 4px;
    }
}
.poka-read-more__less,
.poka-read-more__toggle:checked ~ .poka-read-more__label .poka-read-more__more {
    display: none;
}
.poka-read-more__toggle:checked ~ .poka-read-more__label .poka-read-more__less {
    display: inline;
}

/* Author line on one line (Poka Post Info block → "One line, short date") */
.post-element-info--one-line {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0;
}
.post-element-info--one-line .post-element-info__authors a,
.post-element-info--one-line .post-element-info__date {
    font-size: inherit;
}
.post-element-info--one-line .post-element-info__date {
    white-space: nowrap;
}
.post-element-info--one-line .post-element-info__date::before {
    content: "·";
    margin-left: 4px;
}
@media ( max-width: 480px ) {
    /* Two classes: the parent theme sets the size with two as well */
    .post-element-info.post-element-info--one-line {
        font-size: var(--text-2xs);
    }
    .post-element-info--one-line .post-element-info__date-label {
        display: none;
    }
}