:root { --portal-nav: #343b40; --portal-blue: #087cf0; }
body { color: #30373c; background: #fff; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; font-size: .95rem; }
.portal-nav { background: var(--portal-nav); margin: 5px; min-height: 60px; }
.navbar-brand { font-size: 1.3rem; font-weight: 400; }
.navbar-dark .navbar-nav .nav-link { color: #c4c9ce; }
.navbar-dark .navbar-nav .nav-link:hover { color: #fff; }
.nav-signout { color: #c4c9ce; padding-right: 0; }
.nav-signout:hover,.nav-signout span { color: #fff; }
.page-content { padding: 0 22px 20px; min-height: 330px; }
h1 { font-size: 1.65rem; font-weight: 400; line-height: 1.4; margin: 0 0 22px; }
h2 { font-size: 1.25rem; font-weight: 500; }
hr { border-color: #d6dce1; opacity: .6; margin: 26px 0 20px; }
.login-form { width: min(300px, 100%); margin: 0 16px; padding: 0 0 16px; }
.form-control,.form-select { border-color: #d4dce3; border-radius: 4px; }
.form-control:focus,.form-select:focus { border-color: #79b7f5; box-shadow: 0 0 0 .2rem #087cf01a; }
.btn { border-radius: 4px; }
.btn-primary { background-color: var(--portal-blue); border-color: var(--portal-blue); }
footer { border-top: 1px solid #e5e8eb; margin: 14px 22px 0; padding: 18px 0 28px; }
.page-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; margin: 22px 0; }
.page-heading h1 { margin-bottom: 2px; }
.page-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.filter-panel { display: flex; flex-wrap: wrap; gap: 12px; padding: 12px 16px; background: #d7f7ed; border: 1px solid #c9e8de; border-radius: 3px; margin-bottom: 14px; }
.filter-panel > div { flex: 1 1 145px; max-width: 240px; }
.filter-panel label { display: block; font-size: .82rem; font-weight: 500; margin-bottom: 5px; }
.filter-panel .filter-buttons { display: flex; gap: 6px; align-items: end; max-width: none; }
.search-form { display: flex; flex-wrap: wrap; align-items: start; gap: 8px; margin: 0 0 8px; }
.search-form fieldset { margin: 0; min-width: 0; }
.search-form legend { float: none; width: auto; font-size: .95rem; font-weight: 700; margin: 0 0 3px; padding: 0 10px; }
.search-identity { flex: 2.1 1 360px; }
.search-events { flex: .9 1 180px; }
.search-dates { flex: 1.5 1 300px; }
.search-form-actions .search-dates { flex: 0 1 390px; }
.search-form-actions .search-user { flex: 0 1 200px; }
.search-form-reports .search-dates { flex: 0 1 390px; }
.search-pump { flex: 0 1 180px; }
.search-group-body { background: #d6faed; padding: 10px; }
.search-range-row { display: grid; grid-template-columns: 52px minmax(0,1fr); gap: 10px; align-items: center; margin-bottom: 6px; }
.search-form label { font-size: .85rem; font-weight: 600; }
.search-range-row label { margin: 0; }
.identity-options { display: grid; grid-template-columns: minmax(130px, .85fr) minmax(160px, 1.6fr); gap: 8px 18px; }
.identity-choice .identity-radio { display: flex; align-items: center; gap: 5px; font-weight: 400; margin-bottom: 10px; }
.identity-choice > label[for] { display: inline-block; margin-right: 5px; }
.identity-choice select { display: inline-block; width: auto; }
.identity-options .search-help { grid-column: 1 / -1; }
.search-help { font-size: .73rem; color: #475c54; margin-top: 4px; }
.search-field { flex: 0 1 135px; margin-top: 26px; }
.search-field > label,.search-actions label { display: block; margin-bottom: 4px; }
.search-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; padding-top: 26px; }
.search-actions .filter-buttons { display: flex; gap: 6px; align-items: end; flex-wrap: wrap; }
.search-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; flex-basis: 100%; padding-top: 3px; }
.search-footer > div { display: flex; align-items: center; gap: 8px; }
.search-footer select { width: auto; min-width: 75px; }
[hidden] { display: none !important; }
.table-toolbar { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding-bottom: 10px; }
.data-table { border: 1px solid #dfe5ea; border-radius: 5px; max-height: none; }
.data-table-all { max-height: none; }
.data-table table { font-size: .85rem; white-space: nowrap; }
.data-table th { position: sticky; top: 0; background: var(--portal-nav); color: #8ed2fc; font-weight: 600; z-index: 1; padding: 9px 12px; text-align: center; }
.data-table td { padding: 6px 12px; text-align: center; }
.data-table .long-text { white-space: pre-wrap; min-width: 220px; max-width: 520px; overflow-wrap: anywhere; }
.empty-state { text-align: center; padding: 58px 20px !important; color: #6b7780; white-space: normal; }
.pagination-bar { display: flex; justify-content: space-between; gap: 12px; margin-top: 18px; }
.pagination-bar > div { display: flex; gap: 8px; }
.validation-summary-valid { display: none; }
.editor { max-width: 850px; }
.editor.narrow { max-width: 440px; }
.editor label:not(.form-check-label) { display: block; margin: 14px 0 5px; font-weight: 500; }
.editor .form-check { margin-top: 12px; }
.editor .form-check label { margin: 0; }
.editor fieldset { margin: 20px 0; }
.editor legend { font-size: 1.15rem; }
.report-summary { display: flex; gap: 16px; flex-wrap: wrap; margin: 20px 0; }
.report-card { padding: 16px 24px; border: 1px solid #dfe5ea; border-radius: 6px; min-width: 200px; background: #f7f9fb; }
.report-card strong { display: block; font-size: 1.7rem; font-weight: 500; }
.skip-link { background: white; padding: 12px; }
@media(max-width:600px) { .page-content { padding: 12px; } .login-form { margin: 0; } .filter-panel > div { max-width: none; } .page-actions .btn { font-size: .85rem; } .search-form fieldset { flex-basis: 100%; } .identity-options { grid-template-columns: 1fr; gap: 8px; } .identity-choice { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; } .identity-choice .identity-radio { margin: 0; } .search-field,.search-actions { margin-top: 0; padding-top: 0; } }
@media print { header,.filter-panel,.search-form,.search-persistence-note,.page-actions,.pagination-bar,form button,footer { display: none !important; } .page-content { padding: 0; } .data-table { max-height: none; overflow: visible; border: 0; } .data-table table { font-size: 7pt; white-space: normal; } .data-table td,.data-table th { padding: 3px; position: static; } .data-table th:first-child { position: static; } a { color: inherit; text-decoration: none; } }