/* Shared application chrome. Standalone login/print pages have no .app-shell. */
.app-shell {
    --shell-ink: #0b1733;
    --shell-muted: #64789e;
    --shell-subtle: #8c9bb6;
    --shell-blue: #063865;
    --shell-surface: #fff;
    --shell-canvas: #f5f8fc;
    --shell-line: #edf1f6;
    --shell-soft: #f1f5f9;
    --shell-active-bg: #e6f3ff;
    --shell-active-ink: #083e75;
    --shell-sidebar-width: 242px;
    --shell-header-height: 66px;
    min-height: 100vh;
    background: var(--shell-canvas);
}

.app-shell :is(#page-topbar, .navbar-menu, .page-title-box) {
    font-family: Arial, sans-serif;
    font-size: 14px;
    color: var(--shell-ink);
}

.app-shell :is(#page-topbar, .navbar-menu) :is(button, input) {
    font-family: inherit;
}

/* Header and search are the same on every authenticated page. */
.app-shell #page-topbar {
    border-bottom: 1px solid var(--shell-line);
    box-shadow: none;
    background: var(--shell-surface);
}

.app-shell .navbar-header {
    height: var(--shell-header-height);
    padding: 0 15px;
}

.app-shell .navbar-header > .d-flex { min-width: 0; }
.app-shell .header-item { height: var(--shell-header-height); }
.app-shell .topbar-user { background: transparent; }
.app-shell .user-name-text { color: var(--shell-ink); }
.app-shell .btn-topbar { color: var(--shell-muted); }
.app-shell .hamburger-icon span { background-color: var(--shell-muted); }

.app-header-search {
    display: flex;
    align-items: center;
    width: clamp(240px, 29vw, 434px);
    height: 37px;
    margin: auto 0 auto 26px;
    border: 1px solid #dfe6f0;
    border-radius: 9px;
    background: #f9fbfd;
}

.app-header-search button {
    border: 0;
    background: transparent;
    color: var(--shell-muted);
    padding: 6px 12px;
    font-size: 18px;
}

.app-header-search input {
    min-width: 0;
    width: 100%;
    padding: 8px 12px 8px 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--shell-ink);
    font-size: 14px;
}

.app-header-search input::placeholder { color: var(--shell-muted); }
.app-header-search:focus-within {
    border-color: #5495d5;
    box-shadow: 0 0 0 2px #176ac015;
}

/* Navigation retains the existing active links, collapse and mobile behavior. */
.app-shell .navbar-menu {
    border-right: 1px solid var(--shell-line);
    box-shadow: none;
    background: var(--shell-surface);
}

.app-shell .navbar-brand-box {
    padding: 0 20px;
    text-align: left;
    background: var(--shell-surface);
}

.app-shell .logo { line-height: var(--shell-header-height); color: var(--shell-blue); }
.app-shell .logo .logo-lg { font-size: 26px !important; letter-spacing: -.8px; }
.app-shell .logo .text-success { color: #64991f !important; }
.app-shell .navbar-nav { padding: 14px 12px; }

.app-shell .navbar-menu .navbar-nav .nav-link {
    padding: 13px 12px;
    color: var(--shell-muted);
    font: 14px Arial, sans-serif;
    border-radius: 11px;
}

.app-shell .navbar-menu .navbar-nav .nav-link i { min-width: 34px; font-size: 19px; }
.app-shell .navbar-menu .navbar-nav .nav-link:hover {
    color: var(--shell-active-ink);
    background: var(--shell-soft);
}

.app-shell .navbar-menu .navbar-nav .nav-link.active {
    background: var(--shell-active-bg);
    color: var(--shell-active-ink);
    font-weight: 600;
}

.app-shell .navbar-menu .navbar-nav .nav-sm .nav-link { padding: 10px 12px 10px 22px; }
.app-shell .navbar-menu .navbar-nav .menu-title {
    padding: 25px 12px 15px;
    color: var(--shell-muted);
    font-size: 11px;
    font-weight: 400;
    line-height: 14px;
}

.app-shell .navbar-menu .navbar-nav .menu-title:first-child { display: none; }
.app-shell :is(#page-topbar, .navbar-menu) :is(a, button):focus-visible {
    outline: 2px solid #0074df;
    outline-offset: 2px;
}

/* Shared content offsets and breadcrumb strip; each page keeps its own content. */
.app-shell .page-content { padding: 80px 16px 24px; }
.app-shell .page-title-box {
    padding: 0;
    margin: 0 0 16px;
    background: transparent;
    box-shadow: none;
    border: 0;
    min-height: 20px;
    gap: 12px;
}

.app-shell .page-title-box > h4 {
    color: var(--shell-ink);
    font-family: inherit;
    text-transform: none;
}

.app-shell .page-title-right { margin: 0; }
.app-shell .breadcrumb { font-size: 13px; }
.app-shell :is(.breadcrumb-item, .breadcrumb-item a) { color: var(--shell-subtle); }
.app-shell .breadcrumb-item.active { color: var(--shell-muted); }
.app-shell .breadcrumb-item + .breadcrumb-item::before { color: #9baac0; padding: 0 10px; }
.app-shell .footer { background: transparent; }

[data-layout-mode=dark] .app-shell {
    --shell-ink: #e2eaf6;
    --shell-muted: #a4b5ce;
    --shell-subtle: #94a5bf;
    --shell-blue: #d5e6f7;
    --shell-surface: #212d3e;
    --shell-canvas: #182331;
    --shell-line: #324056;
    --shell-soft: #2b394e;
    --shell-active-bg: #263f59;
    --shell-active-ink: #aed8ff;
}

[data-layout-mode=dark] .app-header-search {
    background: var(--shell-soft);
    border-color: var(--shell-line);
}

@media (min-width: 1025px) {
    [data-sidebar-size=lg] .app-shell .navbar-menu { width: var(--shell-sidebar-width); }
    [data-sidebar-size=lg] .app-shell .main-content { margin-left: var(--shell-sidebar-width); }
    [data-sidebar-size=lg] .app-shell :is(#page-topbar, .footer) { left: var(--shell-sidebar-width); }
    [data-sidebar-size=lg] .app-shell .navbar-brand-box { padding-left: 34px; }
    .app-shell .page-content { padding-left: 20px; }
}

@media (min-width: 768px) {
    /* The icon rail must not inherit the expanded menu's horizontal padding. */
    [data-sidebar-size=sm] .app-shell .navbar-brand-box { padding: 0; text-align: center; }
    [data-sidebar-size=sm] .app-shell .navbar-nav { padding-inline: 8px; }
    [data-sidebar-size=sm] .app-shell .navbar-menu .navbar-nav .menu-title { padding: 12px 0; }
    [data-sidebar-size=sm] .app-shell .navbar-menu .navbar-nav .nav-link { padding: 13px 10px; }
    [data-sidebar-size=sm] .app-shell .navbar-menu .navbar-nav .nav-item:hover > a.menu-link {
        background: var(--shell-active-bg);
        color: var(--shell-active-ink);
    }
    [data-sidebar-size=sm] .app-shell .navbar-menu .navbar-nav .nav-item:hover > .menu-dropdown {
        background: var(--shell-surface);
    }
}

@media (max-width: 991.98px) {
    .app-header-search { width: clamp(180px, 32vw, 300px); margin-left: 8px; }
}

@media (max-width: 767.98px) {
    .app-shell .page-content { padding: 80px 0 24px; }
    .app-shell .navbar-header { padding-inline: 8px; }
    .app-shell .page-title-box { margin-bottom: 20px; }
    .app-header-search { display: none; }
}