/* ORBION.WORLD — desktop design preserved + mobile fix */
html{min-height:100%;background:#07111f!important}
body{min-height:100%;position:relative;margin:0;background-image:linear-gradient(90deg,rgba(4,12,24,.80) 0%,rgba(5,15,29,.55) 22%,rgba(4,12,25,.20) 55%,rgba(3,10,22,.30) 100%),linear-gradient(180deg,rgba(4,10,20,.12) 0%,rgba(4,11,22,.22) 48%,rgba(3,9,18,.72) 100%),url('/assets/panel/images/orbion/orbion-world-bg.png')!important;background-position:center top,center top,center top!important;background-size:cover,cover,cover!important;background-repeat:no-repeat,no-repeat,no-repeat!important;background-attachment:fixed,fixed,fixed!important}
body::before,body::after{display:none!important}
.layout-wrapper,.layout-page,.orbion-layout-page,.layout-content{background:transparent!important;background-color:transparent!important;background-image:none!important}
.layout-wrapper,.orbion-layout-page{min-height:100vh}.layout-content{position:relative}
.layout-menu{background:rgba(6,17,33,.78)!important;border-right:1px solid rgba(102,173,255,.20)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:12px 0 40px rgba(0,0,0,.24)}
.layout-header{background:rgba(7,18,36,.48)!important;border:1px solid rgba(122,180,255,.14)!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 12px 35px rgba(0,0,0,.18)}
.box,.card,.table-responsive,.alert,.modal-content,.layout-content>div:not(.orbion-keep-clear){--tw-bg-opacity:1}
.dark .box,.box{background:linear-gradient(135deg,rgba(19,39,67,.78),rgba(5,17,32,.72))!important;border:1px solid rgba(126,184,255,.18)!important;box-shadow:0 12px 32px rgba(0,0,0,.22);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.menu-inner-link,.menu-inner-button{background-color:rgba(7,23,43,.62)!important;border:1px solid rgba(112,169,238,.09)}
.menu-inner-link:hover,.menu-inner-button:hover{border-color:rgba(116,184,255,.30);box-shadow:0 0 20px rgba(46,132,255,.10)}
.menu-inner-item._is-active>.menu-inner-link,.menu-inner-item._is-active>.menu-inner-button{background:linear-gradient(135deg,rgba(66,103,157,.86),rgba(17,43,75,.86))!important;border-color:rgba(145,195,255,.30)!important}
.btn{border:1px solid rgba(132,188,255,.25)!important;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.orbion-footer{margin:18px 16px 16px;padding:22px 26px;min-height:clamp(100px,10.4167vw,200px);display:flex;align-items:flex-end;justify-content:space-between;gap:20px;position:relative;overflow:hidden;background:url('/assets/panel/images/orbion/orbion-footer.jpg') center/100% 100% no-repeat!important;border:1px solid rgba(117,180,255,.18);border-radius:14px;box-shadow:0 14px 40px rgba(0,0,0,.30)}
.orbion-footer__brand{font-size:18px;letter-spacing:.16em;font-weight:700;color:#e7f2ff;text-shadow:0 2px 10px #000,0 0 18px rgba(77,151,255,.45)}
.orbion-footer__copy{margin-top:5px;font-size:12px;color:rgba(235,244,255,.78);text-shadow:0 2px 8px #000}.orbion-footer__line{display:none}
@media(max-width:1024px){body{background-image:linear-gradient(180deg,rgba(3,10,22,.03),rgba(3,9,18,.30)),url('/assets/panel/images/orbion/orbion-world-mobile.jpg')!important;background-size:100% 100%,cover!important;background-position:center top,center top!important;background-repeat:no-repeat!important;background-attachment:fixed!important}.layout-wrapper,.layout-page,.orbion-layout-page,.layout-content,main{background:transparent!important;background-image:none!important}}
@media(max-width:768px){
html,body{background-color:#07111f!important}
body{background-image:linear-gradient(180deg,rgba(3,10,22,0) 0%,rgba(3,10,22,.04) 60%,rgba(3,9,18,.18) 100%),url('/assets/panel/images/orbion/orbion-world-mobile.jpg')!important;background-size:100% 100%,cover!important;background-position:center top,center top!important;background-repeat:no-repeat!important;background-attachment:fixed!important}
.layout-wrapper,.layout-page,.orbion-layout-page,.layout-content,.layout-content-wrapper,main,#app{background:transparent!important;background-color:transparent!important;background-image:none!important}
.layout-wrapper{padding:0!important;margin:0!important;min-height:100vh!important}
.orbion-layout-page{min-height:100vh!important;width:100%!important}
.layout-header,.layout-navigation{background:rgba(7,18,36,.48)!important;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.layout-content{padding-left:10px!important;padding-right:10px!important}
.dark .box,.box{background:linear-gradient(135deg,rgba(13,31,55,.72),rgba(4,14,28,.64))!important}
.orbion-footer{width:calc(100% - 16px);aspect-ratio:768/220;min-height:0!important;height:auto!important;margin:8px;padding:12px 14px;box-sizing:border-box;align-items:flex-end;background:url('/assets/panel/images/orbion/orbion-footer-mobile.jpg') center/100% 100% no-repeat!important;border-radius:10px}
.orbion-footer__brand{font-size:14px}.orbion-footer__copy{font-size:10px}}
@media(max-width:480px){.orbion-footer{width:calc(100% - 12px);margin:6px;padding:9px 11px}.orbion-footer__brand{font-size:12px}.orbion-footer__copy{font-size:9px}}


/* =========================================================
   ORBION FINAL MOBILE OVERRIDES
   Dedicated mobile artwork + real MoonShine sidebar state
   ========================================================= */

@media (max-width: 768px) {

    html,
    body {
        min-height: 100%;
        background-color: #07111f !important;
    }

    body {
        background-image:
            linear-gradient(
                180deg,
                rgba(3,10,22,0) 0%,
                rgba(3,10,22,.04) 55%,
                rgba(3,9,18,.20) 100%
            ),
            url('/assets/panel/images/orbion/orbion-world-mobile.jpg') !important;

        background-size:
            100% 100%,
            cover !important;

        background-position:
            center top,
            center top !important;

        background-repeat:
            no-repeat,
            no-repeat !important;

        background-attachment:
            fixed,
            fixed !important;
    }

    /* Remove MoonShine background curtain */
    .layout-wrapper,
    .layout-page,
    .orbion-layout-page,
    .layout-content,
    .layout-content-wrapper,
    main,
    #app {
        background: transparent !important;
        background-color: transparent !important;
        background-image: none !important;
    }

    .layout-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 100vh !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .layout-page,
    .orbion-layout-page {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 100vh !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
        flex: 1 1 100% !important;
    }

    /* Whole MoonShine sidebar is CLOSED by default */
    .layout-menu {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        width: 250px !important;
        max-width: 88vw !important;
        height: 100dvh !important;
        min-height: 100dvh !important;
        z-index: 9999 !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        background: rgba(6,17,33,.94) !important;
        transform: translate3d(-105%,0,0) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transition:
            transform .25s ease,
            opacity .20s ease,
            visibility .25s ease !important;
        box-shadow: 12px 0 40px rgba(0,0,0,.45) !important;
    }

    /* asideMenuOpen=true adds this class to main-sidebar */
    .layout-menu._orbion-mobile-open {
        transform: translate3d(0,0,0) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    /* Existing MoonShine inner menu state */
    .layout-menu .menu {
        display: block !important;
    }

    .layout-menu .menu._is-opened {
        display: block !important;
        visibility: visible !important;
    }

    .layout-header,
    .layout-navigation {
        background: rgba(7,18,36,.48) !important;
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }

    .layout-content {
        padding-left: 10px !important;
        padding-right: 10px !important;
        background: transparent !important;
    }

    /* Dedicated 768x220 mobile footer */
    .orbion-footer {
        width: calc(100% - 16px) !important;
        aspect-ratio: 768 / 220 !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 8px !important;
        padding: 12px 14px !important;
        box-sizing: border-box !important;
        align-items: flex-end !important;
        background:
            url('/assets/panel/images/orbion/orbion-footer-mobile.jpg')
            center center / 100% 100% no-repeat !important;
        border-radius: 10px !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

@media (max-width: 480px) {
    .layout-menu {
        width: 245px !important;
        max-width: 88vw !important;
    }

    .orbion-footer {
        width: calc(100% - 12px) !important;
        margin: 6px !important;
        padding: 9px 11px !important;
    }
}

/* Restore desktop sidebar exactly */
@media (min-width: 769px) {
    .layout-menu {
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
}

/* =========================================================
   ORBION MOBILE UI FIX v3
   Visible slide-menu trigger + dropdown/modal stacking
   ========================================================= */

.orbion-mobile-menu-toggle {
    display: none;
}

@media (max-width: 768px) {
    /* Header must stay above page cards and must not clip dropdowns */
    .orbion-mobile-header,
    .layout-header,
    .layout-navigation {
        position: relative !important;
        z-index: 9000 !important;
        overflow: visible !important;
    }

    /* New hamburger stays visible while sidebar itself is off-canvas */
    .orbion-mobile-menu-toggle {
        display: inline-flex !important;
        width: 38px;
        height: 38px;
        flex: 0 0 38px;
        padding: 8px;
        border: 1px solid rgba(132,188,255,.24);
        border-radius: 6px;
        background: rgba(7,23,43,.72);
        flex-direction: column;
        justify-content: center;
        gap: 4px;
        cursor: pointer;
        position: relative;
        z-index: 10020;
    }

    .orbion-mobile-menu-toggle span {
        display: block;
        width: 100%;
        height: 2px;
        border-radius: 2px;
        background: #dcecff;
        pointer-events: none;
    }

    /* Sidebar remains the slide-out drawer */
    .layout-menu {
        z-index: 10000 !important;
    }

    .layout-menu._orbion-mobile-open {
        transform: translate3d(0,0,0) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    /* User profile / contacts / language dropdowns must render over cards */
    #dropdown-user,
    .bg-ava,
    [data-popper-placement],
    [role="menu"],
    .dropdown,
    .dropdown-content {
        z-index: 11050 !important;
    }

    #dropdown-user {
        position: absolute;
    }

    /* Avoid parent clipping */
    .orbion-layout-page,
    .layout-page,
    .layout-header,
    .layout-navigation,
    .orbion-mobile-header {
        overflow: visible !important;
    }

    /* MoonShine modals must be above both sidebar and header */
    .modal,
    .modal-template,
    [data-teleport-target="true"] {
        z-index: 12000 !important;
    }
}

