/* ALOVE SHARED NAVIGATION V1 */
/* Original design copied from Home FINAL10. */

/* ==========================================================
   V28 GRAPHITE STONE NAVBAR
   ========================================================== */

/* Main navbar — darker graphite stone */
.navbar.navbar-dark.bg-dark {
    background:
        radial-gradient(
            ellipse at 45% -80%,
            rgba(190, 200, 205, .11) 0%,
            rgba(105, 116, 123, .05) 40%,
            transparent 68%
        ),
        linear-gradient(
            170deg,
            rgba(255,255,255,.04) 0%,
            transparent 35%,
            rgba(0,0,0,.10) 72%,
            rgba(0,0,0,.20) 100%
        ),
        #2b343a !important;

    border-top: 1px solid rgba(205, 214, 218, .16);
    border-bottom: 1px solid rgba(5, 8, 10, .70);

    box-shadow:
        inset 0 1px 0 rgba(230, 235, 238, .08),
        inset 0 -3px 7px rgba(0,0,0,.18),
        0 2px 6px rgba(0,0,0,.22) !important;
}


/* Navbar buttons become part of the stone */
.navbar.navbar-dark.bg-dark .btn-dark {
    background: transparent !important;
    border-color: transparent !important;

    box-shadow: none !important;

    color: #e2e7e9;
    text-shadow:
        0 -1px 0 rgba(0,0,0,.85),
        0 1px 0 rgba(255,255,255,.08);
}


/* Preserve username green accent */
.navbar.navbar-dark.bg-dark a[href="/home"] {
    color: #5beb34 !important;
}


/* Subtle response, not a big Bootstrap button */
.navbar.navbar-dark.bg-dark .btn-dark:hover,
.navbar.navbar-dark.bg-dark .btn-dark:focus {
    background: rgba(255,255,255,.045) !important;
    border-color: rgba(180,195,202,.10) !important;
}


/* Currency block must not look like another card */
.navbar.navbar-dark.bg-dark .card-header.bg-dark {
    background: transparent !important;
    border: 0 !important;

    box-shadow: none !important;
}


/* Slight engraved divider along bottom */
.navbar.navbar-dark.bg-dark::after {
    content: "";

    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;

    height: 1px;

    background: rgba(190,200,205,.09);

    pointer-events: none;
}

/* ==========================================================
   V29 SIDEBAR — GRAPHITE STONE
   ========================================================== */

#sidebar.sidebar {
    background:
        radial-gradient(
            ellipse at 20% 0%,
            rgba(190,200,205,.10) 0%,
            rgba(100,112,119,.045) 38%,
            transparent 68%
        ),
        linear-gradient(
            100deg,
            rgba(255,255,255,.035) 0%,
            transparent 32%,
            rgba(0,0,0,.11) 76%,
            rgba(0,0,0,.20) 100%
        ),
        #252f35 !important;

    border-right: 2px solid rgba(5,8,10,.68) !important;

    box-shadow:
        inset 1px 0 0 rgba(225,232,235,.08),
        inset -4px 0 9px rgba(0,0,0,.20),
        3px 0 8px rgba(0,0,0,.24) !important;
}


/* Links/buttons inside sidebar */

#sidebar.sidebar a,
#sidebar.sidebar .btn {
    background: transparent !important;

    border-color: transparent !important;

    color: #dce3e6 !important;

    text-shadow:
        0 -1px 0 rgba(0,0,0,.85),
        0 1px 0 rgba(255,255,255,.07);

    box-shadow: none !important;
}


/* Hover: subtle engraving/highlight */

#sidebar.sidebar a:hover,
#sidebar.sidebar .btn:hover,
#sidebar.sidebar a:focus,
#sidebar.sidebar .btn:focus {
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.065),
            rgba(255,255,255,.018)
        ) !important;

    border-top: 1px solid rgba(210,220,224,.10) !important;
    border-bottom: 1px solid rgba(0,0,0,.30) !important;

    color: #ffffff !important;
}


/* Separators inside sidebar */

#sidebar.sidebar hr {
    border-color: rgba(190,200,205,.13) !important;
}


/* Keep icons slightly metallic */

#sidebar.sidebar i {
    color: #b9c7cd;
    text-shadow:
        0 -1px 0 rgba(0,0,0,.8),
        0 1px 0 rgba(255,255,255,.10);
}

/* Sidebar offset for fixed navbar */
#sidebar.sidebar {
    padding-top: 64px !important;
}


/*
 * Travel previously removed sidebar button rounding.
 * Restore the standard Home/Bootstrap small-button radius.
 */
#sidebar.sidebar .btn {
    border-radius: .2rem !important;
}


/* ===== SHARED SIDEBAR SUBMENUS V2 ===== */
/* Dark graphite submenu on ALL pages */

#sidebar.sidebar .sidebar-nav > ul.card {
    background:
        linear-gradient(
            170deg,
            #303b41 0%,
            #263138 100%
        ) !important;

    background-color: #29343a !important;
    border: 1px solid rgba(155,175,185,.13) !important;
    border-radius: 3px !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.045),
        0 2px 5px rgba(0,0,0,.20) !important;
}

#sidebar.sidebar .sidebar-nav > ul.card > a {
    background: transparent !important;
    color: #dce3e6 !important;
}

#sidebar.sidebar .sidebar-nav > ul.card > a:hover,
#sidebar.sidebar .sidebar-nav > ul.card > a:focus {
    background: rgba(255,255,255,.055) !important;
    color: #ffffff !important;
}