/* Shared spacing, focus and filtering conventions. Course colours remain semantic. */
:root{--space-1:.4rem;--space-2:.75rem;--space-3:1rem;--surface-blue:#edf3fa;--focus:#965300;--filter-search-width:26rem}
main{padding:clamp(1rem,2.2vw,1.75rem)}
h1{font-size:clamp(1.55rem,2.7vw,2rem);line-height:1.25;margin:.2rem 0 .7rem}
.heading{flex-wrap:wrap;gap:.6rem 1rem}.heading .eyebrow{margin:0 0 .2rem}
p.eyebrow{margin:.4rem 0}.page-intro{font-size:1rem;margin:.5rem 0 1rem}
button,.button{min-height:36px}summary{min-height:28px}textarea:focus-visible,[tabindex="0"]:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
button:disabled{cursor:default;opacity:.6}
.filters{gap:.75rem;padding:.9rem;margin-bottom:.8rem}
.filters>label,.filters .filter-fields>label{display:flex;flex-direction:column;gap:.3rem;flex:0 1 12rem;min-width:0;font-size:.9rem;font-weight:600}
.filters>label:first-child{flex:0 1 15rem;min-width:0}
.filters>label:has(input[type=search]),.filters>label:has(input[name=q]){flex:0 1 var(--filter-search-width);width:var(--filter-search-width);max-width:100%;min-width:0}
.filters>label>select,.filters>label>input:not([type=checkbox]),.filters .filter-fields>label>select{width:100%;max-width:none;min-height:40px;font-weight:400}
.filters label:has(>input[type=checkbox]){flex-direction:row;align-items:center;min-height:40px;font-weight:400}
.filters label>input[type=checkbox]{flex:none}
.filters .filter-fields{gap:.75rem}.filters .filter-fields>p{margin:.2rem 0}
/* Search controls have a readable line length; small screens still use the available width. */
.certificate-filters .filter-primary{grid-template-columns:minmax(15rem,26rem) minmax(14rem,20rem) minmax(10rem,14rem)}
.filters.report-controls{grid-template-columns:repeat(auto-fit,minmax(min(100%,13.125rem),17rem));justify-content:start}
.alias-filters label:has(input[type=search]){flex:0 1 var(--filter-search-width);min-width:0;max-width:100%}
.alias-filters input[type=search]{width:100%;min-width:0}
.filter-behaviour{flex:1 0 100%;display:flex;align-items:center;gap:.8rem;border-top:1px solid #e2e9e6;padding-top:.6rem;margin-top:.1rem;flex-wrap:wrap}
.filter-behaviour>label{display:flex;align-items:center;gap:.5rem;font-size:.82rem;font-weight:500;flex:none;min-width:0}
.filter-behaviour select{font-size:.82rem;padding:.25rem .4rem;min-height:34px;width:auto;max-width:100%}
.filter-behaviour [role=status]{margin:0}.filter-chip{min-height:32px;padding:.25rem .5rem;font-size:.82rem}
.filter-chip>span:first-child{white-space:normal;text-align:left}
.table-scroll,.table-wrap{max-width:100%;border-radius:.35rem;scrollbar-gutter:stable}
.table-scroll:focus-visible,.table-wrap:focus-visible{outline-offset:2px}
.table-scroll thead th{position:sticky;top:0;background:#e3ebe5;z-index:2}
.table-scroll th[scope=row]{position:sticky;left:0;z-index:1;background:#fff;box-shadow:1px 0 #d7e1db}
.table-scroll th a,.table-scroll td>a,.table-wrap td>a{display:inline-block;padding:.2rem 0;min-height:28px}
.nav-menu>div{min-width:270px;max-width:min(90vw,340px);max-height:calc(100dvh - 100px);overflow:auto;border-radius:0 0 .5rem .5rem;gap:.3rem}
.nav-menu .nav-group{margin:.25rem 0 0;padding:.45rem 0 0;border-top:1px solid #668a7c;display:grid}
.nav-menu .nav-group>strong{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:#c0dacf;margin:.25rem 0}
.nav-menu a{line-height:1.3;padding:.5rem .3rem;min-height:36px}
.nav-menu .report-submenu a{min-height:36px}.nav-menu summary{min-height:32px}
.export-jobs{padding:0;list-style:none}.export-job{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.4rem 1rem;padding:1rem!important;border:1px solid var(--line);border-left:4px solid #779caf;border-radius:.45rem;margin:.75rem 0;background:#f7fafc}
.export-job time{font-size:.82rem;color:#52625d;grid-column:1/-1}.export-job>span{font-size:.85rem;grid-column:1/-1}.export-job .button,.export-job button{grid-column:2;grid-row:2;align-self:start}.export-job progress{grid-column:1/-1;width:100%;height:.6rem;accent-color:var(--green)}
.export-job-ready{border-left-color:#38855c;background:#f1f8f3}.export-job-failed{border-left-color:#ad493a;background:#fff5f1}.export-feedback{grid-column:1/-1}.export-feedback progress{width:100%;accent-color:var(--green)}
@media(max-width:650px){header{gap:.65rem;padding:.75rem}header nav{gap:.3rem .65rem}.brand{white-space:normal}main{padding:.85rem}.filters>label,.filters>label:first-child{flex:1 1 100%;width:100%}.filter-behaviour{gap:.4rem}.filter-behaviour>label{flex-wrap:wrap}.nav-menu>div{right:auto;left:0;max-height:65dvh}.heading>.actions{width:100%}.export-job{grid-template-columns:minmax(0,1fr)}.export-job .button,.export-job button{grid-column:1;grid-row:auto;justify-self:start}dl{grid-template-columns:minmax(0,1fr)}dd{margin-bottom:.5rem}.editor{padding:1rem}.dialog-heading,.section-heading{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

@media(max-width:1000px){.certificate-filters .filter-primary{grid-template-columns:repeat(2,minmax(0,1fr))}.certificate-filters .search-filter{grid-column:1/-1;max-width:var(--filter-search-width)}}
@media(max-width:650px){.filters>label:has(input[type=search]),.filters>label:has(input[name=q]){flex:1 1 100%;width:100%;max-width:none}.filters.report-controls,.certificate-filters .filter-primary{grid-template-columns:minmax(0,1fr)}.certificate-filters .search-filter{max-width:none}.alias-filters label:has(input[type=search]){flex-basis:100%}}

.nav-toggle{display:none}
@media(max-width:650px){header .brand{flex:1;min-width:0}header[data-nav-ready] .nav-toggle{display:block;min-height:40px}header[data-nav-ready]:not([data-menu-open=true]) #main-navigation,header[data-nav-ready]:not([data-menu-open=true])>form{display:none}#main-navigation{flex-basis:100%}header[data-menu-open=true]>form{margin:0}.nav-menu>div{left:auto;right:0;max-width:calc(100vw - 24px)}}

/* Keep the main navigation compact on tablets and expose menus in normal flow. */
header .nav-menu.is-current>summary{font-weight:700;text-decoration:underline;text-decoration-color:#c8e9a7;text-underline-offset:.4rem}
@media(max-width:1000px){header{gap:.75rem;padding:.75rem 1rem}header .brand{flex:1;min-width:0}header[data-nav-ready] .nav-toggle{display:block;min-height:44px}header[data-nav-ready]:not([data-menu-open=true]) #main-navigation,header[data-nav-ready]:not([data-menu-open=true])>form{display:none}#main-navigation{flex-basis:100%;display:flex;flex-direction:column;align-items:stretch;gap:.35rem}#main-navigation>a{min-height:44px;padding:.6rem}.nav-menu>summary{min-height:36px}.nav-menu>div{position:static;min-width:0;max-width:none;max-height:none;box-shadow:none;padding:.5rem}.nav-menu{width:100%}header[data-menu-open=true]>form{margin:0}}
