/* ==========================================================================
   display-scale.css — compact sizing for high-DPI laptop screens
   --------------------------------------------------------------------------
   Windows laptops default to 125%/150% display scaling, which makes the UI
   render as large as a 125%/150% browser zoom. On those screens (desktop
   width, device pixel ratio >= 1.25) the root font size drops to 80%, which
   gives the same look as the 80% browser zoom.

   All shared stylesheets size text and controls in rem, so they scale from
   this one value. Use rem, not px, for new font sizes or they will not scale.

   Deliberately not done with `zoom`: CSS zoom makes jQuery .offset() and
   getBoundingClientRect() disagree with CSS coordinates, which misplaces
   datepickers, autocompletes and dropdowns.

   Browser zoom changes the device pixel ratio too, so a user who already
   zooms to 80% (1.5 x 0.8 = 1.2) drops out of this rule and is not shrunk
   twice.
   ========================================================================== */

@media screen and (min-width: 992px) and (-webkit-min-device-pixel-ratio: 1.25),
       screen and (min-width: 992px) and (min-resolution: 1.25dppx) {
    html {
        font-size: 80%;
    }

    /* icomoon (vendor) hard-codes its icon sizes in px */
    [class^="icon-"], [class*=" icon-"] {
        font-size: 1rem;
    }
    .icon-2x {
        font-size: 2rem;
    }
    .icon-3x {
        font-size: 3rem;
    }

    /* Collapsed sidebar: its icons and toggle are px-sized images, so the
       rail keeps its unscaled 56px (3.5rem x 16px) instead of shrinking
       around them, and the fly-out menus start at its edge. */
    body.sidebar-xs .sidebar-main {
        width: 56px;
    }
    body.sidebar-xs .sidebar-main .sidebar-fixed-bottom {
        width: 56px !important;
    }
    body.sidebar-xs .sidebar-main .nav-sidebar > .nav-item-submenu:not(.sidebar-fixed-bottom):hover > .nav-group-sub,
    body.sidebar-xs .sidebar-main .nav-sidebar > .nav-item-submenu:not(.sidebar-fixed-bottom):focus-within > .nav-group-sub,
    body.sidebar-xs .sidebar-main.sidebar-fixed .nav-sidebar > .nav-item-submenu:focus > .nav-group-sub,
    body.sidebar-xs .sidebar-main.sidebar-fixed .nav-sidebar > .nav-item-submenu:hover > .nav-group-sub {
        left: 56px !important;
    }
}
