/*
=======================================================================
THREESIXOH! LEADS NAV v3
=======================================================================
One icon system only.
No grid.
No duplicate icon span.
Matches existing top-level sidebar geometry.
=======================================================================
*/


/* ---------------------------------------------------------------
   LEADS ROW
   --------------------------------------------------------------- */

body.tso-shell-enabled
.tso-sidebar
details:has(a[href="/leads"])
> summary.nav-group-toggle {

    display:flex !important;

    flex-direction:row !important;

    align-items:center !important;

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

    box-sizing:border-box !important;

    gap:0 !important;

    overflow:visible !important;
}


/* ---------------------------------------------------------------
   ICON
   --------------------------------------------------------------- */

body.tso-shell-enabled
.tso-sidebar
details:has(a[href="/leads"])
> summary.nav-group-toggle::before {

    content:"";

    display:block !important;

    flex:0 0 18px !important;

    width:18px !important;
    height:18px !important;

    margin:0 16px 0 0 !important;
    padding:0 !important;

    background-color:#67e8f9 !important;

    -webkit-mask-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='7' r='3.5'/%3E%3Cpath d='M3.5 19c.4-3.3 2.4-5 5.5-5s5.1 1.7 5.5 5'/%3E%3Cpath d='M18 8v6M15 11h6'/%3E%3C/svg%3E");

    mask-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='7' r='3.5'/%3E%3Cpath d='M3.5 19c.4-3.3 2.4-5 5.5-5s5.1 1.7 5.5 5'/%3E%3Cpath d='M18 8v6M15 11h6'/%3E%3C/svg%3E");

    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;

    -webkit-mask-position:center;
    mask-position:center;

    -webkit-mask-size:18px 18px;
    mask-size:18px 18px;
}


/* ---------------------------------------------------------------
   LABEL
   --------------------------------------------------------------- */

body.tso-shell-enabled
.tso-sidebar
details:has(a[href="/leads"])
> summary.nav-group-toggle
> span:first-of-type {

    display:block !important;

    flex:1 1 auto !important;

    min-width:0 !important;

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

    text-align:left !important;
}


/* ---------------------------------------------------------------
   CHEVRON
   --------------------------------------------------------------- */

body.tso-shell-enabled
.tso-sidebar
details:has(a[href="/leads"])
> summary.nav-group-toggle
> .nav-chevron {

    display:block !important;

    flex:0 0 auto !important;

    margin-left:auto !important;
    padding-left:12px !important;

    width:auto !important;

    text-align:right !important;
}


/* ---------------------------------------------------------------
   REMOVE ANY SURVIVING OLD ICON ELEMENT
   --------------------------------------------------------------- */

body.tso-shell-enabled
.tso-sidebar
.nav-icon-leads {

    display:none !important;
}


/* ---------------------------------------------------------------
   OPEN / ACTIVE
   --------------------------------------------------------------- */

body.tso-shell-enabled
.tso-sidebar
details:has(a[href="/leads"])[open]
> summary.nav-group-toggle::before,

body.tso-shell-enabled
.tso-sidebar
details.active:has(a[href="/leads"])
> summary.nav-group-toggle::before {

    background-color:#ffffff !important;
}


/* ---------------------------------------------------------------
   SIDEBAR WIDTH SAFETY
   --------------------------------------------------------------- */

body.tso-shell-enabled .tso-sidebar,
body.tso-shell-enabled .tso-sidebar-nav,
body.tso-shell-enabled .primary-navigation {

    overflow-x:hidden !important;
    max-width:100% !important;
}

