/*------------------------------------------------------------------
[8.1 - Affiliate page]
*/
.affiliate-boxes-area {
    .affiliate-box {
        cursor: default;
        background: white;

        &-icon {
            width: 5.5rem;
            height: 5.5rem;
            color: var(--color-1);
            border-radius: 50%;
            @include transition(all 1s ease);
        }

        &:hover {
            .affiliate-box-icon {
                background: var(--color-1);
                box-shadow: 0px 2px 30px rgba(var(--color-1-rgb),.1);
                color: white;
            }
        }

        &-title {
            color: var(--color-3);
            font-size: 1.5rem;
            line-height: 1;
            font-weight: 700;
        }
    }
}

.affiliate-table-area {
    background: var(--color-4);

    .country-rates-card {
        height: 30rem;
    }

    table {
        th, 
        td {
            font-size: 1.125rem;
            color: var(--color-3);
        }

        &.table-scroll {
            tbody {
                position: absolute;
                overflow-y: scroll;
                height: 19.5rem;
                padding-right: 1.5rem;
            }

            tr {
                width: 100%;
                table-layout: fixed;
                display: inline-table;
            }
        }

        tfoot {
            position: absolute;
            bottom: 0;
            padding-bottom: 2.5rem;

            td {
                border: none;
                padding: 0;
                font-size: .875rem;
            }
        }

        ::-webkit-scrollbar {
            width: .5rem;
        
            &-track {
                background: #f1f1f1;
                border-radius: 1rem;
            }
        
            &-thumb {
                background: rgba(var(--color-2-rgb),.25);
                border-radius: .5rem;
            }
        }
    }
}
