.elementor-2581 .elementor-element.elementor-element-ab44017{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-2581 .elementor-element.elementor-element-28b8187{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-2581 .elementor-element.elementor-element-cc66596{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-2581 .elementor-element.elementor-element-ba7e179{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-2581 .elementor-element.elementor-element-28b8187{--width:20%;}.elementor-2581 .elementor-element.elementor-element-cc66596{--width:60%;}.elementor-2581 .elementor-element.elementor-element-ba7e179{--width:20%;}}/* Start custom CSS for shortcode, class: .elementor-element-71f0b91 *//* --- AJAX Coupon Pagination Styles (V24) --- */

.all-coupons-ajax-wrapper {
    /* Optional: Add some padding or margin if needed */
}

/* Style the coupon container if needed, e.g., grid layout from previous shortcode */
/* If using [wpcd_coupon], that shortcode's styles will apply. */
/* You might need grid styles again if [wpcd_coupon] doesn't create them */
#all-coupons-container {
    display: grid;
    /* Mobile: 1 column (Default) */
    grid-template-columns: 1fr; 
    gap: 25px; /* Spacing between coupons */
    margin-bottom: 30px; /* Space before pagination */
}
/* Desktop: 2 columns */
@media (min-width: 768px) { 
    #all-coupons-container {
        grid-template-columns: repeat(2, 1fr); 
        gap: 30px; 
    }
}
/* Ensure individual items fit grid */
#all-coupons-container .ajax-coupon-item .wpcd-coupon-id-* {
    margin-bottom: 0 !important; /* Prevent double margins */
}

/* Pagination Styles (Mimicking your screenshot) */
.all-coupons-pagination {
    text-align: center;
    margin-top: 30px;
    clear: both; /* Ensure it appears below floated elements */
}

.all-coupons-pagination .page-numbers {
    display: inline-block;
    padding: 8px 14px;
    margin: 0 3px 6px; /* Added bottom margin for wrapping */
    border: 1px solid #ddd;
    background-color: #fff;
    color: #337ab7; /* Blue-ish link color */
    text-decoration: none;
    border-radius: 4px;
    transition: background-color 0.2s, color 0.2s;
    font-size: 14px;
}

.all-coupons-pagination .page-numbers:hover {
    background-color: #eee;
    color: #23527c;
}

.all-coupons-pagination .page-numbers.current {
    background-color: #28a745; /* Green background for current page (like screenshot) */
    border-color: #28a745;
    color: #fff; /* White text */
    cursor: default;
    z-index: 2; /* Ensure it's above others */
     pointer-events: none; /* Prevent clicking current page */
}

.all-coupons-pagination .page-numbers.dots {
    border: none;
    background: none;
    padding: 8px 5px;
     cursor: default;
}

/* Loader Style */
.coupon-loader {
    font-size: 16px;
    color: #555;
}
/* --- AJAX Coupon Pagination Styles (V24.1 - Single Column Layout) --- */

.all-coupons-ajax-wrapper {
    /* Optional: Add some padding or margin if needed */
}

/* Coupon Container: Always 1 column */
#all-coupons-container {
    display: block; /* Use block layout, not grid */
    margin-bottom: 30px; /* Space before pagination */
}

/* Spacing between individual coupons */
#all-coupons-container .ajax-coupon-item {
    margin-bottom: 25px; /* Adjust spacing as needed */
}

/* Ensure plugin's coupon doesn't add extra conflicting margins */
#all-coupons-container .ajax-coupon-item .wpcd-coupon-id-* {
    margin-bottom: 0 !important;
}

/* Remove the desktop grid layout */
/* @media (min-width: 768px) { 
    #all-coupons-container {
        grid-template-columns: repeat(2, 1fr); 
        gap: 30px; 
    }
} 
*/ /* Commented out or remove this block */


/* --- Pagination Styles (Keep as before) --- */
.all-coupons-pagination {
    text-align: center;
    margin-top: 30px;
    clear: both;
}

.all-coupons-pagination .page-numbers {
    display: inline-block;
    padding: 8px 14px;
    margin: 0 3px 6px;
    border: 1px solid #ddd;
    background-color: #fff;
    color: #337ab7;
    text-decoration: none;
    border-radius: 4px;
    transition: background-color 0.2s, color 0.2s;
    font-size: 14px;
}

.all-coupons-pagination .page-numbers:hover {
    background-color: #eee;
    color: #23527c;
}

.all-coupons-pagination .page-numbers.current {
    background-color: #28a745; /* Green background for current page */
    border-color: #28a745;
    color: #fff;
    cursor: default;
    z-index: 2;
    pointer-events: none;
}

.all-coupons-pagination .page-numbers.dots {
    border: none;
    background: none;
    padding: 8px 5px;
    cursor: default;
}

/* Loader Style (Keep as before) */
.coupon-loader {
    font-size: 16px;
    color: #555;
    text-align: center;
     padding: 20px;
}/* End custom CSS */