﻿/* ============================================================
   GSMUnlockUSA Submit Orders V6.1.2.64
   Adaptive Browse Services + smooth downward Secure Connection sidebar.

   V63 behavior:
   - default/collapsed Secure: combined sidebar stays sticky
   - Browse Services keeps a stable viewport-aware tree height
   - Secure details expand to full natural height, no inner scroll
   - Secure Connection header remains the top row
   - if expanded Secure + Browse fits viewport: sidebar remains sticky
   - if it does NOT fit: sidebar is anchored at its current visual
     position and scrolls naturally with the page (no jump/overlap)
   - legacy ServiceTreeCache / mnbulk.js down()/up() remain untouched
   ============================================================ */

@media (min-width: 768px) {
    .gsm-service-sidebar-layout-row-v61 {
        display: -webkit-flex;
        display: flex;
        -webkit-align-items: stretch;
        align-items: stretch;
    }

    .gsm-service-sidebar-layout-row-v61 > [class*="col-sm-"] {
        float: none !important;
        min-width: 0;
    }

    .gsm-service-sidebar-layout-row-v61 > .col-sm-3 {
        -webkit-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .gsm-service-sidebar-layout-row-v61 > .col-sm-9 {
        -webkit-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }

    #unlockSidebarV58.gsm-service-sidebar-v58 {
        position: relative;
        width: 100%;
        height: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    /* Normal mode: Browse + Secure float together. */
    #unlockServiceSidebarSticky.gsm-service-sidebar-sticky-v61 {
        position: -webkit-sticky;
        position: sticky;
        top: 8px;
        z-index: 4;
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    #unlockServiceSidebarSticky #unlockFastServiceTreeWidget {
        margin-bottom: 8px !important;
    }

    #unlockServiceSidebarSticky #unlockSidebarSecurityV57.gsm-sidebar-security-v57 {
        position: relative !important;
        top: auto !important;
        z-index: 1;
        margin: 0 0 8px 0 !important;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
        flex-direction: column;
        overflow: hidden;
    }

    /* V64: Secure Connection header stays on TOP. */
    #unlockServiceSidebarSticky #unlockSidebarSecurityV57 .gsm-sidebar-security-toggle-v57 {
        -webkit-order: 1;
        order: 1;
        position: relative;
        z-index: 2;
        -webkit-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    /*
     * Details expand gently DOWNWARD below the header.
     * JS supplies the measured max-height during the transition, then returns
     * to natural height. overflow is only hidden while animating; there is
     * never an inner Secure scrollbar.
     */
    #unlockServiceSidebarSticky #unlockSidebarSecurityV57 .gsm-sidebar-security-details-v57 {
        -webkit-order: 2;
        order: 2;
        height: auto !important;
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        overscroll-behavior: auto;
        -webkit-overflow-scrolling: auto;
        transition: max-height 280ms ease, opacity 180ms ease;
        will-change: max-height, opacity;
    }

    #unlockServiceSidebarSticky #unlockSidebarSecurityV57.gsm-security-expanded-v64 .gsm-sidebar-security-details-v57 {
        opacity: 1;
    }

    /*
     * Adaptive V63 flow mode.
     * JS applies this only when the fully expanded combined sidebar cannot
     * fit the viewport. It converts the sticky offset into normal-flow margin
     * space, preserving the current visual location without using absolute/
     * fixed positioning. The expanded sidebar therefore still contributes to
     * page height and cannot overlap the footer.
     */
    #unlockSidebarV58.gsm-service-sidebar-flow-host-v63 {
        position: relative !important;
        height: auto !important;
    }

    #unlockServiceSidebarSticky.gsm-service-sidebar-adaptive-flow-v63 {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100%;
        max-height: none !important;
        z-index: 4;
    }

    /* Safe fallback if JS is delayed/disabled. JS finalizes the exact value. */
    #unlockServiceSidebarSticky #unlockFastServiceTreeWidget #unlockFastServiceTree,
    #unlockServiceSidebarSticky #unlockFastServiceTreeWidget .gsm-service-browser-results-v57 {
        max-height: calc(100vh - 300px) !important;
    }
}

@media (max-width: 767px) {
    #unlockServiceSidebarSticky.gsm-service-sidebar-sticky-v61,
    #unlockServiceSidebarSticky.gsm-service-sidebar-adaptive-flow-v63 {
        position: static !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        max-height: none !important;
    }

    #unlockSidebarSecurityV57.gsm-sidebar-security-v57 {
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
        flex-direction: column;
        overflow: hidden;
    }

    #unlockSidebarSecurityV57 .gsm-sidebar-security-toggle-v57 {
        -webkit-order: 1;
        order: 1;
    }

    #unlockSidebarSecurityV57 .gsm-sidebar-security-details-v57 {
        -webkit-order: 2;
        order: 2;
        height: auto !important;
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        transition: max-height 280ms ease, opacity 180ms ease;
    }

    #unlockSidebarSecurityV57.gsm-security-expanded-v64 .gsm-sidebar-security-details-v57 {
        opacity: 1;
    }
}

/* ============================================================
   V6.1.2.70 - Browse Services header/icon alignment polish
   Presentation only. No service-tree IDs, onclick contracts or legacy
   down()/up() behavior are changed.
   ============================================================ */
.gsm-service-browser-v57 .gsm-service-browser-header-v57{
    display:-webkit-flex!important;
    display:flex!important;
    -webkit-align-items:center!important;
    align-items:center!important;
}
.gsm-service-browser-v57 .gsm-service-browser-title-v57{
    display:-webkit-flex!important;
    display:flex!important;
    -webkit-align-items:center!important;
    align-items:center!important;
    min-width:0!important;
    line-height:1!important;
}
.gsm-service-browser-v57 .gsm-service-browser-title-v57 > .glyphicon-th-list{
    position:relative!important;
    top:0!important;
    display:inline-block!important;
    -webkit-flex:0 0 16px!important;
    flex:0 0 16px!important;
    width:16px!important;
    margin:0 8px 0 0!important;
    padding:0!important;
    line-height:1!important;
    text-align:center!important;
    vertical-align:middle!important;
}
.gsm-service-browser-v57 .gsm-service-browser-title-v57 > span:last-child{
    display:inline-block!important;
    margin:0!important;
    padding:0!important;
    line-height:18px!important;
    vertical-align:middle!important;
}
.gsm-service-browser-v57 .gsm-service-browser-toggle-v57{
    display:-webkit-inline-flex!important;
    display:inline-flex!important;
    -webkit-align-items:center!important;
    align-items:center!important;
    -webkit-justify-content:center!important;
    justify-content:center!important;
}
.gsm-service-browser-v57 .gsm-service-browser-toggle-v57 .glyphicon{
    position:relative!important;
    top:0!important;
    margin:0!important;
    line-height:1!important;
    vertical-align:middle!important;
}

/* ============================================================
   V6.1.2.73 - Shared-site dependency-free sidebar icons
   - Browse Services icon no longer requires Bootstrap Glyphicons
   - Sidebar search magnifier no longer requires Bootstrap Glyphicons
   - Keeps legacy tree / down() / up() behavior untouched
   ============================================================ */
.gsm-service-browser-v57 .gsm-service-browser-title-icon-v73{
    display:-webkit-inline-flex!important;
    display:inline-flex!important;
    -webkit-align-items:center!important;
    align-items:center!important;
    -webkit-justify-content:center!important;
    justify-content:center!important;
    -webkit-flex:0 0 16px!important;
    flex:0 0 16px!important;
    width:16px!important;
    height:16px!important;
    margin:0 8px 0 0!important;
    padding:0!important;
    color:#4b91bc!important;
    line-height:1!important;
    vertical-align:middle!important;
}
.gsm-service-browser-v57 .gsm-service-browser-title-icon-v73 svg{
    display:block!important;
    width:14px!important;
    height:14px!important;
    margin:0!important;
    padding:0!important;
    fill:currentColor!important;
}

.gsm-service-browser-v57 .gsm-service-browser-search-v57{
    position:relative!important;
}
.gsm-service-browser-v57 .gsm-service-browser-search-svg-v73{
    position:absolute!important;
    left:12px!important;
    top:50%!important;
    width:17px!important;
    height:17px!important;
    margin:0!important;
    padding:0!important;
    color:#6f8da5!important;
    line-height:1!important;
    transform:translateY(-50%)!important;
    pointer-events:none!important;
    z-index:2!important;
}
.gsm-service-browser-v57 .gsm-service-browser-search-svg-v73 svg{
    display:block!important;
    width:17px!important;
    height:17px!important;
    margin:0!important;
    padding:0!important;
}
.gsm-service-browser-v57 .gsm-service-browser-search-v57 input{
    padding-left:38px!important;
}

@media(max-width:767px){
    .gsm-service-browser-v57 .gsm-service-browser-search-svg-v73{
        left:11px!important;
        width:16px!important;
        height:16px!important;
    }
    .gsm-service-browser-v57 .gsm-service-browser-search-svg-v73 svg{
        width:16px!important;
        height:16px!important;
    }
    .gsm-service-browser-v57 .gsm-service-browser-search-v57 input{
        padding-left:36px!important;
    }
}

/* V73: dependency-free chevrons for Browse Services + Secure Connection. */
.gsm-service-browser-v57 .gsm-service-browser-chevron-v73,
#unlockSidebarSecurityV57 .gsm-service-browser-chevron-v73{
    position:relative!important;
    display:inline-block!important;
    width:9px!important;
    height:9px!important;
    margin:0!important;
    padding:0!important;
    border-right:2px solid currentColor!important;
    border-bottom:2px solid currentColor!important;
    background:none!important;
    color:#6f8da5!important;
    line-height:1!important;
    vertical-align:middle!important;
    transform-origin:50% 50%!important;
}
.gsm-service-browser-v57 .gsm-chevron-up-v73,
#unlockSidebarSecurityV57 .gsm-chevron-up-v73{
    transform:rotate(225deg)!important;
}
.gsm-service-browser-v57 .gsm-chevron-down-v73,
#unlockSidebarSecurityV57 .gsm-chevron-down-v73{
    transform:rotate(45deg)!important;
}
.gsm-service-browser-v57 .gsm-service-browser-toggle-v57:hover .gsm-service-browser-chevron-v73,
#unlockSidebarSecurityV57 .gsm-sidebar-security-toggle-v57:hover .gsm-service-browser-chevron-v73{
    color:#3f789b!important;
}


/* ==========================================================
   MASTER UNLOCK CODE - SHARED SIDEBAR BRAND V1
   Gives the cloned sidebar its own retail/guided storefront
   identity while retaining the existing service-tree engine.
   ========================================================== */

/* Master-specific assistance card */
#unlockSidebarV58 .muc-support-center-v1 .content-wL {
    border:1px solid #d6e1e8 !important;
    border-radius:11px !important;
    box-shadow:0 4px 12px rgba(23,61,92,.035) !important;
}

#unlockSidebarV58 .muc-support-center-v1 .sc371-head {
    min-height:76px !important;
    padding:12px 13px !important;
    gap:11px !important;
    background:
        linear-gradient(120deg,#fff 0%,#f8fbfc 72%,#fff7ee 100%) !important;
    border-bottom:1px solid #e3eaef !important;
}

#unlockSidebarV58 .muc-support-center-v1 .sc371-orb {
    width:72px !important;
    height:72px !important;
    right:-18px !important;
    top:-20px !important;
    background:rgba(239,133,20,.07) !important;
}

#unlockSidebarV58 .muc-support-center-v1 .sc371-avatar-wrap {
    flex:0 0 52px !important;
    width:52px !important;
    height:52px !important;
    align-items:center !important;
}

#unlockSidebarV58 .muc-support-center-v1 .sc371-avatar-img {
    width:50px !important;
    height:50px !important;
    object-fit:contain !important;
    transform:none !important;
    filter:drop-shadow(0 2px 4px rgba(23,61,92,.10));
}

#unlockSidebarV58 .muc-support-center-v1 .sc371-title {
    color:#173d5c !important;
    font-size:13.5px !important;
    line-height:18px !important;
}

#unlockSidebarV58 .muc-support-center-v1 .sc371-subtitle {
    max-width:170px;
    color:#718697 !important;
    font-size:9.5px !important;
    line-height:14px !important;
}

#unlockSidebarV58 .muc-support-center-v1 a.sc371-action {
    padding:12px 14px !important;
    gap:10px !important;
    background:#fff !important;
}

#unlockSidebarV58 .muc-support-center-v1 a.sc371-action:hover {
    background:#fffaf4 !important;
}

#unlockSidebarV58 .muc-support-center-v1 .sc371-icon {
    flex-basis:36px !important;
    width:36px !important;
    height:36px !important;
    border-radius:9px !important;
    font-size:16px !important;
}

#unlockSidebarV58 .muc-support-center-v1 .sc371-icon-orange {
    background:#fff5eb !important;
    border-color:#f0d7bb !important;
    color:#d77b18 !important;
}

#unlockSidebarV58 .muc-support-center-v1 .sc371-icon-blue {
    background:#f0f7fb !important;
    border-color:#d7e5ee !important;
    color:#347ba4 !important;
}

#unlockSidebarV58 .muc-support-center-v1 .sc371-action-title {
    color:#245d80 !important;
    font-size:11px !important;
    line-height:16px !important;
}

#unlockSidebarV58 .muc-support-center-v1 .sc371-action-note {
    color:#788c9b !important;
    font-size:9px !important;
    line-height:13px !important;
}

#unlockSidebarV58 .muc-support-center-v1 .sc371-sub {
    padding:10px 12px 12px !important;
    color:#81929e !important;
    font-size:9px !important;
}

/* Find Services browser */
#unlockServiceSidebarSticky #unlockFastServiceTreeWidget.gsm-service-browser-v57 {
    overflow:hidden !important;
    border:1px solid #d6e1e8 !important;
    border-radius:10px !important;
    background:#fff !important;
    box-shadow:0 4px 12px rgba(23,61,92,.03) !important;
}

#unlockFastServiceTreeWidget .gsm-service-browser-header-v57 {
    min-height:45px !important;
    padding:10px 11px 9px !important;
    border:0 !important;
    border-top:3px solid #ef8514 !important;
    border-bottom:1px solid #e1e8ed !important;
    background:
        linear-gradient(105deg,rgba(239,133,20,.045),transparent 55%),
        #f8fafb !important;
    color:#173d5c !important;
}

#unlockFastServiceTreeWidget .gsm-service-browser-title-v57 {
    color:#173d5c !important;
    font-size:12px !important;
    font-weight:700 !important;
}

#unlockFastServiceTreeWidget .gsm-service-browser-title-v57 .glyphicon {
    color:#347ba4 !important;
    margin-right:6px !important;
}

#unlockFastServiceTreeWidget .gsm-service-browser-toggle-v57 {
    color:#4d7188 !important;
}

#unlockFastServiceTreeWidget .gsm-service-browser-search-v57 {
    margin:10px 10px 8px !important;
}

#unlockFastServiceTreeWidget #unlockSidebarSearchV57 {
    border:1px solid #cbd9e2 !important;
    border-radius:7px !important;
    background:#fbfcfd !important;
    color:#31536b !important;
}

#unlockFastServiceTreeWidget #unlockSidebarSearchV57:focus {
    border-color:#76a6c7 !important;
    box-shadow:0 0 0 3px rgba(44,111,157,.07) !important;
}

#unlockFastServiceTreeWidget .gsm-service-browser-tree-shell-v57 {
    border-top:1px solid #edf1f4 !important;
}

/* Slightly warmer hover so the Master browser does not look like GSMUnlockUSA. */
#unlockFastServiceTreeWidget .cls-SelectGroup a:hover,
#unlockFastServiceTreeWidget .cls-SelectGroup a:focus {
    background:#fff8f0 !important;
}

/* Secure Access panel */
#unlockSidebarSecurityV57.muc-sidebar-security-v1 {
    margin-top:10px !important;
    overflow:hidden !important;
    border:1px solid #d8e3e9 !important;
    border-radius:9px !important;
    background:#f8fafb !important;
    box-shadow:none !important;
}

#unlockSidebarSecurityV57.muc-sidebar-security-v1 .gsm-sidebar-security-toggle-v57 {
    background:#f8fafb !important;
}

#unlockSidebarSecurityV57.muc-sidebar-security-v1 .gsm-sidebar-security-copy-v57 strong {
    color:#315b75 !important;
}

#unlockSidebarSecurityV57.muc-sidebar-security-v1 .gsm-sidebar-security-copy-v57 small {
    color:#8193a0 !important;
}

#unlockSidebarSecurityV57 .muc-sidebar-security-copy-v1 {
    padding:11px 12px !important;
    color:#687f90 !important;
    font-size:9.5px !important;
    line-height:15px !important;
    background:#fff !important;
}

#unlockSidebarSecurityV57 .muc-sidebar-security-copy-v1 strong {
    color:#244f6d !important;
}

/* Mobile sizing, if sidebar is reused in a mobile drawer/context */
@media(max-width:767px) {
    #unlockSidebarV58 .muc-support-center-v1 .sc371-head {
        min-height:68px !important;
    }

    #unlockSidebarV58 .muc-support-center-v1 .sc371-avatar-wrap {
        flex-basis:46px !important;
        width:46px !important;
        height:46px !important;
    }

    #unlockSidebarV58 .muc-support-center-v1 .sc371-avatar-img {
        width:44px !important;
        height:44px !important;
    }
}
