*{box-sizing:border-box}
body{font-family:Arial,Helvetica,sans-serif;margin:0;background:#f4f7fb;color:#111827}
.top{background:#0f172a;color:white;padding:16px 24px;font-weight:700;display:flex;align-items:center;justify-content:space-between;gap:16px}
.muted{color:#6b7280;font-size:13px;font-weight:400}
.top .muted{color:#cbd5e1;margin-left:8px}
.user-pill{background:#1e293b;border:1px solid #334155;border-radius:999px;padding:8px 12px;font-size:13px}
.wrap{display:flex;min-height:calc(100vh - 80px)}
aside{width:280px;background:#111827;color:white;padding:22px;position:sticky;top:0;height:100vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#334155 #111827}
aside::-webkit-scrollbar{width:8px}
aside::-webkit-scrollbar-track{background:#111827}
aside::-webkit-scrollbar-thumb{background:#334155;border-radius:999px}
.brand{font-weight:800;margin-bottom:18px;color:#f8fafc;line-height:1.4;font-size:15px;letter-spacing:.2px}
.sidebar-section-title{margin:18px 0 6px;color:#94a3b8;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;border-top:1px solid #243244;padding-top:12px}
.sidebar-section-title:first-of-type{border-top:0;padding-top:0;margin-top:10px}
details>summary.sidebar-section-title:first-of-type{border-top:1px solid #243244;padding-top:12px;margin-top:18px}
aside a,aside button{display:block;color:#e5e7eb;background:transparent;border:0;text-decoration:none;padding:9px 10px;text-align:left;width:100%;font-size:14px;border-radius:8px;line-height:1.25;margin-bottom:2px;transition:background-color .15s ease,color .15s ease,box-shadow .15s ease}
aside a:hover,aside button:hover{color:#5eead4;background:#1f2937;box-shadow:inset 3px 0 0 rgba(94,234,212,.5)}
aside a.active{background:#0f766e;color:#fff;font-weight:800;box-shadow:inset 4px 0 0 #5eead4}
aside form{margin:6px 0 0 0}
aside details>summary{cursor:pointer;list-style:none;transition:color .15s ease}
aside details>summary::-webkit-details-marker{display:none}
aside details>summary::before{content:'\25B8';display:inline-block;width:10px;margin-right:4px;color:#5eead4;font-size:10px;transition:transform .15s ease}
aside details[open]>summary::before{transform:rotate(90deg)}
aside details>summary:hover{color:#5eead4}
aside a,aside button,aside details>summary{outline:none}
aside a:focus-visible,aside button:focus-visible,aside details>summary:focus-visible{box-shadow:0 0 0 2px #5eead4;border-radius:8px}
/* Recolour Bootstrap's default blue "primary" theme to the app's teal brand
   colour, so pages built from raw Bootstrap classes (qa_v2/* and similar)
   match the rest of the system instead of looking like a different product. */
:root{--bs-primary:#0f766e;--bs-primary-rgb:15,118,110;--bs-link-color:#0f766e;--bs-link-color-rgb:15,118,110;--bs-link-hover-color:#0d5f58;--bs-link-hover-color-rgb:13,95,88}
.btn-primary{--bs-btn-bg:#0f766e;--bs-btn-border-color:#0f766e;--bs-btn-hover-bg:#0d5f58;--bs-btn-hover-border-color:#0b544e;--bs-btn-active-bg:#0b544e;--bs-btn-active-border-color:#094a44;--bs-btn-disabled-bg:#0f766e;--bs-btn-disabled-border-color:#0f766e}
.btn-outline-primary{--bs-btn-color:#0f766e;--bs-btn-border-color:#0f766e;--bs-btn-hover-bg:#0f766e;--bs-btn-hover-border-color:#0f766e;--bs-btn-active-bg:#0f766e;--bs-btn-active-border-color:#0f766e;--bs-btn-disabled-color:#0f766e;--bs-btn-disabled-border-color:#0f766e}
main{flex:1;padding:32px;overflow:auto}
footer{text-align:center;color:#6b7280;padding:16px}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.stats-grid{margin:16px 0}
.card,.panel,.box{background:white;border-radius:14px;padding:20px;margin:16px 0;box-shadow:0 4px 14px #0002}.card b{font-size:36px;line-height:1.3}a.card{display:block;text-decoration:none;color:inherit;transition:box-shadow .15s,transform .15s;cursor:pointer}a.card:hover{box-shadow:0 8px 18px #0003;transform:translateY(-1px)}.red{border-left:8px solid #dc2626}.darkred{border-left:8px solid #7f1d1d}.green{border-left:8px solid #16a34a}.yellow{border-left:8px solid #eab308}.blue{border-left:8px solid #2563eb}.login{height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0f172a,#0f766e)}.login-box{width:420px}.box h1{margin-top:0}label{font-weight:700;font-size:13px;margin-top:8px;display:block}input,select,button,textarea{display:block;width:100%;box-sizing:border-box;margin:8px 0 12px 0;padding:11px 12px;border-radius:8px;border:1px solid #cbd5e1;background:white;font-family:inherit}textarea{min-height:84px;resize:vertical}button,.btn-secondary{background:#0f766e;color:white;border:0;cursor:pointer;text-decoration:none;text-align:center;font-weight:700}.btn-secondary{display:inline-block;border-radius:8px;padding:10px 14px}.danger{background:#b91c1c}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:8px}.page-head h1,.page-head h2{margin:0 0 6px 0}.compact{align-items:center}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.form-grid .full{grid-column:1/-1}.table-wrap{width:100%;overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:600px}.stacked-panels .panel{width:100%}th,td{text-align:left;vertical-align:top;border-bottom:1px solid #e5e7eb;padding:12px;font-size:14px}th{background:#f8fafc;color:#334155}.status{display:inline-block;background:#e0f2fe;color:#075985;border-radius:999px;padding:6px 10px;font-weight:700;font-size:12px}.alert{border-radius:10px;padding:12px 14px;margin-bottom:16px}.success{background:#dcfce7;color:#166534;border:1px solid #86efac}.error{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}.filter-form{display:grid;grid-template-columns:2fr 1.5fr 1fr auto;gap:8px;align-items:end;margin:0}.mini-form{background:#f8fafc;border:1px solid #e5e7eb;border-radius:10px;padding:10px;margin:0 0 8px 0}.login-help{font-size:13px;line-height:1.5;background:#f8fafc;border-radius:10px;padding:12px;margin-top:12px}.pagination-wrap{margin-top:16px}.pagination-wrap nav div:first-child{display:none}.pagination-wrap a,.pagination-wrap span{display:inline-block;padding:8px 10px;border:1px solid #e5e7eb;border-radius:8px;margin-right:4px;text-decoration:none;color:#0f172a;background:white}
.progress-wrap{width:120px;height:10px;background:#e5e7eb;border-radius:999px;overflow:hidden;margin-bottom:6px}.progress-bar{height:100%;background:#0f766e;border-radius:999px}.danger-link{background:#b91c1c;color:#fff;border:0;border-radius:8px;padding:10px 12px;font-weight:700;cursor:pointer}.inline-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.role-pill{display:inline-block;background:#ecfeff;color:#155e75;border:1px solid #a5f3fc;border-radius:999px;padding:6px 10px;font-weight:700;font-size:12px}.status.inactive{background:#f3f4f6;color:#374151}.status.suspended{background:#fee2e2;color:#991b1b}
/* V11 Audit Control Intelligence Layer */
.traffic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}.traffic-card{display:block;text-decoration:none;color:#111827;background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:14px;box-shadow:0 2px 8px #0001}.traffic-card:hover{box-shadow:0 8px 18px #0002;transform:translateY(-1px)}.traffic-head{display:flex;justify-content:space-between;gap:8px;align-items:center}.traffic-head span{font-size:12px;font-weight:800;border-radius:999px;padding:4px 8px;background:#f3f4f6}.traffic-score{font-size:30px;font-weight:800;margin:10px 0 8px}.traffic-green{border-left:8px solid #16a34a}.traffic-yellow{border-left:8px solid #eab308}.traffic-red{border-left:8px solid #dc2626}.traffic-black{border-left:8px solid #111827}.traffic-black .traffic-head span{background:#111827;color:#fff}.wide{width:100%!important}
/* V13.7 sidebar stability */
.container{max-width:1180px;margin:0 auto}
.badge{display:inline-block;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:800;background:#e0f2fe;color:#075985}
.badge-danger{background:#fee2e2;color:#991b1b}.badge-success{background:#dcfce7;color:#166534}.badge-warning{background:#fef3c7;color:#92400e}
@media(max-width:1000px){.grid,.form-grid{grid-template-columns:1fr}.wrap{display:block}aside{position:relative;width:100%;height:auto;max-height:none}.top{display:block}.filter-form{grid-template-columns:1fr}.page-head{display:block}.split-grid{grid-template-columns:1fr}.progress-wrap{width:100%}.traffic-grid{grid-template-columns:1fr}}

/* =====================================================================
   INLINE TABLE TOOLBAR STANDARD (system-wide) — targeted update #3
   All table search/filter controls render as ONE horizontal 38px flex row
   in the table header. Coerces existing filter markup inline WITHOUT
   restructuring pages or restyling cards/KPIs — original layout intact.
   ===================================================================== */
.filter-form{
    display:flex !important;flex-direction:row !important;align-items:center !important;
    gap:12px !important;flex-wrap:wrap !important;
}
.filter-form>div{display:flex;align-items:center;gap:8px;margin:0}
.filter-form label{margin:0 !important;white-space:nowrap}
.filter-form input,.filter-form select,.filter-form button,.filter-form .btn,.filter-form a.btn{
    height:38px !important;margin:0 !important;width:auto !important;
    display:inline-flex !important;align-items:center;padding:0 14px !important;
    font-size:14px !important;box-sizing:border-box;
}
.filter-form input[type="text"],.filter-form input[name="search"],.filter-form input[name="q"]{flex:1 1 220px;min-width:180px}

/* Bootstrap GET (search/filter) forms → one inline 38px row */
form[method="get" i] .row{
    display:flex !important;flex-wrap:wrap !important;align-items:center !important;gap:12px !important;margin:0 !important;
}
form[method="get" i] .row [class*="col-"]{
    flex:0 0 auto !important;width:auto !important;max-width:100% !important;
    padding-left:0 !important;padding-right:0 !important;margin-bottom:0 !important;
}
form[method="get" i] .form-control{height:38px !important;margin:0 !important;width:auto !important;min-width:180px}
form[method="get" i] .btn{height:38px !important;margin:0 !important;display:inline-flex;align-items:center}