/* ==========================================================
   BeeShift Global Styles
   File: beeshift-global.css

   Shared BeeShift components used across multiple pages.
   Load this stylesheet AFTER the main template stylesheets.
   ========================================================== */


/* ==========================================================
   BUZZY - BEESHIFT HIVE ASSISTANT
   ========================================================== */

.buzzy-popup {
    position: fixed;
    right: 40px;
    bottom: 40px;
    width: 340px;
    padding: 25px;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 15px 45px rgba(0, 0, 0, 0.20);
    z-index: 99999;

    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition:
        opacity 0.3s ease,
        visibility 0.3s ease,
        transform 0.3s ease;
}

.buzzy-popup.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}


/* Buzzy Close Button */

.buzzy-close {
    position: absolute;
    top: 10px;
    right: 14px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #222222;
    font-size: 25px;
    line-height: 1;
    cursor: pointer;
}

.buzzy-close:hover {
    color: #FF7C1F;
}


/* Buzzy Header */

.buzzy-popup-header {
    display: flex;
    flex-direction: column;
    margin-bottom: 18px;
    padding-right: 25px;
}

.buzzy-popup-header strong {
    color: #1c1c1c;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.3;
}

.buzzy-popup-header span {
    margin-top: 3px;
    color: #777777;
    font-size: 12px;
    line-height: 1.4;
}


/* Buzzy Message */

.buzzy-message {
    padding: 16px;
    background: #f7f7f7;
    border-left: 3px solid #FF7C1F;
    border-radius: 10px;
}

.buzzy-message strong {
    color: #1c1c1c;
    font-weight: 700;
}

.buzzy-message p {
    margin: 6px 0 0;
    color: #555555;
    font-size: 14px;
    line-height: 1.6;
}


/* ==========================================================
   BUZZY - MOBILE
   ========================================================== */

@media (max-width: 575px) {

    .buzzy-popup {
        right: 20px;
        bottom: 20px;
        width: calc(100vw - 40px);
        max-width: 340px;
        padding: 22px;
    }

}
/* Chat With Buzzy Launcher Typography */
#buzzyLauncher {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    letter-spacing: 0.4px !important;
}
/* ==========================================================
   Welcome to BeeShift - Consistent Typography
   ========================================================== */

.beeshift-welcome-content .sec-title_text,
.beeshift-welcome-content .medical-about_one_bold,
.beeshift-welcome-content .medical-about_one_text,
.beeshift-welcome-content .medical-about_one_list li {
    font-family: Arial, Helvetica, sans-serif !important;
}

.beeshift-welcome-content .sec-title_text,
.beeshift-welcome-content .medical-about_one_text {
    font-size: 16px !important;
    line-height: 1.7 !important;
    font-weight: 400 !important;
}

.beeshift-welcome-content .medical-about_one_bold {
    font-weight: 700 !important;
}

.beeshift-welcome-content .medical-about_one_list li {
    font-weight: 600 !important;
}
/* ==========================================================
   BeeShift CTA - Full Width Background
   ========================================================== */

.beeshift-fullwidth-cta {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
/* ==========================================================
   BeeShift CTA - Full Width Orange Background
   ========================================================== */

.medical-cta-one {
    background: var(--main-color) url(../medical-images/background/pattern-12.png) repeat-x;
}

.medical-cta-one_inner-container::before {
    display: none;
}
/* ==========================================================
   BeeShift CTA - Center Content
   ========================================================== */

.medical-cta-one_inner-container > .d-flex {
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
}

.medical-cta-one_content {
    width: 100% !important;
    text-align: center !important;
}

.beeshift-stopwatch-heading {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.beeshift-cta-text {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.medical-cta-one_icon {
    margin: 0 auto 20px !important;
}

.beeshift-stopwatch-buttons {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 18px;
    margin-top: 28px;
}
/* ==========================================================
   BeeShift Stay Connected CTA
   ========================================================== */

.beeshift-subscribe-text {
    margin: 10px 0 22px;
    max-width: 650px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height: 1.6;
    font-weight: 400;
    color: #1c1c1c;
}
/* ==========================================================
   BeeShift Mobile App - Store Badges
   ========================================================== */

.forex-cta-two .crypto-app-two_buttons {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 18px;
}

.forex-cta-two .crypto-app-two_buttons .store-btn {
    display: inline-block;
    width: auto !important;
    height: auto !important;
}

.forex-cta-two .crypto-app-two_buttons .store-btn img {
    display: block;
    width: auto !important;
    height: 58px !important;
    max-width: none !important;
    object-fit: contain !important;
}
/* Remove template background around app store badges */
.forex-cta-two .crypto-app-two_buttons .store-btn {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}
/* ==========================================================
   BeeShift Global Header - Center Navigation
   ========================================================== */

@media (min-width: 992px) {

    .main-header.header-style-two .header-upper .inner-container {
        position: relative;
    }

    .main-header.header-style-two .nav-outer {
        position: absolute;
        left: 50%;
        top: 60%;
        transform: translate(-50%, -50%);
        margin: 0 !important;
    }
}
/* Normal header only - vertical alignment */
.main-header.header-style-two:not(.fixed-header) .header-upper .inner-container > .d-flex {
    transform: translateY(12px);
}

/* Sticky / scroll header - restore template position */
.main-header.header-style-two.fixed-header .header-upper .inner-container > .d-flex {
    transform: none !important;
}
/* =========================================================
   BEESHIFT MOBILE MENU OVERRIDES
   ========================================================= */

.mobile-menu .navigation {
    margin: 0;
    padding: 0;
}

/* Main menu rows */
.mobile-menu .navigation > li {
    position: relative;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid #eeeeee;
}

/* Main menu links */
.mobile-menu .navigation > li > a {
    display: block;
    padding: 18px 28px;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 600;
    color: #222222;
    text-decoration: none;
    transition: color 0.25s ease, padding-left 0.25s ease;
}

/* Orange only for active/hover */
.mobile-menu .navigation > li:hover > a,
.mobile-menu .navigation > li.current > a,
.mobile-menu .navigation > li.current-menu-item > a {
    color: #f58220;
}

/* Small BeeShift movement on hover */
.mobile-menu .navigation > li:hover > a {
    padding-left: 34px;
}

/* Dropdown / submenu links */
.mobile-menu .navigation li ul li a {
    display: block;
    padding: 14px 28px 14px 42px;
    font-size: 18px;
    line-height: 1.4;
    font-weight: 500;
    color: #333333;
    border-bottom: 1px solid #f2f2f2;
    text-decoration: none;
}

/* Submenu hover */
.mobile-menu .navigation li ul li a:hover {
    color: #f58220;
}
/* =========================================================
   BEESHIFT MOBILE MENU OVERRIDES
   ========================================================= */

.mobile-menu .navigation {
    margin: 0;
    padding: 0;
}

/* Main menu rows */
.mobile-menu .navigation > li {
    position: relative;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid #eeeeee;
}

/* Main menu links */
.mobile-menu .navigation > li > a {
    display: block;
    padding: 18px 28px;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 600;
    color: #222222;
    text-decoration: none;
    transition: color 0.25s ease, padding-left 0.25s ease;
}

/* Orange only for active/hover */
.mobile-menu .navigation > li:hover > a,
.mobile-menu .navigation > li.current > a,
.mobile-menu .navigation > li.current-menu-item > a {
    color: #f58220;
}

/* Small BeeShift movement on hover */
.mobile-menu .navigation > li:hover > a {
    padding-left: 34px;
}

/* Dropdown / submenu links */
.mobile-menu .navigation li ul li a {
    display: block;
    padding: 14px 28px 14px 42px;
    font-size: 18px;
    line-height: 1.4;
    font-weight: 500;
    color: #333333;
    border-bottom: 1px solid #f2f2f2;
    text-decoration: none;
}

/* Submenu hover */
.mobile-menu .navigation li ul li a:hover {
    color: #f58220;
}
/* =========================================================
   BeeShift Premium Mobile Navigation
   Mobile only — desktop header untouched
========================================================= */

@media (max-width: 991px) {

    /* Main mobile panel */
    .mobile-menu .menu-box {
        width: 88% !important;
        max-width: 390px !important;
        background: #ffffff !important;
        padding: 0 !important;
    }

    /* Logo/header area */
    .mobile-menu .nav-logo {
        position: relative !important;
        padding: 28px 30px 24px !important;
        margin: 0 !important;
        border-bottom: 1px solid #eeeeee !important;
        background: #ffffff !important;
    }

    .mobile-menu .nav-logo img {
        width: auto !important;
        max-width: 180px !important;
        height: 52px !important;
        object-fit: contain !important;
    }

    /* Close X */
    .mobile-menu .close-btn {
        top: 31px !important;
        right: 24px !important;
        width: 44px !important;
        height: 44px !important;
        line-height: 44px !important;
        text-align: center !important;
        border-radius: 50% !important;
        background: #f5f5f5 !important;
        color: #111827 !important;
        font-size: 22px !important;
        z-index: 10 !important;
    }

    /* Navigation container */
    .mobile-menu .menu-outer {
        padding: 14px 28px 30px !important;
    }

    .mobile-menu .navigation {
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Each navigation row */
    .mobile-menu .navigation > li {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        border-bottom: 1px solid #eeeeee !important;
        margin: 0 !important;
    }

    /* Navigation text */
    .mobile-menu .navigation > li > a {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        min-height: 66px !important;
        padding: 0 40px 0 2px !important;

        font-size: 19px !important;
        line-height: 1.25 !important;
        font-weight: 600 !important;

        color: #172033 !important;
        background: transparent !important;
        text-transform: none !important;
    }

    /* Clean right arrow */
    .mobile-menu .navigation > li > a::after {
        content: "\203A" !important;
        position: absolute !important;
        right: 5px !important;
        top: 50% !important;
        transform: translateY(-53%) !important;

        font-size: 31px !important;
        line-height: 1 !important;
        font-weight: 300 !important;
        color: #a5a5a5 !important;
    }

    /* Current page */
    .mobile-menu .navigation > li.current > a {
        color: #ff7c1f !important;
    }

    .mobile-menu .navigation > li.current > a::after {
        color: #ff7c1f !important;
    }

    /* Tap / hover */
    .mobile-menu .navigation > li > a:hover,
    .mobile-menu .navigation > li > a:focus {
        color: #ff7c1f !important;
        padding-left: 8px !important;
    }

    /* Darken backdrop behind menu */
    .mobile-menu .menu-backdrop {
        background: rgba(10, 20, 35, 0.62) !important;
    }
}
/* =========================================================
   BeeShift Homepage Hero — Mobile Image Fit
   Mobile only — desktop hero untouched
========================================================= */

@media (max-width: 767px) {

    .constr-main_slider .swiper-slide {
        background-size: cover !important;
        background-repeat: no-repeat !important;
        background-position: center center !important;
    }

}
/* =========================================================
   BeeShift Home Slider — Dedicated Mobile Images
========================================================= */

@media (max-width: 767px) {

    .constr-main_slider .beeshift-home-slide-1 {
        background-image: url("../constr-images/main-slider/image-1-mobile.jpg") !important;
        background-size: cover !important;
        background-position: center center !important;
        background-repeat: no-repeat !important;
    }

    .constr-main_slider .beeshift-home-slide-2 {
        background-image: url("../constr-images/main-slider/image-2-mobile.jpg") !important;
        background-size: cover !important;
        background-position: center center !important;
        background-repeat: no-repeat !important;
    }

    .constr-main_slider .beeshift-home-slide-3 {
        background-image: url("../constr-images/main-slider/image-3-mobile.jpg") !important;
        background-size: cover !important;
        background-position: center center !important;
        background-repeat: no-repeat !important;
    }

}