/*
 * ThreeSixOh! Sidebar Alignment
 * Standardizes all primary navigation rows to one icon/text geometry.
 */

/* ---------------------------------------------------------
   TOP-LEVEL ROW GEOMETRY
   --------------------------------------------------------- */

body.tso-shell-enabled .tso-sidebar-nav > .nav-group:not(.nav-account),
body.tso-shell-enabled .tso-sidebar-nav > .nav-utility {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
}

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-group:not(.nav-account)
> .nav-group-toggle,

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-utility {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;

    box-sizing: border-box !important;

    padding: 10px 12px !important;
    margin: 0 !important;

    gap: 10px !important;

    border: 1px solid transparent !important;
    border-radius: 8px !important;

    text-decoration: none !important;
    box-shadow: none !important;
}

/* ---------------------------------------------------------
   ONE CONSISTENT ICON COLUMN
   --------------------------------------------------------- */

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-group:not(.nav-account)
> .nav-group-toggle::before,

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-utility::before {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 22px !important;
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;

    height: 22px !important;

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

    line-height: 1 !important;
    text-align: center !important;
}

/* Automation and Ripple currently include their own icon spans.
   Hide those duplicated icons and use the standard icon column. */

body.tso-shell-enabled
.tso-sidebar-nav
.nav-automation-direct
> span[aria-hidden="true"] {
    display: none !important;
}

body.tso-shell-enabled
.tso-sidebar-nav
.nav-ripple-direct
> .nav-ripple-icon {
    display: none !important;
}

body.tso-shell-enabled
.tso-sidebar-nav
.nav-automation
> .nav-group-toggle::before {
    content: "?" !important;
}

body.tso-shell-enabled
.tso-sidebar-nav
.nav-ripple
> .nav-group-toggle::before {
    content: "?" !important;
}

/* Utility items retain a minimal utility marker but occupy the
   exact same icon column as every other top-level item. */

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-utility::before {
    content: "?" !important;
}

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

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-group:not(.nav-account)
> .nav-group-toggle
> span:not(.nav-chevron):not(.nav-count),

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-utility {
    line-height: 1.2 !important;
}

/* Chevron always occupies the far-right side. */

body.tso-shell-enabled
.tso-sidebar-nav
.nav-chevron {
    margin-left: auto !important;
    flex: 0 0 auto !important;
}

/* Count badge sits immediately before the chevron. */

body.tso-shell-enabled
.tso-sidebar-nav
.nav-count {
    margin-left: auto !important;
    flex: 0 0 auto !important;
}

body.tso-shell-enabled
.tso-sidebar-nav
.nav-count
+ .nav-chevron {
    margin-left: 0 !important;
}

/* ---------------------------------------------------------
   CLEAN DEFAULT STATE
   --------------------------------------------------------- */

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-automation:not(.active)
> .nav-group-toggle,

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-ripple:not(.active)
> .nav-group-toggle,

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-utility:not(.active) {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

/* ---------------------------------------------------------
   HOVER
   --------------------------------------------------------- */

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-automation
> .nav-group-toggle:hover,

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-ripple
> .nav-group-toggle:hover,

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-utility:hover {
    background: rgba(255,255,255,.085) !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

/* ---------------------------------------------------------
   ACTIVE STANDALONE ROWS
   Match the normal ThreeSixOh active-navigation treatment without
   the large card / blue underline appearance.
   --------------------------------------------------------- */

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-automation.active
> .nav-group-toggle,

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-ripple.active
> .nav-group-toggle,

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-utility.active {
    background: rgba(0,167,165,.22) !important;
    border-color: rgba(103,216,211,.18) !important;
    box-shadow: none !important;
}

/* Explicitly suppress underline-like decorations added by any
   module-specific stylesheet. */

body.tso-shell-enabled
.tso-sidebar-nav
.nav-automation-direct::after,

body.tso-shell-enabled
.tso-sidebar-nav
.nav-ripple-direct::after,

body.tso-shell-enabled
.tso-sidebar-nav
> .nav-utility::after {
    display: none !important;
    content: none !important;
}