/**
 * Notion Nav Panel - Final overrides (loads after Tailwind so these always win).
 * Reference: clean left-aligned nav, group labels (CRM, OPERATIONS, ASSETS),
 * small icons, clear gap between icon and text.
 */

/* Force nav link padding - override Tailwind px-4 or any other utility */
html body .notion-nav-shell .notion-nav-menu .mud-nav-link.px-4,
html body .notion-nav-menu .mud-nav-link.px-4,
html body .notion-nav-menu .mud-nav-link,
.notion-nav-shell .notion-nav-menu .mud-nav-link {
    padding-left: 16px !important;
    padding-right: 16px !important;
    display: flex !important;
    align-items: center !important;
    min-height: 36px !important;
}

/* MudNavGroup container: same left padding as .mud-nav-item.px-4 (16px) so total indent matches */
.notion-nav-menu .mud-nav-group.px-4,
html body .notion-nav-menu .mud-nav-group.px-4,
.notion-nav-scrollable .mud-nav-group.px-4 {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

/* Asset Register header link: 28px left aligns with other links (user-verified in DevTools) */
html body .notion-nav-menu .mud-nav-group > .mud-nav-link,
html body .notion-nav-menu .mud-nav-group > button.mud-nav-link,
.notion-nav-shell .notion-nav-menu .mud-nav-group > .mud-nav-link,
.notion-nav-scrollable .mud-nav-group > .mud-nav-link {
    padding-left: 28px !important;
    padding-right: 16px !important;
}

/* Asset Register wrapper: no extra padding; group + button use 16px so same as other links */
.notion-nav-group-wrap,
html body .notion-nav-menu .notion-nav-group-wrap,
html body .notion-nav-scrollable .notion-nav-group-wrap {
    padding: 0 !important;
    margin: 0 !important;
}
.notion-nav-group-wrap .mud-nav-group,
.notion-nav-group-wrap nav.mud-nav-group,
.notion-nav-group-wrap .mud-nav-group.px-4 {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
/* Button: 28px left so Asset Register aligns with other links (same as rule above) */
.notion-nav-group-wrap .mud-nav-group > .mud-nav-link,
.notion-nav-group-wrap .mud-nav-group > button.mud-nav-link,
html body .notion-nav-group-wrap .mud-nav-group > .mud-nav-link {
    padding-left: 28px !important;
    padding-right: 16px !important;
    display: flex !important;
    align-items: center !important;
    min-height: 36px !important;
}
/* First child (icon): no extra margin so it sits at padding edge */
.notion-nav-group-wrap .mud-nav-group > .mud-nav-link > .mud-icon-root:first-of-type,
.notion-nav-group-wrap .mud-nav-group > .mud-nav-link > svg:first-of-type {
    margin-left: 0 !important;
    flex-shrink: 0 !important;
}
/* Text portion: no left padding so it doesn’t push the icon; take remaining space */
.notion-nav-group-wrap .mud-nav-group > .mud-nav-link > .mud-nav-link-text {
    padding-left: 0 !important;
    margin-left: 0 !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
}
/* Expand chevron: stay at end */
.notion-nav-group-wrap .mud-nav-group > .mud-nav-link > .mud-nav-link-expand-icon,
.notion-nav-group-wrap .mud-nav-group > .mud-nav-link > .mud-expand-panel-icon {
    flex-shrink: 0 !important;
    margin-left: auto !important;
}

html body .notion-nav-menu .mud-nav-link > div,
.notion-nav-shell .notion-nav-menu .mud-nav-link > div {
    display: flex !important;
    align-items: center !important;
}

/* Icons: 18px (reference “small, ~16x16”) + 16px gap to text */
html body .notion-nav-menu .mud-nav-link .mud-icon-root,
html body .notion-nav-menu .mud-nav-link .mud-icon,
html body .notion-nav-menu .mud-nav-link > .mud-icon-root,
html body .notion-nav-menu .mud-nav-link > .mud-icon,
html body .notion-nav-menu .mud-nav-link > svg,
html body .notion-nav-menu .mud-nav-link .notion-nav-link-icon,
html body .notion-nav-menu .mud-nav-link .notion-nav-link-icon.mud-icon-root,
.notion-nav-shell .notion-nav-menu .mud-nav-link .mud-icon-root,
.notion-nav-shell .notion-nav-menu .mud-nav-link > .mud-icon-root,
.notion-nav-shell .notion-nav-menu .mud-nav-link > svg,
.notion-nav-shell .notion-nav-menu .mud-nav-link .notion-nav-link-icon {
    font-size: 18px !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    margin-right: 16px !important;
    flex-shrink: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Asset Register / MudNavGroup header: force same 18px icon as other items (override MudBlazor .mud-icon-size-medium) */
html body .notion-nav-menu .mud-nav-group > .mud-nav-link .mud-icon-root:not(.mud-nav-link-expand-icon),
html body .notion-nav-menu .mud-nav-group > .mud-nav-link .mud-icon-root.mud-icon-size-medium:not(.mud-nav-link-expand-icon),
.notion-nav-shell .notion-nav-menu .mud-nav-group > .mud-nav-link .mud-icon-root:not(.mud-nav-link-expand-icon),
.notion-nav-menu .mud-nav-group > .mud-nav-link .mud-nav-link-icon {
    font-size: 18px !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    margin-right: 16px !important;
}

/* Section labels: align with nav item content, bumped in slightly more */
.notion-nav-menu .notion-section-label-wrap {
    padding-left: 40px !important;
    margin-left: 0 !important;
}

/* Nested items: 32px indent, no icon */
.notion-nav-menu .mud-nav-group .mud-collapse .mud-nav-link {
    padding-left: 32px !important;
    min-height: 36px !important;
}

/* Expand chevron: 16px */
.notion-nav-menu .mud-nav-group .mud-expand-panel-icon .mud-icon-root,
.notion-nav-menu .mud-nav-group .mud-nav-link-expand-icon .mud-icon-root,
.notion-nav-menu .mud-nav-group .mud-expand-panel-icon,
.notion-nav-menu .mud-nav-group .mud-nav-link-expand-icon {
    font-size: 16px !important;
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
}