:root{
--bg:#f3f4f6;--panel:#fff;--border:#d9dde3;--red:#8B1E24;--text:#1f2937;
}
*{box-sizing:border-box}
body{margin:0;font:16px system-ui;background:var(--bg);color:var(--text)}
.tt-header{display:flex;justify-content:space-between;align-items:center;background:var(--red);color:#fff;padding:0 20px;height:64px}
.tt-brand{font-size:1.3rem;font-weight:700}
.tt-topnav a{color:#fff;text-decoration:none;margin-left:18px}
.tt-shell{display:grid;grid-template-columns:240px 1fr;min-height:calc(100vh - 64px)}
.tt-sidebar{background:#20242b;color:#fff;padding:20px}
.tt-sidebar ul{list-style:none;padding:0}
.tt-sidebar a{display:block;color:#fff;text-decoration:none;padding:10px 0}
.tt-content{padding:24px}
.tt-panel{background:#fff;border:1px solid var(--border);border-radius:12px;padding:20px}
@media(max-width:900px){
.tt-shell{grid-template-columns:1fr}
.tt-sidebar{display:block}
.tt-topnav{display:none}
}

/*=====================================================================
 Sprint 001F - Use includes/navbar.php as Global Standard
 Purpose:
 - Operations shell pages now pull the same includes/navbar.php used by
   the rest of TrainTote.
 - These styles preserve the Operations left sidebar/content shell under
   the standard navbar.
=====================================================================*/

.tt-shell {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    min-height: calc(100vh - 72px);
    background: var(--bg, #f3f4f6);
}

.tt-sidebar {
    background: #20242b;
    color: #fff;
    padding: 20px;
}

.tt-sidebar h3 {
    color: #fff;
    margin-top: 0;
    margin-bottom: 1.25rem;
}

.tt-sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.tt-sidebar a {
    display: block;
    color: #fff;
    text-decoration: none;
    padding: 10px 0;
}

.tt-sidebar a:hover {
    color: #fff;
    text-decoration: underline;
}

.tt-content {
    min-width: 0;
    padding: 24px;
}

@media(max-width: 900px) {
    .tt-shell {
        grid-template-columns: 1fr;
    }

    .tt-sidebar {
        display: block;
        width: 100%;
    }
}

/*=====================================================================
 Sprint 001H - Remove Operations Shell Gap
 Purpose:
 - Keep the Operations left sidebar tight against the standard navbar.
 - Match the feel of the existing list.php pages.
=====================================================================*/

.tt-shell {
    margin-top: 0;
}

/*=====================================================================
 Sprint 001I - Operations Sidebar Filter-Style Navigation
 Purpose:
 - Make Operations left navigation visually match the list.php filter panel.
 - Keep it as navigation, not filters.
=====================================================================*/

.tt-sidebar.tt-module-nav {
    background: #f3f6fa;
    color: #1f2937;
    border-right: 1px solid #d9dde3;
    padding: 18px 14px;
}

.tt-module-nav-header {
    margin-bottom: 14px;
}

.tt-module-nav-header h3 {
    color: #1f2937;
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0;
}

.tt-module-nav-list {
    display: block;
}

.tt-module-nav-list a {
    display: block;
    color: #1f2937;
    text-decoration: none;
    padding: 12px 4px;
    border-bottom: 1px solid #d9dde3;
    font-weight: 600;
}

.tt-module-nav-list a:hover {
    color: #0d6efd;
    background: rgba(13, 110, 253, .04);
    text-decoration: none;
}

.tt-module-nav-list a.active {
    color: #0d6efd;
    font-weight: 700;
}

.tt-module-nav-list a.active::before {
    content: "▸";
    display: inline-block;
    margin-right: 7px;
    color: #0d6efd;
}

@media(max-width:900px) {
    .tt-sidebar.tt-module-nav {
        display: block;
        width: 100%;
        padding: 14px 18px;
    }

    .tt-module-nav-header {
        margin-bottom: 8px;
    }

    .tt-module-nav-list a {
        padding: 10px 4px;
    }
}