/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 23 2026 | 16:57:15 */
/* ==========================================
   MB SITE CAROUSEL
   CSS Class: mb-site-carousel
   ========================================== */


/* ==========================================
   ARROWS — POSITION ONLY
   All styling remains controlled by Elementor
   ========================================== */


/* ==========================================
   PAGINATION PILL
   ========================================== */

.mb-site-carousel .swiper-pagination {
    width: auto !important;

    /* HORIZONTAL POSITION */
    left: 0rem !important;
    right: auto !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    /* SPACE BETWEEN DOTS */
    gap: 8px !important;

    /* OUTER PILL */
    padding: 7px 11px !important;
    background: #ffffff !important;
    border: 0px solid #11678A !important;
    border-radius: 100px !important;

    /* MOVE ENTIRE PILL UP / DOWN */
    transform: translateY(0px) !important;
}


/* ==========================================
   INACTIVE DOTS
   ========================================== */

.mb-site-carousel .swiper-pagination-bullet {
    width: 7px !important;
    height: 7px !important;

    flex: 0 0 auto !important;
    margin: 0 !important;

    background: #aba69e !important;
    border-radius: 100px !important;
    opacity: 1 !important;

    transition:
        width 0.3s ease,
        background 0.3s ease !important;
}


/* ==========================================
   ACTIVE DOT — ELONGATED
   ========================================== */

.mb-site-carousel .swiper-pagination-bullet-active {
    width: 24px !important;
    background: #913949 !important;
}

/* ==========================================
   MB CAROUSEL 2
   CSS Class: mb-carousel-2
   ========================================== */

/* ==========================================
   PAGINATION PILL
   ========================================== */

.mb-carousel-2 .swiper-pagination {
    width: auto !important;

    /* HORIZONTAL POSITION */
    left: 0rem !important;
    right: auto !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    /* SPACE BETWEEN DOTS */
    gap: 8px !important;

    /* OUTER PILL */
    padding: 7px 11px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 100px !important;

    /* MOVE ENTIRE PILL UP / DOWN */
    transform: translateY(0px) !important;
}

/* ==========================================
   INACTIVE DOTS
   ========================================== */

.mb-carousel-2 .swiper-pagination-bullet {
    width: 7px !important;
    height: 7px !important;

    flex: 0 0 auto !important;
    margin: 0 !important;

    background: #aba69e !important;
    border-radius: 100px !important;
    opacity: 1 !important;

    transition:
        width 0.3s ease,
        background 0.3s ease !important;
}

/* ==========================================
   ACTIVE DOT — ELONGATED
   ========================================== */

.mb-carousel-2 .swiper-pagination-bullet-active {
    width: 24px !important;
    background: #FCB720 !important;
}