.elementor-kit-34{--e-global-color-primary:#08EFFF;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-kit-34 e-page-transition{background-color:#FFBC7D;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */.dashboard-notifications .notification {
    background-color: #f9f9f9;
    padding: 10px;
    border: 1px solid #ddd;
    margin-bottom: 10px;
    border-radius: 5px;
}

.dashboard-notifications .notification p {
    margin: 0;
    font-size: 14px;
}

.dashboard-notifications .mark-as-read {
    color: #0073aa;
    text-decoration: none;
    font-size: 12px;
}

.dashboard-notifications .mark-as-read:hover {
    text-decoration: underline;
}

    .pagination-link {
        margin: 0 5px;
        padding: 5px 10px;
        background-color: #f5f5f5;
        border: 1px solid #ddd;
        color: #0073aa;
        text-decoration: none;
        border-radius: 4px;
    }

    .pagination-link:hover {
        background-color: #0073aa;
        color: #fff;
    }

    .pagination-link.active {
        background-color: #0073aa;
        color: #fff;
    }

/* Style the container */
.referral-overview {
    margin: 20px 0;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background-color: #f9f9f9;
}

/* Style the table */
#referral-table {
    width: 100%;
    border-collapse: collapse; /* Ensure borders do not overlap */
    margin-bottom: 20px;
}

/* Style table headers */
#referral-table th {
    background-color: #0073aa; /* WordPress blue */
    color: #ffffff;
    padding: 10px;
    text-align: left;
    font-weight: bold;
    border-bottom: 2px solid #005177; /* Darker shade for border */
}

/* Style table cells */
#referral-table td {
    padding: 10px;
    border-bottom: 1px solid #ddd; /* Light grey bottom border for rows */
}

/* Alternate row coloring for better readability */
#referral-table tr:nth-child(even) {
    background-color: #f2f2f2; /* Light grey for even rows */
}

/* Hover effect for rows */
#referral-table tr:hover {
    background-color: #e0f7fa; /* Light cyan on hover */
}

/* Style pagination container */
.pagination-wrap {
    text-align: center;
    margin-top: 20px;
}

/* Style pagination links */
.pagination-link {
    display: inline-block;
    margin: 0 5px;
    padding: 5px 10px;
    background-color: #0073aa; /* WordPress blue */
    color: #ffffff;
    text-decoration: none;
    border-radius: 4px;
    transition: background-color 0.3s ease; /* Smooth transition effect */
}

/* Style pagination links on hover */
.pagination-link:hover {
    background-color: #005177; /* Darker blue on hover */
}

/* Active page styling */
.pagination-link.active {
    background-color: #333; /* Darker background for active page */
    color: #ffffff;
}

/* Responsive table styling */
@media screen and (max-width: 768px) {
    .referral-overview {
        padding: 10px;
    }

    #referral-table, #referral-table th, #referral-table td {
        font-size: 14px; /* Smaller font size for mobile */
        padding: 8px; /* Smaller padding for mobile */
    }
}
/* Pagination container styling */
.pagination-wrap {
    display: flex;
    justify-content: center; /* Center the pagination */
    align-items: center;
    margin-top: 20px;
    gap: 5px; /* Space between pagination items */
}

/* Style pagination links */
.pagination-link {
    display: inline-block;
    padding: 6px 12px;
    margin: 0 3px; /* Space between links */
    background-color: #0073aa; /* WordPress blue */
    color: #ffffff;
    text-decoration: none;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease; /* Smooth transition for hover effects */
}

/* Hover effect for pagination links */
.pagination-link:hover {
    background-color: #005177; /* Darker blue on hover */
    color: #ffffff;
}

/* Active page styling */
.pagination-link.active {
    background-color: #333; /* Darker background for active page */
    color: #ffffff;
    pointer-events: none; /* Disable pointer events for active link */
}

/* Disabled pagination styling */
.pagination-link.disabled {
    background-color: #cccccc; /* Light grey for disabled state */
    color: #666666;
    cursor: not-allowed; /* Show not-allowed cursor for disabled links */
    pointer-events: none; /* Disable clicks on disabled links */
}

/* Previous and Next button styling */
.pagination-prev, .pagination-next {
    display: inline-block;
    padding: 6px 12px;
    margin: 0 3px; /* Space between links */
    background-color: #0073aa;
    color: #ffffff;
    text-decoration: none;
    border-radius: 4px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Hover effect for Previous and Next buttons */
.pagination-prev:hover, .pagination-next:hover {
    background-color: #005177;
    color: #ffffff;
}

/* Responsive styling for pagination */
@media screen and (max-width: 768px) {
    .pagination-link, .pagination-prev, .pagination-next {
        padding: 4px 8px;
        margin: 0 2px;
        font-size: 14px;
    }
}

#referralsChart, #earningsChart {
    max-height: 500px; /* Set a max height to avoid infinite height issue */
}/* End custom CSS */