:root {
    --plugin-default-color: #0f3d4a;
    --header-height: 72px;
    --transition-speed: 0.3s;
    --overlay-bg: rgba(0, 0, 0, 0.5);
}

/* ===============================
   BASE STYLES & RESET
   =============================== */
li.sits-menu-item:not(.sitsel-has-children) {
    position: static;
    list-style: none;
}

.sitsel-mega-template {
    padding: 20px;
}

.sitsel-mega-template img,
.sitsel-mega-template svg {
    max-width: 100%;
    height: auto;
}

.sitsel-mega-template .elementor-widget-wrap {
    padding: 0;
}

/* ===============================
   MENU LAYOUT
   =============================== */
.sitsel-mega-menu-main {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
}

.sitsel-mega-menu-main[data-layout="horizontal"] {
    flex-wrap: wrap;
}

.sitsel-mega-menu-main[data-layout="vertical"] {
    flex-direction: column;
}

.sitsel-mega-menu-main[data-layout="vertical"] .sits-menu-item {
    display: block;
    margin-bottom: 0;
    width:100%;
}

/* ===============================
   MENU ALIGNMENT (Desktop)
   =============================== */
.sitsel-mega-menu-widget:not(.sitsel-mobile-version) .sitsel-mega-menu-main[data-align="left"] {
    align-items: flex-start;
    justify-content: flex-start;
}

.sitsel-mega-menu-widget:not(.sitsel-mobile-version) .sitsel-mega-menu-main[data-align="center"] {
    align-items: center;
    justify-content: center;
}

.sitsel-mega-menu-widget:not(.sitsel-mobile-version) .sitsel-mega-menu-main[data-align="right"] {
    align-items: flex-end;
    justify-content: flex-end;
}

.sitsel-mega-menu-widget:not(.sitsel-mobile-version) .sitsel-mega-menu-main[data-layout="vertical"][data-align="center"] .sits-menu-item > a{
    justify-content:center;
}

.sitsel-mega-menu-widget:not(.sitsel-mobile-version) .sitsel-mega-menu-main[data-layout="vertical"][data-align="right"] .sits-menu-item > a{
    justify-content:end;
}

/* ===============================
   MENU ITEMS
   =============================== */
.sitsel-mega-menu-widget[data-mobile-breakpoint="0"] .sitsel-mega-menu-main > .sits-menu-item > a {
    min-height: 100% !important;
}

.sitsel-mega-menu-widget:not(.sitsel-mobile-version) .sitsel-mega-menu-main > .sits-menu-item > a {
    display: flex;
    align-items: center;
    vertical-align: middle;
}

.sits-menu-item a {
    display: flex;
    width: 100%;
}

/* ===============================
   SUBMENU BASE
   =============================== */
.sitsel-mega-menu-widget:not(.sitsel-mobile-version) li.sits-menu-item.sitsel-has-children {
    position: relative !important;
    list-style: none;
}

.sitsel-sub-menu {
    list-style: none;
    padding: 0;
    display: none;
    background: #fff;
    z-index: 96;
}

.sitsel-mega-sub-menu[style*="opacity: 0"],
.sitsel-mega-sub-menu[style*="opacity:0"] {
    pointer-events: none;
}

.sitsel-has-children.sitsel-sub-open > .sitsel-sub-menu {
    display: block;
    opacity: 1;
}

/* ===============================
   DESKTOP MEGA MENU - FULL WIDTH
   =============================== */
.sitsel-mega-menu-widget:not(.sitsel-mobile-version) .sitsel-mega-sub-menu {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    max-height:80%;
    overflow:auto;
}

.sitsel-sub-menu .sitsel-mega-sub-menu{
    display:none;
}

.sitsel-mega-open > .sitsel-mega-sub-menu {
    display: block;
    opacity: 1;
}

/* Desktop normal submenu (non-mega) */
.sitsel-mega-menu-widget:not(.sitsel-mobile-version) .sitsel-mega-menu-main[data-layout="horizontal"] .sitsel-has-children > .sitsel-sub-menu:not(.sitsel-mega-sub-menu) {
    list-style: none;
    padding: 0;
    min-width: 10em;
}

/* Desktop first-level submenu positioning */
.sitsel-mega-menu-widget:not(.sitsel-mobile-version) .sitsel-mega-menu-main > .sits-menu-item > .sitsel-sub-menu:not(.sitsel-mega-sub-menu) {
    position: absolute;
}

/* ===============================
   MOBILE DROPDOWN - FULL WIDTH
   =============================== */
.sitsel-mobile-version.sitsel-mm-mobile .sitsel-mega-menu-main-wrapper {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}


/* Right direction */
.sitsel-mega-menu-widget.sitsel-mm-offcanvas[data-offcanvas-direction="right"].sitsel-mobile-version .sitsel-mega-menu-main-wrapper {
    left: auto;
    right: 0;
    transform: translateX(100%);
}

.sitsel-mega-menu-widget.sitsel-mm-offcanvas-open[data-offcanvas-direction="right"].sitsel-mobile-version .sitsel-mega-menu-main-wrapper {
    transform: translateX(0);
}

/* Close button mirror for right panel */
.sitsel-mega-menu-widget[data-offcanvas-direction="right"] .sitsel-offcanvas-close.sitsel-close-top-right {
    margin-left: auto;
}
.sitsel-mega-menu-widget[data-offcanvas-direction="right"] .sitsel-offcanvas-close.sitsel-close-top-left {
    margin-right: auto;
}

/* ===============================
   SUBMENU ICON
   =============================== */
.sitsel-submenu-icon {
    display: inline-block;
    margin-left: 6px;
    vertical-align: middle;
    transition: transform var(--transition-speed) ease;
}

.sitsel-submenu-icon svg {
    vertical-align: middle;
}

/* ===============================
   HOVER EFFECTS
   =============================== */
.sitsel-mega-menu-widget[data-hover-effect="underline"] .sitsel-mega-menu-main  a {
    position: relative;
}

.sitsel-mega-menu-widget[data-hover-effect="underline"] .sitsel-mega-menu-main .sits-menu-item > a:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    height: 2px;
    width: 0;
    background: currentColor;
    transition: width 0.2s ease-in-out;
}

.sitsel-mega-menu-widget[data-hover-effect="underline"] .sitsel-mega-menu-main .sits-menu-item a:hover:after {
    width: 100%;
}

.sitsel-mega-menu-widget[data-hover-effect="grow"] .sitsel-mega-menu-main .sits-menu-item a {
    transition: transform 0.18s ease;
    display: inline-block;
}

.sitsel-mega-menu-widget[data-hover-effect="grow"] .sitsel-mega-menu-main .sits-menu-item a:hover {
    transform: scale(1.05);
}

/* ===============================
   MOBILE TOGGLE BUTTON
   =============================== */
.sitsel-mega-menu-toggle {
    display:none;
    visibility: hidden;
    opacity: 0;
}

.sitsel-mobile-version .sitsel-mega-menu-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: transparent;
    border: none;
    position: relative;
    margin-left: auto;
}

.sitsel-mega-menu-toggle i,
.sitsel-mega-menu-toggle svg {
    display: block;
}

/* ===============================
   MOBILE MENU CONTAINER
   =============================== */
.sitsel-mega-menu-widget.sitsel-mm-mobile {
    display: flex;
}

.sitsel-mega-menu-widget.sitsel-mm-mobile .sitsel-mega-menu-main-wrapper {
    display: none;
    visibility: hidden;
    opacity: 0;
    max-height: 80vh;
    overflow-x: hidden;
    overflow-y: auto;
    transition: transform var(--transition-speed) ease-in-out, opacity var(--transition-speed) ease-in-out;
}

.sitsel-mega-menu-widget.sitsel-mm-mobile .sitsel-mega-menu-main {
    flex-direction: column;
}

.sitsel-mega-menu-widget.sitsel-mm-open .sitsel-mega-menu-main {
    display: flex !important;
}

.sitsel-mobile-version .sitsel-mega-menu-main > li.sits-menu-item {
    width: 100%;
}

/* ===============================
   MOBILE OFF-CANVAS STYLE
   =============================== */
.sitsel-mega-menu-widget.sitsel-mm-offcanvas.sitsel-mobile-version .sitsel-mega-menu-main-wrapper {
    visibility: visible;
    opacity: 0;
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    max-height:100vh;
    width: 100%;
    max-width: 100%;
    padding: 20px;
    display:block !important;
    transform: translateX(-100%);
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 99;
    transition: transform var(--transition-speed) ease-in-out, opacity var(--transition-speed) ease-in-out;
    box-sizing: border-box;
}

.sitsel-mega-menu-widget.sitsel-mm-offcanvas-open.sitsel-mobile-version .sitsel-mega-menu-main-wrapper {
    max-height: 100vh;
    visibility: visible !important;
    opacity: 1 !important;
    transform: translateX(0);
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ===============================
   MOBILE TEMPLATE
   =============================== */
.sitsel-mobile-template {
    visibility: hidden;
    opacity: 0;
    z-index: 2;
    transition: transform var(--transition-speed) ease-in-out, opacity 0.2s ease;
    display: none;
}

.sitsel-mobile-version .sitsel-mobile-template {
    display: block !important;
}

.sitsel-mobile-link {
    cursor: default;
    color: inherit;
    text-decoration: none;
    display: inline;
}

.sitsel-mobile-template-open > a {
    font-weight: 600;
}

/* ===============================
   BACK BUTTONS
   =============================== */
.sitsel-mobile-back,
.sitsel-mobile-version .sitsel-mobile-back-submenu {
    display: block;
    margin-bottom: 10px;
    cursor: pointer;
    text-align: left;
    border: none;
    padding: 10px;
    width: 100%;
    max-width:120px;
}

.sitsel-mobile-back-submenu {
    display: none;
}

/* ===============================
   MOBILE BACK MODE
   =============================== */
.sitsel-mobile-back-mode .sits-menu-item > .sitsel-sub-menu,
.sitsel-mobile-back-mode ul.sitsel-mega-menu-main > .sits-menu-item .sitsel-sub-menu {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: translateX(100%);
    transition: transform 0.32s ease-in-out, opacity 0.2s ease;
    overflow-x: hidden;
}

.sitsel-mobile-back-mode li.sits-menu-item .sitsel-mobile-template.sitsel-mobile-transform {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 10px;
    min-height:100%;
    height: auto;
    transform: translateX(100%);
    transition: transform 0.32s ease-in-out, opacity 0.2s ease;
}

.sitsel-mobile-back-mode.sitsel-mm-offcanvas-open::after {
    background: rgba(0, 0, 0, 0.774);
}

/* ===============================
   MOBILE DEFAULT MODE
   =============================== */
.sitsel-mobile-version.sitsel-mobile-default-mode .sitsel-sub-menu {
    position: relative;
    width: 100%;
    transition: opacity 0.2s ease;
}

/* ===============================
   RESPONSIVE UTILITIES
   =============================== */
/* ===============================
   OFF-CANVAS CLOSE BUTTON
   =============================== */
.sitsel-offcanvas-close {
    display: none;
    position: relative;
    z-index: 999;
    cursor: pointer;
    background: transparent;
    border: none;
    transition: all 0.2s ease;
}

.sitsel-offcanvas-close.sitsel-close-top-right {
    margin-left:auto
}

.sitsel-offcanvas-close.sitsel-close-top-left {
   margin-right:auto;
}

.sitsel-mobile-version.sitsel-mm-offcanvas .sitsel-offcanvas-close {
    display: block !important;
}

.sitsel-offcanvas-close i,
.sitsel-offcanvas-close svg {
    display: block;
}

/* ===============================
   PRINT STYLES
   =============================== */
@media print {
    .sitsel-mega-menu-toggle {
        display: none !important;
    }
    
    .sitsel-mega-menu-main {
        display: block !important;
    }
}
