/* ─────────────────────────────────────────────────────────────────────────
   Roadrunner Live Core — layout styles
   Target: match legacy nav (icon-over-text, white bar, #3f97a7 accent)
   ───────────────────────────────────────────────────────────────────────── */

/* ── Navbar shell ────────────────────────────────────────────────────────── */
#main-navbar {
    background-color: #fff;
    border-bottom: 1px solid #e0e0e0;
    padding: 0;
    min-height: 64px;

    /* Override Bootstrap 5.3 CSS custom properties so its internal
       colour tokens don't fight our colour declarations below */
    --bs-navbar-color:             #55585b;
    --bs-navbar-hover-color:       #3f97a7;
    --bs-navbar-active-color:      #3f97a7;
    --bs-navbar-disabled-color:    rgba(85,88,91,.3);
    --bs-navbar-brand-color:       #55585b;
    --bs-navbar-brand-hover-color: #3f97a7;
    --bs-navbar-toggler-border-color: rgba(85,88,91,.2);
}

/* ── Logo ────────────────────────────────────────────────────────────────── */
#main-navbar .navbar-brand {
    padding: 10px 16px;
}
#main-navbar .navbar-brand img {
    height: 40px;
}

/* ── Primary nav: icon ABOVE text ────────────────────────────────────────── */
#primary-nav .nav-link {
    display:        flex !important;
    flex-direction: column !important;
    align-items:    center !important;
    justify-content: center;
    padding:        10px 14px !important;
    color:          #55585b !important;
    font-size:      .72rem;
    line-height:    1;
    gap:            4px;
    white-space:    nowrap;
    border-bottom:  3px solid transparent;
    transition:     color .15s, border-color .15s;
}

#primary-nav .nav-link i {
    font-size: 1.4rem;
    line-height: 1;
}

#primary-nav .nav-link:hover {
    color:          #3f97a7 !important;
    border-bottom:  3px solid #3f97a7;
}

#primary-nav .nav-link.active,
#primary-nav .nav-item.active > .nav-link {
    color:          #3f97a7 !important;
    border-bottom:  3px solid #3f97a7;
    font-weight:    600;
}

/* ── Dropdown caret hidden (icon nav doesn't need it) ────────────────────── */
#primary-nav .nav-link.dropdown-toggle::after {
    display: none;
}

/* ── Dropdown menus ──────────────────────────────────────────────────────── */
#primary-nav .dropdown-menu {
    border-top:     2px solid #3f97a7;
    border-radius:  0 0 4px 4px;
    margin-top:     0;
    min-width:      200px;
}

#primary-nav .dropdown-item {
    font-size: .85rem;
    color: #55585b;
    padding: 6px 16px;
}

#primary-nav .dropdown-item:hover {
    color:            #3f97a7;
    background-color: #f5f5f5;
}

#primary-nav .dropdown-header {
    color:       #3f97a7;
    font-weight: 600;
    font-size:   .75rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* ── Right-side user pill ────────────────────────────────────────────────── */
#nav-user .nav-link {
    color:       #55585b !important;
    font-size:   .85rem;
    align-items: center;
    gap:         6px;
}
#nav-user .nav-link:hover {
    color: #3f97a7 !important;
}
#nav-user .badge-company {
    font-size:     .68rem;
    background:    #55585b;
    color:         #fff;
    padding:       2px 6px;
    border-radius: 3px;
    vertical-align: middle;
}
#nav-user .dropdown-menu {
    border-top:  2px solid #3f97a7;
    min-width:   220px;
}

/* ── Theme bar ───────────────────────────────────────────────────────────── */
.theme-bar {
    height:     4px;
    background: #55585a;
}

/* ── Environment banners ─────────────────────────────────────────────────── */
.env-banner-dev {
    background:  #0d6efd;
    color:       #fff;
    text-align:  center;
    padding:     4px 0;
    font-size:   .82rem;
}

.env-banner-beta {
    background:  #ffc107;
    color:       #000;
    text-align:  center;
    padding:     4px 0;
    font-size:   .82rem;
}

/* ── Page wrapper ────────────────────────────────────────────────────────── */
#page-wrapper {
    padding-top: 20px;
}

/* ── Footer product equation ─────────────────────────────────────────────── */
.rt-add img {
    height:         32px;
    vertical-align: middle;
}
.foot-plus {
    color:          #fff;
    font-size:      1.2rem;
    font-weight:    700;
    vertical-align: middle;
    margin:         0 4px;
}

/* ── Footer ──────────────────────────────────────────────────────────────── */
#footer {
    background:  #000;
    color:       #fff;
    padding:     32px 0 20px;
    margin-top:  48px;
    font-size:   .85rem;
}

#footer a {
    color:           #999;
    text-decoration: none;
}

#footer a:hover {
    color: #fff;
}

#footer .footer-bottom {
    color:     #999;
    font-size: .8rem;
}
