:root {
    --c-navy: #0b3c5d;
    --c-primary: #0e7c86;
    --c-primary-hover: #0b636b;
    --c-primary-ink: #0a5c64;
    --c-primary-tint: #e3f2f3;
    --c-blue: #2563eb;
    --c-mint: #14b8a6;
    --c-text: #1e293b;
    --c-muted: #526070;
    --c-canvas: #f0f0f1;
    --c-surface: #ffffff;
    --c-subtle: #f6f7f8;
    --c-border: #d5dbe1;
    --c-input-border: #7d8894;
    --c-sidebar: #1d2327;
    --c-sidebar-2: #2c3338;
    --c-sidebar-deep: #161a1d;
    --c-sidebar-text: #c3c7cb;
    --c-success: #18794e;
    --c-warning: #b45309;
    --c-warning-fill: #f5a623;
    --c-danger: #b91c1c;
    --c-info: #1d4ed8;
    --fs-xs: .75rem;
    --fs-sm: .8125rem;
    --fs-base: .875rem;
    --fs-md: 1rem;
    --fs-lg: 1.25rem;
    --fs-xl: 1.5rem;
    --fs-2xl: 2rem;
    --gap: 12px;
    --page-pad: 12px;
    --card-pad: 12px;
    --radius: 3px;
    --radius-lg: 4px;
    --font: "Public Sans", "Source Sans 3", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

html { -webkit-text-size-adjust: 100%; }

body {
    font-family: var(--font);
    color: var(--c-text);
    font-size: var(--fs-base);
    line-height: 1.5;
    overflow-x: clip;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { color: var(--c-text); font-weight: 700; line-height: 1.25; letter-spacing: -.005em; }
h1, .h1, h2, .h2 { font-size: var(--fs-lg); }
h3, .h3, h4, .h4, h5, .h5 { font-size: var(--fs-md); }
h6, .h6 { font-size: var(--fs-sm); }
small, .small, .text-sm, .help-block, .form-text { font-size: var(--fs-sm); }
.badge, .text-xs { font-size: var(--fs-xs); }
.lead { font-size: var(--fs-md); font-weight: 400; }
.display-1, .display-2, .display-3, .display-4 { font-size: var(--fs-xl); font-weight: 700; line-height: 1.25; }
.font-weight-light, .font-weight-lighter, .font-weight-normal { font-weight: 400 !important; }
.font-weight-bolder, .text-bold, b, strong { font-weight: 700; }
.navbar, .dropdown-item, .dropdown-menu { font-size: var(--fs-sm); }
.alert { font-size: var(--fs-base); }
.small-box h3, .info-box .info-box-number { font-size: var(--fs-xl); }
.selectize-input, .selectize-dropdown, .select2-container .select2-selection, .select2-results__option, .ts-control, .ts-dropdown { font-size: var(--fs-base); }

a { color: var(--c-primary-ink); }
a:hover { color: var(--c-navy); }

:focus-visible { outline: 2px solid var(--c-primary); outline-offset: 2px; }
.btn:focus, .btn.focus, .form-control:focus, .custom-select:focus, .page-link:focus, .custom-control-input:focus ~ .custom-control-label::before { box-shadow: none !important; outline: 2px solid var(--c-primary); outline-offset: 1px; }

.card, .main-sidebar, .main-header, .navbar, .dropdown-menu, .modal-content, .btn, .small-box, .info-box, .alert, .toast, .popover, .swal2-popup,
.elevation-1, .elevation-2, .elevation-3, .elevation-4, .elevation-5, .shadow, .shadow-sm, .shadow-lg, .card-outline, .nav-sidebar .nav-link { box-shadow: none !important; }
[class*="bg-gradient"] { background-image: none !important; }
* { text-shadow: none !important; }
.swal2-popup { border: 1px solid var(--c-border) !important; }

.skip-link {
    position: absolute;
    left: 8px;
    top: -60px;
    z-index: 2000;
    padding: 10px 16px;
    background: var(--c-navy);
    color: #fff;
    font-weight: 600;
    border-radius: var(--radius);
}
.skip-link:focus { top: 8px; color: #fff; }

.text-muted { color: var(--c-muted) !important; }
.text-primary { color: var(--c-primary-ink) !important; }
.text-success { color: var(--c-success) !important; }
.text-info { color: var(--c-info) !important; }
.text-warning { color: var(--c-warning) !important; }
.text-danger { color: var(--c-danger) !important; }
.text-black-50 { color: var(--c-muted) !important; }

.bg-primary { background-color: var(--c-primary) !important; color: #fff !important; }
.bg-success { background-color: var(--c-success) !important; color: #fff !important; }
.bg-info { background-color: var(--c-info) !important; color: #fff !important; }
.bg-danger { background-color: var(--c-danger) !important; color: #fff !important; }
.bg-secondary { background-color: #4b5563 !important; color: #fff !important; }
.bg-warning, .bg-yellow { background-color: var(--c-warning-fill) !important; color: var(--c-text) !important; }

.fill { width: -webkit-fill-available !important; width: stretch !important; }
.font-11 { font-size: 11pt; }
.displayNone { display: none; }

/* Buttons: primary = main action, secondary/default/light = neutral, info = view (blue outline),
   warning = edit (amber outline), danger = destructive, success = positive state change,
   outline-success = export (teal-green outline) */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 32px;
    padding: 0 12px;
    line-height: 1.25;
    border: 1px solid transparent;
    border-radius: var(--radius);
    font-size: var(--fs-sm);
    font-weight: 600;
    background-image: none;
    transform: none !important;
    transition: background-color .12s, border-color .12s, color .12s;
}
.btn-sm, .btn-group-sm > .btn { min-height: 28px; padding: 0 8px; font-size: var(--fs-sm); border-radius: var(--radius); }
.btn-lg, .btn-group-lg > .btn { min-height: 40px; padding: 0 18px; font-size: var(--fs-md); border-radius: var(--radius); }
.btn-xs { min-height: 24px; padding: 0 6px; font-size: var(--fs-xs); }
.btn-block { display: flex; width: 100%; }
.btn-flat { border-radius: 0; }
.btn:disabled, .btn.disabled { opacity: .5; }

.btn-primary, .btn-dark {
    background-color: var(--c-primary); border-color: var(--c-primary); color: #fff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.btn-dark:hover, .btn-dark:focus, .btn-dark:not(:disabled):not(.disabled):active {
    background-color: var(--c-primary-hover); border-color: var(--c-primary-hover); color: #fff;
}

.btn-secondary, .btn-default, .btn-light, .btn-app {
    background-color: var(--c-surface); border-color: var(--c-input-border); color: var(--c-text);
}
.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:not(:disabled):not(.disabled):active,
.btn-default:hover, .btn-default:focus, .btn-default:not(:disabled):not(.disabled):active,
.btn-light:hover, .btn-light:focus, .btn-light:not(:disabled):not(.disabled):active,
.btn-app:hover, .btn-app:focus {
    background-color: #e9ecef; border-color: var(--c-text); color: var(--c-text);
}

.btn-danger { background-color: var(--c-danger); border-color: var(--c-danger); color: #fff; }
.btn-danger:hover, .btn-danger:focus, .btn-danger:not(:disabled):not(.disabled):active { background-color: #991b1b; border-color: #991b1b; color: #fff; }
.btn-success { background-color: var(--c-success); border-color: var(--c-success); color: #fff; }
.btn-success:hover, .btn-success:focus, .btn-success:not(:disabled):not(.disabled):active { background-color: #12603d; border-color: #12603d; color: #fff; }

.btn-outline-primary, .btn-outline-dark { background: var(--c-surface); color: var(--c-primary-ink); border-color: var(--c-primary); }
.btn-outline-primary:hover, .btn-outline-dark:hover, .btn-outline-primary:not(:disabled):not(.disabled):active { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }
.btn-outline-secondary, .btn-outline-light { background: var(--c-surface); color: var(--c-text); border-color: var(--c-input-border); }
.btn-outline-secondary:hover, .btn-outline-light:hover { background: #e9ecef; border-color: var(--c-text); color: var(--c-text); }
.btn-info, .btn-outline-info { background: var(--c-surface); color: #1d4ed8; border-color: #2563eb; }
.btn-info:hover, .btn-info:focus, .btn-info:not(:disabled):not(.disabled):active, .btn-outline-info:hover, .btn-outline-info:not(:disabled):not(.disabled):active { background: #e3ecfd; color: #1e3a8a; border-color: #1d4ed8; }
.btn-warning, .btn-outline-warning { background: var(--c-surface); color: #b45309; border-color: #b45309; }
.btn-warning:hover, .btn-warning:focus, .btn-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:hover, .btn-outline-warning:not(:disabled):not(.disabled):active { background: #fdf0d5; color: #7a3b06; border-color: #92400e; }
.btn-outline-danger { background: var(--c-surface); color: var(--c-danger); border-color: var(--c-danger); }
.btn-outline-danger:hover, .btn-outline-danger:not(:disabled):not(.disabled):active { background: var(--c-danger); border-color: var(--c-danger); color: #fff; }
.btn-outline-success { background: var(--c-surface); color: #0f766e; border-color: #0f766e; }
.btn-outline-success:hover, .btn-outline-success:not(:disabled):not(.disabled):active { background: #dcf0ee; border-color: #0b5e57; color: #0b5e57; }

.btn-link { background: transparent; border-color: transparent; color: var(--c-primary-ink); font-weight: 600; }
.btn-link:hover { color: var(--c-navy); text-decoration: underline; }
.btn-tool { background: transparent; border-color: transparent; color: var(--c-muted); min-height: 28px; }
.btn-tool:hover { color: var(--c-text); }

/* Forms: one input system; the portal and sign-in page raise --input-h/--input-pad/--input-fs */
:root { --input-h: 32px; --input-h-sm: 28px; --input-pad: 4px 8px; --input-fs: var(--fs-sm); --label-fs: var(--fs-sm); }
label, .col-form-label, .control-label, .form-label { font-weight: 600; font-size: var(--label-fs); color: var(--c-text); margin-bottom: 4px; }
.required::after { content: " *"; color: var(--c-danger); }
.form-group { margin-bottom: 10px; }
.form-text, .help-block { font-size: var(--fs-xs); color: var(--c-muted); }

.form-control, .custom-select, .custom-file-label, .input-group-text,
.select2-container .select2-selection, .ts-control, .selectize-input, .multiselect.dropdown-toggle,
.dataTables_wrapper .dataTables_length select, .dataTables_wrapper .dataTables_filter input,
:where(.content-wrapper, .portal, .modal, .auth-page) :is(input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="date"], input[type="password"], input[type="search"], select, textarea):not(.form-control):not(.custom-select):not([class*="select2"]) {
    border: 1px solid var(--c-input-border);
    border-radius: var(--radius);
    background-color: var(--c-surface);
    color: var(--c-text);
    font-size: var(--input-fs);
    box-shadow: none;
}
.form-control:not(textarea):not([multiple]):not([size]), .custom-select:not([multiple]):not([size]), .custom-file, .custom-file-input, .custom-file-label,
.select2-container .select2-selection--single, .ts-control, .selectize-input, .multiselect.dropdown-toggle,
.dataTables_wrapper .dataTables_length select, .dataTables_wrapper .dataTables_filter input,
:where(.content-wrapper, .portal, .modal, .auth-page) :is(input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="date"], input[type="password"], input[type="search"], select:not([multiple])):not(.form-control):not(.custom-select):not([class*="select2"]) {
    height: var(--input-h);
    min-height: var(--input-h);
    padding: var(--input-pad);
    line-height: 1.4;
}
.custom-file-label::after { height: calc(var(--input-h) - 2px); line-height: 1.4; padding: var(--input-pad); background: var(--c-subtle); }
.input-group-text { height: var(--input-h); padding: var(--input-pad); background-color: var(--c-subtle); color: var(--c-muted); }
textarea.form-control { padding: var(--input-pad); min-height: calc(var(--input-h) * 2); height: auto; }
.form-control-sm:not(textarea), .custom-select-sm, .input-group-sm > .form-control:not(textarea), .input-group-sm .input-group-text { height: var(--input-h-sm) !important; min-height: var(--input-h-sm); padding: 2px 8px; font-size: var(--fs-sm); }
.select2-container .select2-selection--single .select2-selection__rendered { line-height: calc(var(--input-h) - 10px); padding-left: 0; }
.select2-container .select2-selection--single .select2-selection__arrow { height: calc(var(--input-h) - 2px); }
.form-control::placeholder, input::placeholder, textarea::placeholder { color: #6b7280; opacity: 1; }

.form-control:focus, .custom-select:focus, .custom-file-input:focus ~ .custom-file-label, .select2-container--focus .select2-selection, .ts-control.focus, .selectize-input.focus,
:where(.content-wrapper, .portal, .modal, .auth-page) :is(input, select, textarea):focus {
    border-color: var(--c-primary);
    outline: 2px solid var(--c-primary);
    outline-offset: 0;
    box-shadow: none !important;
}
.form-control.is-invalid, .custom-select.is-invalid, .form-control[aria-invalid="true"], .was-validated .form-control:invalid { border-color: var(--c-danger); }
.form-control.is-invalid:focus { outline-color: var(--c-danger); }
.form-control.is-valid, .custom-select.is-valid, .was-validated .form-control:valid { border-color: var(--c-input-border); background-image: none; padding-right: 8px; }
.invalid-feedback { font-size: var(--fs-xs); color: var(--c-danger); font-weight: 600; }
.error { color: var(--c-danger); font-weight: 600; }
.has-error .form-control { border-color: var(--c-danger); }
.form-control:disabled, .form-control[readonly], .custom-select:disabled, :where(.content-wrapper, .portal, .modal) :is(input, select, textarea):disabled {
    background-color: #eef0f3;
    color: var(--c-muted);
    cursor: not-allowed;
}
.form-control.form-control-border { border: 1px solid var(--c-input-border); }
.form-control.rounded-0, .custom-select.rounded-0 { border-radius: var(--radius) !important; }
input[type="date"].form-control { appearance: none; -webkit-appearance: none; }

.form-check { padding-left: 24px; }
.form-check-input { width: 16px; height: 16px; margin-left: -24px; margin-top: .2rem; }
.form-check-label { font-weight: 400; font-size: var(--input-fs); }
.form-check-inline { margin-right: 12px; }
.form-check-input, .custom-control-input, input[type="checkbox"], input[type="radio"] { accent-color: var(--c-primary); }
.custom-control-label::before, .custom-control-label::after { width: 16px; height: 16px; top: .2rem; }
.custom-control-label::before { border: 1px solid var(--c-input-border); }
.custom-control-input:checked ~ .custom-control-label::before { background-color: var(--c-primary); border-color: var(--c-primary); }
.custom-control-inline { margin-right: 12px; }
.form-inline { gap: 8px; flex-wrap: wrap; align-items: flex-end; }
.form-inline .form-control { margin-bottom: 0; }

/* Compact density for the back office */
.content-wrapper .input-group-text { font-size: var(--input-fs); }
.dataTables_wrapper { font-size: var(--fs-sm); }
.dataTables_wrapper .dataTables_length select, .dataTables_wrapper .dataTables_filter input { height: var(--input-h-sm); min-height: var(--input-h-sm); padding: 2px 6px; }

/* Filter bar (x-filter-bar) */
.filter-bar .card-body { padding: 8px var(--card-pad); }
.filter-form { margin: 0; }
.filter-fields { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; align-items: end; }
.filter-field { min-width: 0; }
.filter-field-wide { grid-column: span 2; }
.filter-field label { display: block; font-size: var(--fs-xs) !important; font-weight: 600; color: var(--c-muted); margin-bottom: 2px; }
.filter-field .form-control, .filter-field .custom-select, .filter-field .input-group, .filter-fields .fill { width: 100% !important; margin: 0 !important; }
.filter-actions { display: flex; gap: 8px; align-self: end; flex-wrap: wrap; }
.filter-actions .btn { min-height: var(--input-h-sm); }
.filter-field .select2-container .select2-selection--single, .filter-field .ts-control, .filter-field .selectize-input { min-height: var(--input-h-sm); height: var(--input-h-sm); padding: 2px 8px; font-size: var(--fs-sm); }
.filter-fields .form-inline { display: contents; }

/* Cards */
.card {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--radius-lg);
    margin-bottom: var(--gap);
}
.card-header, .modal-header {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 40px;
    padding: 8px var(--card-pad);
    background: var(--c-surface) !important;
    color: var(--c-text) !important;
    border-bottom: 1px solid var(--c-border);
    font-weight: 600;
    font-size: var(--fs-base);
}
.card-header::after { display: none; }
.card-title, .card-header .card-title, .modal-title { float: none; font-size: var(--fs-md); font-weight: 600; margin: 0; color: var(--c-text) !important; line-height: 1.25; }
.card-title > i, .modal-title > i { color: #64748b; margin-right: .4em; font-size: var(--fs-sm); }
.card-header > .card-tools, .card-header > .btn, .card-header > form, .card-header > .badge, .card-header > .float-right { float: none; margin: 0 0 0 auto; }
.card-header > .card-tools ~ .btn, .card-header > .btn ~ .btn { margin-left: 0; }
.card-header .btn { min-height: 28px; padding: 0 8px; }
.card-header .text-white, .card-header .card-title a, .modal-header .text-white { color: var(--c-text) !important; }
.card[class*="card-"]:not(.card-body) > .card-header { background: var(--c-surface) !important; color: var(--c-text) !important; border-bottom: 1px solid var(--c-border); }
.card[class*="card-"].card-outline { border-top: 1px solid var(--c-border); }
.card-header[class*="bg-"], .modal-header[class*="bg-"] { background: var(--c-surface) !important; color: var(--c-text) !important; }
.btn-tool { color: var(--c-muted) !important; }
.card-body { padding: var(--card-pad); }
.card-footer { background: var(--c-subtle); border-top: 1px solid var(--c-border); padding: 8px var(--card-pad); }
.card-body:has(> table), .card-body:has(> .table) { overflow-x: auto; }

/* One spacing token for gutters, card gaps and page padding */
.content .row:not(.no-gutters), .content-header .row:not(.no-gutters) { margin-left: calc(var(--gap) / -2); margin-right: calc(var(--gap) / -2); }
.content .row:not(.no-gutters) > [class*="col"], .content-header .row:not(.no-gutters) > [class*="col"] { padding-left: calc(var(--gap) / 2); padding-right: calc(var(--gap) / 2); }
.content .card[class*="mt-"], .content .card[class*="mb-"], .content .card[class*="my-"] { margin-top: 0 !important; margin-bottom: var(--gap) !important; }
.content .row > [class*="col"] > .card:only-child { height: calc(100% - var(--gap)); }
.content > br, .content > .container-fluid > br { display: none; }

/* Tables fill their card edge to edge; negative margins avoid touching sibling content */
.card-body > .table, .card-body > table, .card-body > .table-responsive, .card-body > .dataTables_wrapper {
    margin-left: calc(-1 * var(--card-pad));
    margin-right: calc(-1 * var(--card-pad));
    width: calc(100% + 2 * var(--card-pad)) !important;
    max-width: none;
    margin-bottom: 0;
}
.card-body > .table:first-child, .card-body > table:first-child, .card-body > .table-responsive:first-child, .card-body > .dataTables_wrapper:first-child { margin-top: calc(-1 * var(--card-pad)); }
.card-body > .table:last-child, .card-body > table:last-child, .card-body > .table-responsive:last-child, .card-body > .dataTables_wrapper:last-child { margin-bottom: calc(-1 * var(--card-pad)); }
.card-body.p-0 > .table, .card-body.p-0 > table, .card-body.p-0 > .table-responsive, .card-body.p-0 > .dataTables_wrapper { margin: 0; width: 100% !important; }
.card .table { width: 100% ; margin-bottom: 0; }
.card .table tr > :first-child { padding-left: var(--card-pad); }
.card .table tr > :last-child { padding-right: var(--card-pad); }
.card .table-bordered { border: 0; }
.card .table-bordered tr > :first-child { border-left: 0; }
.card .table-bordered tr > :last-child { border-right: 0; }
.card .table > thead:first-child > tr:first-child > th, .card .table > tbody:first-child > tr:first-child > td { border-top: 0; }
.card .dataTables_wrapper > .row { margin: 0; padding: 8px var(--card-pad); }
.card .dataTables_wrapper > .row > [class*="col"] { padding: 0; }
.card .dataTables_wrapper > .row:has(table) { padding: 0; }
.card-footer .pagination { margin: 0; }

/* Tables: one look whatever legacy variant classes a view still uses */
.table, .table.small, .table-sm, .table-condensed { color: var(--c-text); font-size: var(--fs-sm); margin-bottom: 0; width: 100%; background: var(--c-surface); border: 0; }
.table th, .table td, .table-sm th, .table-sm td, .table-condensed th, .table-condensed td {
    padding: 6px 10px;
    vertical-align: middle;
    border: 0;
    border-bottom: 1px solid #e3e7eb;
    line-height: 1.4;
}
.table thead th, .table thead.thead-dark th, .table thead.thead-light th, .table > tr:first-child > th {
    background: var(--c-subtle) !important;
    color: var(--c-text) !important;
    font-size: var(--fs-xs);
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    white-space: nowrap;
    border: 0;
    border-bottom: 1px solid var(--c-border);
    vertical-align: bottom;
}
.table-bordered, .table-bordered th, .table-bordered td, .table-borderless th, .table-borderless td { border-left: 0 !important; border-right: 0 !important; border-top: 0 !important; }
.table-bordered { border: 0; }
.table-striped tbody tr:nth-of-type(odd), .table tbody tr[class*="table-"], .table tbody tr[class*="table-"] > td, .table tbody tr[class*="table-"] > th, .table tbody tr[class*="bg-"] { background-color: transparent !important; color: var(--c-text) !important; }
.table tbody tr:hover { background-color: var(--c-primary-tint); }
.table tbody tr:last-child > td { border-bottom: 0; }
.table.text-center th, .table.text-center td { text-align: left; }
.table .text-right, .table .num, .table td.num, .table th.num { text-align: right; font-variant-numeric: tabular-nums; }
.table td .badge { line-height: 1.3; vertical-align: middle; }
.table td:last-child:has(.btn, .btn-group) { white-space: nowrap; text-align: right; }
.table td:has(> .btn), .table td:has(> form .btn), .table td:has(> a.btn) { white-space: nowrap; }
.table td .btn + .btn, .table td .btn + form, .table td form + .btn { margin-left: 4px; }
.table td form { display: inline; }
.table tfoot td, .table tfoot th { font-weight: 700; border-top: 1px solid var(--c-border); border-bottom: 0; background: var(--c-surface); }
.table-responsive { -webkit-overflow-scrolling: touch; }
.table-wrap { border: 1px solid var(--c-border); border-radius: var(--radius-lg); background: var(--c-surface); }
.table-wrap > .table tr > :first-child { padding-left: 12px; }
.table-wrap > .table tr > :last-child { padding-right: 12px; }

/* Pagination: Laravel, DataTables and Livewire share it */
.pagination-bar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; padding: 8px var(--card-pad); border-top: 1px solid var(--c-border); background: var(--c-surface); }
.pagination-summary, .dataTables_wrapper .dataTables_info { font-size: var(--fs-xs); color: var(--c-muted); font-variant-numeric: tabular-nums; }
.pagination, .dataTables_wrapper .dataTables_paginate .pagination { margin: 0; display: flex; flex-wrap: wrap; gap: 4px; padding: 0; }
.page-item .page-link, .page-item:first-child .page-link, .page-item:last-child .page-link {
    min-width: 28px;
    height: 28px;
    min-height: 28px;
    padding: 0 8px;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--fs-sm);
    line-height: 1;
    color: var(--c-text);
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--radius);
}
.page-item .page-link:hover { background: var(--c-primary-tint); color: var(--c-text); border-color: var(--c-border); }
.page-item .page-link:focus { box-shadow: none; outline: 2px solid var(--c-primary); outline-offset: 1px; }
.page-item.active .page-link { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }
.page-item.disabled .page-link { color: #8a949e; background: var(--c-surface); border-color: var(--c-border); }
.dataTables_wrapper .dataTables_paginate { display: flex; justify-content: flex-end; }
@media (max-width: 575.98px) {
    .pagination-summary { flex-basis: 100%; }
    .pagination-bar nav, .pagination-bar .pagination { width: 100%; justify-content: center; }
    .pagination .page-item:not(.active):not(:first-child):not(:last-child) { display: none; }
}

/* Badges: tinted fill, darker 1px border, dark text (all AA) */
.badge, .badge-pill, .badge-status {
    display: inline-block;
    font-size: var(--fs-xs);
    font-weight: 600;
    line-height: 1.4;
    padding: 2px 8px;
    border-radius: var(--radius);
    border: 1px solid #c6ccd3;
    background: #eef0f3;
    color: #374151;
    background-image: none;
    white-space: nowrap;
    vertical-align: middle;
}
.badge-status-new, .badge-info { background: #dbe7fd; border-color: #9db8f0; color: #1e3a8a; }
.badge-status-progress, .badge-warning { background: #fde9bf; border-color: #e9b65a; color: #713f07; }
.badge-status-waiting, .badge-primary { background: #e4e8f6; border-color: #a8b3db; color: #1e2a6b; }
.badge-status-classified { background: #d2ecee; border-color: #8fcbd0; color: #0a4f56; }
.badge-status-done, .badge-success { background: #d1efdd; border-color: #95d1ad; color: #11553a; }
.badge-status-critical, .badge-danger { background: #f9d9d9; border-color: #eb9f9f; color: #7f1d1d; }
.badge-status-neutral, .badge-secondary, .badge-light { background: #eef0f3; border-color: #c6ccd3; color: #374151; }
.badge-dark { background: #1e293b; border-color: #1e293b; color: #fff; }
a.badge:hover { filter: brightness(.96); text-decoration: none; }

/* Alerts and callouts: same tones as status badges */
.alert, .callout {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px 12px;
    margin-bottom: var(--gap);
    font-size: var(--fs-sm);
    border: 1px solid #c6ccd3;
    border-left: 4px solid #6b7280;
    border-radius: var(--radius);
    background: #f4f5f7;
    color: var(--c-text) !important;
}
.alert > .fas, .alert > .fa { margin-top: 3px; flex: none; }
.alert > div { flex: 1; min-width: 0; }
.alert a, .callout a { color: inherit; text-decoration: underline; }
.alert.text-center { justify-content: center; }
.alert-dismissible { padding-right: 12px; }
.alert-dismissible .close { position: static; order: 99; padding: 0 4px; margin-left: auto; color: var(--c-text); opacity: .7; line-height: 1; font-size: 1.25rem; }
.alert-dismissible .close:hover { opacity: 1; }
.alert-success, .callout.callout-success { background: #f0f9f4; border-color: #95d1ad; border-left-color: var(--c-success); }
.alert-danger, .alert-error, .callout.callout-danger { background: #fdf2f2; border-color: #eb9f9f; border-left-color: var(--c-danger); }
.alert-warning, .callout.callout-warning { background: #fffaf0; border-color: #e9b65a; border-left-color: var(--c-warning); }
.alert-info, .alert-primary, .callout.callout-info { background: #f2f6fe; border-color: #9db8f0; border-left-color: var(--c-info); }
.alert-secondary, .alert-light, .alert-dark, .callout { background: #f4f5f7; border-color: #c6ccd3; border-left-color: #6b7280; }
.flash-stack { padding: var(--gap) var(--page-pad) 0; }
.flash-stack .alert:last-child { margin-bottom: 0; }
.content-wrapper { display: flex; flex-direction: column; }
.content-wrapper > .content-header { order: -1; }
.portal .flash-stack, .auth-column .flash-stack { padding: var(--gap) 0 0; }
.auth-column .flash-stack { padding: 0 0 var(--gap); }

/* Modals, tabs, pagination, dropdowns */
.modal-content { border-radius: var(--radius-lg); border: 1px solid var(--c-border); }
.modal-body { padding: var(--card-pad); }
.modal-footer { border-top: 1px solid var(--c-border); padding: 8px var(--card-pad); background: var(--c-surface); justify-content: flex-end; gap: 8px; }
.modal-footer > * { margin: 0; }
.modal-footer .btn { min-height: 28px; padding: 0 10px; }
.modal-backdrop.show { opacity: .4; }
.modal-header .close { color: var(--c-muted); opacity: 1; text-shadow: none; font-size: 1.25rem; }
.modal-header .close:hover { color: var(--c-text); }
.modal-header .close:focus-visible { outline: 2px solid var(--c-primary); outline-offset: 1px; }
@media (min-width: 576px) { .modal-dialog { max-width: 500px; } }
@media (min-width: 992px) { .modal-lg, .modal-xl { max-width: 800px; } }
@media (min-width: 1200px) { .modal-xl { max-width: 1140px; } }

.swal2-popup { font-family: var(--font); border-radius: var(--radius-lg) !important; padding: 16px !important; }
.swal2-title { font-size: var(--fs-md) !important; font-weight: 600 !important; color: var(--c-text) !important; }
.swal2-html-container, .swal2-content { font-size: var(--fs-base) !important; color: var(--c-text) !important; }
.swal2-toast .swal2-title { font-size: var(--fs-sm) !important; }
.swal2-actions { gap: 8px; justify-content: flex-end; }
.swal2-styled { margin: 0 !important; border-radius: var(--radius) !important; font-size: var(--fs-sm) !important; font-weight: 600 !important; min-height: 32px; padding: 0 14px !important; box-shadow: none !important; }
.swal2-styled.swal2-confirm { background: var(--c-primary) !important; border: 1px solid var(--c-primary) !important; color: #fff !important; }
.swal2-styled.swal2-deny, .swal2-icon-warning ~ .swal2-actions .swal2-confirm, .swal2-icon-error ~ .swal2-actions .swal2-confirm { background: var(--c-danger) !important; border-color: var(--c-danger) !important; }
.swal2-styled.swal2-cancel { background: var(--c-surface) !important; border: 1px solid var(--c-input-border) !important; color: var(--c-text) !important; }
.swal2-styled:focus-visible { outline: 2px solid var(--c-primary) !important; outline-offset: 1px; }
.swal2-timer-progress-bar { background: var(--c-primary) !important; }
.modal-header { border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
.modal-header .close { margin: -4px -4px -4px auto; padding: 4px 8px; }

.nav-tabs { border-bottom: 1px solid var(--c-border); }
.nav-tabs .nav-link { font-size: var(--fs-sm); border-radius: 0; color: var(--c-muted); font-weight: 600; border: 0; border-bottom: 3px solid transparent; }
.nav-tabs .nav-link:hover { color: var(--c-text); border-bottom-color: var(--c-border); }
.nav-tabs .nav-link.active { color: var(--c-primary-ink); border-bottom-color: var(--c-primary); background: transparent; }
.content-wrapper .nav-pills .nav-link { border-radius: var(--radius); color: var(--c-text); font-weight: 600; font-size: var(--fs-sm); }
.content-wrapper .nav-pills .nav-link.active { background: var(--c-primary); color: #fff; }


.dropdown-menu { border-radius: var(--radius-lg); border-color: var(--c-border); }
.dropdown-item { padding: .5rem 1rem; color: var(--c-text); }
.dropdown-item:hover, .dropdown-item:focus { background: var(--c-primary-tint); color: var(--c-text); }

/* Step wizard (back-office initiate form and public wizards) */
.stepwizard { display: flex; justify-content: center; margin: 8px 0 20px; }
.stepwizard-row { display: flex; position: relative; gap: clamp(12px, 4vw, 48px); }
.stepwizard-row::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 18px;
    right: 18px;
    height: 2px;
    background: var(--c-border);
    z-index: 0;
}
.stepwizard-step { position: relative; z-index: 1; text-align: center; }
.stepwizard-step p { margin: 6px 0 0; font-size: var(--fs-sm); color: var(--c-muted); }
.btn-circle {
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--fs-sm);
    font-weight: 700;
    border: 2px solid var(--c-input-border);
    background: var(--c-surface);
    color: var(--c-muted);
}
.btn-circle.btn-warning, .btn-circle.btn-success, .btn-circle.btn-primary, .stepwizard-step.active .btn-circle {
    background: var(--c-primary);
    border-color: var(--c-primary);
    color: #fff;
}
.stepwizard .btn.disabled, .stepwizard .btn[disabled] { opacity: 1 !important; color: #8a949e; }

/* ===== Back office shell (AdminLTE) ===== */
.wrapper { overflow-x: clip; }
.content-wrapper { background: var(--c-canvas); }
.content-wrapper .container, .content-wrapper .container-fluid, .content-wrapper > .content { max-width: none; }
.content-wrapper > .content { padding: 0 var(--page-pad) var(--gap); }
.content-wrapper > .content:first-child { padding-top: var(--gap); }
.content-wrapper > .content > .container, .content-wrapper > .content > .container-fluid,
.content-wrapper > .content-header > .container, .content-wrapper > .content-header > .container-fluid { padding-left: 0; padding-right: 0; }
.content-wrapper:focus { outline: none; }

/* Navigation system: back-office navbar, sidebar, portal header and auth header share these rules */
:root { --nav-h: 48px; }
.brand-lockup { display: flex; align-items: center; gap: 10px; height: var(--nav-h); text-decoration: none !important; white-space: nowrap; min-width: 0; }
.brand-lockup img, .brand-lockup .brand-image { width: 28px; height: 28px; border-radius: var(--radius); flex: none; float: none; margin: 0; opacity: 1; }
.brand-lockup .brand-text { font-size: var(--fs-md); font-weight: 700 !important; color: var(--c-navy); letter-spacing: .01em; }
.brand-lockup .brand-sub { font-size: var(--fs-sm); color: var(--c-muted); font-weight: 400; overflow: hidden; text-overflow: ellipsis; }

.icon-btn { width: 36px; height: 36px; min-height: 36px; padding: 0 !important; display: inline-flex !important; align-items: center; justify-content: center; border-radius: var(--radius); color: var(--c-muted) !important; border: 0; background: transparent; }
.icon-btn:hover { background: var(--c-subtle); color: var(--c-text) !important; }
.icon-btn:focus-visible { outline: 2px solid var(--c-primary); outline-offset: 1px; }

.main-header.navbar { background: var(--c-surface); border-bottom: 1px solid var(--c-border); padding: 0 8px; }
.main-header .nav-link { color: var(--c-text); font-size: var(--fs-sm); display: flex; align-items: center; }
.main-header .nav-link:hover { color: var(--c-primary-ink); }
.navbar-context { font-size: var(--fs-sm); font-weight: 600; color: var(--c-muted); padding: 0 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.navbar-agency-name { font-size: var(--fs-xs); color: var(--c-muted); padding: 0 12px; }
.user-menu-toggle { gap: 8px; padding: 2px 6px !important; border-radius: var(--radius); }
.user-menu-toggle:hover { background: var(--c-subtle); }
.user-menu-toggle > .fa-angle-down { color: var(--c-muted); }
.user-menu-text { line-height: 1.15; }
.user-menu-name { font-size: var(--fs-sm); font-weight: 600; color: var(--c-text); }
.user-menu-role { font-size: var(--fs-xs); color: var(--c-muted); }
.user-initial { width: 28px; height: 28px; border-radius: 50%; background: var(--c-navy); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: var(--fs-xs); flex: none; }
.user-menu .dropdown-header { font-size: var(--fs-xs); color: var(--c-muted); white-space: normal; }

.main-sidebar, .main-sidebar.sidebar-dark-primary { background: var(--c-sidebar); }
.main-sidebar .brand-link.brand-lockup { height: calc(2.93725rem + 1px); padding: 0 16px; border-bottom: 1px solid var(--c-sidebar-2) !important; }
.main-sidebar .brand-lockup .brand-text { color: #fff; }
.main-sidebar .sidebar { padding: 0 0 16px; }
.main-sidebar .nav-header { color: #a7adb3; font-size: var(--fs-xs); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; padding: 16px 16px 4px !important; }
.main-sidebar .nav-sidebar > .nav-header:first-child { padding-top: 12px !important; }
.sidebar-dark-primary .nav-sidebar .nav-link {
    display: flex;
    align-items: center;
    min-height: 36px;
    padding: 0 16px;
    margin: 0;
    border: 0;
    border-left: 3px solid transparent;
    border-radius: 0;
    color: var(--c-sidebar-text);
    font-size: var(--fs-sm);
}
.sidebar-dark-primary .nav-sidebar .nav-link > p { margin: 0; flex: 1; display: flex; align-items: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sidebar-dark-primary .nav-sidebar .nav-link > p > .right { position: static; margin-left: auto; font-size: var(--fs-xs); transition: transform .15s; }
.sidebar-dark-primary .nav-sidebar .menu-open > .nav-link > p > .right { transform: rotate(-90deg); }
.sidebar-dark-primary .nav-sidebar .nav-link > p > .badge { margin-left: auto; }
.main-sidebar .nav-sidebar .nav-icon { width: 20px; margin-right: 10px !important; font-size: 1rem; text-align: center; color: #9aa1a7 !important; flex: none; }
.main-sidebar .nav-treeview .nav-icon { font-size: 5px; }
.sidebar-dark-primary .nav-sidebar .nav-link:hover, .sidebar-dark-primary .nav-sidebar .nav-link:focus { background: var(--c-sidebar-2); color: #fff; }
.sidebar-dark-primary .nav-sidebar .nav-link:hover .nav-icon { color: #fff !important; }
.sidebar-dark-primary .nav-sidebar > .nav-item.menu-open > .nav-link { background: transparent; color: #fff; }
.sidebar-dark-primary .nav-sidebar .nav-link.active,
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar .nav-treeview > .nav-item > .nav-link.active,
.sidebar-dark-primary .nav-sidebar .nav-link.active:hover {
    background: rgba(20, 184, 166, .16);
    border-left-color: var(--c-mint);
    color: #fff;
    box-shadow: none;
}
.sidebar-dark-primary .nav-sidebar .nav-link.active .nav-icon { color: var(--c-mint) !important; }
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.tree-link.active { background: transparent; }
.sidebar-dark-primary .nav-sidebar .nav-treeview { background: transparent; }
.nav-child-indent .nav-treeview { padding-left: 12px; }
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .nav-header { display: none; }
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .nav-sidebar .nav-link { justify-content: center; padding: 0; }
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .nav-sidebar .nav-icon { margin-right: 0 !important; }
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .brand-link.brand-lockup { padding: 0; justify-content: center; }

.content-header, .portal-page-header {
    background: var(--c-surface);
    border-bottom: 1px solid var(--c-border);
    padding: var(--gap) var(--page-pad);
    margin-bottom: var(--gap);
}
.content-header .row { align-items: center; }
.content-header .row.mb-2 { margin-bottom: 0 !important; }
.content-header h1, .content-header .m-0, .page-title { font-size: var(--fs-lg); font-weight: 600; color: var(--c-text); margin: 0; line-height: 1.25; }
.content-header h1 i, .content-header h1 .fa, .content-header h1 .fas, .content-header h1 .far, .page-title i { color: var(--c-muted) !important; font-size: 1em; margin-right: 6px; }
.page-subtitle { font-size: var(--fs-sm); color: var(--c-muted); margin: 2px 0 0; }
.page-header-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.page-header-text { min-width: 0; }
.page-header-actions { margin-left: auto; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.page-header-actions .btn { min-height: 28px; padding: 0 8px; }
.breadcrumb { background: transparent; padding: 0; margin: 0; font-size: var(--fs-sm); color: var(--c-muted); }
.breadcrumb a { color: var(--c-muted); }
.breadcrumb-item.active { color: var(--c-muted); }

.main-footer {
    background: var(--c-surface);
    border-top: 1px solid var(--c-border);
    color: var(--c-muted);
    font-size: var(--fs-sm);
    padding: 10px 16px;
}

.info-box, .small-box { --tone: #6b7280; --tone-tint: #eef0f3; --tone-ink: #374151; border: 1px solid var(--c-border); border-left: 4px solid var(--tone); border-radius: var(--radius-lg); background: var(--c-surface); min-height: 72px; margin-bottom: 0; }
.info-box .info-box-icon { border-radius: var(--radius-lg); width: 40px; height: 40px; min-width: 40px; align-self: center; font-size: 20px; }
.info-box .info-box-text { color: var(--c-muted); font-size: var(--fs-sm); font-weight: 600; text-transform: none; }
.info-box .info-box-number { font-weight: 700; color: var(--c-text); line-height: 1.2; }
.small-box > .small-box-footer { border-radius: 0 0 var(--radius-lg) 0; background: var(--c-subtle) !important; color: var(--tone-ink) !important; border-top: 1px solid var(--c-border); }
.info-box:has(.bg-primary), .info-box:has(.bg-info), .info-box:has(.bg-blue), .small-box.bg-primary, .small-box.bg-info, .small-box.bg-blue { --tone: #2563eb; --tone-tint: #e3ecfd; --tone-ink: #1d4ed8; }
.info-box:has(.bg-secondary), .info-box:has(.bg-teal), .small-box.bg-secondary, .small-box.bg-teal { --tone: #0e7c86; --tone-tint: #dcf0f1; --tone-ink: #0a5c64; }
.info-box:has(.bg-success), .info-box:has(.bg-green), .small-box.bg-success, .small-box.bg-green { --tone: #18794e; --tone-tint: #dcf3e6; --tone-ink: #11553a; }
.info-box:has(.bg-warning), .info-box:has(.bg-yellow), .info-box:has(.bg-orange), .small-box.bg-warning, .small-box.bg-yellow, .small-box.bg-orange { --tone: #d97706; --tone-tint: #fdf0d5; --tone-ink: #92400e; }
.info-box:has(.bg-danger), .info-box:has(.bg-red), .small-box.bg-danger, .small-box.bg-red { --tone: #b91c1c; --tone-tint: #fbe3e3; --tone-ink: #991b1b; }
.info-box .info-box-icon[class*="bg-"] { background: var(--tone-tint) !important; color: var(--tone-ink) !important; }
.small-box[class*="bg-"] { background: var(--c-surface) !important; color: var(--c-text) !important; }
.small-box[class*="bg-"] .inner h3, .small-box[class*="bg-"] .inner p { color: var(--c-text) !important; }
.small-box > .icon { position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border-radius: var(--radius-lg); background: var(--tone-tint); display: flex; align-items: center; justify-content: center; }
.small-box > .icon > i, .small-box:hover > .icon > i { position: static; font-size: 20px !important; color: var(--tone-ink) !important; opacity: 1; transform: none; }
.stat-card { border-left: 4px solid var(--tone, var(--c-primary)); }

.row:has(> [class*="col"] > .info-box),
.row:has(> [class*="col"] > .small-box) {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--gap);
    margin: 0 0 var(--gap);
}
.row:has(> [class*="col"] > .info-box) > [class*="col"],
.row:has(> [class*="col"] > .small-box) > [class*="col"] { max-width: none; padding: 0; width: auto; flex: none; }

/* Phones and tablets */
@media (max-width: 767.98px) {
    :root { --gap: 8px; --page-pad: 16px; }
}

@media (max-width: 991.98px) {
}

@media (max-width: 767.98px) {
    .form-inline .form-control, .form-inline .input-group, .form-inline .btn { width: 100%; }
    .float-sm-right { float: none !important; }
    .page-header-actions { margin-left: 0; width: 100%; }
    .filter-field-wide { grid-column: auto; }
}

@media (pointer: coarse) {
    .btn, .page-link, .main-sidebar .nav-sidebar .nav-link, .dropdown-item { min-height: 40px; }
    .icon-btn { width: 40px; height: 40px; }
    :root { --input-h: 40px; --input-h-sm: 36px; }
    .btn-sm, .table td .btn-sm, .filter-actions .btn { min-height: 40px; min-width: 40px; }
    .btn-circle { min-height: 36px; }
}

@media (max-width: 575.98px) {
    form .row > .col-6, form .row > .col-4, form .row > .col-3 { flex: 0 0 100%; max-width: 100%; }
    .modal-dialog { margin: 8px; max-width: none; }
    .modal-content { max-height: calc(100vh - 16px); }
    .modal-body { overflow-y: auto; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

@media print {
    .main-sidebar, .main-header, .main-footer, .skip-link, .card-tools, .pagination, .btn, #sidebar-overlay { display: none !important; }
    body, .wrapper, .content-wrapper { background: #fff !important; }
    .content-wrapper, .layout-navbar-fixed .wrapper .content-wrapper, .layout-fixed .wrapper .content-wrapper {
        margin: 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
    }
    .card { border: 1px solid #999; break-inside: avoid; }
    .table thead th { background: #eee !important; }
    .table tbody tr:hover { background: transparent !important; }
    a[href]::after { content: none !important; }
}

/* ===== Staff sign-in ===== */
.auth-page { --fs-base: 1rem; --input-h: 44px; --input-pad: 8px 12px; --input-fs: var(--fs-base); --label-fs: var(--fs-base); background: var(--c-canvas); min-height: 100vh; display: flex; flex-direction: column; }
.auth-banner { background: var(--c-surface); border-bottom: 1px solid var(--c-border); }
.auth-main { flex: 1; display: flex; align-items: flex-start; justify-content: center; padding: clamp(24px, 8vh, 72px) 16px 32px; }
.auth-column { width: 100%; max-width: 420px; }
.auth-card { width: 100%; max-width: 420px; background: var(--c-surface); border: 1px solid var(--c-border); border-top: 3px solid var(--c-navy); border-radius: var(--radius-lg); padding: 28px 28px 24px; }
.auth-card h1 { font-size: var(--fs-xl); margin: 0 0 4px; color: var(--c-navy); }
.auth-card .lead-in { color: var(--c-muted); margin-bottom: 20px; }
.auth-card .btn-block { height: 44px; }
.auth-footer { text-align: center; color: var(--c-muted); font-size: var(--fs-sm); padding: 16px; }

.content-wrapper:has(> .content-header) > .flash-stack { padding-top: 0; margin-bottom: var(--gap); }
.content-wrapper:not(:has(> .content-header)) > .flash-stack + .content { padding-top: var(--gap); }

.empty-state, td.dataTables_empty { text-align: center; padding: 24px 12px !important; color: var(--c-muted); font-size: var(--fs-xs); }
.empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; }
.empty-state-icon { font-size: 24px; color: #94a3b8; margin-bottom: 8px; }
.empty-state-title { font-size: var(--fs-sm); font-weight: 600; color: var(--c-text); margin: 0; }
.empty-state-message { font-size: var(--fs-xs); color: var(--c-muted); margin: 2px 0 0; }
.empty-state-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 8px; }
.empty-state-actions .btn { min-height: var(--input-h-sm); padding: 0 8px; }
.table tbody tr.empty-state-row, .table tbody tr.empty-state-row:hover, .table-striped tbody tr.empty-state-row:nth-of-type(odd), .table tbody tr:has(> td.dataTables_empty) { background: var(--c-surface) !important; }
.table tr.empty-state-row > td { padding: 0 !important; }
.chart .empty-state, [class*="chart"] > .empty-state, .card-body:has(canvas) .empty-state { min-height: 240px; }

.detail-list { display: grid; gap: 10px 16px; margin: 0; grid-template-columns: minmax(0, 1fr); }
.detail-item { min-width: 0; }
.detail-item dt { font-size: var(--fs-xs); font-weight: 600; color: var(--c-muted); letter-spacing: .02em; margin: 0 0 2px; }
.detail-item dd { font-size: var(--fs-sm); color: var(--c-text); margin: 0; overflow-wrap: anywhere; word-break: break-word; }
.detail-empty { color: var(--c-muted); }
.detail-item-wide { grid-column: 1 / -1; }
@media (min-width: 768px) {
    .detail-list-cols-2, .detail-list-cols-3, .detail-list-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
    .detail-list-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .detail-list-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: var(--gap); align-items: start; }
    .detail-aside { position: sticky; top: calc(3.5rem + 1px + var(--gap)); }
}
.detail-main, .detail-aside { min-width: 0; }

.timeline { margin: 0 0 var(--gap); padding: 0; }
.timeline::before { left: 11px; width: 2px; background: var(--c-border); border-radius: 0; }
.timeline > div { margin-bottom: 10px; margin-right: 0; }
.timeline > div > .fa, .timeline > div > .fas, .timeline > div > .far, .timeline > div > .fab, .timeline > div > .svg-inline--fa {
    width: 12px; height: 12px; left: 6px; top: 10px; line-height: 12px; font-size: 0; border-radius: 50%;
    background: var(--c-muted); color: transparent;
}
.timeline > div > .bg-success { background: var(--c-success) !important; }
.timeline > div > .bg-danger { background: var(--c-danger) !important; }
.timeline > div > .bg-warning, .timeline > div > .bg-yellow { background: var(--c-warning) !important; }
.timeline > div > .bg-info, .timeline > div > .bg-blue { background: var(--c-info) !important; }
.timeline > div > .bg-primary { background: var(--c-primary) !important; }
.timeline > div > .timeline-item {
    margin-left: 32px; margin-right: 0; border: 1px solid var(--c-border); border-radius: var(--radius-lg);
    background: var(--c-surface); color: var(--c-text); font-size: var(--fs-sm);
}
.timeline .timeline-item > .time { color: var(--c-muted); font-size: var(--fs-xs); padding: 8px 12px; }
.timeline .timeline-item > .timeline-header { font-size: var(--fs-sm); font-weight: 600; color: var(--c-text); padding: 8px 12px; border-bottom: 1px solid var(--c-border); }
.timeline .timeline-item > .timeline-body, .timeline .timeline-item > .timeline-footer { padding: 8px 12px; }
.timeline > .time-label > span { background: var(--c-subtle) !important; color: var(--c-text) !important; border: 1px solid var(--c-border); border-radius: var(--radius); font-size: var(--fs-xs); font-weight: 600; padding: 2px 8px; }

@media print {
    .detail-layout { display: block !important; }
    .detail-aside { position: static !important; margin-top: var(--gap); }
}

/* Icons: FA 5 solid, size inherits, spacing from CSS; only indicator chips get a fixed glyph size */
.fa-lg, .fa-2x, .fa-3x, .fa-4x, .fa-5x, .fa-6x, .fa-7x, .fa-8x, .fa-9x, .fa-10x { font-size: 1em; line-height: inherit; vertical-align: baseline; }
.dropdown-item > i, .nav-link > i:not(.nav-icon):not(:only-child), .badge > i, .breadcrumb-item > i { margin-right: .4em; }
.btn > i { margin: 0 !important; }
.nav-link > i:only-child, .icon-btn > i { margin: 0; }
.table td > i, .table th i, .card-header > i, .page-title i { color: #64748b; }