/*
    Corrections to the W3CRM vendor template (wwwroot/W3CRM/css/style.css).

    They live here rather than in that file because Peach.Core ships a
    byte-identical copy of style.css as a razor class library asset, so an edit
    there has to be mirrored into another repository and would be lost the next
    time the template is updated.
*/

/*
    The scrollbar gutter was only reserved on pages with enough content to
    scroll, so the viewport was 2483px wide on the dashboard and 2488px on a
    short page. Everything laid out against the viewport moved with it - the
    header's right-hand cluster (bell, site badge, greeting) shifted 5px
    sideways between pages, while the fixed logo panel stayed put, which read
    as the header being misaligned. It also left content stopping 5px short of
    the window edge on scrolling pages only, like an inconsistent right margin.

    Reserving the gutter always costs the same 5px on every page and nothing
    moves. It cannot be reclaimed instead: the content genuinely overflows.
*/
html {
    scrollbar-gutter: stable;
}

/*
    .nav-header is position:fixed but no rule anywhere gives it a left, so it
    fell back to its static position of 3.75px while .header and .deznav are
    both explicitly at 0. The logo panel therefore overhung the sidebar below
    it by 3.75px and left a sliver of background down its left edge.
*/
.nav-header {
    left: 0;
}

/* The template's RTL mode positions this from the right; leave it as it was. */
[direction="rtl"] .nav-header {
    left: auto;
}

/*
    Inside .page-titles the heading keeps Bootstrap's default
    margin-bottom: 0.5rem, which sits inside the bar's symmetric 9.6px padding.
    That pushed the title up and collected the slack underneath it - 10px above
    the heading against 19px below.
*/
.page-titles h3 {
    margin-bottom: 0;
}

/*
    The sidebar menu goes three levels deep (Manage > Master > Whatsapp Forms),
    but the template only ever styled two: `.deznav .metismenu ul a` is a
    descendant selector, so every level below the first gets the same 2.5rem
    padding and the same marker dash at 1.8rem. A third-level item therefore
    started in the same column as its own parent, and the tree read as flat.

    Indenting the nested `ul` rather than its anchors moves the dash, the hover
    nudge and all four media-query variants of that padding together, instead of
    restating each one. The collapsed sidebar is unaffected: its fly-out already
    overrides this padding to 1px.
*/
.deznav .metismenu ul ul {
    padding-left: 1.25rem;
}