:root {
    --brand-orange: #FD5523;
    --brand-orange-soft: #ffb39a;
    --brand-orange-tint: #FFF1EC;
    --brand-navy: #062f3a;
    --brand-navy-2: #0a3d4a;

    --ink: #1f2d35;
    --muted: #6b7b83;
    --line: #e9edf0;
    --shadow-sm: 0 2px 8px rgba(6, 47, 58, .06);
    --shadow: 0 10px 30px rgba(6, 47, 58, .10);
    --shadow-lg: 0 18px 45px rgba(6, 47, 58, .16);
}

/* ---------------- base ---------------- */
body {
    background:
        radial-gradient(1200px 400px at 100% -10%, var(--brand-orange-tint), transparent 60%),
        #f4f6f8;
    color: var(--ink);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

a { color: var(--brand-navy-2); text-decoration: none; }
a:hover { color: var(--brand-orange); }

.text-primary { color: var(--brand-orange) !important; }
.text-navy { color: var(--brand-navy) !important; }
code { color: var(--brand-orange); }

/* ---------------- buttons ---------------- */
.btn-primary {
    --bs-btn-bg: var(--brand-orange);
    --bs-btn-border-color: var(--brand-orange);
    --bs-btn-hover-bg: #e6461a;
    --bs-btn-hover-border-color: #e6461a;
    --bs-btn-active-bg: #cc3d13;
    --bs-btn-active-border-color: #cc3d13;
    --bs-btn-disabled-bg: var(--brand-orange-soft);
    --bs-btn-disabled-border-color: var(--brand-orange-soft);
    --bs-btn-focus-shadow-rgb: 253, 85, 35;
    font-weight: 600;
}
.btn-outline-primary {
    --bs-btn-color: var(--brand-orange);
    --bs-btn-border-color: var(--brand-orange);
    --bs-btn-hover-bg: var(--brand-orange);
    --bs-btn-hover-border-color: var(--brand-orange);
    --bs-btn-active-bg: var(--brand-orange);
    --bs-btn-active-border-color: var(--brand-orange);
    --bs-btn-focus-shadow-rgb: 253, 85, 35;
    font-weight: 600;
}
.btn-navy {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--brand-navy);
    --bs-btn-border-color: var(--brand-navy);
    --bs-btn-hover-bg: var(--brand-navy-2);
    --bs-btn-hover-border-color: var(--brand-navy-2);
    color: #fff;
}

/* ---------------- navbar (header) ---------------- */
.brandbar {
    background: linear-gradient(100deg, var(--brand-navy) 0%, var(--brand-navy-2) 100%);
    box-shadow: 0 4px 18px rgba(6, 47, 58, .28);
    padding-top: .6rem;
    padding-bottom: .6rem;
}
.brandbar .navbar-brand {
    font-weight: 800;
    letter-spacing: .3px;
    color: #fff;
    display: flex;
    align-items: center;
    gap: .5rem;
}
.brandbar .navbar-brand .logo-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: var(--brand-orange);
    color: #fff;
    box-shadow: 0 4px 12px rgba(253, 85, 35, .5);
}
.brandbar .navbar-brand .mark { color: var(--brand-orange); }
.brandbar .nav-link {
    color: rgba(255, 255, 255, .78) !important;
    font-weight: 500;
    padding-left: .9rem !important;
    padding-right: .9rem !important;
    position: relative;
}
.brandbar .nav-link:hover { color: #fff !important; }
.brandbar .nav-link.active { color: #fff !important; }
.brandbar .nav-link.active::after {
    content: "";
    position: absolute;
    left: .9rem; right: .9rem; bottom: -.35rem;
    height: 3px; border-radius: 3px;
    background: var(--brand-orange);
}

/* ---------------- footer ---------------- */
.site-footer {
    background: linear-gradient(100deg, var(--brand-navy) 0%, var(--brand-navy-2) 100%);
    color: rgba(255, 255, 255, .72);
    margin-top: 3rem;
    padding: 1.5rem 0;
}
.site-footer a { color: var(--brand-orange-soft); }
.site-footer a:hover { color: #fff; }

/* ---------------- cards ---------------- */
.card {
    border: 1px solid var(--line);
    border-radius: .9rem;
    box-shadow: var(--shadow-sm);
    transition: box-shadow .18s ease, transform .18s ease;
}
.card:hover { box-shadow: var(--shadow); }
.card-header {
    background: #fff;
    border-bottom: 1px solid var(--line);
    font-weight: 700;
    color: var(--brand-navy);
    border-radius: .9rem .9rem 0 0 !important;
    padding: .85rem 1rem;
}

/* page heading */
.page-head h1 { color: var(--brand-navy); font-weight: 800; }
.page-head .lead-sub { color: var(--muted); }

/* ---------------- stat tiles ---------------- */
.stat-tile {
    border-radius: 1rem;
    padding: 1.25rem 1.4rem;
    color: #fff;
    box-shadow: var(--shadow);
    position: relative;
    overflow: hidden;
}
.stat-tile .stat-num { font-size: 2.6rem; font-weight: 800; line-height: 1; }
.stat-tile .stat-label { opacity: .85; font-weight: 500; }
.stat-tile .stat-ico {
    position: absolute; right: .8rem; top: .6rem;
    font-size: 3.4rem; opacity: .18;
}
.stat-navy { background: linear-gradient(135deg, var(--brand-navy), var(--brand-navy-2)); }
.stat-orange { background: linear-gradient(135deg, var(--brand-orange), #ff7a4d); }
.stat-teal { background: linear-gradient(135deg, #0a3d4a, #12707f); }

/* ---------------- tables ---------------- */
.table { --bs-table-hover-bg: var(--brand-orange-tint); margin-bottom: 0; }
.table thead th {
    background: var(--brand-navy);
    color: #fff;
    border-color: var(--brand-navy) !important;
    font-size: .74rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    font-weight: 600;
}
.table td small { font-size: .78rem; }

/* ---------------- badges ---------------- */
.badge.text-bg-warning { background: var(--brand-orange) !important; color: #fff !important; }
.badge.text-bg-secondary { background: var(--brand-navy-2) !important; }

/* ---------------- filter bar ---------------- */
.filter-bar {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: .9rem;
    box-shadow: var(--shadow-sm);
    padding: .85rem 1rem;
    margin-bottom: 1.25rem;
}
.filter-bar .form-label { font-size: .78rem; color: var(--muted); margin-bottom: .15rem; }

/* list-group items inside cards */
.list-group-item-action:hover { background: var(--brand-orange-tint); }

/* sortable table headers */
.table thead th .sort-link { color: #fff; text-decoration: none; }
.table thead th .sort-link:hover { color: var(--brand-orange-soft); }

/* small helper */
.font-monospace { font-size: .75rem; }
main { min-height: 72vh; }

/* ---------------- responsive ---------------- */
@media (max-width: 991.98px) {
    .brandbar .nav-link.active::after { display: none; }
    .brandbar .navbar-nav { padding-top: .5rem; }
}
@media (max-width: 575.98px) {
    h1, .page-head h1 { font-size: 1.4rem; }
    .stat-tile { padding: 1rem 1.1rem; }
    .stat-tile .stat-num { font-size: 2rem; }
    .stat-tile .stat-ico { font-size: 2.6rem; }
    .card-header { padding: .7rem .85rem; }
    /* keep action buttons tidy on small screens */
    .table td .btn { padding: .25rem .45rem; }
    .filter-bar { padding: .75rem; }
    main { padding-top: 1rem !important; }
}
/* let wide tables scroll instead of squashing on phones */
.table-responsive { -webkit-overflow-scrolling: touch; }