/**
 * Product Carousel Styles - Complete RTL Support
 * Fully tested for English (LTR) and Arabic (RTL)
 */

 /* Related products css */
 
/* Main container */
.acf-postbox .acf-field[data-name="related_products"] .acf-relationship{
    min-height:500px;
    font-size:13px;
}

/* ==================================
   SEARCH/FILTER ROW
================================== */
.acf-postbox .acf-field[data-name="related_products"] .acf-relationship .filters{
    display:flex;
    flex-direction:column;   /* move filters to separate rows */
    gap:8px;
    margin-bottom:10px;
}

/* search box */
.acf-postbox .acf-field[data-name="related_products"] .acf-relationship .filter.-search{
    width:100% !important;
}

.acf-postbox .acf-field[data-name="related_products"] .acf-relationship .filter.-search input{
    width:100%;
    height:36px;
    font-size:13px;
    padding:6px 10px;
}

/* select dropdown */
.acf-postbox .acf-field[data-name="related_products"] .acf-relationship .filter.-post_type,
.acf-postbox .acf-field[data-name="related_products"] .acf-relationship .filter.-taxonomy{
    width:100% !important;
}

.acf-postbox .acf-field[data-name="related_products"] .acf-relationship select{
    width:100%;
    height:36px;
    font-size:13px;
}

/* ==================================
   PRODUCT LISTS
================================== */
.acf-postbox .acf-field[data-name="related_products"] .acf-relationship .selection,
.acf-postbox .acf-field[data-name="related_products"] .acf-relationship .values{
    width:100%;
    max-width:100%;
}

/* reduce font size */
.acf-postbox .acf-field[data-name="related_products"] .acf-relationship .list li{
    font-size:12px;
    line-height:1.4;
    padding:8px;
}

/* increase height */
.acf-postbox .acf-field[data-name="related_products"] .acf-relationship ul{
    height:220px !important;
    overflow-y:auto;
}

/* headings */
.acf-postbox .acf-field[data-name="related_products"] .acf-relationship .title{
    font-size:13px;
    font-weight:600;
    padding:8px;
}

/* selected items */
.acf-postbox .acf-field[data-name="related_products"] .acf-relationship .values li{
    background:#f7f7f7;
    margin-bottom:4px;
    border-radius:4px;
}

/* scrollbar */
.acf-postbox .acf-field[data-name="related_products"] .acf-relationship ul::-webkit-scrollbar{
    width:6px;
}

/* ==========================================================
   SINGLE BLOG PAGE
   Astra Fashion Lifestyle 02 Style
==========================================================*/

.blog-post{
    max-width: 100%;
    margin:0 auto;
    padding:40px 0 60px;
}

/* ------------------------------
   Header
------------------------------ */

.blog-header{
    text-align:center;
    margin-bottom:40px;
}

.blog-title{
    font-size:46px;
    font-weight:700;
    line-height:1.25;
    color:#1d2939;
    margin:0 0 18px;
}

.blog-meta{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:18px;
    flex-wrap:wrap;
    color:#667085;
    font-size:15px;
    margin-bottom:20px;
}

.blog-meta span{

    display:flex;

    align-items:center;

    gap:6px;

}

.blog-meta .published-date::before{

    /* content:"📅"; */

}

.blog-meta .author::before{

    /* content:"👤"; */

}

.language-badge{

    display:inline-flex;

}

.lang-label{

    padding:7px 18px;

    background:rgba(20,163,166,.10);

    border:1px solid rgba(20,163,166,.20);

    color:#14A3A6;

    border-radius:50px;

    font-size:13px;

    font-weight:600;

}

/* ------------------------------
   Banner
------------------------------ */

.post-banner{

    margin:45px 0;

    overflow:hidden;

    border-radius:18px;

    box-shadow:0 15px 40px rgba(0,0,0,.08);

}

.post-banner img{

    width:100%;

    display:block;

    aspect-ratio:16/8;

    object-fit:cover;

    transition:.5s;

}

.post-banner:hover img{

    transform:scale(1.04);

}

/* ------------------------------
   Excerpt
------------------------------ */

.post-excerpt{

    max-width:760px;

    margin:0 auto 50px;

    text-align:center;

    font-size:22px;

    line-height:1.8;

    color:#475467;

    font-style:italic;

    position:relative;

}

.post-excerpt::before{

    content:"";

    width:70px;

    height:3px;

    background:#14A3A6;

    display:block;

    margin:0 auto 20px;

}

/* ------------------------------
   Content
------------------------------ */

.blog-content{

    font-size:17px;

    line-height:1.95;

    color:#344054;

}

.blog-content p{

    margin-bottom:26px;

}

.blog-content h2{

    font-size:34px;

    margin:60px 0 22px;

    color:#1d2939;

}

.blog-content h3{

    font-size:28px;

    margin:50px 0 18px;

    color:#1d2939;

}

.blog-content h4{

    font-size:22px;

    margin:40px 0 16px;

}

.blog-content img{

    width:100%;

    border-radius:14px;

    margin:35px 0;

}

.blog-content ul,

.blog-content ol{

    margin:30px 0;

    padding-left:28px;

}

.blog-content li{

    margin-bottom:12px;

}

.blog-content blockquote{

    margin:40px 0;

    padding:30px;

    background:#f8fbfb;

    border-left:5px solid #14A3A6;

    border-radius:12px;

    font-size:20px;

    font-style:italic;

    color:#344054;

}

.blog-content table{

    width:100%;

    border-collapse:collapse;

    margin:40px 0;

}

.blog-content table th{

    background:#14A3A6;

    color:#fff;

}

.blog-content table th,

.blog-content table td{

    border:1px solid #e5e7eb;

    padding:14px;

}

.blog-content a{

    color:#14A3A6;

    font-weight:600;

}

.blog-content a:hover{

    color:#0f8f92;

}

/* ======================================================
   Featured Products
   (Keep Existing Width)
====================================================== */

.featured-products-section{

    margin-top:70px;

    padding-top:50px;

    border-top:1px solid #ececec;

}

.featured-products-section h2{

    font-size:32px;

    text-align:center;

    margin-bottom:35px;

    color:#1d2939;

}

/* Keep Slick Slider Width */

.slider{

    width:100%;

}

.slide{

    padding:10px;

}

/* ======================================================
   Navigation
====================================================== */

.post-navigation{

    margin-top:70px;

    display:flex;

    justify-content:space-between;

    gap:25px;

}

.post-navigation a{

    display:flex;

    align-items:center;

    justify-content:center;

    min-height:62px;

    padding:16px 28px;

    border-radius:50px;

    background:#fff;

    border:2px solid #14A3A6;

    color:#14A3A6;

    font-weight:600;

    transition:.3s;

    text-decoration:none;

    box-shadow:0 5px 20px rgba(0,0,0,.05);

}

.post-navigation a:hover{

    background:#14A3A6;

    color:#fff;

    transform:translateY(-3px);

    box-shadow:0 12px 25px rgba(20,163,166,.25);

}

.nav-previous a::before{


    margin-right:10px;

    font-size:18px;

}

.nav-next a::after{


    margin-left:10px;

    font-size:18px;

}

/* ======================================================
   Mobile
====================================================== */

@media(max-width:768px){

.blog-post{

    padding:20px 15px;

}

.blog-title{

    font-size:34px;

}

.post-excerpt{

    font-size:18px;

}

.blog-content{

    font-size:16px;

}

.post-navigation{

    flex-direction:column;

}

.post-navigation a{

    width:100%;

}

}

 
.slider,
.slider * {
    box-sizing: border-box;
}

.slider {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
}

.slider img {
    display: block;
    width: 100%;
    height: auto;
}

/* ===== FEATURED PRODUCTS SECTION ===== */

.featured-products-section {
    margin: 60px 0;
    padding: 40px 20px;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    border-radius: 12px;
    border-top: 3px solid #0d9488;
}

.featured-products-section h2 {
    font-size: 28px;
    font-weight: 700;
    margin: 0 0 40px 0;
    color: #0f172a;
    text-align: center;
    position: relative;
    padding-bottom: 15px;
}

.featured-products-section h2::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background: #0d9488;
    border-radius: 2px;
}

/* ===== SLIDER CONTAINER ===== */

.slider {
    position: relative;
    padding: 40px 0;
    margin: 0;
}

.slider.carousel-ready {
    opacity: 1;
}

.slider.slick-initialized {
    visibility: visible;
}

/* ===== SLICK LIST & TRACK ===== */

.slider .slick-list {
    position: relative;
    overflow: hidden;
    margin: 0;
    padding: 0;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.slider .slick-track {
    display: flex !important;
    align-items: center;
    position: relative;
    top: 0;
    left: 0;
}

/* ===== INDIVIDUAL SLIDES ===== */

.slider .slick-slide {
    display: flex !important;
    justify-content: center;
    align-items: center;
    padding: 0 10px;
    box-sizing: border-box;
    opacity: 0.6;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    outline: none;
    margin: 0;
}

.slider .slick-slide.slick-current,
.slider .slick-slide.slick-center {
    opacity: 1;
    z-index: 5;
}

.slider .slick-slide.slick-current {
    transform: scale(1.05);
}

.slider.changing .slick-slide {
    pointer-events: none;
}

/* ===== SLIDE CARD ===== */

.slide {
    width: 320px;
    position: relative;
    margin: 0;
    display: block;
}

.slide figure {
    margin: 0;
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    width: 100%;
}

.slide img {
    width: 100%;
    height: 420px;
    object-fit: cover;
    border-radius: 10px;
    display: block;
    transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.slide:hover img {
    transform: scale(1.05);
}

/* ===== SLIDE OVERLAY GRADIENT ===== */

.slide figure::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 10px;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.05) 100%);
    transition: background 0.3s ease;
    z-index: 2;
}

.slide:hover figure::after {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.1) 100%);
}

/* ===== SLIDE TEXT CONTENT ===== */

.text {
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 20px;
    color: #fff;
    z-index: 3;
    transition: transform 0.3s ease;
    text-align: left;
}

.slide:hover .text {
    transform: translateY(-5px);
}

/* Category badge */
.category {
    color: #ff9800;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    display: block;
    margin-bottom: 8px;
}

/* Rating */
.rating {
    color: #ffd700;
    font-size: 14px;
    font-weight: 700;
    display: block;
    margin: 8px 0;
}

/* Title */
.title {
    color: #fff;
    font-size: 18px;
    margin: 8px 0;
    font-weight: 700;
    line-height: 1.4;
    transition: font-size 0.3s ease;
}

.slick-center .title {
    font-size: 22px;
}

/* Summary/Description */
.summary {
    color: #14A6B9;
    margin: 8px 0 0 0;
    font-size: 14px;
    opacity: 0.9;
    transition: opacity 0.3s ease;
}

.slide:hover .summary {
    opacity: 1;
}

.summary::after {
    content: " →";
    margin-left: 4px;
    transition: margin 0.3s ease;
}

.slide:hover .summary::after {
    margin-left: 8px;
}


.slider {
    position: relative;
}
 
  

/* Mobile */
@media (max-width: 768px) {

    .slider .slick-prev,
    .slider .slick-next {
        width: 38px;
        height: 38px;
    }

    .slider .slick-prev:after,
    .slider .slick-next:after {
        font-size: 18px;
        line-height: 38px;
    }

    .slider .slick-prev {
        left: -10px;
    }

    .slider .slick-next {
        right: -10px;
    }
} 
 
/* Tablet */
@media (max-width: 1024px) {

    .slick-prev {
        left: -55px;
    }

    .slick-next {
        right: -55px;
    }

    [dir="rtl"] .slick-prev {
        left: auto;
        right: -55px;
    }

    [dir="rtl"] .slick-next {
        right: auto;
        left: -55px;
    }
}

/* Mobile */
@media (max-width: 768px) {

    .slick-prev,
    .slick-next {
        width: 46px;
        height: 46px;
    }

    .slick-prev {
        left: -45px;
    }

    .slick-next {
        right: -45px;
    }

    [dir="rtl"] .slick-prev {
        left: auto;
        right: -45px;
    }

    [dir="rtl"] .slick-next {
        right: auto;
        left: -45px;
    }

    .slick-prev .arrow-icon,
    .slick-next .arrow-icon {
        font-size: 22px;
    }
}

/* Small Mobile */
@media (max-width: 480px) {

    .slick-prev,
    .slick-next {
        width: 40px;
        height: 40px;
    }

    .slick-prev {
        left: -30px;
    }

    .slick-next {
        right: -30px;
    }

    [dir="rtl"] .slick-prev {
        left: auto;
        right: -30px;
    }

    [dir="rtl"] .slick-next {
        right: auto;
        left: -30px;
    }

    .slick-prev .arrow-icon,
    .slick-next .arrow-icon {
        font-size: 18px;
    }
}

.slick-dots {
    position: absolute;
    bottom: -50px;
    left: 0;
    right: 0;
    text-align: center;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
}

.slick-dots li {
    display: inline-block;
    margin: 0;
    padding: 0;
}

.slick-dots button {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #cbd5e1;
    border: none;
    cursor: pointer;
    padding: 0;
    font-size: 0;
    line-height: 0;
    transition: all 0.3s ease;
    display: block;
}

.slick-dots li.slick-active button {
    background: #0d9488;
    width: 36px;
    border-radius: 6px;
}

.slick-dots button:hover {
    background: #0d9488;
}

/* ===== RTL (ARABIC) SPECIFIC STYLES ===== */

/* RTL detection - applies to html[dir="rtl"] */
[dir="rtl"] .text {
    left: auto;
    /* right: 20px; */
    text-align: right;
}

[dir="rtl"] .category {
    text-align: right;
}

[dir="rtl"] .title {
    text-align: right;
}

[dir="rtl"] .summary {
    text-align: right;
}

[dir="rtl"] .summary::after {
    content: " ←";
    margin-left: 0;
    margin-right: 4px;
}

[dir="rtl"] .slide:hover .summary::after {
    margin-right: 8px;
    margin-left: 0;
}
 
/* ===== RESPONSIVE DESIGN ===== */

@media (max-width: 1024px) {

    .slide {
        width: 280px;
    }

    .slide img {
        height: 380px;
    }

    .slick-prev {
        left: -50px;
    }

    .slick-next {
        right: -50px;
    }

    [dir="rtl"] .slick-prev {
        left: auto;
        right: -50px;
    }

    [dir="rtl"] .slick-next {
        right: auto;
        left: -50px;
    }
}

@media (max-width: 768px) {

    .featured-products-section {
        margin: 40px 0;
        padding: 30px 15px;
    }

    .featured-products-section h2 {
        font-size: 22px;
        margin-bottom: 30px;
    }

    .slider {
        padding: 30px 0;
    }

    .slide {
        width: 240px;
    }

    .slide img {
        height: 320px;
    }

    .title {
        font-size: 16px;
    }

    .slick-center .title {
        font-size: 18px;
    }

    .category {
        font-size: 11px;
    }

    .summary {
        font-size: 13px;
    }

    .slick-prev,
    .slick-next {
        width: 40px;
        height: 40px;
        font-size: 18px;
    }

    .slick-prev {
        left: -40px;
    }

    .slick-next {
        right: -40px;
    }

    [dir="rtl"] .slick-prev {
        left: auto;
        right: -40px;
    }

    [dir="rtl"] .slick-next {
        right: auto;
        left: -40px;
    }

    .slick-dots {
        bottom: -45px;
    }
}

@media (max-width: 480px) {

    .featured-products-section {
        margin: 30px 0;
        padding: 20px 10px;
    }

    .featured-products-section h2 {
        font-size: 18px;
        margin-bottom: 25px;
    }

    .slider {
        padding: 20px 0;
    }

    .slide {
        width: 100%;
    }

    .slide img {
        height: 280px;
        aspect-ratio: 4 / 5;
    }

    .slick-prev,
    .slick-next {
        width: 36px;
        height: 36px;
        font-size: 16px;
    }

    .slick-prev {
        left: -35px;
    }

    .slick-next {
        right: -35px;
    }

    [dir="rtl"] .slick-prev {
        left: auto;
        right: -35px;
    }

    [dir="rtl"] .slick-next {
        right: auto;
        left: -35px;
    }

    .title {
        font-size: 14px;
    }

    .slick-center .title {
        font-size: 16px;
    }

    .category {
        font-size: 10px;
    }

    .summary {
        font-size: 12px;
    }

    .text {
        left: 15px;
        right: 15px;
        bottom: 15px;
    }

    [dir="rtl"] .text {
        left: auto;
        right: 15px;
    }

    .slider .slick-list {
        margin: 0 -8px;
    }

    .slider .slick-slide {
        padding: 0 8px;
    }

    .slick-dots {
        bottom: -40px;
        gap: 4px;
    }

    .slick-dots button {
        width: 10px;
        height: 10px;
    }

    .slick-dots li.slick-active button {
        width: 28px;
    }
}

/* ===== BLOG STYLES ===== */

.blog-post {
    background: white;
    padding: 30px;
    border-radius: 8px;
    margin-bottom: 30px;
}

.blog-header {
    margin-bottom: 30px;
    border-bottom: 2px solid #e5e7eb;
    padding-bottom: 20px;
}

.blog-title {
    font-size: 36px;
    font-weight: 700;
    margin: 0 0 15px 0;
    color: #0f172a;
    line-height: 1.2;
}

.blog-meta {
    display: flex;
    gap: 15px;
    font-size: 14px;
    color: #6b7280;
}

.featured-image {
    margin: 30px 0;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.featured-image img {
    width: 100%;
    height: auto;
    display: block;
}

.blog-content {
    font-size: 16px;
    line-height: 1.8;
    color: #374151;
    margin: 30px 0;
}

.blog-content p {
    margin-bottom: 15px;
}

/* ===== POST NAVIGATION ===== */

.post-navigation {
    display: flex;
    justify-content: space-between;
    margin-top: 40px;
    padding-top: 30px;
    border-top: 2px solid #e5e7eb;
    gap: 20px;
}

.nav-previous,
.nav-next {
    flex: 1;
}

.nav-previous a,
.nav-next a {
    display: block;
    padding: 15px;
    background: #f3f4f6;
    border-radius: 6px;
    text-decoration: none;
    color: #0d9488;
    font-weight: 600;
    transition: all 0.3s ease;
}

.nav-previous a:hover,
.nav-next a:hover {
    background: #0d9488;
    color: white;
}

/* ===== LANGUAGE BADGE ===== */

.language-badge {
    /* text-align: center; */
    margin-top: 10px;
}

.lang-label {
    display: inline-block;
    background: #e0f2fe;
    color: #0369a1;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}

/* ===== NO PRODUCTS MESSAGE ===== */

.no-products {
    text-align: center;
    padding: 40px 20px;
    color: #6b7280;
    font-style: italic;
    background: #f9fafb;
    border-radius: 8px;
    margin: 20px 0;
}

/* ===== CAROUSEL LOADER ===== */

.carousel-loading {
    text-align: center;
    padding: 40px 20px;
    color: #6b7280;
    display: none;
}

.carousel-loading.active {
    display: block;
} 
/* ===== PRINT STYLES ===== */

@media print {

    .featured-products-section {
        page-break-inside: avoid;
    }

    .slider {
        display: none;
    }
}


.carousel-nav {
    background: #0d9488;
    color: white;
    border: none !important;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    transition: all 0.3s ease;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(13, 148, 136, 0.2);
    position: relative;
    z-index: 10;
}


/* ==========================================================
   CLEAN SLICK ARROWS
==========================================================*/

.slider{
    position:relative;
}

/* Common */

.slider .slick-prev,
.slider .slick-next{

    width:48px;
    height:48px;

    background:#ffffff;
    border:none;
    border-radius:50%;

    display:flex !important;
    align-items:center;
    justify-content:center;

    cursor:pointer;

    box-shadow:0 8px 22px rgba(0,0,0,.12);

    transition:.3s;

    z-index:20;
}

/* Hide default Slick icon */

.slider .slick-prev:before,
.slider .slick-next:before{
    display:none;
}

/* SVG/Icon inserted from JS */

.slider .arrow-icon{

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:22px;
    font-weight:700;

    color:#14A3A6;

    transition:.3s;
}

/* Hover */

.slider .slick-prev:hover,
.slider .slick-next:hover{

    background:#14A3A6;

    /* transform:translateY(-2px); */

    box-shadow:0 14px 28px rgba(20,163,166,.25);

}

.slider .slick-prev:hover .arrow-icon,
.slider .slick-next:hover .arrow-icon{

    color:#fff;

}

/* Disabled */

.slider .slick-disabled{

    opacity:.35;
    cursor:not-allowed;
    pointer-events:none;

}

/* ---------- LTR ---------- */

html[dir="ltr"] .slider .slick-prev{

    left:-65px;
    right:auto;

}

html[dir="ltr"] .slider .slick-next{

    right:-65px;
    left:auto;

}

/* ---------- RTL ---------- */

html[dir="rtl"] .slider .slick-prev{
 
    left:auto;

}

html[dir="rtl"] .slider .slick-next{
 
    right:auto;

}

/* ---------- Tablet ---------- */

@media(max-width:1024px){

html[dir="ltr"] .slider .slick-prev{
left:-45px;
}

html[dir="ltr"] .slider .slick-next{
right:-45px;
}

html[dir="rtl"] .slider .slick-prev{
right:-45px;
}

html[dir="rtl"] .slider .slick-next{
left:-45px;
}

}

/* ---------- Mobile ---------- */

@media(max-width:768px){

.slider .slick-prev,
.slider .slick-next{

width:42px;
height:42px;

}

.slider .arrow-icon{

font-size:18px;

}

html[dir="ltr"] .slider .slick-prev{
left:-18px;
}

html[dir="ltr"] .slider .slick-next{
right:-18px;
}

html[dir="rtl"] .slider .slick-prev{
right:-18px;
}

html[dir="rtl"] .slider .slick-next{
left:-18px;
}

}

/* ---------- Small Mobile ---------- */

@media(max-width:480px){

.slider .slick-prev,
.slider .slick-next{

width:38px;
height:38px;

}

.slider .arrow-icon{

font-size:16px;

}

html[dir="ltr"] .slider .slick-prev{
left:5px;
}

html[dir="ltr"] .slider .slick-next{
right:5px;
}

html[dir="rtl"] .slider .slick-prev{
right:5px;
}

html[dir="rtl"] .slider .slick-next{
left:5px;
}

}

/* BLOG PAGE pagingation design */
/* ==========================================================
   UAGB POST PAGINATION
   Astra Fashion Lifestyle 02
==========================================================*/

.uagb-post-pagination-wrap{

    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;

    gap:12px;

    margin:60px auto 20px;

}

/* All Buttons */

.uagb-post-pagination-wrap .page-numbers{

    min-width:46px;
    height:46px;

    padding:0 18px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#ffffff;

    color:#14A3A6;

    border:2px solid rgba(20,163,166,.18);

    border-radius:50px;

    text-decoration:none;

    font-size:15px;

    font-weight:600;

    transition:.3s ease;

    box-shadow:0 6px 18px rgba(0,0,0,.06);

}

/* Hover */

.uagb-post-pagination-wrap .page-numbers:hover{

    background:#14A3A6;

    color:#ffffff;

    border-color:#14A3A6;

    transform:translateY(-2px);

    box-shadow:0 12px 24px rgba(20,163,166,.22);

}

/* Current Page */

.uagb-post-pagination-wrap .current{

    background:#14A3A6;

    color:#ffffff;

    border-color:#14A3A6;

    cursor:default;

    pointer-events:none;

}

/* Previous & Next */

.uagb-post-pagination-wrap .prev,
.uagb-post-pagination-wrap .next{

    padding:0 24px;

    font-weight:700;

}

/* Icons */

.uagb-post-pagination-wrap .prev::before{

    /* content:"←"; */

    margin-right:8px;

}

.uagb-post-pagination-wrap .next::after{

    /* content:"→"; */

    margin-left:8px;

}

/* Focus */

.uagb-post-pagination-wrap .page-numbers:focus{

    outline:none;

    box-shadow:
        0 0 0 4px rgba(20,163,166,.18),
        0 10px 24px rgba(20,163,166,.20);

}

/* ==========================================================
   RTL
==========================================================*/

html[dir="rtl"] .uagb-post-pagination-wrap{

    direction:rtl;

}

html[dir="rtl"] .uagb-post-pagination-wrap .prev::before{

    /* content:"→"; */

    margin-right:0;

    margin-left:8px;

}

html[dir="rtl"] .uagb-post-pagination-wrap .next::after{

    /* content:"←"; */

    margin-left:0;

    margin-right:8px;

}

/* ==========================================================
   Mobile
==========================================================*/

@media(max-width:768px){

.uagb-post-pagination-wrap{

    gap:8px;

}

.uagb-post-pagination-wrap .page-numbers{

    min-width:40px;

    height:40px;

    padding:0 14px;

    font-size:14px;

}

.uagb-post-pagination-wrap .prev,
.uagb-post-pagination-wrap .next{

    padding:0 16px;

}

}

@media(max-width:480px){

.uagb-post-pagination-wrap{

    gap:6px;

}

.uagb-post-pagination-wrap .page-numbers{

    min-width:36px;

    height:36px;

    padding:0 12px;

    font-size:13px;

}

}