/* ============================================================
 CODSHIPX AI CRM R31-R7-R1
 TOPBAR CONTEXT / SEARCH SEPARATION
============================================================ */

.topbar{
    display:flex !important;
    align-items:center !important;

    column-gap:18px !important;

    padding-left:20px !important;
    padding-right:20px !important;

    overflow:visible !important;
}


/* ============================================================
 LEFT BLOCK

 Parent owns width.
 Child is always 100% of parent.
 This removes the old fixed-child/flex-parent mismatch.
============================================================ */

.topbar-left{
    position:relative !important;

    left:auto !important;
    right:auto !important;
    top:auto !important;

    transform:none !important;

    flex:
        0 0 clamp(350px, 29vw, 420px) !important;

    width:
        clamp(350px, 29vw, 420px) !important;

    min-width:
        350px !important;

    max-width:
        420px !important;

    margin:0 !important;
    padding:0 !important;

    z-index:2 !important;
}


.page-ident,
body[data-cx-r31-topbar-state] .page-ident{

    position:relative !important;

    width:100% !important;
    min-width:0 !important;
    max-width:none !important;

    margin:0 !important;

    box-sizing:border-box !important;
}


/* ============================================================
 RIGHT BLOCK
============================================================ */

.topbar-right{
    position:relative !important;

    left:auto !important;
    right:auto !important;
    top:auto !important;

    transform:none !important;

    flex:
        1 1 0 !important;

    width:auto !important;

    min-width:0 !important;
    max-width:none !important;

    margin:0 !important;
    padding:0 !important;

    display:flex !important;
    align-items:center !important;

    gap:14px !important;

    z-index:1 !important;
}


/* ============================================================
 SEARCH

 No fixed minimum large enough to force overlap.
============================================================ */

.global-search{
    position:relative !important;

    left:auto !important;
    right:auto !important;

    transform:none !important;

    flex:
        1 1 0 !important;

    width:auto !important;

    min-width:0 !important;
    max-width:none !important;

    margin:
        0 !important;

    box-sizing:
        border-box !important;

    z-index:1 !important;

    overflow:visible !important;
}


.global-search input{
    min-width:0 !important;
    width:100% !important;
}


/* search icon must always remain visible */

.global-search > svg,
.global-search > span:first-child,
.global-search .search-icon{

    flex:
        0 0 auto !important;

    position:relative !important;

    z-index:2 !important;
}


/* ============================================================
 RIGHT ACTIONS NEVER SHRINK INTO SEARCH
============================================================ */

.codi-mini,
.cxr30-top-ask-codi,
.round-button,
.topbar-right > :last-child{

    flex-shrink:0 !important;
}


/* ============================================================
 1250 AND BELOW
============================================================ */

@media(max-width:1250px){

    .topbar{
        column-gap:
            14px !important;

        padding-left:
            14px !important;

        padding-right:
            14px !important;
    }

    .topbar-left{

        flex-basis:
            clamp(300px, 30vw, 360px) !important;

        width:
            clamp(300px, 30vw, 360px) !important;

        min-width:
            300px !important;

        max-width:
            360px !important;
    }
}


/* ============================================================
 1000 AND BELOW
============================================================ */

@media(max-width:1000px){

    .topbar-left{

        flex:
            1 1 auto !important;

        width:auto !important;

        min-width:260px !important;
        max-width:none !important;
    }

    .global-search{
        display:none !important;
    }
}


/* CODSHIPX_AI_CRM_R31_R7_R1_TOPBAR_OVERLAP_FIX_END */
