:root {
    --space-1: 8px;
    --space-2: 16px;
    --space-3: 24px;
    --space-4: 32px;
    --space-5: 40px;
    --app-bg: #f7f8f2;
    --app-surface: #ffffff;
    --app-surface-2: #fbfcf8;
    --app-surface-3: #f4f7ee;
    --app-surface-4: #edf3e8;
    --app-border: #dde4d4;
    --app-border-strong: #c9d3be;
    --app-text: #18252e;
    --app-muted: #6c767d;
    --app-muted-2: #8b949a;
    --app-brand: #7d980f;
    --app-brand-2: #a2bb2f;
    --app-brand-dark: #5f7606;
    --app-gold: #d7a942;
    --app-dark: #123744;
    --app-success: #198754;
    --app-danger: #dc3545;
    --app-warning: #ffc107;
    --app-info: #0dcaf0;
    --app-shadow: 0 14px 30px rgba(27, 49, 37, 0.08);
    --app-shadow-sm: 0 8px 18px rgba(27, 49, 37, 0.05);
    --app-shadow-lg: 0 22px 46px rgba(27, 49, 37, 0.11);
    --app-shadow-xl: 0 28px 58px rgba(27, 49, 37, 0.14);
    --app-shadow-soft: 0 10px 22px rgba(27, 49, 37, 0.06);
    --app-shadow-medium: 0 18px 34px rgba(27, 49, 37, 0.09);
    --app-radius-xs: 8px;
    --app-radius-sm: 12px;
    --app-radius: 18px;
    --app-radius-lg: 24px;
}

html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
    overflow-x: hidden;
    max-width: 100%;
}

body {
    margin: 0;
    font-size: 14px;
    color: var(--app-text);
    background: var(--app-bg);
    font-family: "Aptos", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    overflow-x: hidden;
    line-height: 1.55;
    letter-spacing: 0.002em;
    max-width: 100%;
}

.app-shell {
    min-height: 100vh;
}

.app-layout {
    min-height: 100vh;
}

.app-main {
    min-height: 100vh;
    display: grid;
    grid-template-rows: auto 1fr auto;
    min-width: 0;
}

a {
    text-decoration: none;
}

img {
    max-width: 100%;
}

.app-body,
body.bg-light {
    background: radial-gradient(circle at top left, rgba(125, 152, 15, 0.09), transparent 28%), radial-gradient(circle at top right, rgba(215, 169, 66, 0.07), transparent 22%), linear-gradient(180deg, #fbfcf7 0%, #f4f7ee 100%);
}

.app-navbar,
.navbar.bg-dark {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 244, 0.95)) !important;
    box-shadow: 0 10px 26px rgba(27, 49, 37, 0.08);
    border-bottom: 1px solid rgba(214, 222, 202, 0.92);
    backdrop-filter: blur(14px);
}

.app-layout {
    display: grid;
    grid-template-columns: 288px minmax(0, 1fr);
}

.app-sidebar-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(15, 36, 46, 0.42);
    backdrop-filter: blur(3px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.18s ease;
    z-index: 1020;
}

.app-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    padding: 16px 12px;
    background: linear-gradient(180deg, #f8faf5 0%, #eef4e8 100%);
    border-right: 1px solid rgba(214, 222, 202, 0.95);
    color: #22353c;
    overflow: hidden;
    z-index: 1025;
    box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.55);
}

.app-sidebar-top {
    padding: 6px 6px 16px;
}

.app-sidebar-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #1d2f36;
}

.app-sidebar-brand-mark {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(125, 152, 15, 0.90), rgba(190, 207, 105, 0.88));
    box-shadow: 0 10px 22px rgba(125, 152, 15, 0.16);
    font-size: 1.1rem;
    color: #fff;
}

.app-sidebar-brand-mark img {
    width: 34px;
    height: 34px;
    object-fit: contain;
    border-radius: 10px;
}

.app-sidebar-brand-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.app-sidebar-brand-title {
    font-size: 0.98rem;
    font-weight: 800;
    letter-spacing: 0.01em;
}

.app-sidebar-brand-subtitle {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(34, 53, 60, 0.58);
}

.app-sidebar-scroll {
    display: grid;
    gap: 16px;
    height: calc(100vh - 90px);
    overflow-y: auto;
    padding-right: 4px;
}

.app-sidebar-group {
    display: grid;
    gap: 4px;
}

.app-sidebar-group-title {
    padding: 0 10px;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: rgba(58, 76, 66, 0.58);
}

.app-sidebar-link {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 42px;
    padding: 0 12px;
    border-radius: 14px;
    color: #405058;
    font-weight: 600;
    transition: 0.18s ease;
}

.app-sidebar-link i {
    width: 20px;
    text-align: center;
    font-size: 1rem;
}

.app-sidebar-link:hover,
.app-sidebar-link:focus {
    color: #1d2f36;
    background: rgba(125, 152, 15, 0.10);
}

.app-sidebar-link.active {
    color: #16323a;
    background: linear-gradient(135deg, rgba(125, 152, 15, 0.18), rgba(255,255,255,0.75));
    box-shadow: inset 0 0 0 1px rgba(191, 205, 168, 0.85);
}

.app-topbar {
    top: 0;
    min-height: 72px;
}

.app-sidebar-toggle {
    min-width: 42px;
    min-height: 42px;
    border-radius: 12px !important;
}

.app-topbar-action {
    min-height: 38px;
    border-radius: 999px !important;
}

.app-topbar-shortcuts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

body.app-sidebar-collapsed .app-layout {
    grid-template-columns: 96px minmax(0, 1fr);
}

body.app-sidebar-collapsed .app-sidebar-brand-copy,
body.app-sidebar-collapsed .app-sidebar-group-title,
body.app-sidebar-collapsed .app-sidebar-link span {
    display: none;
}

body.app-sidebar-collapsed .app-sidebar-link {
    justify-content: center;
    padding: 0;
}

.app-brand-wrap {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0.25rem 0.65rem 0.25rem 0;
}

.app-brand-title {
    font-size: 1.08rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: 0.01em;
}

.navbar .navbar-brand,
.navbar .nav-link,
.navbar .dropdown-toggle {
    color: #203239 !important;
}

.navbar .nav-link {
    opacity: 0.96;
    font-weight: 600;
    border-radius: 999px;
    padding: 0.68rem 1rem !important;
    transition: all 0.18s ease-in-out;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus {
    color: #162930 !important;
    opacity: 1;
    background: rgba(125, 152, 15, 0.10);
}

.navbar .nav-link.active {
    background: rgba(125, 152, 15, 0.16);
    color: #162930 !important;
    box-shadow: inset 0 0 0 1px rgba(191, 205, 168, 0.90);
}

.navbar .dropdown-menu {
    border: 1px solid rgba(216, 223, 200, 0.95);
    box-shadow: var(--app-shadow-lg);
    margin-top: 0.55rem;
    max-width: min(94vw, 360px);
    background: rgba(255, 255, 255, 0.98);
}

.app-navbar-collapse {
    gap: 1.2rem;
}

.app-primary-nav {
    gap: 0.4rem;
    align-items: center;
}

.app-nav-list .dropdown {
    position: relative;
}

.app-dropdown-menu {
    min-width: 280px;
    border-radius: 22px !important;
    padding: 12px;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(14px);
    overflow: hidden;
}

.app-account-menu {
    min-width: 240px;
    max-height: min(72vh, 460px);
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
}

.app-dropdown-wide {
    min-width: min(92vw, 360px);
}

.app-dropdown-menu .dropdown-header {
    padding: 0.45rem 0.65rem;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #768178;
}

.app-dropdown-menu li + li {
    margin-top: 2px;
}

.app-dropdown-menu .dropdown-divider {
    margin: 0.55rem 0;
    border-color: #e1e7d3;
}

.app-dropdown-scroll {
    max-height: min(72vh, 460px);
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}

.app-dropdown-scroll::-webkit-scrollbar {
    width: 10px;
}

.app-dropdown-scroll::-webkit-scrollbar-thumb {
    background: rgba(27, 86, 101, 0.28);
    border-radius: 999px;
}

.app-dropdown-scroll::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.04);
}

.brand-small {
    font-size: 12px;
    color: rgba(32, 50, 57, 0.68);
    margin-top: -1px;
}

main,
.main-wrap {
    min-height: calc(100vh - 82px);
    padding-top: 20px;
    padding-bottom: 28px;
}

.app-page-shell {
    display: grid;
    gap: 24px;
    min-width: 0;
}

.container,
.container-fluid {
    position: relative;
    max-width: 100%;
}

.row,
[class*="col-"] {
    min-width: 0;
}

.footer-app {
    background: rgba(255, 255, 255, 0.92);
    border-top: 1px solid var(--app-border);
    color: var(--app-muted);
    padding: 14px 0;
    backdrop-filter: blur(8px);
    margin-top: 12px;
}

.card,
.table,
.alert,
.dropdown-menu,
.form-control,
.form-select,
.btn,
.input-group-text,
.progress {
    border-radius: 14px !important;
}

.card {
    border: 1px solid rgba(216, 223, 200, 0.95);
    box-shadow: var(--app-shadow);
    background: var(--app-surface);
    overflow: hidden;
    border-radius: var(--app-radius-lg) !important;
}

.card-header {
    background: linear-gradient(180deg, #ffffff 0%, #fbfcf8 100%);
    border-bottom: 1px solid var(--app-border);
    font-weight: 700;
    color: #23343a;
    padding: 1.05rem 1.2rem;
}

.card-body {
    background: #fff;
    padding: 1.2rem;
    overflow-x: auto;
    max-width: 100%;
}

.card-body > form:last-child {
    margin-bottom: 0;
}

.table {
    background: #fff;
    overflow: hidden;
    margin-bottom: 0;
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.table thead th {
    background: linear-gradient(180deg, #fcfdf9 0%, #f1f5ea 100%);
    border-bottom: 1px solid var(--app-border);
    font-weight: 700;
    color: #31402f;
    white-space: nowrap;
    padding-top: 0.82rem;
    padding-bottom: 0.82rem;
    position: sticky;
    top: 0;
    z-index: 2;
}

.table td,
.table th {
    vertical-align: middle;
    word-break: break-word;
}

.table td {
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
    border-bottom-color: #e5ead9;
}

.table tbody tr:nth-child(even) {
    background: rgba(248, 250, 243, 0.92);
}

.table-hover tbody tr:hover {
    background: rgba(125, 152, 15, 0.07);
}

.table-responsive {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    max-width: 100%;
}

.enterprise-grid-wrap {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    border-top: 1px solid rgba(216, 223, 200, 0.95);
    background: linear-gradient(180deg, #ffffff 0%, #fcfdf9 100%);
}

.table-modern th,
.table-modern td {
    white-space: nowrap;
    vertical-align: middle;
    padding: 10px 12px;
}

.table-modern {
    min-width: 100%;
}

.table-responsive > .table,
.table-responsive > .table-modern,
.app-table-responsive > .table,
.enterprise-grid-wrap > .table {
    min-width: max-content;
}

.table-responsive > .table th,
.table-responsive > .table td,
.table-modern th,
.table-modern td {
    white-space: nowrap;
}

.dashboard-summary-table {
    table-layout: fixed;
}

.dashboard-summary-table th,
.dashboard-summary-table td {
    vertical-align: middle;
}

.dashboard-summary-table .col-jobno {
    width: 110px;
}

.dashboard-summary-table .col-customer {
    width: 180px;
}

.dashboard-summary-table .col-vehicle {
    width: 180px;
}

.dashboard-summary-table .col-status {
    width: 96px;
}

.dashboard-summary-table .col-money {
    width: 128px;
}

.dashboard-summary-table .col-eta {
    width: 112px;
}

.dashboard-summary-table .col-action {
    width: 88px;
}

.dashboard-summary-table .col-date {
    width: 124px;
}

.dashboard-summary-table .col-type {
    width: 132px;
}

.dashboard-summary-table .col-file {
    width: auto;
}

.dashboard-documents-table {
    table-layout: fixed;
}

.dashboard-documents-table .col-date {
    width: 126px;
}

.dashboard-documents-table .col-jobno {
    width: 104px;
}

.dashboard-documents-table .col-doc-type {
    width: 168px;
}

.dashboard-documents-table .col-doc-file {
    width: 360px;
}

.dashboard-documents-table .col-doc-status {
    width: 108px;
}

.dashboard-documents-table .document-date-cell,
.dashboard-documents-table .document-job-cell,
.dashboard-documents-table .document-status-cell {
    white-space: nowrap;
}

.dashboard-summary-table .text-truncate-cell,
.dashboard-summary-table .text-truncate-cell span,
.dashboard-summary-table .text-truncate-cell div {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-summary-table .table-empty-row td {
    text-align: center;
}

.dashboard-documents-table th,
.dashboard-documents-table td {
    vertical-align: middle;
}

.dashboard-documents-table .document-type-cell,
.dashboard-documents-table .document-file-cell {
    white-space: normal;
}

.document-type-text,
.document-file-name {
    display: block;
    line-height: 1.35;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.document-file-name {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.table-modern thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background: linear-gradient(180deg, #fdfefa 0%, #f3f7ed 100%);
    color: #31424a;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(207, 216, 196, 0.95);
    box-shadow: inset 0 -1px 0 rgba(207, 216, 196, 0.95);
}

.table-modern tbody td {
    padding-top: 0.72rem;
    padding-bottom: 0.72rem;
    border-bottom: 1px solid rgba(223, 229, 214, 0.95);
}

.table-modern tbody tr:nth-child(even) {
    background: rgba(251, 252, 248, 0.94);
}

.table-modern.table-hover tbody tr:hover {
    background: rgba(125, 152, 15, 0.06);
    box-shadow: inset 0 1px 0 rgba(125, 152, 15, 0.08), inset 0 -1px 0 rgba(125, 152, 15, 0.08);
}

.table-modern .badge,
.table-modern .status-pill,
.table-modern .data-pill {
    white-space: nowrap;
}

.table-modern .table-actions {
    gap: 0.35rem;
}

.table-modern .table-actions .btn {
    min-height: 32px;
    padding: 0.36rem 0.7rem;
    font-size: 12px;
}

.table-empty-row td {
    text-align: center;
    color: var(--app-muted);
    padding-top: 1.4rem;
    padding-bottom: 1.4rem;
    background: linear-gradient(180deg, #fbfcf8 0%, #f6f8f1 100%);
}

.enterprise-toolbar {
    border-radius: 24px;
    gap: 14px;
}

.enterprise-toolbar .form-label {
    margin-bottom: 0.38rem;
}

.enterprise-toolbar .btn {
    min-height: 40px;
}

.enterprise-toolbar .filter-toolbar-actions {
    align-items: flex-end;
}

.table-responsive .table {
    min-width: 720px;
}

.table-responsive::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.enterprise-grid-wrap::-webkit-scrollbar,
.table-responsive::-webkit-scrollbar-thumb {
    background: rgba(27, 86, 101, 0.28);
    border-radius: 999px;
}

.enterprise-grid-wrap::-webkit-scrollbar-track,
.table-responsive::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.04);
}

.app-table-responsive {
    width: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.app-table-responsive .table {
    min-width: 980px;
}

.app-table-card {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 22px;
    overflow: hidden;
    background: #fff;
    box-shadow: var(--app-shadow);
}

.app-scroll-panel {
    max-height: 380px;
    overflow-y: auto;
    overflow-x: hidden;
}

.app-scroll-panel::-webkit-scrollbar,
.app-table-responsive::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.app-scroll-panel::-webkit-scrollbar-thumb,
.app-table-responsive::-webkit-scrollbar-thumb {
    background: rgba(27, 86, 101, 0.28);
    border-radius: 999px;
}

.app-scroll-panel::-webkit-scrollbar-track,
.app-table-responsive::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.04);
}

.app-scroll-panel-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
}

.dashboard-grid-scroll {
    max-height: 430px;
    overflow-x: auto;
    overflow-y: auto;
    scrollbar-gutter: stable both-edges;
    padding-bottom: 4px;
}

.dashboard-grid-scroll .table {
    min-width: 980px;
}

.dashboard-grid-scroll::-webkit-scrollbar {
    width: 10px;
    height: 12px;
}

.dashboard-grid-scroll::-webkit-scrollbar-thumb {
    background: rgba(27, 86, 101, 0.30);
    border-radius: 999px;
}

.dashboard-grid-scroll::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.05);
}

.table td.text-truncate-cell,
.table th.text-truncate-cell {
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.table-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.45rem;
    min-width: max-content;
}

.dashboard-table-actions {
    justify-content: flex-end;
    width: 100%;
    gap: 0.3rem;
}

.dashboard-summary-table td:last-child,
.dashboard-summary-table th:last-child {
    padding-right: 10px;
}

.dashboard-summary-table .table-action-icon {
    margin-left: 0;
}

.table-actions.compact {
    gap: 0.3rem;
}

.table-action-icon {
    width: 32px;
    height: 32px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(216, 223, 200, 0.95);
    background: linear-gradient(180deg, #ffffff 0%, #f7faf2 100%);
    color: #264048;
    box-shadow: var(--app-shadow-sm);
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, background-color 0.16s ease;
}

.table-action-icon:hover,
.table-action-icon:focus {
    color: #0f3946;
    border-color: var(--app-border-strong);
    background: #f8fbf2;
    transform: translateY(-1px);
    box-shadow: 0 12px 22px rgba(15, 39, 47, 0.10);
}

.table-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 0.34rem 0.72rem;
    border-radius: 10px !important;
    font-size: 12px;
    font-weight: 700;
}

.form-control,
.form-select {
    min-height: 46px;
    border: 1px solid #d4dcc7;
    box-shadow: none !important;
    background: #fff;
    color: var(--app-text);
    border-radius: 14px !important;
}

.form-control:focus,
.form-select:focus {
    border-color: #a9be4a;
    box-shadow: 0 0 0 0.2rem rgba(125, 152, 15, 0.15) !important;
}

.form-label {
    margin-bottom: 0.45rem;
    font-weight: 600;
    color: #30413f;
    font-size: 0.93rem;
}

.form-text {
    color: #748071;
}

form .row,
form .g-3,
form .g-4 {
    row-gap: 0.35rem;
}

form .mb-3:last-child,
form .mb-4:last-child {
    margin-bottom: 0 !important;
}

.btn {
    font-weight: 700;
    padding-left: 15px;
    padding-right: 15px;
    white-space: nowrap;
    max-width: 100%;
    min-height: 42px;
    border-radius: 14px !important;
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, background-color 0.16s ease, color 0.16s ease;
}

.btn-primary {
    background: linear-gradient(135deg, #7e9817, #a8bf41);
    border: none;
    box-shadow: 0 8px 18px rgba(125, 152, 15, 0.16);
    color: #fff;
}

.btn-primary:hover,
.btn-primary:focus {
    filter: brightness(1.02);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 12px 22px rgba(125, 152, 15, 0.18);
}

.btn-outline-primary {
    border-color: rgba(125, 152, 15, 0.38);
    color: #5f7606;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcf8 100%);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background: rgba(125, 152, 15, 0.12);
    border-color: rgba(125, 152, 15, 0.52);
    color: #4f6505;
    transform: translateY(-1px);
}

.app-topbar .btn-outline-light {
    border-color: rgba(32, 50, 57, 0.14);
    color: #203239;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbf5 100%);
    box-shadow: var(--app-shadow-sm);
}

.app-topbar .btn-outline-light:hover,
.app-topbar .btn-outline-light:focus {
    background: rgba(125, 152, 15, 0.10);
    border-color: rgba(125, 152, 15, 0.36);
    color: #162930;
}

.app-sidebar-toggle {
    border-color: rgba(32, 50, 57, 0.14) !important;
    color: #203239 !important;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbf5 100%);
}

.app-sidebar-toggle:hover,
.app-sidebar-toggle:focus {
    background: rgba(125, 152, 15, 0.10);
    border-color: rgba(125, 152, 15, 0.36) !important;
    color: #162930 !important;
}

.app-user-chip {
    background: rgba(18, 55, 68, 0.05);
    border: 1px solid rgba(214, 222, 202, 0.92);
}

.app-user-avatar {
    background: linear-gradient(135deg, #8da528, #b7ca5b);
    color: #fff;
}

.app-user-name {
    color: #203239;
}

.app-user-role-label {
    color: rgba(32, 50, 57, 0.62);
}

.app-user-pill {
    background: rgba(18, 55, 68, 0.05);
    color: #203239;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background: #f4f8eb;
}

.page-hero {
    position: relative;
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 24px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(246, 249, 239, 0.96));
    color: #1a2d33;
    box-shadow: 0 16px 30px rgba(27, 49, 37, 0.08);
    overflow: hidden;
}

.page-hero::after {
    content: "";
    position: absolute;
    right: -70px;
    top: -70px;
    width: 220px;
    height: 220px;
    background: radial-gradient(circle, rgba(125, 152, 15, 0.14), transparent 68%);
    pointer-events: none;
}

.page-eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 11px;
    font-weight: 700;
    color: #6b7a32;
    margin-bottom: 6px;
}

.page-subtitle {
    max-width: 760px;
    color: var(--app-muted);
}

.page-hero .btn-outline-primary {
    background: rgba(255,255,255,0.82);
    border-color: rgba(125, 152, 15, 0.28);
    color: #5f7606;
}

.page-hero .btn-outline-primary:hover,
.page-hero .btn-outline-primary:focus {
    background: rgba(125, 152, 15, 0.12);
    border-color: rgba(125, 152, 15, 0.48);
    color: #4f6505;
}

.filter-panel,
.section-card,
.table-shell,
.erp-dashboard-header,
.erp-tile-panel,
.erp-analytics-panel,
.erp-module,
.erp-kpi-card,
.erp-app-tile,
.erp-analytics-card,
.erp-queue-card,
.erp-inline-task-list,
.summary-stack-item,
.erp-signal-item,
.soft-panel,
.surface-panel,
.portal-summary-card,
.premium-stat-card,
.mini-overview-card,
.executive-card,
.action-chip {
    box-shadow: var(--app-shadow-sm);
}

.table-shell,
.filter-panel,
.section-card,
.erp-dashboard-header,
.erp-tile-panel,
.erp-analytics-panel,
.executive-card,
.surface-panel,
.soft-panel {
    background: linear-gradient(180deg, #ffffff 0%, #fcfdf9 100%);
}

.erp-dashboard-title {
    color: #1a2d33;
}

.erp-dashboard-fx {
    background: rgba(18, 55, 68, 0.06);
    color: #36515a;
}

.erp-dashboard-kicker {
    background: rgba(125, 152, 15, 0.10);
    color: #667c12;
}

.erp-module-header,
.filter-panel-header,
.table-shell-header,
.surface-panel-header,
.executive-card-header {
    background: linear-gradient(180deg, #ffffff 0%, #f9fbf5 100%);
}

.erp-kpi-card,
.portal-summary-card,
.premium-stat-card,
.mini-overview-card,
.summary-stack-item,
.erp-signal-item,
.erp-app-tile,
.erp-analytics-card,
.action-chip {
    background: linear-gradient(180deg, #ffffff 0%, #fafcf7 100%);
}

.table-modern tbody tr:nth-child(even),
.table tbody tr:nth-child(even) {
    background: rgba(251, 252, 248, 0.86);
}

.table-modern.table-hover tbody tr:hover,
.table-hover tbody tr:hover {
    background: rgba(125, 152, 15, 0.05);
}

.footer-app {
    background: rgba(255, 255, 255, 0.95);
}

.app-dropdown-menu {
    background: rgba(255, 255, 255, 0.98);
}

.dropdown-item {
    color: #25353c;
}

.modal-content {
    border: 1px solid rgba(216, 223, 200, 0.95);
    box-shadow: var(--app-shadow-lg);
}

.modal-header {
    background: linear-gradient(180deg, #ffffff 0%, #fafcf7 100%);
    border-bottom: 1px solid var(--app-border);
}

.list-group-item {
    background: rgba(255, 255, 255, 0.94);
    border-color: rgba(223, 229, 214, 0.95);
}

.list-group-item-action:hover,
.list-group-item-action:focus {
    background: #f8fbf3;
}

.app-sidebar-backdrop {
    background: rgba(24, 39, 46, 0.20);
}

body.app-sidebar-open .app-sidebar {
    box-shadow: 0 24px 54px rgba(27, 49, 37, 0.16);
}
    
.btn-outline-secondary {
    border-color: #c8d0be;
    color: #4f5d55;
    background: #fff;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
    background: #eef3e4;
    border-color: #bcc8af;
    color: #25323a;
    transform: translateY(-1px);
}

.btn-group > .btn {
    min-height: 38px;
}

.btn-outline-danger:hover,
.btn-outline-danger:focus,
.btn-danger:hover,
.btn-danger:focus {
    color: #fff;
}

.dropdown-menu {
    padding: 10px;
}

.dropdown-item {
    border-radius: 12px;
    padding: 0.75rem 0.85rem;
    white-space: normal;
    font-weight: 600;
    color: #24323a;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background: #f2f8df;
}

.app-user-pill {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 12px !important;
    background: rgba(18, 55, 68, 0.05);
    border-radius: 999px;
}

.app-user-nav {
    margin-left: auto;
}

.app-user-chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(18, 55, 68, 0.05);
    border-radius: 999px;
    padding: 0.42rem 0.85rem !important;
    border: 1px solid rgba(214, 222, 202, 0.92);
}

.app-user-avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: linear-gradient(135deg, #8da528, #b7ca5b);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.app-user-name-wrap {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

.app-user-name {
    font-size: 13px;
    font-weight: 700;
    color: #203239;
}

.app-user-role-label {
    font-size: 11px;
    color: rgba(32, 50, 57, 0.62);
}

.page-eyebrow {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #6c7a38;
}

.page-title {
    margin: 0;
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: #13232b;
}

.page-subtitle {
    color: var(--app-muted);
    max-width: 760px;
    margin-top: 0.5rem;
}

.page-hero {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 28px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(245, 248, 237, 0.95));
    box-shadow: var(--app-shadow);
    overflow: hidden;
}

.page-hero-compact {
    min-height: 0;
}

.page-hero-content {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    padding: 28px;
}

.page-hero-copy {
    max-width: 720px;
}

.page-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-content: flex-start;
    justify-content: flex-end;
}

.page-section-head {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 16px;
}

.page-section-kicker,
.erp-section-kicker {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #68753c;
}

.section-heading,
.erp-section-title {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #1a2a31;
}

.section-subtitle,
.erp-section-note {
    margin: 0.28rem 0 0;
    color: var(--app-muted);
    font-size: 12px;
    line-height: 1.55;
}

.filter-panel,
.section-card,
.table-shell {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 22px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcf8 100%);
    box-shadow: var(--app-shadow-sm);
    overflow: hidden;
}

.filter-panel-header,
.table-shell-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--app-border);
    background: linear-gradient(180deg, #ffffff 0%, #f7faef 100%);
}

.table-shell-header > * {
    min-width: 0;
}

.filter-panel-dashboard form,
.section-card-body {
    padding: 1rem 1.1rem;
}

.table-shell-title {
    font-size: 1rem;
    font-weight: 800;
    color: #1b2d34;
    min-width: 0;
}

.table-shell-subtitle {
    margin-top: 0.24rem;
    color: var(--app-muted);
    font-size: 12px;
    line-height: 1.5;
    min-width: 0;
}

.table-shell-subtitle.compact {
    max-width: 560px;
}

.dashboard-quick-grid,
.command-center-grid {
    display: grid;
    gap: 16px;
}

.dashboard-quick-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.command-center-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.executive-card {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 22px;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbf3 100%);
    box-shadow: var(--app-shadow-sm);
    overflow: hidden;
}

.executive-card-header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 1rem 1.05rem;
    border-bottom: 1px solid var(--app-border);
}

.executive-card-title {
    font-size: 1rem;
    font-weight: 800;
    color: #1b2d34;
}

.executive-card-note {
    margin-top: 0.22rem;
    color: var(--app-muted);
    font-size: 12px;
    line-height: 1.45;
}

.executive-card-body {
    padding: 1rem 1.05rem;
}

.trend-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 30px;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    background: rgba(18, 55, 68, 0.08);
    color: #123744;
    font-size: 12px;
    font-weight: 700;
}

.kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.kpi-card {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f9fbf5);
    padding: 14px;
    box-shadow: var(--app-shadow-sm);
}

.kpi-card-neutral {
    border-top: 3px solid #7a8a52;
}

.kpi-card-negative {
    border-top: 3px solid #d9534f;
}

.kpi-card-warning {
    border-top: 3px solid #d7a942;
}

.kpi-card-positive {
    border-top: 3px solid #198754;
}

.kpi-title {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--app-muted);
}

.kpi-value {
    margin-top: 0.45rem;
    font-size: 1.45rem;
    font-weight: 800;
    line-height: 1.1;
    color: #182930;
}

.kpi-subtext,
.kpi-footer {
    margin-top: 0.38rem;
    font-size: 12px;
    color: var(--app-muted);
    line-height: 1.45;
}

.kpi-trend {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-top: 0.55rem;
    font-size: 12px;
}

.kpi-trend-label {
    color: var(--app-muted);
}

.kpi-trend-value {
    font-weight: 700;
    color: #123744;
}

.kpi-trend-value.is-danger {
    color: #b02a37;
}

.kpi-trend-value.is-warning {
    color: #8f6b00;
}

.kpi-trend-value.is-positive {
    color: #156f46;
}

.kpi-progress,
.erp-kpi-progress,
.erp-mini-bar {
    width: 100%;
    height: 6px;
    border-radius: 999px;
    background: rgba(18, 55, 68, 0.08);
    overflow: hidden;
}

.kpi-progress-bar,
.erp-kpi-progress span,
.erp-mini-bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #123744, #2f6d7b);
}

.kpi-progress-bar.is-danger,
.erp-kpi-progress.is-danger span,
.erp-mini-bar.is-danger span {
    background: linear-gradient(90deg, #c93c49, #e06470);
}

.kpi-progress-bar.is-warning,
.erp-kpi-progress.is-warning span,
.erp-mini-bar.is-warning span {
    background: linear-gradient(90deg, #d09a28, #f0bf56);
}

.kpi-progress-bar.is-positive,
.erp-kpi-progress.is-success span,
.erp-mini-bar.is-success span {
    background: linear-gradient(90deg, #1d8f5b, #4fbe86);
}

.erp-kpi-progress.is-info span,
.erp-mini-bar.is-info span {
    background: linear-gradient(90deg, #2d7285, #67aab7);
}

.mini-chart,
.summary-stack,
.erp-metric-stack,
.erp-signal-list,
.erp-queue-list {
    display: grid;
    gap: 10px;
}

.mini-chart {
    margin-top: 14px;
}

.mini-chart-row,
.erp-mini-bar-row,
.erp-bank-row,
.erp-metric-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(120px, 1fr) auto;
    gap: 10px;
    align-items: center;
    font-size: 12px;
}

.mini-chart-label,
.erp-metric-row span,
.erp-bank-row span,
.erp-mini-bar-row span:first-child {
    color: var(--app-muted);
}

.mini-chart-track {
    width: 100%;
    height: 6px;
    border-radius: 999px;
    background: rgba(18, 55, 68, 0.08);
    overflow: hidden;
}

.mini-chart-fill {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--app-brand), var(--app-brand-2));
}

.mini-chart-value,
.erp-mini-bar-row strong,
.erp-bank-row strong,
.erp-metric-row strong {
    font-weight: 800;
    color: #1b2f36;
}

.summary-stack-item,
.erp-signal-item {
    display: grid;
    gap: 4px;
    padding: 14px 15px;
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 16px;
    background: #fff;
    box-shadow: var(--app-shadow-sm);
}

.summary-stack-label,
.erp-signal-label,
.erp-queue-label {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--app-muted);
}

.summary-stack-value,
.erp-signal-item strong {
    color: #1d3137;
    font-weight: 800;
    line-height: 1.45;
}

.summary-stack-meta,
.erp-signal-item small,
.erp-queue-note {
    font-size: 12px;
    color: var(--app-muted);
    line-height: 1.45;
}

.workspace-split-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(320px, 0.95fr);
    gap: 16px;
}

.workspace-stack {
    display: grid;
    gap: 16px;
}

.premium-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.premium-stat-card {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 22px;
    padding: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbf2 100%);
    box-shadow: var(--app-shadow-sm);
    min-height: 132px;
}

.premium-stat-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--app-muted);
    font-weight: 800;
}

.premium-stat-value {
    margin-top: 0.5rem;
    font-size: 1.44rem;
    font-weight: 800;
    color: #172831;
    line-height: 1.12;
    letter-spacing: -0.02em;
}

.premium-stat-note {
    margin-top: 0.4rem;
    color: var(--app-muted);
    font-size: 12px;
    line-height: 1.5;
}

.surface-panel {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 24px;
    background: linear-gradient(180deg, #ffffff 0%, #fafcf6 100%);
    box-shadow: var(--app-shadow);
    overflow: hidden;
}

.surface-panel-body {
    padding: 1.15rem;
}

.surface-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--app-border);
    background: linear-gradient(180deg, #ffffff 0%, #f7faef 100%);
}

.surface-panel-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
    color: #1a2d33;
}

.surface-panel-subtitle {
    margin-top: 0.24rem;
    font-size: 12px;
    color: var(--app-muted);
    line-height: 1.5;
}

.summary-kicker {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    padding: 0.28rem 0.72rem;
    border-radius: 999px;
    background: rgba(125, 152, 15, 0.12);
    color: #587100;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.portal-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.portal-summary-card {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 22px;
    padding: 15px 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbf4 100%);
    box-shadow: var(--app-shadow-sm);
    min-height: 138px;
}

.portal-summary-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--app-muted);
    font-weight: 800;
}

.portal-summary-value {
    margin-top: 0.5rem;
    font-size: 1.4rem;
    font-weight: 800;
    color: #172831;
    line-height: 1.12;
}

.portal-summary-note {
    margin-top: 0.45rem;
    font-size: 12px;
    color: var(--app-muted);
    line-height: 1.5;
}

.portal-highlight-list {
    display: grid;
    gap: 10px;
}

.portal-highlight-item {
    display: grid;
    gap: 4px;
    padding: 13px 14px;
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 18px;
    background: #fff;
}

.portal-highlight-title {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--app-muted);
    font-weight: 700;
}

.portal-highlight-value {
    color: #1c2e34;
    font-weight: 800;
    line-height: 1.45;
}

.portal-highlight-meta {
    font-size: 11px;
    color: var(--app-muted);
    line-height: 1.45;
}

.section-link-list {
    display: grid;
    gap: 10px;
}

.section-link-card {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 15px;
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbf4 100%);
    color: inherit;
    box-shadow: var(--app-shadow-sm);
}

.section-link-card:hover,
.section-link-card:focus {
    color: inherit;
    border-color: #c7d39d;
    box-shadow: 0 14px 28px rgba(18, 38, 28, 0.09);
}

.section-link-title {
    font-weight: 800;
    color: #1d3137;
}

.section-link-copy {
    margin-top: 0.25rem;
    font-size: 12px;
    color: var(--app-muted);
    line-height: 1.5;
}

.section-link-meta {
    font-size: 12px;
    color: #587100;
    font-weight: 700;
    white-space: nowrap;
}

.data-pill {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    background: rgba(15, 57, 70, 0.08);
    color: #123744;
    font-size: 12px;
    font-weight: 700;
}

.dashboard-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(320px, 0.9fr);
    gap: 18px;
}

.dashboard-side-stack {
    display: grid;
    gap: 18px;
}

.task-list-card .list-group-item,
.alert-list-card .list-group-item {
    padding: 0.88rem 1rem;
    border-color: #e5ead9;
}

.table-shell-header .btn,
.workspace-actions .btn,
.filter-toolbar-actions .btn {
    min-height: 38px;
}

.dashboard-documents-shell .table-shell-header .btn {
    flex: 0 0 auto;
    align-self: flex-start;
}

.metric-card.is-accent .metric-value {
    color: #10313d;
}

.metric-card.is-warning .metric-value {
    color: #9a6b00;
}

.metric-card.is-success .metric-value {
    color: #156f46;
}

.preview-note {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(255, 193, 7, 0.28);
    border-radius: 18px;
    background: rgba(255, 243, 205, 0.68);
    color: #6d5900;
}

.form-shell-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.8fr);
    gap: 18px;
}

.form-shell-main,
.form-shell-side {
    display: grid;
    gap: 18px;
}

.mini-overview-grid {
    display: grid;
    gap: 12px;
}

.mini-overview-card {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 20px;
    padding: 14px 15px;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbf4 100%);
    box-shadow: var(--app-shadow-sm);
}

.mini-overview-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--app-muted);
    font-weight: 800;
}

.mini-overview-value {
    margin-top: 0.45rem;
    font-size: 1.2rem;
    font-weight: 800;
    color: #172831;
    line-height: 1.2;
}

.mini-overview-note {
    margin-top: 0.35rem;
    color: var(--app-muted);
    font-size: 12px;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 0.38rem 0.75rem;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.02em;
    border: 1px solid transparent;
}

.status-pill.is-positive {
    background: rgba(25, 135, 84, 0.12);
    color: #156f46;
    border-color: rgba(25, 135, 84, 0.18);
}

.status-pill.is-warning {
    background: rgba(255, 193, 7, 0.16);
    color: #8f6b00;
    border-color: rgba(255, 193, 7, 0.22);
}

.status-pill.is-danger {
    background: rgba(220, 53, 69, 0.12);
    color: #b02a37;
    border-color: rgba(220, 53, 69, 0.18);
}

.status-pill.is-info {
    background: rgba(13, 202, 240, 0.14);
    color: #0b84a3;
    border-color: rgba(13, 202, 240, 0.18);
}

.status-pill.is-neutral {
    background: rgba(108, 117, 125, 0.10);
    color: #55606a;
    border-color: rgba(108, 117, 125, 0.14);
}

.money-positive {
    color: #156f46;
    font-weight: 800;
}

.money-warning {
    color: #9a6b00;
    font-weight: 800;
}

.money-danger {
    color: #b02a37;
    font-weight: 800;
}

.money-hero {
    font-size: 1.15rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.kpi-grid-3,
.kpi-grid-4,
.kpi-grid-6 {
    display: grid;
    gap: 14px;
}

.kpi-grid-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.kpi-grid-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.kpi-grid-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.action-chip {
    display: grid;
    gap: 0.22rem;
    align-content: start;
    min-height: 92px;
    padding: 0.8rem 0.95rem;
    border-radius: 16px;
    border: 1px solid rgba(216, 223, 200, 0.95);
    background: linear-gradient(180deg, #ffffff, #f8fbf2);
    color: #203138;
    box-shadow: var(--app-shadow-sm);
}

.action-chip span {
    font-weight: 800;
    color: #1d3137;
}

.action-chip small {
    font-size: 11px;
    line-height: 1.45;
    color: var(--app-muted);
}

.action-chip:hover,
.action-chip:focus {
    color: #203138;
    border-color: #c7d39d;
    box-shadow: 0 14px 28px rgba(18, 38, 28, 0.09);
}

.table-stat {
    font-size: 12px;
    color: var(--app-muted);
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0.32rem 0.72rem;
    border-radius: 999px;
    background: rgba(18, 55, 68, 0.06);
    border: 1px solid rgba(216, 223, 200, 0.95);
    font-weight: 700;
}

.portal-photo-thumb {
    aspect-ratio: 1 / 1;
    object-fit: cover;
    width: 100%;
    border-radius: 14px;
}

.portal-photo-trigger {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 18px;
    padding: 10px;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbf3 100%);
    box-shadow: var(--app-shadow-sm);
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.portal-photo-trigger:hover,
.portal-photo-trigger:focus {
    transform: translateY(-1px);
    border-color: var(--app-border-strong);
    box-shadow: 0 14px 30px rgba(18, 38, 28, 0.10);
}

.portal-safe-wrap {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.portal-customer-table td,
.portal-customer-table th {
    vertical-align: middle;
}

.portal-inline-metric {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 180px;
}

.portal-inline-metric + .portal-inline-metric {
    margin-top: 4px;
}

.portal-customer-table .cell-meta,
.portal-customer-table .table-note {
    overflow-wrap: anywhere;
}

.page-hero-actions .btn,
.section-link-card,
.portal-photo-trigger {
    max-width: 100%;
}

.trace-panel {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 18px;
    padding: 12px;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbf4 100%);
    height: 100%;
}

.trace-pre {
    margin: 0;
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 280px;
    overflow: auto;
    color: #415159;
}

.table-note {
    max-width: 260px;
    white-space: normal;
    line-height: 1.45;
}

.flow-breakdown {
    display: grid;
    gap: 10px;
}

.flow-breakdown-item {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 16px;
    padding: 10px 12px;
    background: #fff;
}

.sort-link,
.sort-button {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: inherit;
    background: transparent;
    border: none;
    padding: 0;
    font-weight: 700;
    text-decoration: none;
}

.sort-button {
    width: 100%;
    justify-content: flex-start;
    cursor: pointer;
}

.sort-link:hover,
.sort-button:hover {
    color: var(--app-brand-dark);
}

.sort-indicator {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1rem;
    font-size: 0.9rem;
    color: #88907f;
}

.sort-indicator.active {
    color: var(--app-brand-dark);
}

.table-readable td,
.table-readable th {
    padding-top: 0.74rem;
    padding-bottom: 0.74rem;
}

.cell-stack {
    display: flex;
    flex-direction: column;
    gap: 0.18rem;
}

.cell-meta {
    font-size: 12px;
    color: var(--app-muted);
    line-height: 1.35;
}

.job-photo-strip {
    display: flex;
    gap: 8px;
}

.job-photo-thumb {
    width: 52px;
    height: 52px;
    object-fit: cover;
    border-radius: 12px;
    border: 1px solid rgba(216, 223, 200, 0.95);
    box-shadow: var(--app-shadow-sm);
}

.bg-soft-primary {
    background: rgba(13, 110, 253, 0.12);
    color: #0d6efd;
}

.bg-soft-success {
    background: rgba(25, 135, 84, 0.12);
    color: #198754;
}

.bg-soft-danger {
    background: rgba(220, 53, 69, 0.12);
    color: #dc3545;
}

.bg-soft-warning {
    background: rgba(255, 193, 7, 0.16);
    color: #8f6b00;
}

.bg-soft-info {
    background: rgba(13, 202, 240, 0.16);
    color: #0b84a3;
}

.bg-soft-secondary {
    background: rgba(108, 117, 125, 0.12);
    color: #55606a;
}

.bg-soft-dark {
    background: rgba(18, 55, 68, 0.12);
    color: #123744;
}

.admin-grid-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.admin-link-card {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    padding: 16px;
    border: 1px solid var(--app-border);
    border-radius: 18px;
    background: linear-gradient(180deg, #fff, #fbfcf7);
    color: inherit;
    transition: transform 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease;
}

.admin-link-card:hover {
    transform: translateY(-1px);
    box-shadow: var(--app-shadow-sm);
    border-color: #c7d39d;
    color: inherit;
}

.admin-link-icon {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    flex: 0 0 auto;
}

.admin-link-title {
    font-weight: 700;
    color: #1e2c32;
    margin-bottom: 4px;
}

.admin-link-text {
    font-size: 12px;
    color: var(--app-muted);
    line-height: 1.45;
}

.role-summary-list {
    display: grid;
    gap: 10px;
}

.role-summary-item,
.admin-check-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px dashed #dce4cf;
}

.role-summary-item:last-child,
.admin-check-item:last-child {
    border-bottom: none;
}

.role-check-card {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 44px;
    cursor: pointer;
    margin-bottom: 0;
}

.role-check-card .form-check-input {
    flex: 0 0 auto;
    margin: 0;
}

.role-check-card .form-check-label {
    overflow-wrap: anywhere;
}

.role-label {
    font-weight: 600;
    color: #213339;
}

.auction-purchase-panel {
    background: linear-gradient(180deg, #ffffff 0%, #fbfcf7 100%);
    border-color: rgba(201, 211, 190, 0.95);
}

.auction-purchase-note {
    margin: -4px 0 14px;
    color: var(--app-muted);
    font-size: 12px;
    line-height: 1.45;
}

.auction-amount-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.auction-amount-grid > [class*="col-"] {
    width: 100%;
}

@media (max-width: 767.98px) {
    .auction-amount-grid {
        grid-template-columns: 1fr;
    }
}

.erp-status-link {
    color: inherit;
    cursor: pointer;
    text-decoration: none;
}

.erp-status-link:hover {
    color: inherit;
    text-decoration: none;
    transform: translateY(-2px);
}

.erp-status-link.is-active {
    border-color: rgba(37, 99, 235, 0.42) !important;
    box-shadow: 0 14px 28px rgba(37, 99, 235, 0.14) !important;
}

.job-quick-status-form {
    min-width: 154px;
}

.job-quick-status-form .form-select {
    font-size: 12px;
    min-height: 30px;
    padding-bottom: 0.25rem;
    padding-top: 0.25rem;
}

.job-position-action-col {
    min-width: 600px;
}

.job-position-row-form {
    min-width: 590px;
}

.job-position-action-grid {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: 160px 150px 180px 80px;
}

.job-position-action-grid .form-select,
.job-position-action-grid .form-control,
.job-position-action-grid .btn {
    min-height: 32px;
}

.job-position-update-btn {
    white-space: nowrap;
}

@media (max-width: 767.98px) {
    .job-position-action-col,
    .job-position-row-form {
        min-width: 360px;
    }

    .job-position-action-grid {
        grid-template-columns: 1fr;
    }
}

.settings-link-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.settings-link-item {
    display: block;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid var(--app-border);
    background: #fafcf6;
    color: #24323a;
    font-weight: 600;
    transition: all 0.12s ease;
}

.settings-link-item:hover {
    background: #f2f8df;
    border-color: #c9d79a;
    color: #18242a;
}

.admin-users-table td,
.admin-users-table th {
    padding-top: 0.95rem;
    padding-bottom: 0.95rem;
}

.page-actions,
.toolbar-actions,
.card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.user-cell-main {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.user-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--app-brand), var(--app-brand-2));
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    box-shadow: 0 8px 18px rgba(125, 152, 15, 0.18);
    flex: 0 0 auto;
}

.erp-dashboard {
    display: grid;
    gap: 18px;
}

.erp-dashboard-header,
.erp-tile-panel,
.erp-analytics-panel {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 22px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcf8 100%);
    box-shadow: var(--app-shadow-sm);
    padding: 16px 18px;
}

.erp-dashboard-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
}

.erp-dashboard-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}

.erp-dashboard-kicker,
.erp-dashboard-fx {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.erp-dashboard-kicker {
    background: rgba(125, 152, 15, 0.12);
    color: #5d7308;
}

.erp-dashboard-fx {
    background: rgba(18, 55, 68, 0.08);
    color: #123744;
}

.erp-dashboard-title {
    margin: 0;
    font-size: 1.85rem;
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.03em;
    color: #162830;
}

.erp-dashboard-subtitle {
    margin: 0.45rem 0 0;
    max-width: 760px;
    color: var(--app-muted);
}

.erp-header-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.erp-kpi-strip,
.erp-summary-grid,
.erp-tile-grid,
.erp-workspace-grid,
.erp-analytics-grid {
    display: grid;
    gap: 16px;
}

.erp-kpi-strip {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.erp-kpi-card {
    min-height: 170px;
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff 0%, #f8faf5 100%);
    box-shadow: var(--app-shadow-sm);
    padding: 14px 15px;
    display: grid;
    align-content: start;
    gap: 8px;
    overflow: hidden;
}

.erp-kpi-label {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--app-muted);
}

.erp-kpi-value {
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.03em;
    color: #162931;
    word-break: break-word;
}

.kpi-value,
.erp-kpi-value,
.kpi-strip-value,
.premium-stat-value,
.erp-queue-value,
.money-hero {
    word-break: break-word;
    overflow-wrap: anywhere;
}

.page-title,
.table-shell-title,
.table-shell-subtitle,
.surface-panel-title,
.surface-panel-subtitle,
.erp-dashboard-title,
.erp-dashboard-subtitle,
.erp-module-title,
.erp-section-title,
.section-link-title,
.portal-highlight-title,
.portal-highlight-value,
.page-subtitle,
.card-title,
.card-header h1,
.card-header h2,
.card-header h3,
.card-header h4,
.card-header h5,
.card-header h6 {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.card,
.page-hero,
.table-shell,
.surface-panel,
.erp-module,
.erp-dashboard-header,
.erp-tile-panel,
.erp-analytics-panel {
    max-width: 100%;
}

.cell-stack,
.table-note,
.trace-pre,
.page-hero-content,
.surface-panel-body,
.erp-module-body {
    min-width: 0;
    overflow-wrap: anywhere;
}

.erp-kpi-meta,
.erp-kpi-foot {
    font-size: 12px;
    color: var(--app-muted);
    line-height: 1.45;
}

.erp-summary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.erp-module {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 22px;
    background: linear-gradient(180deg, #ffffff 0%, #fafcf7 100%);
    box-shadow: var(--app-shadow-sm);
    overflow: hidden;
}

.erp-module-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--app-border);
    background: linear-gradient(180deg, #ffffff 0%, #f6f9ef 100%);
}

.erp-module-kicker {
    width: 28px;
    height: 28px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
    background: rgba(18, 55, 68, 0.08);
    color: #123744;
    font-weight: 800;
}

.erp-module-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
    color: #1a2d33;
}

.erp-module-body {
    padding: 15px 16px 16px;
}

.erp-section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 14px;
}

.erp-tile-grid {
    grid-template-columns: repeat(9, minmax(0, 1fr));
}

.erp-app-tile {
    min-height: 104px;
    display: grid;
    align-content: space-between;
    gap: 10px;
    padding: 14px 12px;
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f7faf2 100%);
    color: #1e3137;
    box-shadow: var(--app-shadow-sm);
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.erp-app-tile strong {
    font-size: 0.92rem;
    line-height: 1.2;
}

.erp-app-tile span {
    font-size: 11px;
    line-height: 1.5;
    color: var(--app-muted);
}

.erp-app-tile:hover,
.erp-app-tile:focus {
    color: #1e3137;
    transform: translateY(-1px);
    border-color: #c7d39d;
    box-shadow: 0 14px 28px rgba(18, 38, 28, 0.09);
}

.erp-workspace-grid {
    grid-template-columns: minmax(0, 1.5fr) minmax(320px, 0.92fr);
}

.erp-workspace-grid > *,
.erp-finance-grid > *,
.table-shell,
.enterprise-grid-wrap,
.app-table-responsive {
    min-width: 0;
}

.erp-dashboard-table {
    table-layout: fixed;
}

.dashboard-documents-table {
    min-width: 820px;
}

.dashboard-documents-table .document-type-text,
.dashboard-documents-table .document-file-name {
    max-width: 100%;
}

.erp-queue-shell {
    display: grid;
    grid-template-rows: auto auto 1fr;
}

.erp-queue-card {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 16px;
    background: #fff;
    box-shadow: var(--app-shadow-sm);
    padding: 12px 13px;
}

.erp-queue-value {
    margin-top: 0.3rem;
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1.1;
    color: #1a2e35;
}

.erp-inline-task-list {
    margin: 0 16px 16px;
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbf5 100%);
    overflow: hidden;
}

.erp-inline-task-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--app-border);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #304149;
}

.erp-inline-task-head a {
    color: #587100;
}

.erp-inline-task-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-top: 1px solid rgba(223, 229, 214, 0.95);
}

.erp-inline-task-item:first-of-type {
    border-top: none;
}

.erp-inline-task-item.is-empty {
    color: var(--app-muted);
}

.erp-finance-grid {
    grid-template-columns: minmax(320px, 0.92fr) minmax(0, 1.5fr);
}

.erp-bank-summary {
    display: grid;
    gap: 0;
    padding: 10px 0;
}

.erp-bank-row {
    padding: 12px 16px;
    border-top: 1px solid rgba(223, 229, 214, 0.95);
}

.erp-bank-row:first-child {
    border-top: none;
}

.erp-bank-row span,
.erp-bank-row strong {
    overflow-wrap: anywhere;
}

.erp-analytics-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.erp-analytics-card {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--app-shadow-sm);
    padding: 14px 15px;
    display: grid;
    gap: 10px;
}

.erp-analytics-card span {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--app-muted);
}

.erp-analytics-card strong {
    font-size: 0.98rem;
    color: #1b2f36;
}

.erp-analytics-card small {
    font-size: 12px;
    color: var(--app-muted);
}

@media (max-width: 1399.98px) {
    .erp-kpi-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .erp-tile-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .erp-analytics-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1199.98px) {
    .app-layout {
        grid-template-columns: 1fr;
    }

    .app-sidebar {
        position: fixed;
        left: 0;
        top: 0;
        bottom: 0;
        width: min(320px, 88vw);
        transform: translateX(-100%);
        transition: transform 0.18s ease;
        box-shadow: var(--app-shadow-xl);
    }

    body.app-sidebar-open .app-sidebar {
        transform: translateX(0);
    }

    body.app-sidebar-open .app-sidebar-backdrop {
        opacity: 1;
        pointer-events: auto;
    }

    body.app-sidebar-collapsed .app-sidebar-brand-copy,
    body.app-sidebar-collapsed .app-sidebar-group-title,
    body.app-sidebar-collapsed .app-sidebar-link span,
    body.app-sidebar-open .app-sidebar-brand-copy,
    body.app-sidebar-open .app-sidebar-group-title,
    body.app-sidebar-open .app-sidebar-link span {
        display: inline;
    }

    .admin-grid-links,
    .settings-link-grid,
    .dashboard-quick-grid,
    .dashboard-section-grid,
    .command-center-grid,
    .dashboard-main-grid,
    .workspace-split-grid,
    .kpi-strip,
    .costing-workflow-grid,
    .costing-split-grid,
    .kpi-grid-4,
    .kpi-grid-6,
    .portal-summary-grid,
    .premium-stat-grid,
    .erp-summary-grid,
    .erp-workspace-grid,
    .erp-finance-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-pill-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sales-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .kpi-grid-3,
    .erp-kpi-strip,
    .erp-tile-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .command-grid,
    .overview-chip-grid,
    .info-grid,
    .hero-stat-grid,
    .form-shell-grid,
    .workspace-stack {
        grid-template-columns: 1fr;
    }

    .page-title {
        font-size: 1.55rem;
    }
}

@media (max-width: 991.98px) {
    .page-hero-content,
    .table-shell-header,
    .toolbar-strip,
    .filter-toolbar,
    .surface-panel-header,
    .erp-dashboard-header,
    .erp-section-head,
    .erp-inline-task-head {
        flex-direction: column;
        align-items: stretch;
    }

    .page-hero-actions,
    .toolbar-actions,
    .filter-toolbar-actions,
    .app-topbar-shortcuts,
    .erp-header-actions {
        width: 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 767.98px) {
    html {
        font-size: 13px;
    }

    .main-wrap {
        padding-top: 18px;
    }

    .table-responsive .table,
    .app-table-responsive .table {
        min-width: 640px;
    }

    .page-hero-content {
        padding: 22px 18px;
    }

    .app-user-name-wrap {
        display: none;
    }

    .navbar .nav-link {
        border-radius: 12px;
    }

    .dashboard-pill-row,
    .dashboard-section-grid,
    .dashboard-quick-grid,
    .command-center-grid,
    .dashboard-main-grid,
    .workspace-split-grid,
    .kpi-strip,
    .admin-grid-links,
    .settings-link-grid,
    .sales-summary-grid,
    .costing-workflow-grid,
    .costing-split-grid,
    .kpi-grid-3,
    .kpi-grid-4,
    .kpi-grid-6,
    .portal-summary-grid,
    .premium-stat-grid,
    .erp-kpi-strip,
    .erp-summary-grid,
    .erp-tile-grid,
    .erp-workspace-grid,
    .erp-finance-grid,
    .erp-analytics-grid {
        grid-template-columns: 1fr;
    }

    .table-shell-header,
    .command-panel-header,
    .workspace-header,
    .filter-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .toolbar-strip {
        align-items: stretch;
    }

    .toolbar-actions {
        width: 100%;
    }

    .app-sticky-savebar,
    .app-sticky-savebar-actions {
        align-items: stretch;
    }

    .btn,
    .form-control,
    .form-select {
        width: 100%;
    }

    .app-topbar-shortcuts {
        gap: 6px;
    }

    .app-topbar-shortcuts .btn {
        flex: 1 1 120px;
    }

    .app-dropdown-menu,
    .app-dropdown-wide {
        min-width: 100%;
        max-width: 100%;
    }

    .app-user-chip {
        width: 100%;
        justify-content: center;
    }

    .app-navbar-collapse {
        padding: 1rem 0 0.25rem;
    }
}
.owner-delete-form {
    min-width: 220px;
    max-width: 280px;
}

.owner-delete-form textarea {
    resize: vertical;
}

.app-navbar .container-fluid {
    gap: 12px;
    min-width: 0;
}

.app-topbar-shortcuts,
.toolbar-actions {
    row-gap: 8px;
}

.app-user-nav,
.app-user-nav .dropdown {
    min-width: 0;
}

.app-user-chip {
    max-width: min(100%, 360px);
    gap: 10px;
    padding-right: 0.9rem !important;
}

.app-user-name-wrap {
    min-width: 0;
}

.app-user-name,
.app-user-role-label,
.dropdown-item {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.dropdown-item {
    white-space: normal;
    line-height: 1.4;
    padding-top: 0.62rem;
    padding-bottom: 0.62rem;
}

.app-account-menu {
    padding-bottom: 8px;
}

.table-shell-header {
    row-gap: 10px;
}

.table-shell-header .toolbar-actions,
.table-shell-header .btn,
.table-shell-header a.btn {
    max-width: 100%;
}

.table-shell .table-responsive,
.card .table-responsive {
    max-width: 100%;
}

.table-modern td,
.table-modern th,
.table td,
.table th {
    overflow-wrap: anywhere;
}

.dashboard-grid-scroll {
    max-width: 100%;
}

.dashboard-grid-scroll .table th,
.dashboard-grid-scroll .table td {
    vertical-align: middle;
}

.owner-delete-form {
    width: min(280px, 100%);
}

@media (max-width: 991.98px) {
    .app-navbar .container-fluid {
        align-items: flex-start;
    }

    .app-user-nav {
        width: 100%;
        justify-content: flex-end;
    }
}

/* Final enterprise polish layer */
.app-body.app-shell {
    background:
        radial-gradient(circle at top left, rgba(125, 152, 15, 0.08), transparent 24%),
        radial-gradient(circle at top right, rgba(18, 55, 68, 0.05), transparent 20%),
        linear-gradient(180deg, #f6f8f2 0%, #eef3ea 100%);
    color: #203038;
}

.app-main {
    background: linear-gradient(180deg, rgba(252, 253, 250, 0.86), rgba(241, 245, 238, 0.92));
    min-width: 0;
}

.app-sidebar {
    padding: 14px 12px 16px;
    background: linear-gradient(180deg, #f7faf4 0%, #edf2e8 100%);
    border-right: 1px solid rgba(208, 218, 200, 0.95);
    box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.75), 12px 0 28px rgba(28, 47, 37, 0.04);
}

.app-sidebar-top {
    position: sticky;
    top: 0;
    z-index: 2;
    margin: -14px -6px 0;
    padding: 14px 12px 16px;
    background: linear-gradient(180deg, rgba(247, 250, 244, 0.98), rgba(247, 250, 244, 0.94));
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(220, 227, 213, 0.82);
}

.app-sidebar-brand {
    gap: 14px;
    padding: 2px 2px 0;
    text-decoration: none;
}

.app-sidebar-brand-mark {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    box-shadow: 0 14px 26px rgba(125, 152, 15, 0.18);
}

.app-sidebar-brand-mark img {
    width: 36px;
    height: 36px;
}

.app-sidebar-brand-title {
    font-size: 1rem;
    letter-spacing: -0.01em;
}

.app-sidebar-brand-subtitle {
    font-size: 10.5px;
    letter-spacing: 0.14em;
}

.app-sidebar-scroll {
    gap: 18px;
    height: calc(100vh - 104px);
    padding: 12px 4px 10px 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(29, 64, 74, 0.22) transparent;
}

.app-sidebar-scroll::-webkit-scrollbar {
    width: 8px;
}

.app-sidebar-scroll::-webkit-scrollbar-thumb {
    background: rgba(29, 64, 74, 0.22);
    border-radius: 999px;
}

.app-sidebar-scroll::-webkit-scrollbar-track {
    background: transparent;
}

.app-sidebar-group {
    gap: 6px;
}

.app-sidebar-group + .app-sidebar-group {
    padding-top: 4px;
}

.app-sidebar-group-title {
    padding: 0 12px;
    margin-bottom: 2px;
    font-size: 10.5px;
    letter-spacing: 0.14em;
    color: rgba(47, 68, 57, 0.58);
}

.app-sidebar-link {
    position: relative;
    min-height: 44px;
    padding: 0 14px;
    border-radius: 15px;
    color: #39505a;
    font-size: 0.93rem;
    line-height: 1.2;
}

.app-sidebar-link i {
    width: 18px;
    font-size: 0.98rem;
    color: #4d6771;
}

.app-sidebar-link:hover,
.app-sidebar-link:focus {
    background: linear-gradient(180deg, rgba(125, 152, 15, 0.10), rgba(255, 255, 255, 0.82));
    box-shadow: inset 0 0 0 1px rgba(205, 215, 190, 0.72);
}

.app-sidebar-link.active {
    color: #16323a;
    background: linear-gradient(135deg, rgba(125, 152, 15, 0.16), rgba(255, 255, 255, 0.92));
    box-shadow:
        inset 0 0 0 1px rgba(189, 203, 166, 0.92),
        0 10px 24px rgba(26, 49, 39, 0.06);
}

.app-sidebar-link.active::before {
    content: "";
    position: absolute;
    left: 8px;
    top: 9px;
    bottom: 9px;
    width: 4px;
    border-radius: 999px;
    background: linear-gradient(180deg, #7e9817 0%, #9ab23b 100%);
}

.app-sidebar-link.active i {
    color: #395d0f;
}

.app-topbar {
    min-height: 74px;
    padding: 8px 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(247, 250, 244, 0.96)) !important;
    box-shadow: 0 12px 28px rgba(21, 40, 31, 0.06);
}

.app-brand-wrap {
    gap: 3px;
}

.app-brand-title {
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: #1e3138;
}

.brand-small {
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(45, 63, 71, 0.58);
}

.app-topbar-shortcuts {
    gap: 10px;
}

.app-topbar-action {
    min-height: 36px;
    padding-left: 14px;
    padding-right: 14px;
    font-size: 0.83rem;
    box-shadow: 0 6px 16px rgba(15, 37, 45, 0.04);
}

.app-user-chip {
    min-height: 46px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(245, 248, 241, 0.94));
    border: 1px solid rgba(214, 222, 202, 0.98);
    box-shadow: 0 10px 24px rgba(21, 40, 31, 0.05);
}

.app-user-avatar {
    width: 40px;
    height: 40px;
    box-shadow: 0 10px 18px rgba(125, 152, 15, 0.14);
}

.app-user-name {
    font-weight: 700;
    color: #22343b;
}

.app-user-role-label {
    margin-top: 2px;
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(56, 73, 80, 0.58);
}

.app-dropdown-menu {
    border-radius: 20px !important;
    border: 1px solid rgba(217, 224, 209, 0.96);
    box-shadow: 0 20px 40px rgba(18, 35, 28, 0.12);
}

.app-account-menu {
    padding: 12px;
}

.dropdown-item {
    border-radius: 14px;
    font-size: 0.93rem;
}

.main-wrap {
    padding-top: 24px;
    padding-bottom: 30px;
}

.app-page-shell {
    gap: 26px;
}

.footer-app {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(245, 248, 242, 0.96));
    font-size: 0.9rem;
}

.card {
    border-color: rgba(216, 223, 205, 0.92);
    box-shadow: 0 14px 28px rgba(22, 39, 30, 0.06);
}

.card-header {
    padding: 1rem 1.2rem;
}

.card-body {
    padding: 1.2rem 1.2rem 1.15rem;
}

.table-shell,
.erp-dashboard-header,
.erp-module,
.erp-kpi-card,
.erp-app-tile,
.erp-analytics-panel,
.erp-tile-panel,
.erp-queue-card {
    box-shadow: 0 14px 28px rgba(22, 39, 30, 0.055);
}

.table-shell,
.erp-module,
.erp-dashboard-header,
.erp-tile-panel,
.erp-analytics-panel {
    border-color: rgba(216, 223, 205, 0.92);
}

.table-shell-header,
.erp-module-header,
.erp-section-head {
    gap: 16px;
}

.table-shell-title,
.erp-module-title,
.erp-section-title {
    letter-spacing: -0.02em;
}

.table-shell-subtitle,
.erp-dashboard-subtitle,
.erp-app-tile span,
.erp-kpi-meta,
.erp-kpi-foot {
    color: #6d7b75;
}

.erp-dashboard {
    gap: 20px;
}

.erp-dashboard-header,
.erp-tile-panel,
.erp-analytics-panel {
    border-radius: 24px;
    padding: 18px 20px;
}

.erp-dashboard-title {
    font-size: 2rem;
}

.erp-dashboard-subtitle {
    max-width: 860px;
    line-height: 1.58;
}

.erp-kpi-strip {
    gap: 18px;
}

.erp-kpi-card {
    min-height: 176px;
    border-radius: 20px;
    padding: 16px 16px 14px;
    gap: 9px;
}

.erp-kpi-label {
    font-size: 10.5px;
    letter-spacing: 0.12em;
}

.erp-kpi-value {
    font-size: clamp(1.42rem, 1.1rem + 0.7vw, 1.92rem);
    line-height: 1.02;
}

.erp-kpi-meta,
.erp-kpi-foot {
    line-height: 1.5;
}

.erp-module {
    border-radius: 24px;
}

.erp-module-header {
    padding: 15px 18px;
}

.erp-module-body {
    padding: 16px 18px 18px;
}

.erp-module-kicker {
    width: 30px;
    height: 30px;
    border-radius: 11px;
}

.status-pill,
.badge {
    font-weight: 700;
    letter-spacing: 0.01em;
}

.erp-signal-item,
.erp-analytics-card,
.erp-inline-task-item,
.erp-bank-row {
    border-radius: 14px;
}

.erp-signal-item {
    padding: 12px 14px;
    transition: background-color 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}

.erp-signal-item:hover,
.erp-signal-item:focus {
    background: linear-gradient(180deg, #ffffff 0%, #f6f9ef 100%);
    transform: translateY(-1px);
}

.erp-tile-grid {
    gap: 14px;
}

.erp-app-tile {
    min-height: 112px;
    border-radius: 18px;
    padding: 15px 14px;
}

.erp-app-tile strong {
    font-size: 0.95rem;
}

.erp-workspace-grid,
.erp-finance-grid,
.erp-analytics-grid,
.erp-summary-grid {
    gap: 18px;
}

.dashboard-grid-scroll {
    border-radius: 18px;
    scrollbar-width: thin;
    scrollbar-color: rgba(29, 64, 74, 0.24) transparent;
}

.dashboard-grid-scroll::-webkit-scrollbar {
    height: 9px;
    width: 9px;
}

.dashboard-grid-scroll::-webkit-scrollbar-thumb {
    background: rgba(29, 64, 74, 0.24);
    border-radius: 999px;
}

.dashboard-grid-scroll::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.03);
}

.erp-dashboard-table th {
    background: #f5f8f1;
}

.table-modern {
    border-radius: 18px;
}

.table-modern th,
.table-modern td {
    padding: 11px 12px;
    line-height: 1.45;
}

.table-modern thead th {
    font-size: 0.76rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #61716b;
    background: #f5f8f1;
}

.table-modern tbody td {
    color: #25363d;
}

.table-actions,
.dashboard-table-actions {
    gap: 6px;
}

.table-action-icon,
.table-actions .btn,
.table-action-btn {
    min-height: 34px;
    border-radius: 11px !important;
    box-shadow: none;
}

.form-label {
    font-weight: 700;
    font-size: 0.9rem;
    letter-spacing: -0.01em;
}

.form-control,
.form-select {
    min-height: 47px;
    border-color: #d3dbca;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcf8 100%);
}

.input-group-text {
    background: #f6f8f2;
    border-color: #d3dbca;
    color: #42555e;
}

.btn {
    min-height: 40px;
    font-size: 0.92rem;
}

.btn-sm {
    min-height: 34px;
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
}

.btn-outline-secondary {
    border-color: rgba(168, 179, 165, 0.9);
    background: linear-gradient(180deg, #ffffff 0%, #fafcf7 100%);
    color: #44575f;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
    background: #f2f6ec;
    border-color: rgba(145, 160, 140, 0.95);
    color: #2e4248;
}

.btn-danger,
.btn-outline-danger {
    box-shadow: none;
}

.btn-danger {
    background: linear-gradient(135deg, #c54242, #db6565);
    border: none;
}

.btn-danger:hover,
.btn-danger:focus {
    box-shadow: 0 12px 22px rgba(197, 66, 66, 0.2);
}

.status-pill.is-danger,
.badge.bg-danger,
.btn-danger,
.btn-outline-danger:hover,
.btn-outline-danger:focus {
    color: #fff !important;
}

.owner-delete-form {
    padding: 12px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255, 250, 250, 0.98), rgba(255, 245, 245, 0.98));
    border: 1px solid rgba(229, 188, 188, 0.92);
}

@media (max-width: 1199.98px) {
    .app-sidebar {
        box-shadow: 16px 0 36px rgba(18, 35, 28, 0.14);
    }

    .erp-kpi-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .app-sidebar-top {
        margin: -14px -6px 0;
    }

    .app-topbar {
        min-height: 68px;
    }

    .erp-dashboard-header,
    .erp-tile-panel,
    .erp-analytics-panel,
    .erp-module-body,
    .erp-module-header,
    .table-shell-header,
    .card-body {
        padding-left: 16px;
        padding-right: 16px;
    }
}

.erp-dashboard-compact {
    gap: 14px;
}

.erp-dashboard-compact .erp-dashboard-header {
    padding-top: 14px;
    padding-bottom: 14px;
}

.erp-dashboard-compact .erp-kpi-strip,
.erp-dashboard-compact .erp-workspace-grid,
.erp-dashboard-compact .erp-finance-grid,
.erp-dashboard-compact .erp-analytics-grid,
.erp-dashboard-compact .erp-summary-grid {
    gap: 14px;
}

.erp-dashboard-compact .erp-kpi-card {
    min-height: 132px;
    padding: 13px 14px;
}

.erp-dashboard-compact .erp-module-header {
    padding-top: 12px;
    padding-bottom: 12px;
}

.erp-dashboard-compact .erp-module-body {
    padding-top: 12px;
    padding-bottom: 14px;
}

.erp-dashboard-compact .erp-signal-item,
.erp-dashboard-compact .erp-inline-task-item,
.erp-dashboard-compact .erp-bank-row {
    padding-top: 10px;
    padding-bottom: 10px;
}

.kpi-strip-compact {
    gap: 10px;
    margin-bottom: 12px;
}

.kpi-strip-compact .kpi-strip-card,
.kpi-strip-compact .ui-compact-card {
    min-height: 98px;
    padding: 13px 14px;
}

.kpi-strip-compact .kpi-strip-card .text-muted,
.kpi-strip-compact .ui-compact-card .text-muted {
    line-height: 1.25;
}

.ui-compact-card {
    border-radius: 16px;
}

.ui-tight-toolbar {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}

.ui-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 128px;
    padding: 22px 16px;
    text-align: center;
    color: #43545c;
}

.ui-empty-title {
    color: #22343b;
    font-weight: 800;
    font-size: 1rem;
}

.ui-empty-text {
    max-width: 560px;
    color: #6a7771;
    line-height: 1.45;
}

.table-empty-row .ui-empty-state {
    margin: 0 auto;
}

.audit-filter-grid .form-label {
    margin-bottom: 0.3rem;
}

.audit-filter-grid .form-control,
.audit-filter-grid .form-select {
    min-height: 40px;
}

@media (min-width: 992px) {
    .audit-filter-grid {
        display: grid;
        grid-template-columns: minmax(210px, 2fr) minmax(132px, 1fr) minmax(132px, 1fr) minmax(138px, 1fr) minmax(150px, 1.15fr) minmax(132px, 0.9fr) minmax(132px, 0.9fr) minmax(92px, 0.7fr) minmax(92px, 0.7fr);
        gap: 0.5rem;
    }

    .audit-filter-grid > [class*="col-"] {
        width: auto;
        max-width: none;
        padding-left: 0;
        padding-right: 0;
    }
}

.job-action-board {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    min-width: min(680px, 100%);
}

.job-action-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    padding: 10px;
    border: 1px solid rgba(211, 219, 202, 0.92);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.7);
}

.job-action-group > span {
    width: 100%;
    color: #61716b;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.job-photo-tile {
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(211, 219, 202, 0.92);
    border-radius: 16px;
    background: #fff;
    text-align: left;
    box-shadow: 0 10px 24px rgba(26, 39, 34, 0.07);
}

.job-photo-tile img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.job-photo-tile span {
    display: block;
    min-height: 42px;
    padding: 10px 12px;
    color: #53645f;
    font-size: 0.88rem;
}

.job-timeline {
    display: grid;
    gap: 12px;
}

.job-timeline-item {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 12px;
}

.job-timeline-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 14px;
    background: #f5f8f1;
    color: #41565c;
    border: 1px solid rgba(211, 219, 202, 0.92);
}

.job-timeline-content {
    padding: 12px 14px;
    border: 1px solid rgba(211, 219, 202, 0.92);
    border-radius: 16px;
    background: #fff;
}

.erp-command-kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
}

.erp-command-kpi-grid .erp-kpi-card {
    min-height: 116px;
    padding: 16px 17px;
    border: 1px solid rgba(211, 219, 202, 0.92);
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcf8 100%);
    box-shadow: 0 12px 30px rgba(26, 39, 34, 0.07);
}

.erp-kpi-card-large {
    min-height: 132px;
}

.erp-kpi-label,
.erp-status-label {
    color: #61716b;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.erp-kpi-value {
    margin-top: 8px;
    color: #22343b;
    font-size: clamp(1.28rem, 1.5vw, 1.78rem);
    font-weight: 900;
    line-height: 1.05;
}

.erp-kpi-meta {
    margin-top: 8px;
    color: #74817b;
    font-size: 0.84rem;
}

.erp-status-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 10px;
}

.erp-status-card-grid-warning {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.erp-status-card {
    min-height: 84px;
    padding: 12px 14px;
    border: 1px solid rgba(211, 219, 202, 0.92);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(26, 39, 34, 0.055);
}

.erp-status-card.is-positive {
    border-color: rgba(41, 132, 76, 0.26);
    background: #f6fbf7;
}

.erp-status-card.is-warning {
    border-color: rgba(204, 143, 35, 0.34);
    background: #fff9ec;
}

.erp-status-card.is-danger {
    border-color: rgba(190, 72, 72, 0.34);
    background: #fff4f4;
}

.erp-status-value,
.erp-status-badge {
    margin-top: 7px;
    color: #22343b;
    font-size: 1.08rem;
    font-weight: 900;
    line-height: 1.18;
}

.erp-command-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.erp-command-card {
    padding: 16px;
    border: 1px solid rgba(211, 219, 202, 0.92);
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcf8 100%);
    box-shadow: 0 12px 30px rgba(26, 39, 34, 0.06);
}

.erp-command-card.table-shell {
    padding: 0;
    overflow: hidden;
}

.erp-command-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.erp-command-title {
    color: #22343b;
    font-size: 1.02rem;
    font-weight: 900;
}

.erp-command-note {
    color: #6a7771;
    font-size: 0.88rem;
}

.erp-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
}

.erp-info-item {
    min-height: 70px;
    padding: 11px 12px;
    border: 1px solid rgba(211, 219, 202, 0.85);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.78);
}

.erp-info-item span {
    display: block;
    color: #6a7771;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.erp-info-item strong {
    display: block;
    margin-top: 6px;
    color: #22343b;
    font-size: 0.98rem;
    line-height: 1.24;
    word-break: break-word;
}

.erp-info-item.is-total {
    border-color: rgba(204, 143, 35, 0.34);
    background: #fff9ec;
}

.erp-photo-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px;
}

.erp-photo-tile img {
    aspect-ratio: 16 / 10;
}

.job-index-photo-strip {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 112px;
}

.job-index-photo-thumb {
    position: relative;
    width: 38px;
    height: 38px;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(211, 219, 202, 0.92);
    border-radius: 9px;
    background: #f5f8f1;
    box-shadow: 0 5px 12px rgba(26, 39, 34, 0.08);
}

.job-index-photo-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.job-index-photo-more {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(18, 31, 36, 0.62);
    color: #fff;
    font-size: 0.78rem;
    font-weight: 900;
}

.job-index-photo-empty {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 76px;
    min-height: 34px;
    padding: 6px 9px;
    border: 1px dashed rgba(122, 137, 129, 0.36);
    border-radius: 10px;
    background: #fbfcf8;
    color: #6a7771;
    font-size: 0.78rem;
    font-weight: 800;
}

.erp-photo-lightbox {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 56px 82px;
    background: rgba(11, 19, 22, 0.86);
}

.erp-photo-lightbox.is-open {
    display: flex;
}

.erp-photo-lightbox-open {
    overflow: hidden;
}

.erp-photo-lightbox-stage {
    display: grid;
    gap: 12px;
    width: min(1120px, 100%);
}

.erp-photo-lightbox-stage img {
    display: block;
    width: 100%;
    max-height: calc(100vh - 170px);
    object-fit: contain;
    border-radius: 16px;
    background: #10191d;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.42);
}

.erp-photo-lightbox-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: #fff;
}

.erp-photo-lightbox-counter {
    font-weight: 900;
}

.erp-photo-lightbox-caption {
    color: rgba(255, 255, 255, 0.78);
    text-align: right;
}

.erp-photo-lightbox-close,
.erp-photo-lightbox-nav {
    position: absolute;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    box-shadow: 0 16px 42px rgba(0, 0, 0, 0.28);
}

.erp-photo-lightbox-close {
    top: 18px;
    right: 22px;
    width: 42px;
    height: 42px;
}

.erp-photo-lightbox-nav {
    top: 50%;
    width: 54px;
    height: 54px;
    transform: translateY(-50%);
    font-size: 1.45rem;
}

.erp-photo-lightbox-prev {
    left: 18px;
}

.erp-photo-lightbox-next {
    right: 18px;
}

.erp-inline-warning {
    padding: 10px 12px;
    border: 1px solid rgba(204, 143, 35, 0.34);
    border-radius: 12px;
    background: #fff9ec;
    color: #74531c;
    font-size: 0.9rem;
    font-weight: 700;
}

.erp-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 180px;
    padding: 26px 18px;
    text-align: center;
    border: 1px dashed rgba(122, 137, 129, 0.38);
    border-radius: 16px;
    background: #fbfcf8;
    color: #43545c;
}

.erp-job-command-header {
    display: grid;
    grid-template-columns: minmax(260px, 0.95fr) minmax(360px, 1.45fr);
    gap: 16px;
    align-items: stretch;
}

.erp-job-identity-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.erp-job-identity-grid span {
    display: block;
    color: #61716b;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.erp-job-identity-grid strong {
    display: block;
    margin-top: 4px;
    color: #22343b;
    line-height: 1.2;
}

.erp-job-status-board {
    display: grid;
    grid-template-columns: repeat(5, minmax(100px, 1fr));
    gap: 10px;
}

.page-hero-compact .erp-job-command-header {
    gap: 12px;
}

.job-details-command-center {
    padding: 14px 18px 13px !important;
    overflow: visible;
}

.job-details-command-center .erp-job-command-header {
    grid-template-columns: minmax(250px, 0.82fr) minmax(420px, 1.18fr);
    align-items: start;
    gap: 12px;
}

.job-details-command-center .page-eyebrow {
    margin-bottom: 4px;
}

.erp-job-identity .page-title {
    max-width: 100%;
    overflow-wrap: anywhere;
    line-height: 1.06;
}

.job-details-command-center .erp-job-identity .page-title {
    margin: 0;
    padding-left: 2px;
    font-size: clamp(1.55rem, 2vw, 2.15rem);
    line-height: 1.08;
}

.erp-job-identity-grid {
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
}

.job-details-command-center .erp-job-identity-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 9px;
}

.job-details-command-center .erp-job-identity-grid span {
    font-size: 0.66rem;
}

.job-details-command-center .erp-job-identity-grid strong {
    margin-top: 2px;
    font-size: 0.88rem;
}

.job-details-command-center .erp-job-status-board {
    grid-template-columns: repeat(5, minmax(86px, 1fr));
    gap: 8px;
}

.erp-job-status-board .erp-status-card {
    min-height: 62px;
    padding: 9px 10px;
    border-radius: 12px;
}

.job-details-command-center .erp-job-status-board .erp-status-card {
    min-height: 54px;
    padding: 7px 9px;
    box-shadow: 0 5px 14px rgba(26, 39, 34, 0.045);
}

.erp-job-status-board .erp-status-label {
    font-size: 0.68rem;
}

.job-details-command-center .erp-job-status-board .erp-status-label {
    font-size: 0.62rem;
    letter-spacing: 0.06em;
}

.erp-job-status-board .erp-status-badge {
    margin-top: 5px;
    font-size: 0.9rem;
    line-height: 1.12;
    word-break: break-word;
}

.job-details-command-center .erp-job-status-board .erp-status-badge {
    margin-top: 4px;
    font-size: 0.78rem;
    line-height: 1.1;
}

.job-command-toolbar {
    display: grid;
    grid-template-columns: minmax(190px, 0.24fr) minmax(0, 1fr);
    align-items: start;
    gap: 10px;
}

.job-compact-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    padding-top: 2px;
}

.page-hero-compact .status-pill {
    min-height: 0;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 0.78rem;
}

.job-details-command-center .status-pill {
    padding: 4px 8px;
    font-size: 0.72rem;
    line-height: 1.1;
}

.page-hero-compact .job-action-board {
    gap: 8px;
    min-width: min(760px, 100%);
}

.job-details-command-center .job-action-board {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    min-width: 0;
}

.page-hero-compact .job-action-group {
    gap: 5px;
    padding: 8px;
    border-radius: 12px;
}

.job-details-command-center .job-action-group {
    align-content: start;
    gap: 4px;
    padding: 7px;
    border-radius: 10px;
}

.page-hero-compact .job-action-group > span {
    font-size: 0.68rem;
}

.job-details-command-center .job-action-group > span {
    font-size: 0.62rem;
    letter-spacing: 0.06em;
}

.page-hero-compact .job-action-group .btn {
    padding: 0.28rem 0.48rem;
    font-size: 0.78rem;
    line-height: 1.18;
}

.job-details-command-center .job-action-group .btn {
    padding: 0.24rem 0.42rem;
    font-size: 0.72rem;
    line-height: 1.12;
    white-space: normal;
}

.job-details-command-center .job-action-group form {
    display: inline-flex;
}

.job-photo-command-card {
    margin-top: 8px;
}

.job-photo-command-card .erp-command-card-header {
    margin-bottom: 10px;
}

.erp-command-card .erp-photo-gallery {
    grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
}

.erp-command-card .erp-photo-tile img {
    aspect-ratio: 4 / 3;
}

.erp-command-card .erp-photo-tile span {
    min-height: 36px;
    padding: 8px 10px;
    font-size: 0.82rem;
}

.erp-command-card .erp-empty-state {
    min-height: 118px;
    padding: 16px 14px;
}

.erp-command-kpi-grid .erp-kpi-card {
    min-height: 96px;
    padding: 12px 13px;
}

.erp-command-kpi-grid .erp-kpi-card-large {
    min-height: 112px;
}

.erp-command-kpi-grid .erp-kpi-value {
    margin-top: 6px;
    font-size: clamp(1.08rem, 1.24vw, 1.46rem);
}

.job-form-section-card {
    padding: 18px;
    margin-bottom: 18px;
    border: 1px solid rgba(211, 219, 202, 0.92);
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcf8 100%);
}

.job-form-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.job-form-section-title {
    color: #22343b;
    font-size: 1rem;
    font-weight: 800;
}

.job-form-section-note {
    color: #6a7771;
    font-size: 0.88rem;
}

@media (max-width: 991.98px) {
    .job-action-board {
        grid-template-columns: 1fr;
    }

    .job-details-command-center .erp-job-command-header,
    .job-command-toolbar {
        grid-template-columns: 1fr;
    }

    .job-details-command-center .job-action-board {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .erp-command-kpi-grid,
    .erp-status-card-grid,
    .erp-command-grid,
    .erp-job-command-header,
    .erp-job-status-board {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .job-details-command-center {
        padding: 13px 14px 12px !important;
    }

    .job-details-command-center .erp-job-identity-grid,
    .job-details-command-center .erp-job-status-board,
    .job-details-command-center .job-action-board {
        grid-template-columns: 1fr;
    }

    .erp-command-kpi-grid,
    .erp-status-card-grid,
    .erp-command-grid,
    .erp-job-command-header,
    .erp-job-status-board {
        grid-template-columns: 1fr;
    }

    .erp-photo-lightbox {
        padding: 58px 16px 28px;
    }

    .erp-photo-lightbox-nav {
        width: 44px;
        height: 44px;
    }

    .erp-photo-lightbox-prev {
        left: 8px;
    }

    .erp-photo-lightbox-next {
        right: 8px;
    }

    .erp-photo-lightbox-caption {
        width: 100%;
        text-align: left;
    }
}

/* Global overflow guard: keep page chrome, filters, KPI cards, and tables inside the viewport. */
*,
*::before,
*::after {
    box-sizing: border-box;
}

.app-main,
.main-wrap,
.app-page-shell,
.page-hero,
.page-hero-content,
.filter-panel,
.filter-toolbar,
.table-shell,
.card,
.card-body,
.erp-command-card,
.erp-command-kpi-grid,
.erp-status-card-grid,
.kpi-grid,
.kpi-grid-3,
.kpi-grid-4,
.portal-summary-grid,
.row {
    max-width: 100%;
    min-width: 0;
}

.main-wrap {
    width: 100%;
    overflow-x: clip;
}

.app-page-shell {
    width: 100%;
    padding-inline: 1px;
}

.page-hero-content,
.table-shell-header,
.filter-toolbar,
.filter-panel,
.card-body,
.erp-command-card,
.erp-kpi-card,
.erp-status-card,
.portal-summary-card,
.metric-card,
.kpi-card {
    min-width: 0;
}

.filter-panel,
.filter-toolbar {
    padding: 16px;
    overflow: visible;
}

.filter-panel > form,
.filter-toolbar > form,
.filter-toolbar-form,
.filter-toolbar .row,
.filter-panel .row,
form.card .row,
.card-body > form,
.card > form {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin-left: 0;
    margin-right: 0;
}

.filter-toolbar-block,
.filter-toolbar-intro,
.filter-toolbar-actions {
    min-width: 0;
    max-width: 100%;
}

.filter-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.filter-toolbar .form-label,
.filter-panel .form-label,
.card .form-label {
    display: block;
    width: 100%;
    padding-left: 1px;
    overflow: visible;
    white-space: normal;
}

.form-control,
.form-select,
.input-group,
.btn {
    max-width: 100%;
}

.card-body {
    overflow-x: visible;
}

.table-shell,
.card {
    overflow: hidden;
}

.table-shell .table-responsive,
.card > .table-responsive,
.card .table-responsive,
.enterprise-grid-wrap,
.app-table-responsive,
.dashboard-grid-scroll {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
}

.table-shell-header {
    flex-wrap: wrap;
}

.table-shell-header > *,
.table-shell-title,
.table-shell-subtitle,
.table-stat {
    min-width: 0;
    max-width: 100%;
}

.erp-command-kpi-grid,
.erp-status-card-grid,
.kpi-grid,
.kpi-grid-3,
.kpi-grid-4,
.portal-summary-grid {
    overflow: visible;
}

.erp-kpi-card,
.erp-status-card,
.portal-summary-card,
.metric-card,
.kpi-card {
    overflow: visible;
}

.erp-kpi-label,
.erp-status-label,
.portal-summary-label,
.metric-label,
.kpi-label,
.text-muted.small {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
}

.erp-kpi-value,
.erp-status-value,
.portal-summary-value,
.metric-value,
.kpi-value {
    max-width: 100%;
    overflow-wrap: anywhere;
}

@media (min-width: 992px) {
    .audit-filter-grid {
        width: 100%;
        padding-inline: 2px;
    }

    .audit-filter-grid > [class*="col-"] {
        min-width: 0;
        padding-left: 4px;
        padding-right: 4px;
    }
}

@media (max-width: 991.98px) {
    .filter-panel,
    .filter-toolbar {
        padding: 14px;
    }
}

@media (max-width: 575.98px) {
    .main-wrap {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .filter-panel,
    .filter-toolbar,
    .card-body {
        padding-left: 12px;
        padding-right: 12px;
    }
}

/* Customer portal vehicle details */
.customer-vehicle-page {
    display: grid;
    gap: 1rem;
    max-width: 100%;
    box-sizing: border-box;
}

.customer-vehicle-page *,
.customer-vehicle-page *::before,
.customer-vehicle-page *::after {
    box-sizing: border-box;
}

.cv-hero,
.cv-section,
.cv-kpi-card {
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 16px 38px rgba(35, 48, 35, 0.08);
}

.cv-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.35rem;
}

.cv-hero-main {
    min-width: 0;
}

.cv-title {
    margin: 0;
    color: #1c2e34;
    font-size: clamp(1.45rem, 2vw, 2.1rem);
    font-weight: 800;
    line-height: 1.18;
    overflow-wrap: anywhere;
}

.cv-reference {
    margin-top: 0.35rem;
    color: var(--app-muted);
    font-size: 0.95rem;
    overflow-wrap: anywhere;
}

.cv-badge-row,
.cv-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.cv-badge-row {
    margin-top: 0.8rem;
}

.cv-actions {
    justify-content: flex-end;
    flex-shrink: 0;
}

.cv-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    white-space: nowrap;
}

.cv-status-badge,
.cv-count-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    max-width: 100%;
    padding: 0.28rem 0.65rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.15;
    overflow-wrap: anywhere;
    text-align: center;
}

.cv-badge-success {
    color: #14532d;
    background: #dcfce7;
    border: 1px solid #bbf7d0;
}

.cv-badge-warning {
    color: #7c2d12;
    background: #ffedd5;
    border: 1px solid #fed7aa;
}

.cv-badge-info {
    color: #0f3f46;
    background: #ccfbf1;
    border: 1px solid #99f6e4;
}

.cv-badge-muted,
.cv-count-pill {
    color: #334155;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
}

.cv-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
    max-width: 100%;
}

.cv-kpi-card {
    min-width: 0;
    padding: 1rem;
}

.cv-kpi-label {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.cv-kpi-value {
    margin-top: 0.35rem;
    color: #1c2e34;
    font-size: 1.28rem;
    font-weight: 850;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.cv-section-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    max-width: 100%;
}

.cv-section {
    min-width: 0;
    padding: 1.15rem;
}

.cv-section-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.9rem;
}

.cv-section-header h2 {
    margin: 0;
    color: #1c2e34;
    font-size: 1.05rem;
    font-weight: 850;
    line-height: 1.25;
}

.cv-section-header p {
    margin: 0.2rem 0 0;
    color: var(--app-muted);
    font-size: 0.86rem;
    overflow-wrap: anywhere;
}

.cv-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.cv-detail-item {
    min-width: 0;
    padding: 0.72rem 0.8rem;
    border: 1px solid #edf2e7;
    border-radius: 12px;
    background: #fbfcf8;
}

.cv-detail-wide {
    grid-column: 1 / -1;
}

.cv-detail-item span {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
}

.cv-detail-item strong,
.cv-inline-link {
    display: block;
    min-width: 0;
    color: #1c2e34;
    font-size: 0.95rem;
    font-weight: 750;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.cv-inline-link {
    color: #166534;
    text-decoration: none;
}

.cv-inline-link:hover,
.cv-inline-link:focus {
    text-decoration: underline;
}

.cv-timeline {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.8rem;
}

.cv-timeline-item {
    position: relative;
    min-width: 0;
    padding: 0.9rem;
    border: 1px solid #edf2e7;
    border-radius: 14px;
    background: #fbfcf8;
}

.cv-timeline-dot {
    width: 12px;
    height: 12px;
    margin-bottom: 0.55rem;
    border-radius: 999px;
    background: #cbd5e1;
}

.cv-timeline-item.is-complete .cv-timeline-dot {
    background: #16a34a;
}

.cv-timeline-content {
    display: grid;
    gap: 0.65rem;
}

.cv-timeline-content h3 {
    margin: 0;
    color: #1c2e34;
    font-size: 0.95rem;
    font-weight: 800;
}

.cv-timeline-content p {
    margin: 0.25rem 0 0;
    color: var(--app-muted);
    font-size: 0.82rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.cv-photo-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
    max-width: 100%;
}

.cv-photo-card {
    display: grid;
    gap: 0.45rem;
    width: 100%;
    min-width: 0;
    padding: 0.55rem;
    border: 1px solid rgba(216, 223, 200, 0.95);
    border-radius: 14px;
    background: #fff;
    color: inherit;
    text-align: left;
    transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.cv-photo-card:hover,
.cv-photo-card:focus {
    border-color: var(--app-border-strong);
    box-shadow: 0 12px 26px rgba(35, 48, 35, 0.12);
    outline: none;
    transform: translateY(-1px);
}

.cv-photo-card img {
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    object-fit: cover;
}

.cv-photo-card span {
    color: var(--app-muted);
    font-size: 0.82rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.cv-empty-state {
    padding: 1rem;
    border: 1px dashed #d8dfc8;
    border-radius: 12px;
    background: #fbfcf8;
    color: var(--app-muted);
}

.cv-table-wrap {
    max-width: 100%;
    overflow-x: auto;
}

.customer-vehicle-page .table {
    min-width: 680px;
}

@media (max-width: 1200px) {
    .cv-kpi-grid,
    .cv-timeline,
    .cv-photo-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 992px) {
    .cv-hero,
    .cv-section-header {
        flex-direction: column;
    }

    .cv-actions {
        justify-content: flex-start;
    }

    .cv-section-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .cv-hero,
    .cv-section {
        padding: 1rem;
    }

    .cv-kpi-grid,
    .cv-detail-grid,
    .cv-timeline,
    .cv-photo-grid {
        grid-template-columns: 1fr;
    }

    .cv-actions .btn {
        width: 100%;
        justify-content: center;
    }
}

/* Executive KPI dashboard polish */
.erp-kpi-section {
    display: grid;
    gap: 0.85rem;
    margin-bottom: 1.15rem;
    max-width: 100%;
}

.erp-kpi-section-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    max-width: 100%;
}

.erp-kpi-section-title {
    color: #1c2e34;
    font-size: 1.05rem;
    font-weight: 850;
    line-height: 1.2;
}

.erp-kpi-section-subtitle {
    margin-top: 0.18rem;
    color: var(--app-muted);
    font-size: 0.86rem;
    overflow-wrap: anywhere;
}

.erp-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
    max-width: 100%;
}

.erp-kpi-tile {
    position: relative;
    display: grid;
    align-content: space-between;
    gap: 0.55rem;
    min-width: 0;
    min-height: 154px;
    padding: 1rem;
    border: 1px solid #d9e0e7;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 16px 36px rgba(28, 46, 52, 0.08);
    overflow: hidden;
}

.erp-kpi-tile::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: #64748b;
}

.erp-kpi-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    min-width: 0;
}

.erp-kpi-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #f1f5f9;
    color: #334155;
    font-size: 1.05rem;
}

.erp-kpi-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    min-height: 24px;
    padding: 0.18rem 0.5rem;
    border-radius: 999px;
    background: #f8fafc;
    color: #475569;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1.15;
    overflow-wrap: anywhere;
    text-align: center;
}

.erp-kpi-label {
    color: var(--app-muted);
    font-size: 0.74rem;
    font-weight: 850;
    letter-spacing: 0;
    line-height: 1.2;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.erp-kpi-value {
    color: #1c2e34;
    font-size: clamp(1.18rem, 1.6vw, 1.62rem);
    font-weight: 900;
    line-height: 1.12;
    overflow-wrap: anywhere;
}

.erp-kpi-subtext {
    color: var(--app-muted);
    font-size: 0.78rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.erp-kpi-bar {
    height: 5px;
    border-radius: 999px;
    background: #eef2f7;
    overflow: hidden;
}

.erp-kpi-bar span {
    display: block;
    height: 100%;
    max-width: 100%;
    border-radius: inherit;
    background: #64748b;
}

.erp-kpi-finance::before,
.erp-kpi-finance .erp-kpi-bar span {
    background: #2563eb;
}

.erp-kpi-finance .erp-kpi-icon {
    background: #dbeafe;
    color: #1d4ed8;
}

.erp-kpi-operations::before,
.erp-kpi-operations .erp-kpi-bar span {
    background: #0f766e;
}

.erp-kpi-operations .erp-kpi-icon {
    background: #ccfbf1;
    color: #0f766e;
}

.erp-kpi-risk::before,
.erp-kpi-risk .erp-kpi-bar span {
    background: #d97706;
}

.erp-kpi-risk .erp-kpi-icon {
    background: #fef3c7;
    color: #b45309;
}

.erp-kpi-success::before,
.erp-kpi-success .erp-kpi-bar span {
    background: #16a34a;
}

.erp-kpi-success .erp-kpi-icon {
    background: #dcfce7;
    color: #15803d;
}

.erp-kpi-warning::before,
.erp-kpi-warning .erp-kpi-bar span {
    background: #f59e0b;
}

.erp-kpi-warning {
    border-color: #fed7aa;
    background: #fffaf3;
}

.erp-kpi-warning .erp-kpi-icon {
    background: #ffedd5;
    color: #c2410c;
}

.erp-kpi-warning .erp-kpi-value,
.erp-kpi-warning .erp-kpi-badge {
    color: #9a3412;
}

.erp-kpi-danger::before,
.erp-kpi-danger .erp-kpi-bar span {
    background: #dc2626;
}

.erp-kpi-danger {
    border-color: #fecaca;
    background: #fff7f7;
}

.erp-kpi-danger .erp-kpi-icon {
    background: #fee2e2;
    color: #b91c1c;
}

.erp-kpi-danger .erp-kpi-value,
.erp-kpi-danger .erp-kpi-badge {
    color: #991b1b;
}

.erp-dashboard-panels .card,
.erp-dashboard-panels .table-responsive {
    max-width: 100%;
}

.erp-dashboard-panels .table {
    min-width: 520px;
}

@media (max-width: 1200px) {
    .erp-kpi-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 992px) {
    .erp-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .erp-kpi-grid {
        grid-template-columns: 1fr;
    }

    .erp-kpi-tile {
        min-height: 132px;
    }
}
/* Premium dashboard and navigation polish */
.app-layout {
    grid-template-columns: 292px minmax(0, 1fr);
}

.app-sidebar {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 28%),
        linear-gradient(180deg, #12363b 0%, #193f36 48%, #263b2c 100%);
    border-right: 1px solid rgba(227, 215, 178, 0.28);
    box-shadow: 18px 0 42px rgba(17, 42, 37, 0.16);
}

.app-sidebar-top {
    margin: -14px -12px 0;
    padding: 16px 14px 18px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.04)),
        linear-gradient(135deg, rgba(214, 174, 88, 0.22), rgba(125, 152, 15, 0.10));
    border-bottom: 1px solid rgba(227, 215, 178, 0.22);
}

.app-sidebar-brand {
    min-width: 0;
    padding: 8px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.07);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.app-sidebar-brand-mark {
    background: linear-gradient(135deg, #f1cf79 0%, #a6b94b 52%, #547329 100%);
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.20), inset 0 0 0 1px rgba(255, 255, 255, 0.30);
}

.app-sidebar-brand-title {
    color: #fffaf0;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.14);
}

.app-sidebar-brand-subtitle {
    color: rgba(249, 238, 205, 0.78);
}

.app-sidebar-scroll {
    gap: 17px;
    padding: 14px 5px 16px 2px;
    scrollbar-color: rgba(241, 207, 121, 0.42) transparent;
}

.app-sidebar-scroll::-webkit-scrollbar-thumb {
    background: rgba(241, 207, 121, 0.42);
}

.app-sidebar-group + .app-sidebar-group {
    border-top: 1px solid rgba(235, 228, 202, 0.10);
    padding-top: 12px;
}

.app-sidebar-group-title {
    color: rgba(249, 238, 205, 0.58);
    font-size: 10px;
    letter-spacing: 0.16em;
}

.app-sidebar-link {
    min-height: 42px;
    padding: 0 12px;
    color: rgba(250, 249, 240, 0.82);
    border-radius: 13px;
    font-size: 0.91rem;
    font-weight: 650;
    overflow: hidden;
}

.app-sidebar-link i {
    width: 22px;
    min-width: 22px;
    color: rgba(239, 214, 143, 0.78);
}

.app-sidebar-link span {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
}

.app-sidebar-link:hover,
.app-sidebar-link:focus {
    color: #fffdf5;
    background: rgba(255, 255, 255, 0.10);
    box-shadow: inset 0 0 0 1px rgba(241, 207, 121, 0.22);
}

.app-sidebar-link:hover i,
.app-sidebar-link:focus i {
    color: #f4d982;
}

.app-sidebar-link.active {
    color: #fdf9ed;
    background:
        linear-gradient(135deg, rgba(241, 207, 121, 0.25), rgba(125, 152, 15, 0.18)),
        rgba(255, 255, 255, 0.08);
    box-shadow:
        inset 0 0 0 1px rgba(241, 207, 121, 0.36),
        0 12px 26px rgba(0, 0, 0, 0.16);
}

.app-sidebar-link.active::before {
    left: 6px;
    top: 10px;
    bottom: 10px;
    width: 3px;
    background: linear-gradient(180deg, #f1cf79 0%, #a6b94b 100%);
}

.app-sidebar-link.active i {
    color: #f4d982;
}

.app-topbar {
    border-bottom: 1px solid rgba(210, 198, 161, 0.55);
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.96), rgba(252, 249, 238, 0.96)),
        linear-gradient(180deg, #fff, #f7f3e7) !important;
}

.app-sidebar-toggle {
    border-color: rgba(27, 64, 59, 0.20) !important;
    color: #1b403b !important;
    background: rgba(255, 255, 255, 0.72) !important;
}

.app-topbar-action {
    border-color: rgba(125, 152, 15, 0.34) !important;
    color: #31533f !important;
    background: rgba(255, 255, 255, 0.72) !important;
}

.app-topbar-action:hover,
.app-sidebar-toggle:hover {
    background: #f8f1dc !important;
    border-color: rgba(214, 174, 88, 0.62) !important;
}

.app-user-chip {
    border-color: rgba(214, 174, 88, 0.34);
    background: linear-gradient(180deg, #fffdf7, #f7f1df);
}

.erp-dashboard {
    gap: 20px;
}

.erp-dashboard-header {
    position: relative;
    overflow: hidden;
    padding: 24px 26px;
    border: 1px solid rgba(214, 174, 88, 0.34);
    border-radius: 24px;
    background: linear-gradient(135deg, rgba(18, 54, 59, 0.96) 0%, rgba(31, 73, 58, 0.94) 54%, rgba(88, 102, 39, 0.90) 100%);
    box-shadow: 0 24px 54px rgba(22, 51, 45, 0.18);
}

.erp-dashboard-header::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 18% 20%, rgba(241, 207, 121, 0.22), transparent 28%),
        radial-gradient(circle at 88% 10%, rgba(255, 255, 255, 0.16), transparent 22%);
    pointer-events: none;
}

.erp-dashboard-header > * {
    position: relative;
    z-index: 1;
}

.erp-dashboard-kicker {
    background: rgba(255, 255, 255, 0.13);
    color: #f7df99;
    box-shadow: inset 0 0 0 1px rgba(241, 207, 121, 0.22);
}

.erp-dashboard-title {
    color: #fffaf0;
    font-size: clamp(1.75rem, 2.2vw, 2.45rem);
    letter-spacing: 0;
}

.erp-dashboard-subtitle {
    max-width: 860px;
    color: rgba(255, 250, 240, 0.80);
    font-size: 0.98rem;
    line-height: 1.58;
}

.erp-kpi-strip {
    grid-template-columns: repeat(6, minmax(190px, 1fr));
}

.erp-kpi-card {
    position: relative;
    min-height: 152px;
    border-radius: 18px;
    border: 1px solid rgba(216, 202, 160, 0.50);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(251, 248, 238, 0.96));
    box-shadow: 0 16px 34px rgba(35, 54, 42, 0.08);
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.erp-kpi-card:hover {
    transform: translateY(-2px);
    border-color: rgba(214, 174, 88, 0.54);
    box-shadow: 0 22px 44px rgba(35, 54, 42, 0.13);
}

.erp-kpi-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, #7e9817, #f1cf79);
}

.erp-kpi-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.erp-kpi-card-icon {
    width: 38px;
    height: 38px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: #fffaf0;
    background: linear-gradient(135deg, #12363b, #7e9817);
    box-shadow: 0 12px 22px rgba(30, 63, 55, 0.16);
}

.erp-kpi-card-icon i {
    font-size: 1.05rem;
}

.erp-kpi-card-receivable .erp-kpi-card-icon,
.erp-kpi-card-alerts .erp-kpi-card-icon {
    background: linear-gradient(135deg, #7a3330, #c88b3a);
}

.erp-kpi-card-payable .erp-kpi-card-icon {
    background: linear-gradient(135deg, #6d601d, #d6ae58);
}

.erp-kpi-card-received .erp-kpi-card-icon {
    background: linear-gradient(135deg, #1f5b48, #7e9817);
}

.erp-kpi-card-shipping .erp-kpi-card-icon {
    background: linear-gradient(135deg, #224f5a, #6f8f9c);
}

.erp-kpi-label {
    color: rgba(47, 65, 60, 0.68);
}

.erp-kpi-value {
    color: #162f32;
    font-size: clamp(1.25rem, 1.5vw, 1.65rem);
}

.erp-kpi-progress {
    height: 7px;
    border-radius: 999px;
    background: rgba(35, 64, 55, 0.09);
}

.erp-kpi-progress span {
    background: linear-gradient(90deg, #7e9817, #d6ae58);
}

.erp-module,
.table-shell,
.erp-tile-panel,
.erp-analytics-panel {
    border-color: rgba(216, 202, 160, 0.42);
    box-shadow: 0 16px 36px rgba(35, 54, 42, 0.075);
}

.erp-module-header,
.table-shell-header {
    background: linear-gradient(180deg, rgba(255, 253, 247, 0.98), rgba(247, 242, 225, 0.92));
    border-bottom-color: rgba(216, 202, 160, 0.42);
}

.erp-module-kicker {
    background: linear-gradient(135deg, rgba(18, 54, 59, 0.12), rgba(214, 174, 88, 0.22));
    color: #31533f;
}

.status-pill {
    border: 1px solid rgba(255, 255, 255, 0.54);
    box-shadow: 0 8px 18px rgba(35, 54, 42, 0.07);
}

.erp-signal-list {
    gap: 10px;
}

.erp-signal-item {
    border: 1px solid rgba(218, 210, 185, 0.54);
    border-radius: 15px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(250, 248, 240, 0.88));
    transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.erp-signal-item:hover {
    transform: translateY(-1px);
    border-color: rgba(214, 174, 88, 0.56);
    box-shadow: 0 12px 24px rgba(35, 54, 42, 0.08);
}

.erp-signal-label {
    color: #486138;
}

.dashboard-grid-scroll {
    max-width: 100%;
    overflow-x: auto;
}

@media (max-width: 1399.98px) {
    .erp-kpi-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .erp-dashboard-header {
        padding: 20px;
    }

    .erp-summary-grid,
    .erp-kpi-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .erp-dashboard-header {
        padding: 18px;
        border-radius: 20px;
    }

    .erp-summary-grid,
    .erp-kpi-strip {
        grid-template-columns: 1fr;
    }

    .erp-kpi-card {
        min-height: 136px;
    }
}

@media (min-width: 1200px) {
    body.app-sidebar-collapsed .app-layout {
        grid-template-columns: 86px minmax(0, 1fr);
    }

    body.app-sidebar-collapsed .app-sidebar {
        padding-left: 10px;
        padding-right: 10px;
    }

    body.app-sidebar-collapsed .app-sidebar-brand {
        justify-content: center;
        padding: 8px 4px;
    }

    body.app-sidebar-collapsed .app-sidebar-link {
        justify-content: center;
        padding: 0;
    }

    body.app-sidebar-collapsed .app-sidebar-link i {
        margin: 0;
    }

    body.app-sidebar-collapsed .app-sidebar-link.active::before {
        left: 5px;
    }
}

/* Premium corporate shared component sweep */
.app-page-shell {
    max-width: 100%;
}

.page-hero,
.surface-panel,
.table-shell,
.card,
.metric-card,
.info-card,
.mini-overview-card,
.portal-summary-card,
.erp-app-tile,
.erp-analytics-card,
.erp-queue-card {
    border-color: rgba(216, 202, 160, 0.46) !important;
    box-shadow: 0 16px 34px rgba(35, 54, 42, 0.07);
}

.page-hero {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(250, 246, 232, 0.94)),
        linear-gradient(90deg, rgba(18, 54, 59, 0.05), rgba(214, 174, 88, 0.08));
}

.page-eyebrow,
.erp-section-kicker,
.table-shell-subtitle,
.section-subtitle,
.toolbar-note {
    letter-spacing: 0.04em;
}

.btn-primary,
.btn-success {
    border-color: rgba(18, 54, 59, 0.18) !important;
    background: linear-gradient(135deg, #163f3e, #6f8821) !important;
    box-shadow: 0 10px 22px rgba(28, 62, 49, 0.14);
}

.btn-primary:hover,
.btn-success:hover {
    background: linear-gradient(135deg, #12363b, #7e9817) !important;
    box-shadow: 0 14px 28px rgba(28, 62, 49, 0.18);
}

.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-dark,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-danger {
    border-color: rgba(125, 152, 15, 0.30);
    color: #26483f;
    background: rgba(255, 255, 255, 0.62);
}

.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline-dark:hover,
.btn-outline-success:hover,
.btn-outline-warning:hover,
.btn-outline-danger:hover {
    border-color: rgba(214, 174, 88, 0.60);
    background: #f8f1dc;
    color: #173b38;
}

.form-control,
.form-select {
    border-color: rgba(198, 207, 179, 0.92);
    border-radius: 11px;
    background-color: rgba(255, 255, 255, 0.92);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74);
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(125, 152, 15, 0.58);
    box-shadow: 0 0 0 0.2rem rgba(125, 152, 15, 0.14);
}

.table-modern thead th,
.table thead.table-light th {
    background: linear-gradient(180deg, #fbf8ec, #f1ecd8);
    color: #243d3b;
    border-bottom-color: rgba(216, 202, 160, 0.62);
}

.table-modern tbody tr:hover,
.table-hover tbody tr:hover {
    background-color: rgba(249, 244, 226, 0.72);
}

.ui-empty-state {
    border-radius: 16px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.74), rgba(250, 247, 236, 0.76));
}

.app-sidebar-group {
    min-width: 0;
}

.app-sidebar-group-toggle {
    width: 100%;
    min-height: 32px;
    padding: 0 10px;
    border: 0;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: rgba(249, 238, 205, 0.64);
    background: transparent;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.14em;
    text-align: left;
    text-transform: uppercase;
    transition: background 0.16s ease, color 0.16s ease;
}

.app-sidebar-group-toggle:hover,
.app-sidebar-group-toggle:focus {
    color: #fff8df;
    background: rgba(255, 255, 255, 0.08);
    outline: none;
}

.app-sidebar-group-toggle i {
    font-size: 0.78rem;
    color: rgba(241, 207, 121, 0.70);
    transition: transform 0.18s ease;
}

.app-sidebar-group-links {
    display: grid;
    gap: 4px;
    overflow: hidden;
    transition: grid-template-rows 0.18s ease, opacity 0.18s ease;
}

.app-sidebar-group.is-collapsed .app-sidebar-group-links {
    display: none;
}

.app-sidebar-group.is-collapsed .app-sidebar-group-toggle i {
    transform: rotate(-90deg);
}

.app-sidebar-link {
    gap: 10px;
}

.app-sidebar-link span {
    line-height: 1.25;
}

.app-topbar-shortcuts {
    align-items: center;
}

.app-page-header {
    margin-bottom: 18px;
    padding: 18px 22px;
    border: 1px solid rgba(216, 202, 160, 0.48);
    border-radius: 22px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(249, 245, 231, 0.94)),
        linear-gradient(90deg, rgba(18, 54, 59, 0.05), rgba(214, 174, 88, 0.09));
    box-shadow: 0 16px 34px rgba(35, 54, 42, 0.075);
}

.app-page-header h1 {
    margin: 0;
    color: #163b38;
    font-size: clamp(1.4rem, 1.8vw, 2rem);
    font-weight: 850;
    letter-spacing: 0;
}

.app-page-header p {
    max-width: 860px;
    margin: 6px 0 0;
    color: rgba(49, 67, 61, 0.72);
}

.app-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    margin-bottom: 8px;
    color: rgba(72, 97, 56, 0.72);
    font-size: 0.78rem;
    font-weight: 750;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.app-breadcrumb a {
    color: #31533f;
}

.app-breadcrumb a:hover {
    color: #12363b;
}

.app-action-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    white-space: nowrap;
}

.app-action-icon {
    font-size: 0.95em;
    line-height: 1;
}

.app-action-create {
    box-shadow: 0 12px 24px rgba(28, 62, 49, 0.16);
}

.app-action-export {
    border-color: rgba(214, 174, 88, 0.50) !important;
}

.app-action-back {
    border-color: rgba(49, 83, 63, 0.24) !important;
}

.app-empty-state-card,
.ui-empty-state {
    display: grid;
    justify-items: center;
    gap: 8px;
    width: min(100%, 520px);
    margin: 0 auto;
    padding: 22px;
    border: 1px dashed rgba(125, 152, 15, 0.34);
    border-radius: 18px;
    color: #4f5d56;
    text-align: center;
}

.ui-empty-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #31533f;
    background: linear-gradient(135deg, rgba(125, 152, 15, 0.16), rgba(214, 174, 88, 0.20));
}

.ui-empty-title {
    color: #173b38;
    font-weight: 850;
}

.ui-empty-text {
    color: rgba(55, 73, 67, 0.70);
    font-size: 0.92rem;
}

.table,
.table-modern {
    --bs-table-striped-bg: rgba(248, 250, 243, 0.94);
    --bs-table-hover-bg: rgba(125, 152, 15, 0.075);
}

.table tbody tr {
    transition: background-color 0.14s ease, box-shadow 0.14s ease;
}

.table tbody tr:hover {
    box-shadow: inset 3px 0 0 rgba(214, 174, 88, 0.68);
}

.table thead th,
.table-modern thead th {
    position: sticky;
    top: 0;
    z-index: 4;
}

form .form-label,
.form-label {
    color: #263f3c;
    font-weight: 750;
}

.form-label.required::after,
.form-label .text-danger,
label.required::after {
    color: #b94a3f;
}

label.required::after,
.form-label.required::after {
    content: " *";
}

.form-section,
fieldset,
.form-card {
    border-color: rgba(216, 202, 160, 0.46);
    border-radius: 18px;
}

.erp-kpi-strip {
    align-items: stretch;
}

.erp-kpi-card {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.erp-kpi-card .erp-kpi-progress {
    margin-top: auto;
}

body.app-sidebar-collapsed .app-sidebar-group-toggle {
    justify-content: center;
    padding: 0;
}

body.app-sidebar-collapsed .app-sidebar-group-toggle span,
body.app-sidebar-collapsed .app-sidebar-group-toggle i,
body.app-sidebar-collapsed .app-sidebar-group-links {
    display: none;
}

@media (max-width: 1500px) and (min-width: 1200px) {
    .app-layout {
        grid-template-columns: 276px minmax(0, 1fr);
    }

    .app-sidebar-link {
        font-size: 0.88rem;
        min-height: 40px;
        padding-left: 11px;
        padding-right: 11px;
    }

    .app-sidebar-group-title {
        padding-left: 11px;
        padding-right: 11px;
    }
}

/* Final premium SaaS transformation layer */
:root {
    --saas-bg: #f5f7fb;
    --saas-surface: rgba(255, 255, 255, 0.88);
    --saas-surface-solid: #ffffff;
    --saas-border: rgba(145, 164, 151, 0.18);
    --saas-border-strong: rgba(125, 152, 15, 0.22);
    --saas-text: #102a2d;
    --saas-muted: #64736f;
    --saas-green-900: #0b2f2f;
    --saas-green-800: #123b38;
    --saas-green-700: #1d5146;
    --saas-olive: #7d980f;
    --saas-gold: #d6ae58;
    --saas-blue: #2f80ed;
    --saas-purple: #7c5cff;
    --saas-red: #dc5f57;
    --saas-shadow-xs: 0 6px 16px rgba(16, 42, 45, 0.06);
    --saas-shadow-sm: 0 12px 30px rgba(16, 42, 45, 0.08);
    --saas-shadow-md: 0 20px 52px rgba(16, 42, 45, 0.11);
    --saas-shadow-lg: 0 28px 72px rgba(16, 42, 45, 0.14);
    --saas-radius: 18px;
    --saas-radius-lg: 26px;
    --saas-radius-xl: 32px;
}

body,
.app-body {
    color: var(--saas-text);
    background:
        linear-gradient(135deg, rgba(125, 152, 15, 0.08), transparent 28%),
        linear-gradient(225deg, rgba(47, 128, 237, 0.06), transparent 30%),
        linear-gradient(180deg, #fbfcff 0%, var(--saas-bg) 48%, #f8faf5 100%);
}

.app-layout {
    grid-template-columns: 272px minmax(0, 1fr);
}

.app-sidebar {
    padding: 14px 10px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02)),
        radial-gradient(circle at top left, rgba(214, 174, 88, 0.18), transparent 34%),
        linear-gradient(180deg, #092d2f 0%, #103c38 48%, #082625 100%);
    border-right: 1px solid rgba(255, 255, 255, 0.10);
    box-shadow: 18px 0 48px rgba(13, 46, 44, 0.16);
}

.app-sidebar-top {
    margin: -6px -4px 0;
    padding: 12px 10px 14px;
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}

.app-sidebar-brand {
    padding: 9px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 18px 34px rgba(0, 0, 0, 0.10);
}

.app-sidebar-brand-mark {
    width: 40px;
    height: 40px;
    border-radius: 16px;
    background: linear-gradient(135deg, #f3cf76, #7d980f 62%, #184a3f);
}

.app-sidebar-brand-title {
    color: #fffef8;
    font-weight: 850;
}

.app-sidebar-brand-subtitle {
    color: rgba(244, 236, 207, 0.70);
}

.app-sidebar-scroll {
    gap: 12px;
    height: calc(100vh - 86px);
    padding: 12px 4px 16px 0;
}

.app-sidebar-group + .app-sidebar-group {
    border-top-color: rgba(255, 255, 255, 0.07);
    padding-top: 10px;
}

.app-sidebar-group-toggle {
    min-height: 30px;
    border-radius: 12px;
    color: rgba(240, 246, 232, 0.58);
    letter-spacing: 0.10em;
}

.app-sidebar-group-toggle:hover,
.app-sidebar-group-toggle:focus {
    background: rgba(255, 255, 255, 0.09);
    backdrop-filter: blur(12px);
}

.app-sidebar-group-links {
    gap: 5px;
}

.app-sidebar-link {
    min-height: 39px;
    padding: 0 11px;
    border-radius: 14px;
    color: rgba(244, 249, 239, 0.80);
    font-size: 0.88rem;
    font-weight: 650;
}

.app-sidebar-link i {
    width: 20px;
    min-width: 20px;
    color: rgba(235, 207, 130, 0.72);
}

.app-sidebar-link:hover,
.app-sidebar-link:focus {
    color: #fffdf4;
    background: rgba(255, 255, 255, 0.11);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.11), 0 12px 24px rgba(0, 0, 0, 0.10);
    backdrop-filter: blur(12px);
}

.app-sidebar-link.active {
    color: #fffef8;
    background:
        linear-gradient(135deg, rgba(214, 174, 88, 0.24), rgba(125, 152, 15, 0.16)),
        rgba(255, 255, 255, 0.12);
    box-shadow:
        inset 0 0 0 1px rgba(241, 207, 121, 0.28),
        0 0 0 1px rgba(241, 207, 121, 0.08),
        0 14px 30px rgba(0, 0, 0, 0.16);
}

.app-sidebar-link.active::before {
    left: 5px;
    top: 9px;
    bottom: 9px;
    width: 3px;
    border-radius: 999px;
    background: linear-gradient(180deg, #ffe29a, #7d980f);
    box-shadow: 0 0 18px rgba(241, 207, 121, 0.62);
}

.app-topbar {
    min-height: 70px;
    border-bottom: 1px solid rgba(145, 164, 151, 0.16);
    background: rgba(255, 255, 255, 0.78) !important;
    box-shadow: 0 16px 40px rgba(16, 42, 45, 0.07);
    backdrop-filter: blur(18px);
}

.app-brand-title {
    color: #0f3534;
}

.brand-small {
    color: rgba(65, 84, 79, 0.62);
}

.app-global-search {
    flex: 1 1 360px;
    max-width: 620px;
    min-height: 42px;
    align-items: center;
    gap: 10px;
    margin-left: 20px !important;
    padding: 0 10px 0 14px;
    border: 1px solid rgba(145, 164, 151, 0.20);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86), 0 10px 24px rgba(16, 42, 45, 0.06);
}

.app-global-search i {
    color: rgba(49, 83, 63, 0.68);
}

.app-global-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    color: #183d3b;
    background: transparent;
    font-size: 0.92rem;
}

.app-search-shortcut {
    flex: 0 0 auto;
    padding: 3px 8px;
    border-radius: 999px;
    color: rgba(49, 83, 63, 0.70);
    background: rgba(125, 152, 15, 0.10);
    font-size: 0.72rem;
    font-weight: 800;
}

.app-topbar-tools {
    flex-wrap: nowrap !important;
}

.app-icon-button {
    position: relative;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(145, 164, 151, 0.20);
    border-radius: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #214842;
    background: rgba(255, 255, 255, 0.74);
    box-shadow: 0 10px 22px rgba(16, 42, 45, 0.06);
    transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

.app-icon-button:hover,
.app-icon-button:focus {
    color: #123b38;
    background: #fffdf7;
    transform: translateY(-1px);
    box-shadow: 0 16px 30px rgba(16, 42, 45, 0.10);
}

.app-icon-dot {
    position: absolute;
    top: 9px;
    right: 10px;
    width: 8px;
    height: 8px;
    border: 2px solid #fff;
    border-radius: 999px;
    background: #dc5f57;
}

.app-user-chip {
    min-height: 42px;
    border: 1px solid rgba(145, 164, 151, 0.20);
    border-radius: 17px !important;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 10px 22px rgba(16, 42, 45, 0.06);
}

.app-user-avatar {
    background: linear-gradient(135deg, #123b38, #7d980f);
}

.main-wrap {
    padding-top: 22px;
}

.app-page-shell {
    gap: 22px;
}

.erp-card,
.erp-form-card,
.erp-section,
.erp-chart-shell,
.card,
.surface-panel,
.table-shell,
.page-hero,
.metric-card,
.info-card,
.mini-overview-card,
.portal-summary-card,
.erp-app-tile,
.erp-analytics-card,
.erp-queue-card,
.premium-stat-card {
    border: 1px solid var(--saas-border) !important;
    border-radius: var(--saas-radius-lg) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.82)),
        linear-gradient(135deg, rgba(125, 152, 15, 0.04), rgba(47, 128, 237, 0.035));
    box-shadow: var(--saas-shadow-sm);
    backdrop-filter: blur(14px);
}

.erp-card:hover,
.erp-section:hover,
.erp-chart-shell:hover,
.card:hover,
.surface-panel:hover,
.table-shell:hover,
.premium-stat-card:hover {
    box-shadow: var(--saas-shadow-md);
}

.card-header,
.table-shell-header,
.erp-module-header,
.surface-panel-header {
    border-bottom: 1px solid rgba(145, 164, 151, 0.14);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(249, 252, 247, 0.70));
}

.erp-page-header,
.app-page-header,
.page-hero,
.erp-dashboard-header {
    border-radius: var(--saas-radius-xl) !important;
    box-shadow: var(--saas-shadow-md);
}

.page-hero,
.app-page-header {
    background:
        radial-gradient(circle at 10% 0%, rgba(214, 174, 88, 0.16), transparent 26%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(246, 250, 244, 0.88));
}

.erp-dashboard-header {
    min-height: 172px;
    padding: 30px;
    background:
        radial-gradient(circle at 12% 18%, rgba(241, 207, 121, 0.24), transparent 30%),
        radial-gradient(circle at 86% 6%, rgba(47, 128, 237, 0.14), transparent 24%),
        linear-gradient(135deg, #0b2f2f 0%, #155247 56%, #778d24 100%);
}

.erp-dashboard-title {
    font-size: clamp(2rem, 3vw, 3.1rem);
    font-weight: 900;
}

.erp-dashboard-subtitle {
    max-width: 940px;
    font-size: 1.02rem;
}

.erp-dashboard-kicker,
.page-eyebrow,
.erp-section-kicker,
.erp-badge,
.badge,
.status-pill,
.data-pill {
    border-radius: 999px;
    font-weight: 800;
    letter-spacing: 0.03em;
}

.erp-kpi,
.erp-stat,
.erp-kpi-card,
.erp-kpi-tile,
.premium-stat-card,
.erp-status-card {
    min-height: 158px;
    border: 1px solid rgba(145, 164, 151, 0.16) !important;
    border-radius: 24px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(249, 251, 247, 0.90)),
        linear-gradient(135deg, rgba(125, 152, 15, 0.06), rgba(214, 174, 88, 0.06));
    box-shadow: var(--saas-shadow-xs);
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.erp-kpi:hover,
.erp-stat:hover,
.erp-kpi-card:hover,
.erp-kpi-tile:hover,
.premium-stat-card:hover,
.erp-status-card:hover {
    transform: translateY(-2px);
    border-color: rgba(125, 152, 15, 0.24) !important;
    box-shadow: var(--saas-shadow-md);
}

.erp-kpi-value,
.premium-stat-value,
.erp-status-value {
    color: #102f30;
    font-size: clamp(1.45rem, 2vw, 2.15rem);
    font-weight: 900;
    letter-spacing: 0;
}

.erp-kpi-label,
.premium-stat-label,
.erp-status-label {
    color: rgba(63, 82, 77, 0.68);
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.erp-kpi-card-icon,
.erp-kpi-icon {
    width: 44px;
    height: 44px;
    border-radius: 16px;
    box-shadow: 0 14px 28px rgba(16, 42, 45, 0.14);
}

.erp-kpi-progress,
.erp-kpi-bar {
    height: 7px;
    border-radius: 999px;
    background: rgba(16, 42, 45, 0.07);
    overflow: hidden;
}

.erp-kpi-progress span,
.erp-kpi-bar span {
    border-radius: inherit;
    background: linear-gradient(90deg, #7d980f, #d6ae58);
}

.erp-table,
.table {
    border-radius: 18px !important;
}

.table-responsive,
.enterprise-grid-wrap,
.app-table-responsive {
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.74);
}

.table thead th,
.table-modern thead th,
.erp-table thead th {
    top: 0;
    color: rgba(27, 57, 56, 0.78);
    background: rgba(248, 251, 247, 0.96);
    box-shadow: inset 0 -1px 0 rgba(145, 164, 151, 0.16);
}

.table td,
.table th {
    padding: 0.86rem 0.95rem;
}

.table tbody tr:nth-child(even) {
    background: rgba(247, 250, 245, 0.62);
}

.table-hover tbody tr:hover,
.table tbody tr:hover {
    background: rgba(232, 240, 218, 0.66);
    transform: translateX(1px);
}

.erp-badge,
.badge,
.status-pill,
.data-pill {
    border: 1px solid rgba(255, 255, 255, 0.48);
    box-shadow: 0 8px 18px rgba(16, 42, 45, 0.06);
}

.erp-form-card,
form.card,
.surface-panel,
fieldset {
    box-shadow: var(--saas-shadow-sm);
}

.form-control,
.form-select,
.input-group-text {
    min-height: 42px;
    border-color: rgba(145, 164, 151, 0.22);
    border-radius: 14px !important;
    background: rgba(255, 255, 255, 0.82);
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(125, 152, 15, 0.44);
    box-shadow: 0 0 0 0.22rem rgba(125, 152, 15, 0.12), 0 10px 22px rgba(16, 42, 45, 0.06);
}

.btn {
    min-height: 39px;
    border-radius: 13px !important;
    font-weight: 750;
    box-shadow: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.btn:hover,
.btn:focus {
    transform: translateY(-1px);
}

.btn-primary,
.btn-success {
    background: linear-gradient(135deg, #123b38, #7d980f) !important;
    box-shadow: 0 14px 28px rgba(18, 59, 56, 0.16);
}

.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-dark,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-danger,
.btn-outline-info {
    background: rgba(255, 255, 255, 0.74);
    border-color: rgba(145, 164, 151, 0.24);
}

.alert {
    border: 0 !important;
    border-radius: 18px !important;
    box-shadow: var(--saas-shadow-xs);
}

.ui-empty-state {
    border-style: dashed;
    border-color: rgba(125, 152, 15, 0.30);
    background:
        radial-gradient(circle at 50% 0%, rgba(214, 174, 88, 0.12), transparent 38%),
        rgba(255, 255, 255, 0.78);
}

@media (max-width: 1199.98px) {
    .app-global-search {
        order: 3;
        flex-basis: 100%;
        max-width: none;
        margin: 10px 0 0 !important;
    }
}

@media (max-width: 767.98px) {
    .app-topbar .container-fluid {
        align-items: flex-start;
    }

    .app-icon-button {
        width: 39px;
        height: 39px;
    }

    .erp-dashboard-header {
        min-height: auto;
        padding: 22px;
    }
}

/* Ultra HD modern SaaS refinement layer */
:root {
    --uhd-bg: #fbfaf6;
    --uhd-bg-soft: #f7f6ef;
    --uhd-card: rgba(255, 255, 255, 0.92);
    --uhd-card-solid: #ffffff;
    --uhd-line: rgba(27, 54, 50, 0.10);
    --uhd-line-strong: rgba(27, 54, 50, 0.16);
    --uhd-text: #102625;
    --uhd-subtle: #6a756f;
    --uhd-sidebar-a: #062828;
    --uhd-sidebar-b: #103f39;
    --uhd-accent: #86a521;
    --uhd-gold: #d8b463;
    --uhd-sky: #3f8cff;
    --uhd-lavender: #8d7bff;
    --uhd-shadow-1: 0 10px 28px rgba(20, 43, 40, 0.06);
    --uhd-shadow-2: 0 22px 58px rgba(20, 43, 40, 0.10);
    --uhd-shadow-3: 0 34px 86px rgba(20, 43, 40, 0.14);
    --uhd-radius-sm: 14px;
    --uhd-radius: 22px;
    --uhd-radius-lg: 30px;
}

html {
    background: var(--uhd-bg);
}

body,
.app-body {
    color: var(--uhd-text);
    background:
        radial-gradient(circle at 18% -8%, rgba(216, 180, 99, 0.16), transparent 26%),
        radial-gradient(circle at 86% 2%, rgba(63, 140, 255, 0.10), transparent 24%),
        linear-gradient(180deg, #fffdf8 0%, var(--uhd-bg) 44%, var(--uhd-bg-soft) 100%);
    font-size: 14.5px;
    letter-spacing: 0;
}

.app-layout {
    grid-template-columns: 258px minmax(0, 1fr);
}

.app-sidebar {
    padding: 12px 9px;
    background:
        radial-gradient(circle at 18% 0%, rgba(216, 180, 99, 0.20), transparent 28%),
        linear-gradient(180deg, var(--uhd-sidebar-a) 0%, var(--uhd-sidebar-b) 54%, #062423 100%);
    border-right: 0;
    box-shadow: 18px 0 48px rgba(9, 44, 42, 0.18);
}

.app-sidebar-top {
    padding: 8px 6px 12px;
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

.app-sidebar-brand {
    gap: 10px;
    padding: 8px;
    border-radius: 19px;
    background: rgba(255, 255, 255, 0.075);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.08),
        0 16px 34px rgba(0, 0, 0, 0.12);
}

.app-sidebar-brand-mark {
    width: 38px;
    height: 38px;
    border-radius: 15px;
}

.app-sidebar-brand-title {
    font-size: 0.94rem;
}

.app-sidebar-brand-subtitle {
    font-size: 10px;
    letter-spacing: 0.10em;
}

.app-sidebar-scroll {
    height: calc(100vh - 78px);
    gap: 10px;
    padding: 10px 3px 16px 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(216, 180, 99, 0.34) transparent;
}

.app-sidebar-scroll::-webkit-scrollbar {
    width: 8px;
}

.app-sidebar-scroll::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background-clip: content-box;
    background-color: rgba(216, 180, 99, 0.36);
}

.app-sidebar-group + .app-sidebar-group {
    padding-top: 8px;
    border-top-color: rgba(255, 255, 255, 0.055);
}

.app-sidebar-group-toggle {
    min-height: 28px;
    padding: 0 10px;
    border-radius: 12px;
    color: rgba(246, 241, 224, 0.56);
    font-size: 9.5px;
    font-weight: 850;
    letter-spacing: 0.12em;
}

.app-sidebar-group-links {
    gap: 3px;
}

.app-sidebar-link {
    min-height: 38px;
    padding: 0 10px;
    border-radius: 15px;
    color: rgba(246, 250, 242, 0.80);
    font-size: 0.875rem;
    font-weight: 650;
}

.app-sidebar-link i {
    width: 20px;
    min-width: 20px;
    color: rgba(236, 213, 151, 0.72);
    font-size: 0.96rem;
}

.app-sidebar-link:hover,
.app-sidebar-link:focus {
    background: rgba(255, 255, 255, 0.105);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.11),
        0 12px 28px rgba(0, 0, 0, 0.14);
}

.app-sidebar-link.active {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.09)),
        linear-gradient(90deg, rgba(216, 180, 99, 0.22), rgba(134, 165, 33, 0.10));
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.16),
        0 0 24px rgba(216, 180, 99, 0.10),
        0 14px 34px rgba(0, 0, 0, 0.17);
}

.app-sidebar-link.active::before {
    left: 4px;
    top: 9px;
    bottom: 9px;
    width: 3px;
    background: linear-gradient(180deg, #ffe5a3, var(--uhd-accent));
    box-shadow: 0 0 16px rgba(255, 229, 163, 0.72);
}

.app-topbar {
    min-height: 68px;
    background: rgba(255, 255, 255, 0.76) !important;
    border-bottom: 1px solid rgba(27, 54, 50, 0.08);
    box-shadow: 0 18px 46px rgba(20, 43, 40, 0.07);
    backdrop-filter: blur(22px) saturate(1.25);
}

.app-brand-wrap {
    padding-right: 0.35rem;
}

.app-brand-title {
    font-size: 1.02rem;
    font-weight: 900;
}

.brand-small {
    font-size: 11px;
}

.app-global-search {
    min-height: 44px;
    max-width: 680px;
    border-color: rgba(27, 54, 50, 0.10);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.68));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.90),
        0 14px 34px rgba(20, 43, 40, 0.065);
}

.app-global-search:focus-within {
    border-color: rgba(134, 165, 33, 0.32);
    box-shadow:
        0 0 0 4px rgba(134, 165, 33, 0.10),
        0 18px 38px rgba(20, 43, 40, 0.09);
}

.app-search-shortcut {
    background: rgba(16, 38, 37, 0.055);
    color: rgba(16, 38, 37, 0.58);
}

.app-icon-button {
    width: 43px;
    height: 43px;
    border-radius: 50%;
    border-color: rgba(27, 54, 50, 0.10);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: var(--uhd-shadow-1);
}

.app-icon-button:hover,
.app-icon-button:focus,
.app-user-chip:hover,
.app-user-chip:focus {
    transform: translateY(-1px);
    box-shadow: var(--uhd-shadow-2);
}

.app-user-chip {
    min-height: 44px;
    border-radius: 999px !important;
    border-color: rgba(27, 54, 50, 0.10);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: var(--uhd-shadow-1);
}

.app-user-name {
    font-weight: 850;
}

.app-user-role-label {
    color: rgba(16, 38, 37, 0.58);
}

.main-wrap {
    padding-top: 24px;
}

.app-page-shell {
    gap: 24px;
}

.card,
.erp-card,
.erp-form-card,
.erp-section,
.erp-chart-shell,
.table-shell,
.surface-panel,
.page-hero,
.metric-card,
.info-card,
.mini-overview-card,
.portal-summary-card,
.erp-app-tile,
.erp-analytics-card,
.erp-queue-card,
.premium-stat-card,
.erp-module,
.erp-tile-panel,
.erp-analytics-panel {
    border: 1px solid var(--uhd-line) !important;
    border-radius: var(--uhd-radius-lg) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.82)),
        radial-gradient(circle at 0% 0%, rgba(216, 180, 99, 0.09), transparent 28%);
    box-shadow: var(--uhd-shadow-1);
    backdrop-filter: blur(16px) saturate(1.15);
}

.card:hover,
.erp-card:hover,
.erp-section:hover,
.erp-chart-shell:hover,
.table-shell:hover,
.surface-panel:hover,
.premium-stat-card:hover,
.erp-module:hover {
    box-shadow: var(--uhd-shadow-2);
}

.card-header,
.table-shell-header,
.erp-module-header,
.surface-panel-header {
    padding: 1rem 1.15rem;
    border-bottom: 1px solid var(--uhd-line);
    background: rgba(255, 255, 255, 0.58);
}

.card-body,
.surface-panel-body,
.erp-module-body {
    padding: 1.15rem;
}

.page-hero,
.erp-dashboard-header,
.app-page-header {
    border-radius: 34px !important;
    border-color: rgba(255, 255, 255, 0.58) !important;
    box-shadow: var(--uhd-shadow-2);
}

.page-hero {
    background:
        radial-gradient(circle at 10% 0%, rgba(216, 180, 99, 0.16), transparent 28%),
        radial-gradient(circle at 90% 0%, rgba(63, 140, 255, 0.08), transparent 24%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(250, 248, 239, 0.84));
}

.erp-dashboard-header {
    min-height: 184px;
    padding: 34px;
    background:
        radial-gradient(circle at 12% 12%, rgba(255, 230, 167, 0.24), transparent 30%),
        radial-gradient(circle at 86% 10%, rgba(141, 123, 255, 0.12), transparent 24%),
        linear-gradient(135deg, #092f2e 0%, #15514a 52%, #879d2c 100%);
}

.erp-dashboard-title,
.page-title,
.app-page-header h1,
h1 {
    color: #102625;
    font-weight: 900;
    letter-spacing: 0;
}

.erp-dashboard-title {
    color: #fffdf5;
    font-size: clamp(2.15rem, 3.4vw, 3.45rem);
}

.page-subtitle,
.erp-dashboard-subtitle,
.table-shell-subtitle,
.section-subtitle,
.text-muted {
    color: rgba(68, 82, 78, 0.68) !important;
}

.erp-dashboard-subtitle {
    color: rgba(255, 253, 245, 0.78) !important;
}

.erp-kpi-strip,
.erp-kpi-grid,
.premium-stat-grid,
.erp-status-card-grid {
    gap: 18px;
}

.erp-kpi-card,
.erp-kpi,
.erp-kpi-tile,
.erp-stat,
.premium-stat-card,
.erp-status-card {
    min-height: 166px;
    border-radius: 28px !important;
    border-color: rgba(27, 54, 50, 0.09) !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(63, 140, 255, 0.08), transparent 28%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(255, 255, 255, 0.84));
    box-shadow: var(--uhd-shadow-1);
}

.erp-kpi-card::before,
.erp-kpi-tile::before {
    height: 3px;
    background: linear-gradient(90deg, var(--uhd-accent), var(--uhd-gold), var(--uhd-sky));
}

.erp-kpi-card:hover,
.erp-kpi:hover,
.erp-kpi-tile:hover,
.erp-stat:hover,
.premium-stat-card:hover,
.erp-status-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--uhd-shadow-2);
}

.erp-kpi-card-top,
.erp-kpi-topline {
    align-items: center;
}

.erp-kpi-card-icon,
.erp-kpi-icon {
    width: 46px;
    height: 46px;
    border-radius: 18px;
    box-shadow: 0 18px 34px rgba(20, 43, 40, 0.16);
}

.erp-kpi-label,
.premium-stat-label,
.erp-status-label {
    color: rgba(61, 76, 71, 0.62);
    font-size: 0.74rem;
    font-weight: 900;
}

.erp-kpi-value,
.premium-stat-value,
.erp-status-value {
    color: #0f2b2b;
    font-size: clamp(1.65rem, 2.45vw, 2.45rem);
    font-weight: 950;
}

.erp-kpi-meta,
.erp-kpi-foot,
.premium-stat-note {
    color: rgba(68, 82, 78, 0.66);
    font-size: 0.82rem;
}

.erp-kpi-meta {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    align-items: center;
    gap: 6px;
    padding: 4px 9px;
    border-radius: 999px;
    background: rgba(134, 165, 33, 0.09);
}

.erp-kpi-progress,
.erp-kpi-bar {
    height: 6px;
    background: rgba(16, 38, 37, 0.055);
}

.erp-module-header,
.table-shell-header {
    gap: 12px;
}

.erp-signal-list {
    gap: 12px;
}

.erp-signal-item,
.erp-inline-task-item,
.erp-bank-row {
    border-color: rgba(27, 54, 50, 0.08);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 8px 18px rgba(20, 43, 40, 0.045);
}

.table-responsive,
.enterprise-grid-wrap,
.app-table-responsive {
    border: 1px solid var(--uhd-line);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.74);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.table {
    border-radius: 24px !important;
    color: #1c302e;
}

.table thead th,
.table-modern thead th,
.erp-table thead th {
    padding-top: 0.95rem;
    padding-bottom: 0.95rem;
    color: rgba(33, 54, 51, 0.70);
    background: rgba(252, 251, 246, 0.96);
    font-size: 0.73rem;
    font-weight: 900;
    letter-spacing: 0.055em;
}

.table td,
.table th {
    border-bottom-color: rgba(27, 54, 50, 0.075);
}

.table td {
    padding-top: 0.92rem;
    padding-bottom: 0.92rem;
}

.table tbody tr:nth-child(even) {
    background: rgba(250, 249, 243, 0.70);
}

.table-hover tbody tr:hover,
.table tbody tr:hover {
    background: rgba(239, 244, 230, 0.78);
    box-shadow: inset 4px 0 0 rgba(216, 180, 99, 0.72);
}

.badge,
.status-pill,
.data-pill,
.erp-badge {
    min-height: 24px;
    padding: 0.34rem 0.62rem;
    border-radius: 999px;
    box-shadow: 0 8px 18px rgba(20, 43, 40, 0.06);
}

.form-label,
form .form-label {
    margin-bottom: 0.42rem;
    color: rgba(32, 53, 50, 0.78);
    font-size: 0.82rem;
    font-weight: 850;
}

.form-control,
.form-select,
.input-group-text {
    min-height: 44px;
    border: 1px solid rgba(27, 54, 50, 0.11);
    border-radius: 15px !important;
    color: #173332;
    background: rgba(255, 255, 255, 0.82);
}

.form-control::placeholder {
    color: rgba(68, 82, 78, 0.48);
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(134, 165, 33, 0.40);
    background: #fff;
    box-shadow:
        0 0 0 4px rgba(134, 165, 33, 0.10),
        0 14px 28px rgba(20, 43, 40, 0.07);
}

.btn {
    border-radius: 15px !important;
    font-weight: 800;
}

.btn-sm {
    min-height: 34px;
    border-radius: 12px !important;
}

.btn-primary,
.btn-success {
    background: linear-gradient(135deg, #103b38, #7f9a20) !important;
    box-shadow: 0 16px 30px rgba(16, 59, 56, 0.16);
}

.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-dark,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-danger,
.btn-outline-info {
    color: #234744;
    background: rgba(255, 255, 255, 0.70);
    border-color: rgba(27, 54, 50, 0.12);
}

.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline-dark:hover,
.btn-outline-success:hover,
.btn-outline-warning:hover,
.btn-outline-danger:hover,
.btn-outline-info:hover {
    color: #102625;
    background: #fffdf7;
    border-color: rgba(216, 180, 99, 0.38);
}

.ui-empty-state,
.app-empty-state-card {
    border-radius: 24px;
    border-color: rgba(134, 165, 33, 0.22);
    background:
        radial-gradient(circle at 50% 0%, rgba(216, 180, 99, 0.12), transparent 34%),
        rgba(255, 255, 255, 0.78);
}

body.app-sidebar-collapsed .app-layout {
    grid-template-columns: 82px minmax(0, 1fr);
}

body.app-sidebar-collapsed .app-sidebar {
    padding-left: 8px;
    padding-right: 8px;
}

@media (max-width: 1500px) and (min-width: 1200px) {
    .app-layout {
        grid-template-columns: 248px minmax(0, 1fr);
    }

    .app-sidebar-link {
        min-height: 37px;
        font-size: 0.84rem;
    }
}

@media (max-width: 1199.98px) {
    .app-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .app-sidebar {
        width: min(86vw, 292px);
    }

    .app-global-search {
        flex-basis: min(100%, 520px);
    }
}

@media (max-width: 575.98px) {
    .app-topbar {
        min-height: 64px;
    }

    .app-brand-title {
        font-size: 0.94rem;
    }

    .brand-small,
    .app-search-shortcut {
        display: none;
    }

    .main-wrap {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .card-body,
    .surface-panel-body,
    .erp-module-body {
        padding: 1rem;
    }
}

/* 3D HD glassmorphism upgrade layer */
:root {
    --glass-bg: rgba(255, 255, 255, 0.66);
    --glass-bg-strong: rgba(255, 255, 255, 0.84);
    --glass-line: rgba(255, 255, 255, 0.58);
    --glass-shadow: 0 22px 55px rgba(24, 44, 42, 0.12);
    --glass-shadow-deep: 0 34px 86px rgba(24, 44, 42, 0.17);
    --glass-inner: inset 0 1px 0 rgba(255, 255, 255, 0.92), inset 0 -1px 0 rgba(21, 50, 46, 0.035);
    --glass-blur: blur(22px) saturate(1.25);
    --depth-green: #0d3835;
    --depth-green-soft: #1f5f53;
    --depth-olive: #91aa2d;
    --depth-gold: #e0bd70;
    --depth-ink: #102725;
}

body,
.app-body {
    background:
        radial-gradient(circle at 18% 2%, rgba(224, 189, 112, 0.18), transparent 28%),
        radial-gradient(circle at 82% 0%, rgba(89, 145, 255, 0.12), transparent 24%),
        radial-gradient(circle at 50% 110%, rgba(145, 170, 45, 0.12), transparent 30%),
        linear-gradient(180deg, #fffdf8 0%, #f7f6ef 48%, #fbfaf6 100%);
}

.app-sidebar {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
        radial-gradient(circle at 18% 0%, rgba(224, 189, 112, 0.24), transparent 30%),
        radial-gradient(circle at 90% 18%, rgba(145, 170, 45, 0.12), transparent 24%),
        linear-gradient(180deg, #062625 0%, #103d38 52%, #052120 100%);
    box-shadow:
        20px 0 55px rgba(6, 38, 37, 0.22),
        inset -1px 0 0 rgba(255, 255, 255, 0.08);
}

.app-sidebar-brand {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.055));
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow:
        0 22px 44px rgba(0, 0, 0, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(18px);
}

.app-sidebar-brand-mark,
.erp-kpi-card-icon,
.erp-kpi-icon,
.ui-empty-icon,
.app-user-avatar {
    box-shadow:
        0 18px 36px rgba(13, 56, 53, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.32),
        inset 0 -8px 18px rgba(0, 0, 0, 0.12);
}

.app-sidebar-group-toggle,
.app-sidebar-link {
    transform: translateZ(0);
}

.app-sidebar-link {
    border: 1px solid transparent;
}

.app-sidebar-link:hover,
.app-sidebar-link:focus {
    border-color: rgba(255, 255, 255, 0.12);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.06));
    box-shadow:
        0 16px 34px rgba(0, 0, 0, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.16);
    transform: translateX(2px);
}

.app-sidebar-link.active {
    border-color: rgba(224, 189, 112, 0.28);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.20), rgba(255, 255, 255, 0.08)),
        linear-gradient(90deg, rgba(224, 189, 112, 0.28), rgba(145, 170, 45, 0.13));
    box-shadow:
        0 0 0 1px rgba(224, 189, 112, 0.10),
        0 0 28px rgba(224, 189, 112, 0.14),
        0 18px 42px rgba(0, 0, 0, 0.20),
        inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.app-sidebar-link.active::before {
    box-shadow:
        0 0 18px rgba(255, 231, 170, 0.78),
        0 0 34px rgba(145, 170, 45, 0.28);
}

.app-topbar {
    background: rgba(255, 255, 255, 0.62) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.72);
    box-shadow:
        0 18px 46px rgba(24, 44, 42, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.82);
    backdrop-filter: var(--glass-blur);
}

.app-global-search,
.app-icon-button,
.app-user-chip,
.app-sidebar-toggle {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.58)) !important;
    border: 1px solid rgba(255, 255, 255, 0.70) !important;
    box-shadow:
        0 16px 34px rgba(24, 44, 42, 0.09),
        var(--glass-inner);
    backdrop-filter: var(--glass-blur);
}

.app-global-search:focus-within,
.app-icon-button:hover,
.app-icon-button:focus,
.app-user-chip:hover,
.app-user-chip:focus,
.app-sidebar-toggle:hover,
.app-sidebar-toggle:focus {
    box-shadow:
        0 24px 48px rgba(24, 44, 42, 0.13),
        0 0 0 4px rgba(145, 170, 45, 0.10),
        var(--glass-inner);
}

.app-icon-button {
    border-radius: 50% !important;
}

.card,
.erp-card,
.erp-form-card,
.erp-section,
.erp-chart-shell,
.table-shell,
.surface-panel,
.page-hero,
.metric-card,
.info-card,
.mini-overview-card,
.portal-summary-card,
.erp-app-tile,
.erp-analytics-card,
.erp-queue-card,
.premium-stat-card,
.erp-module,
.erp-tile-panel,
.erp-analytics-panel {
    border: 1px solid var(--glass-line) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.58)),
        radial-gradient(circle at 0% 0%, rgba(224, 189, 112, 0.12), transparent 30%),
        radial-gradient(circle at 100% 0%, rgba(89, 145, 255, 0.07), transparent 24%);
    box-shadow:
        var(--glass-shadow),
        var(--glass-inner);
    backdrop-filter: var(--glass-blur);
}

.card:hover,
.erp-card:hover,
.erp-section:hover,
.erp-chart-shell:hover,
.table-shell:hover,
.surface-panel:hover,
.premium-stat-card:hover,
.erp-module:hover {
    box-shadow:
        var(--glass-shadow-deep),
        0 0 0 1px rgba(255, 255, 255, 0.34),
        var(--glass-inner);
}

.card-header,
.table-shell-header,
.erp-module-header,
.surface-panel-header {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0.36));
    backdrop-filter: blur(16px);
}

.erp-dashboard-header,
.page-hero,
.app-page-header {
    border: 1px solid rgba(255, 255, 255, 0.42) !important;
    box-shadow:
        0 34px 84px rgba(19, 57, 52, 0.20),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.erp-dashboard-header {
    background:
        radial-gradient(circle at 14% 16%, rgba(255, 231, 170, 0.26), transparent 30%),
        radial-gradient(circle at 84% 8%, rgba(101, 162, 255, 0.14), transparent 24%),
        linear-gradient(135deg, #062d2d 0%, #15544b 52%, #8aa02f 100%);
}

.erp-kpi-card,
.erp-kpi,
.erp-kpi-tile,
.erp-stat,
.premium-stat-card,
.erp-status-card {
    min-height: 174px;
    border: 1px solid rgba(255, 255, 255, 0.70) !important;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.66)),
        radial-gradient(circle at 100% 0%, rgba(89, 145, 255, 0.10), transparent 28%),
        radial-gradient(circle at 0% 0%, rgba(224, 189, 112, 0.12), transparent 30%);
    box-shadow:
        0 22px 52px rgba(24, 44, 42, 0.11),
        var(--glass-inner);
}

.erp-kpi-card:hover,
.erp-kpi:hover,
.erp-kpi-tile:hover,
.erp-stat:hover,
.premium-stat-card:hover,
.erp-status-card:hover {
    transform: translateY(-5px);
    box-shadow:
        0 34px 78px rgba(24, 44, 42, 0.16),
        0 0 0 1px rgba(255, 255, 255, 0.44),
        var(--glass-inner);
}

.erp-kpi-card::before,
.erp-kpi-tile::before {
    height: 4px;
    background: linear-gradient(90deg, #91aa2d, #e0bd70, #66a2ff);
    opacity: 0.92;
}

.erp-kpi-card-icon,
.erp-kpi-icon {
    background: linear-gradient(135deg, var(--depth-green), var(--depth-olive)) !important;
}

.erp-kpi-value,
.premium-stat-value,
.erp-status-value {
    font-size: clamp(1.8rem, 2.7vw, 2.7rem);
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.70);
}

.erp-kpi-meta {
    border: 1px solid rgba(255, 255, 255, 0.62);
    background: linear-gradient(145deg, rgba(145, 170, 45, 0.14), rgba(255, 255, 255, 0.46));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.64);
}

.erp-kpi-progress,
.erp-kpi-bar {
    height: 7px;
    background: rgba(17, 39, 37, 0.065);
    box-shadow: inset 0 1px 3px rgba(17, 39, 37, 0.10);
}

.erp-kpi-progress span,
.erp-kpi-bar span {
    box-shadow: 0 0 16px rgba(145, 170, 45, 0.28);
}

.table-responsive,
.enterprise-grid-wrap,
.app-table-responsive {
    border: 1px solid rgba(255, 255, 255, 0.62);
    background: rgba(255, 255, 255, 0.56);
    box-shadow:
        0 18px 44px rgba(24, 44, 42, 0.08),
        var(--glass-inner);
    backdrop-filter: blur(16px);
}

.table thead th,
.table-modern thead th,
.erp-table thead th {
    background: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(14px);
    box-shadow:
        inset 0 -1px 0 rgba(24, 44, 42, 0.08),
        0 6px 16px rgba(24, 44, 42, 0.04);
}

.table tbody tr {
    transition: transform 0.16s ease, background-color 0.16s ease, box-shadow 0.16s ease;
}

.table-hover tbody tr:hover,
.table tbody tr:hover {
    background: rgba(246, 249, 239, 0.88);
    box-shadow:
        inset 4px 0 0 rgba(224, 189, 112, 0.78),
        0 8px 18px rgba(24, 44, 42, 0.045);
}

.badge,
.status-pill,
.data-pill,
.erp-badge {
    border: 1px solid rgba(255, 255, 255, 0.58);
    background-image: linear-gradient(145deg, rgba(255, 255, 255, 0.24), rgba(255, 255, 255, 0.04));
    box-shadow:
        0 10px 22px rgba(24, 44, 42, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.40);
}

.form-control,
.form-select,
.input-group-text {
    border-color: rgba(255, 255, 255, 0.70);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.90), rgba(255, 255, 255, 0.66));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.88),
        inset 0 -8px 18px rgba(17, 39, 37, 0.025),
        0 10px 24px rgba(24, 44, 42, 0.045);
}

.form-control:focus,
.form-select:focus {
    box-shadow:
        0 0 0 4px rgba(145, 170, 45, 0.13),
        0 18px 38px rgba(24, 44, 42, 0.09),
        inset 0 1px 0 rgba(255, 255, 255, 0.90);
}

.btn {
    box-shadow:
        0 10px 22px rgba(24, 44, 42, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.34);
}

.btn-primary,
.btn-success {
    border-color: rgba(255, 255, 255, 0.24) !important;
    background: linear-gradient(135deg, #0d3835, #2f705e 48%, #91aa2d) !important;
    box-shadow:
        0 18px 38px rgba(13, 56, 53, 0.20),
        inset 0 1px 0 rgba(255, 255, 255, 0.26);
}

.btn:hover,
.btn:focus {
    transform: translateY(-2px);
    box-shadow:
        0 18px 38px rgba(24, 44, 42, 0.11),
        inset 0 1px 0 rgba(255, 255, 255, 0.38);
}

.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-dark,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-danger,
.btn-outline-info {
    border-color: rgba(255, 255, 255, 0.62);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.76), rgba(255, 255, 255, 0.50));
}

.ui-empty-state,
.app-empty-state-card {
    border-color: rgba(255, 255, 255, 0.68);
    background:
        radial-gradient(circle at 50% 0%, rgba(224, 189, 112, 0.14), transparent 34%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.80), rgba(255, 255, 255, 0.58));
    box-shadow: var(--glass-shadow), var(--glass-inner);
}

@media (max-width: 1500px) and (min-width: 1200px) {
    .erp-kpi-value,
    .premium-stat-value,
    .erp-status-value {
        font-size: clamp(1.55rem, 2.1vw, 2.25rem);
    }
}

@media (max-width: 767.98px) {
    .app-global-search {
        min-height: 42px;
    }

    .erp-kpi-card,
    .erp-kpi,
    .erp-kpi-tile,
    .erp-stat,
    .premium-stat-card,
    .erp-status-card {
        min-height: 148px;
    }
}

/* Corporate refinement layer: restrained premium palette and typography */
:root {
    --corp-green: #12372a;
    --corp-green-dark: #0f2f25;
    --corp-olive: #5f6f3a;
    --corp-gold: #c9a227;
    --corp-cream: #f7f5ef;
    --corp-card: #ffffff;
    --corp-text: #17231d;
    --corp-muted: #6b746e;
    --corp-border: #e6e1d6;
    --corp-danger: #b42318;
    --corp-success: #247a4d;
    --corp-warning: #a16207;
    --corp-shadow-sm: 0 8px 18px rgba(23, 35, 29, 0.055);
    --corp-shadow: 0 14px 34px rgba(23, 35, 29, 0.075);
    --corp-shadow-lg: 0 20px 48px rgba(23, 35, 29, 0.095);
    --corp-radius: 18px;
    --corp-radius-lg: 22px;
}

html {
    font-size: 14px;
}

body,
.app-body {
    color: var(--corp-text);
    background:
        radial-gradient(circle at 12% -8%, rgba(201, 162, 39, 0.10), transparent 25%),
        linear-gradient(180deg, #fbfaf6 0%, var(--corp-cream) 100%);
    font-size: 14px;
    line-height: 1.52;
}

.app-layout {
    grid-template-columns: 258px minmax(0, 1fr);
}

.app-sidebar {
    background: linear-gradient(180deg, var(--corp-green-dark) 0%, var(--corp-green) 56%, #0b261d 100%);
    box-shadow: 12px 0 30px rgba(15, 47, 37, 0.16);
}

.app-sidebar-brand {
    border-color: rgba(255, 255, 255, 0.10);
    background: rgba(255, 255, 255, 0.07);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 10px 24px rgba(0, 0, 0, 0.12);
}

.app-sidebar-brand-mark {
    width: 36px;
    height: 36px;
    border-radius: 13px;
    background: linear-gradient(135deg, var(--corp-gold), var(--corp-olive));
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
}

.app-sidebar-brand-mark img {
    width: 30px;
    height: 30px;
}

.app-sidebar-brand-title {
    color: #fffdf8;
    font-size: 0.92rem;
    font-weight: 800;
}

.app-sidebar-brand-subtitle {
    color: rgba(255, 253, 248, 0.62);
    font-size: 9.5px;
}

.app-sidebar-scroll {
    gap: 10px;
    scrollbar-color: rgba(201, 162, 39, 0.28) transparent;
}

.app-sidebar-scroll::-webkit-scrollbar-thumb {
    background-color: rgba(201, 162, 39, 0.30);
}

.app-sidebar-group + .app-sidebar-group {
    border-top-color: rgba(255, 255, 255, 0.06);
}

.app-sidebar-group-toggle {
    min-height: 27px;
    color: rgba(255, 253, 248, 0.54);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.12em;
}

.app-sidebar-group-toggle i {
    color: rgba(201, 162, 39, 0.62);
}

.app-sidebar-link {
    min-height: 37px;
    padding: 0 10px;
    border-radius: 13px;
    color: rgba(255, 253, 248, 0.78);
    font-size: 13px;
    font-weight: 600;
    box-shadow: none;
}

.app-sidebar-link i {
    color: rgba(201, 162, 39, 0.70);
    font-size: 0.92rem;
}

.app-sidebar-link:hover,
.app-sidebar-link:focus {
    color: #fffdf8;
    background: rgba(255, 255, 255, 0.09);
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: none;
    transform: none;
}

.app-sidebar-link.active {
    color: #fffdf8;
    border-color: rgba(201, 162, 39, 0.24);
    background: linear-gradient(90deg, rgba(201, 162, 39, 0.18), rgba(255, 255, 255, 0.08));
    box-shadow: inset 0 0 0 1px rgba(201, 162, 39, 0.10), 0 8px 18px rgba(0, 0, 0, 0.12);
}

.app-sidebar-link.active::before {
    left: 5px;
    top: 10px;
    bottom: 10px;
    width: 3px;
    background: var(--corp-gold);
    box-shadow: none;
}

.app-topbar {
    min-height: 64px;
    border-bottom: 1px solid rgba(230, 225, 214, 0.88);
    background: rgba(255, 255, 255, 0.82) !important;
    box-shadow: var(--corp-shadow-sm);
    backdrop-filter: blur(14px);
}

.app-brand-title {
    color: var(--corp-green-dark);
    font-size: 0.98rem;
}

.brand-small {
    color: var(--corp-muted);
    font-size: 10.5px;
}

.app-global-search {
    min-height: 40px;
    max-width: 560px;
    border-color: var(--corp-border) !important;
    background: rgba(255, 255, 255, 0.78) !important;
    box-shadow: var(--corp-shadow-sm), inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.app-global-search input {
    font-size: 13px;
}

.app-global-search:focus-within {
    border-color: rgba(95, 111, 58, 0.42) !important;
    box-shadow: 0 0 0 3px rgba(95, 111, 58, 0.10), var(--corp-shadow-sm);
}

.app-search-shortcut {
    color: var(--corp-muted);
    background: rgba(95, 111, 58, 0.08);
    font-size: 10px;
}

.app-icon-button,
.app-sidebar-toggle {
    width: 39px;
    height: 39px;
    border-color: var(--corp-border) !important;
    background: rgba(255, 255, 255, 0.80) !important;
    color: var(--corp-green);
    box-shadow: var(--corp-shadow-sm);
}

.app-icon-button:hover,
.app-icon-button:focus,
.app-sidebar-toggle:hover,
.app-sidebar-toggle:focus {
    transform: translateY(-1px);
    box-shadow: var(--corp-shadow);
}

.app-icon-dot {
    background: var(--corp-danger);
}

.app-user-chip {
    min-height: 40px;
    border-color: var(--corp-border) !important;
    background: rgba(255, 255, 255, 0.82) !important;
    box-shadow: var(--corp-shadow-sm);
}

.app-user-avatar {
    background: linear-gradient(135deg, var(--corp-green), var(--corp-olive));
    box-shadow: none;
}

.app-user-name {
    color: var(--corp-text);
    font-size: 13px;
}

.app-user-role-label {
    color: var(--corp-muted);
    font-size: 10.5px;
}

.main-wrap {
    padding-top: 20px;
}

.app-page-shell {
    gap: 20px;
}

.card,
.erp-card,
.erp-form-card,
.erp-section,
.erp-chart-shell,
.table-shell,
.surface-panel,
.page-hero,
.metric-card,
.info-card,
.mini-overview-card,
.portal-summary-card,
.erp-app-tile,
.erp-analytics-card,
.erp-queue-card,
.premium-stat-card,
.erp-module,
.erp-tile-panel,
.erp-analytics-panel {
    border: 1px solid var(--corp-border) !important;
    border-radius: var(--corp-radius-lg) !important;
    background: var(--corp-card);
    box-shadow: var(--corp-shadow);
    backdrop-filter: none;
}

.card:hover,
.erp-card:hover,
.erp-section:hover,
.erp-chart-shell:hover,
.table-shell:hover,
.surface-panel:hover,
.premium-stat-card:hover,
.erp-module:hover {
    box-shadow: var(--corp-shadow-lg);
}

.card-header,
.table-shell-header,
.erp-module-header,
.surface-panel-header {
    border-bottom: 1px solid var(--corp-border);
    background: linear-gradient(180deg, #ffffff, #fbfaf6);
}

.card-body,
.surface-panel-body,
.erp-module-body {
    padding: 1.05rem;
}

.page-hero,
.erp-dashboard-header,
.app-page-header {
    border-radius: 26px !important;
    box-shadow: var(--corp-shadow);
}

.page-hero {
    background: linear-gradient(135deg, #ffffff, #fbfaf6);
}

.erp-dashboard-header {
    min-height: 152px;
    padding: 26px;
    background: linear-gradient(135deg, var(--corp-green-dark) 0%, var(--corp-green) 58%, var(--corp-olive) 100%);
    box-shadow: var(--corp-shadow-lg);
}

.erp-dashboard-title,
.page-title,
.app-page-header h1,
h1 {
    color: var(--corp-text);
    font-size: clamp(1.55rem, 2.1vw, 2rem);
    font-weight: 850;
    letter-spacing: 0;
    text-shadow: none;
}

.erp-dashboard-title {
    color: #fffdf8;
    font-size: clamp(1.75rem, 2.6vw, 2.35rem);
}

.erp-dashboard-subtitle {
    color: rgba(255, 253, 248, 0.78) !important;
    font-size: 0.94rem;
}

.page-subtitle,
.table-shell-subtitle,
.section-subtitle,
.text-muted,
.erp-section-note {
    color: var(--corp-muted) !important;
    font-size: 0.88rem;
}

.erp-dashboard-kicker,
.page-eyebrow,
.erp-section-kicker {
    color: var(--corp-gold);
    font-size: 11px;
    letter-spacing: 0.08em;
}

.erp-kpi-strip,
.erp-kpi-grid,
.premium-stat-grid,
.erp-status-card-grid {
    gap: 14px;
}

.erp-kpi-card,
.erp-kpi,
.erp-kpi-tile,
.erp-stat,
.premium-stat-card,
.erp-status-card {
    min-height: 142px;
    border-radius: 20px !important;
    border-color: var(--corp-border) !important;
    background: #ffffff;
    box-shadow: var(--corp-shadow-sm);
}

.erp-kpi-card:hover,
.erp-kpi:hover,
.erp-kpi-tile:hover,
.erp-stat:hover,
.premium-stat-card:hover,
.erp-status-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--corp-shadow);
}

.erp-kpi-card::before,
.erp-kpi-tile::before {
    height: 3px;
    background: linear-gradient(90deg, var(--corp-olive), var(--corp-gold));
}

.erp-kpi-card-icon,
.erp-kpi-icon {
    width: 38px;
    height: 38px;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--corp-green), var(--corp-olive)) !important;
    box-shadow: var(--corp-shadow-sm);
}

.erp-kpi-card-icon i,
.erp-kpi-icon i {
    font-size: 0.98rem;
}

.erp-kpi-label,
.premium-stat-label,
.erp-status-label {
    color: var(--corp-muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.erp-kpi-value,
.premium-stat-value,
.erp-status-value {
    color: var(--corp-text);
    font-size: clamp(1.6rem, 2.1vw, 2.15rem);
    font-weight: 850;
    text-shadow: none;
}

.erp-kpi-meta,
.erp-kpi-foot,
.premium-stat-note {
    color: var(--corp-muted);
    font-size: 12px;
}

.erp-kpi-meta {
    padding: 3px 8px;
    border: 1px solid rgba(95, 111, 58, 0.14);
    background: rgba(95, 111, 58, 0.07);
    box-shadow: none;
}

.erp-kpi-progress,
.erp-kpi-bar {
    height: 5px;
    background: rgba(23, 35, 29, 0.07);
    box-shadow: none;
}

.erp-kpi-progress span,
.erp-kpi-bar span {
    background: linear-gradient(90deg, var(--corp-olive), var(--corp-gold));
    box-shadow: none;
}

.erp-signal-item,
.erp-inline-task-item,
.erp-bank-row {
    border-color: var(--corp-border);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: none;
}

.table-responsive,
.enterprise-grid-wrap,
.app-table-responsive {
    border: 1px solid var(--corp-border);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: var(--corp-shadow-sm);
    backdrop-filter: none;
}

.table {
    color: var(--corp-text);
    font-size: 13px;
}

.table thead th,
.table-modern thead th,
.erp-table thead th {
    padding-top: 0.72rem;
    padding-bottom: 0.72rem;
    color: var(--corp-muted);
    background: #fbfaf6;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.045em;
    box-shadow: inset 0 -1px 0 var(--corp-border);
    backdrop-filter: none;
}

.table td {
    padding-top: 0.68rem;
    padding-bottom: 0.68rem;
    border-bottom-color: rgba(230, 225, 214, 0.82);
}

.table tbody tr:nth-child(even) {
    background: rgba(247, 245, 239, 0.46);
}

.table-hover tbody tr:hover,
.table tbody tr:hover {
    background: rgba(95, 111, 58, 0.055);
    box-shadow: inset 3px 0 0 rgba(201, 162, 39, 0.55);
    transform: none;
}

.badge,
.status-pill,
.data-pill,
.erp-badge {
    min-height: 22px;
    padding: 0.28rem 0.55rem;
    border: 1px solid rgba(230, 225, 214, 0.80);
    box-shadow: none;
    font-size: 11px;
    font-weight: 750;
}

.bg-success,
.text-bg-success {
    background-color: var(--corp-success) !important;
}

.bg-danger,
.text-bg-danger {
    background-color: var(--corp-danger) !important;
}

.bg-warning,
.text-bg-warning {
    background-color: var(--corp-warning) !important;
}

.form-label,
form .form-label {
    color: var(--corp-text);
    font-size: 13px;
    font-weight: 750;
}

.form-control,
.form-select,
.input-group-text {
    min-height: 40px;
    border: 1px solid var(--corp-border);
    border-radius: 12px !important;
    color: var(--corp-text);
    background: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.80);
    font-size: 14px;
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(95, 111, 58, 0.42);
    box-shadow: 0 0 0 3px rgba(95, 111, 58, 0.12);
}

.btn {
    min-height: 38px;
    border-radius: 12px !important;
    font-size: 13px;
    font-weight: 750;
    box-shadow: none;
}

.btn:hover,
.btn:focus {
    transform: translateY(-1px);
    box-shadow: var(--corp-shadow-sm);
}

.btn-primary,
.btn-success {
    border-color: var(--corp-green) !important;
    background: linear-gradient(135deg, var(--corp-green), var(--corp-olive)) !important;
    box-shadow: var(--corp-shadow-sm);
}

.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-dark,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-danger,
.btn-outline-info {
    color: var(--corp-green);
    border-color: var(--corp-border);
    background: #ffffff;
}

.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline-dark:hover,
.btn-outline-success:hover,
.btn-outline-warning:hover,
.btn-outline-danger:hover,
.btn-outline-info:hover {
    color: var(--corp-green-dark);
    border-color: rgba(201, 162, 39, 0.48);
    background: #fbfaf6;
}

.ui-empty-state,
.app-empty-state-card {
    border-color: var(--corp-border);
    background: #ffffff;
    box-shadow: var(--corp-shadow-sm);
}

.ui-empty-icon {
    width: 38px;
    height: 38px;
    border-radius: 13px;
    color: var(--corp-green);
    background: rgba(95, 111, 58, 0.10);
    box-shadow: none;
}

.ui-empty-title {
    color: var(--corp-text);
    font-size: 14px;
}

.ui-empty-text {
    color: var(--corp-muted);
    font-size: 13px;
}

body.app-sidebar-collapsed .app-layout {
    grid-template-columns: 82px minmax(0, 1fr);
}

@media (min-width: 1200px) and (max-width: 1500px) {
    .app-layout {
        grid-template-columns: 246px minmax(0, 1fr);
    }

    .app-sidebar-link {
        font-size: 12.5px;
    }

    .erp-kpi-value,
    .premium-stat-value,
    .erp-status-value {
        font-size: clamp(1.45rem, 1.9vw, 2rem);
    }
}

@media (max-width: 767.98px) {
    body,
    .app-body {
        font-size: 14px;
    }

    .erp-dashboard-title {
        font-size: clamp(1.55rem, 8vw, 2rem);
    }

    .erp-kpi-card,
    .erp-kpi,
    .erp-kpi-tile,
    .erp-stat,
    .premium-stat-card,
    .erp-status-card {
        min-height: 128px;
    }
}

/* Final calm typography and color tuning */
body,
.app-body {
    font-weight: 400;
}

.fw-bold,
strong,
b {
    font-weight: 700 !important;
}

.app-sidebar {
    background:
        radial-gradient(circle at 14% 0%, rgba(201, 162, 39, 0.12), transparent 24%),
        linear-gradient(180deg, #12372a 0%, #12372a 56%, #0f2f25 100%);
    box-shadow: 10px 0 24px rgba(15, 47, 37, 0.14);
}

.app-sidebar-brand-title {
    font-weight: 750;
}

.app-sidebar-brand-subtitle,
.app-sidebar-group-toggle,
.app-sidebar-group-title,
.page-eyebrow,
.erp-section-kicker,
.erp-dashboard-kicker,
.table thead th,
.table-modern thead th,
.erp-table thead th,
.erp-kpi-label,
.premium-stat-label,
.erp-status-label {
    letter-spacing: 0.035em;
}

.app-sidebar-group-toggle {
    color: rgba(255, 253, 248, 0.50);
    font-weight: 650;
}

.app-sidebar-link {
    min-height: 36px;
    color: rgba(255, 253, 248, 0.76);
    font-size: 12.5px;
    font-weight: 500;
}

.app-sidebar-link i {
    color: rgba(201, 162, 39, 0.62);
}

.app-sidebar-link.active {
    background: linear-gradient(90deg, rgba(201, 162, 39, 0.14), rgba(255, 255, 255, 0.07));
    box-shadow: inset 0 0 0 1px rgba(201, 162, 39, 0.08), 0 6px 14px rgba(0, 0, 0, 0.10);
}

.app-sidebar-link.active::before {
    background: rgba(201, 162, 39, 0.86);
}

.app-topbar,
.app-global-search,
.app-icon-button,
.app-user-chip,
.app-sidebar-toggle {
    box-shadow: 0 7px 16px rgba(23, 35, 29, 0.045);
}

.app-icon-button,
.app-sidebar-toggle,
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-dark,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-danger,
.btn-outline-info {
    color: #244538;
}

.erp-dashboard-header {
    min-height: 140px;
    background:
        radial-gradient(circle at 14% 18%, rgba(255, 255, 255, 0.16), transparent 28%),
        linear-gradient(135deg, #1f4a3b 0%, #315b42 54%, #8a8652 100%);
    box-shadow: 0 14px 32px rgba(23, 35, 29, 0.12);
}

.erp-dashboard-title {
    font-size: clamp(1.62rem, 2.35vw, 2.15rem);
    font-weight: 780;
}

.erp-dashboard-subtitle {
    color: rgba(255, 253, 248, 0.74) !important;
    font-size: 0.9rem;
}

.erp-dashboard-kicker {
    color: rgba(255, 235, 180, 0.88);
    font-size: 10.5px;
    font-weight: 650;
}

.page-title,
.app-page-header h1,
h1 {
    font-size: clamp(1.45rem, 1.85vw, 1.9rem);
    font-weight: 760;
}

h2,
.erp-section-title,
.table-shell-title,
.erp-module-title {
    font-weight: 720;
}

.erp-kpi-card,
.erp-kpi,
.erp-kpi-tile,
.erp-stat,
.premium-stat-card,
.erp-status-card {
    min-height: 132px;
}

.erp-kpi-label,
.premium-stat-label,
.erp-status-label {
    color: rgba(107, 116, 110, 0.88);
    font-size: 11.5px;
    font-weight: 650;
}

.erp-kpi-value,
.premium-stat-value,
.erp-status-value {
    font-size: clamp(1.45rem, 1.85vw, 1.95rem);
    font-weight: 760;
}

.erp-kpi-meta,
.erp-kpi-foot,
.premium-stat-note {
    font-size: 11.5px;
}

.erp-kpi-card-icon,
.erp-kpi-icon {
    width: 35px;
    height: 35px;
    border-radius: 12px;
    background: linear-gradient(135deg, #244538, #5f6f3a) !important;
}

.erp-kpi-card-icon i,
.erp-kpi-icon i {
    font-size: 0.9rem;
}

.btn {
    font-weight: 650;
}

.btn-primary,
.btn-success {
    background: linear-gradient(135deg, #12372a, #5f6f3a) !important;
}

.badge,
.status-pill,
.data-pill,
.erp-badge {
    font-weight: 650;
}

.form-label,
form .form-label {
    font-weight: 650;
}

.table thead th,
.table-modern thead th,
.erp-table thead th {
    font-weight: 680;
}

/* Final brand color consistency polish */
:root {
    --brand-dark-green: #12372a;
    --brand-olive: #5f6f3a;
    --brand-gold: #c9a227;
}

.erp-kpi-card::before,
.erp-kpi-tile::before,
.erp-kpi-progress span,
.erp-kpi-bar span,
.kpi-progress-bar,
.progress-bar {
    background: linear-gradient(90deg, var(--brand-olive), var(--brand-gold)) !important;
    box-shadow: none !important;
}

.erp-kpi-card-icon,
.erp-kpi-icon,
.app-sidebar-brand-mark,
.app-user-avatar,
.ui-empty-icon {
    background: linear-gradient(135deg, var(--brand-dark-green), var(--brand-olive)) !important;
    box-shadow: 0 8px 16px rgba(18, 55, 42, 0.12) !important;
}

.erp-kpi-card-receivable .erp-kpi-card-icon,
.erp-kpi-card-alerts .erp-kpi-card-icon {
    background: linear-gradient(135deg, var(--brand-dark-green), var(--brand-gold)) !important;
}

.erp-kpi-card-payable .erp-kpi-card-icon {
    background: linear-gradient(135deg, var(--brand-olive), var(--brand-gold)) !important;
}

.erp-kpi-card-received .erp-kpi-card-icon {
    background: linear-gradient(135deg, #247a4d, var(--brand-olive)) !important;
}

.erp-kpi-card-shipping .erp-kpi-card-icon {
    background: linear-gradient(135deg, var(--brand-dark-green), var(--brand-olive)) !important;
}

.erp-dashboard-header {
    background-image:
        radial-gradient(circle at 14% 18%, rgba(201, 162, 39, 0.12), transparent 28%),
        linear-gradient(135deg, var(--brand-dark-green) 0%, #315b42 58%, var(--brand-olive) 100%) !important;
}

.page-hero,
.app-page-header {
    background:
        radial-gradient(circle at 14% 18%, rgba(201, 162, 39, 0.08), transparent 28%),
        linear-gradient(135deg, #ffffff, #fbfaf6) !important;
}

.page-eyebrow,
.erp-dashboard-kicker,
.erp-section-kicker {
    color: var(--brand-gold) !important;
}

.app-icon-button,
.app-sidebar-toggle,
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-dark,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-danger,
.btn-outline-info {
    color: var(--brand-dark-green) !important;
}

.btn-primary,
.btn-success {
    background: linear-gradient(135deg, var(--brand-dark-green), var(--brand-olive)) !important;
}

/* Clean modern SaaS reset layer */
:root {
    --clean-bg: #f4f7fb;
    --clean-bg-2: #f6f8fb;
    --clean-card: #ffffff;
    --clean-border: #e8edf3;
    --clean-border-strong: #d8e1ec;
    --clean-text: #111827;
    --clean-muted: #667085;
    --clean-sidebar: #0f172a;
    --clean-sidebar-2: #102a2a;
    --clean-blue: #2563eb;
    --clean-cyan: #06b6d4;
    --clean-success: #10b981;
    --clean-danger: #dc2626;
    --clean-warning: #d97706;
    --clean-shadow-sm: 0 8px 20px rgba(15, 23, 42, 0.045);
    --clean-shadow: 0 14px 34px rgba(15, 23, 42, 0.07);
    --clean-shadow-lg: 0 22px 52px rgba(15, 23, 42, 0.09);
    --clean-radius: 18px;
    --clean-radius-lg: 22px;
}

html {
    font-size: 14px;
    background: var(--clean-bg);
}

body,
.app-body,
body.bg-light {
    color: var(--clean-text);
    background:
        radial-gradient(circle at 18% -10%, rgba(37, 99, 235, 0.08), transparent 26%),
        radial-gradient(circle at 88% 0%, rgba(6, 182, 212, 0.08), transparent 24%),
        linear-gradient(180deg, #fbfdff 0%, var(--clean-bg) 100%) !important;
    font-size: 14px;
    font-weight: 400;
}

.app-layout {
    grid-template-columns: 260px minmax(0, 1fr);
}

.app-sidebar {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0)),
        linear-gradient(180deg, var(--clean-sidebar) 0%, var(--clean-sidebar-2) 100%) !important;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: 12px 0 30px rgba(15, 23, 42, 0.14) !important;
}

.app-sidebar-brand {
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: rgba(255, 255, 255, 0.055) !important;
    box-shadow: none !important;
}

.app-sidebar-brand-mark,
.app-user-avatar {
    background: linear-gradient(135deg, var(--clean-blue), var(--clean-cyan)) !important;
    box-shadow: 0 10px 20px rgba(37, 99, 235, 0.18) !important;
}

.app-sidebar-brand-title {
    color: #f8fafc;
    font-weight: 750;
}

.app-sidebar-brand-subtitle {
    color: rgba(226, 232, 240, 0.62);
}

.app-sidebar-scroll {
    scrollbar-color: rgba(148, 163, 184, 0.34) transparent;
}

.app-sidebar-scroll::-webkit-scrollbar-thumb {
    background-color: rgba(148, 163, 184, 0.34) !important;
}

.app-sidebar-group + .app-sidebar-group {
    border-top-color: rgba(255, 255, 255, 0.055) !important;
}

.app-sidebar-group-toggle,
.app-sidebar-group-title {
    color: rgba(203, 213, 225, 0.58) !important;
    font-size: 9.5px;
    font-weight: 650;
    letter-spacing: 0.035em;
}

.app-sidebar-group-toggle i {
    color: rgba(148, 163, 184, 0.72) !important;
}

.app-sidebar-link {
    color: rgba(226, 232, 240, 0.82) !important;
    font-size: 13px;
    font-weight: 500;
    border: 1px solid transparent !important;
    background: transparent !important;
    box-shadow: none !important;
}

.app-sidebar-link i {
    color: rgba(148, 163, 184, 0.82) !important;
}

.app-sidebar-link:hover,
.app-sidebar-link:focus {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.075) !important;
    border-color: rgba(255, 255, 255, 0.07) !important;
    transform: none !important;
    box-shadow: none !important;
}

.app-sidebar-link:hover i,
.app-sidebar-link:focus i {
    color: #67e8f9 !important;
}

.app-sidebar-link.active {
    color: #ffffff !important;
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.92), rgba(6, 182, 212, 0.82)) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    box-shadow: 0 10px 24px rgba(37, 99, 235, 0.18) !important;
}

.app-sidebar-link.active::before {
    display: none;
}

.app-sidebar-link.active i {
    color: #ffffff !important;
}

.app-topbar {
    min-height: 64px;
    background: rgba(255, 255, 255, 0.84) !important;
    border-bottom: 1px solid var(--clean-border) !important;
    box-shadow: var(--clean-shadow-sm) !important;
    backdrop-filter: blur(14px);
}

.app-brand-title {
    color: var(--clean-text) !important;
    font-size: 1rem;
    font-weight: 750;
}

.brand-small,
.app-user-role-label {
    color: var(--clean-muted) !important;
}

.app-global-search,
.app-icon-button,
.app-user-chip,
.app-sidebar-toggle {
    border: 1px solid var(--clean-border) !important;
    background: rgba(255, 255, 255, 0.92) !important;
    color: var(--clean-text) !important;
    box-shadow: var(--clean-shadow-sm) !important;
}

.app-global-search:focus-within,
.app-icon-button:hover,
.app-icon-button:focus,
.app-user-chip:hover,
.app-user-chip:focus,
.app-sidebar-toggle:hover,
.app-sidebar-toggle:focus {
    border-color: rgba(37, 99, 235, 0.30) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10), var(--clean-shadow-sm) !important;
}

.app-global-search input {
    color: var(--clean-text);
}

.app-search-shortcut {
    color: var(--clean-muted);
    background: #eef4ff !important;
}

.app-icon-dot {
    background: var(--clean-danger) !important;
}

.main-wrap {
    padding-top: 20px;
}

.app-page-shell {
    gap: 20px;
}

.card,
.erp-card,
.erp-form-card,
.erp-section,
.erp-chart-shell,
.table-shell,
.surface-panel,
.page-hero,
.metric-card,
.info-card,
.mini-overview-card,
.portal-summary-card,
.erp-app-tile,
.erp-analytics-card,
.erp-queue-card,
.premium-stat-card,
.erp-module,
.erp-tile-panel,
.erp-analytics-panel,
.erp-kpi-card,
.erp-kpi,
.erp-kpi-tile,
.erp-stat,
.erp-status-card {
    border: 1px solid var(--clean-border) !important;
    border-radius: var(--clean-radius-lg) !important;
    background: var(--clean-card) !important;
    box-shadow: var(--clean-shadow-sm) !important;
    backdrop-filter: none !important;
}

.card:hover,
.erp-card:hover,
.erp-section:hover,
.erp-chart-shell:hover,
.table-shell:hover,
.surface-panel:hover,
.premium-stat-card:hover,
.erp-module:hover,
.erp-kpi-card:hover,
.erp-kpi:hover,
.erp-kpi-tile:hover,
.erp-stat:hover,
.erp-status-card:hover {
    box-shadow: var(--clean-shadow) !important;
    transform: translateY(-1px);
}

.card-header,
.table-shell-header,
.erp-module-header,
.surface-panel-header {
    border-bottom: 1px solid var(--clean-border) !important;
    background: #ffffff !important;
}

.page-hero,
.app-page-header,
.erp-dashboard-header {
    border-radius: 24px !important;
    background:
        linear-gradient(135deg, #ffffff 0%, #f8fbff 62%, #eef7ff 100%) !important;
    box-shadow: var(--clean-shadow) !important;
    color: var(--clean-text) !important;
}

.erp-dashboard-title,
.page-title,
.app-page-header h1,
h1 {
    color: var(--clean-text) !important;
    font-size: clamp(1.75rem, 2.35vw, 2rem);
    font-weight: 750;
    text-shadow: none !important;
}

.erp-dashboard-subtitle,
.page-subtitle,
.table-shell-subtitle,
.section-subtitle,
.text-muted,
.erp-section-note,
.app-page-header p {
    color: var(--clean-muted) !important;
}

.erp-dashboard-kicker,
.page-eyebrow,
.erp-section-kicker {
    color: var(--clean-blue) !important;
    letter-spacing: 0.035em;
}

.erp-kpi-card,
.erp-kpi,
.erp-kpi-tile,
.erp-stat,
.premium-stat-card,
.erp-status-card {
    min-height: 136px;
}

.erp-kpi-card::before,
.erp-kpi-tile::before {
    background: linear-gradient(90deg, var(--clean-blue), var(--clean-cyan)) !important;
}

.erp-kpi-card-icon,
.erp-kpi-icon,
.ui-empty-icon {
    background: linear-gradient(135deg, var(--clean-blue), var(--clean-cyan)) !important;
    box-shadow: 0 10px 20px rgba(37, 99, 235, 0.14) !important;
}

.erp-kpi-card-received .erp-kpi-card-icon,
.bg-success,
.text-bg-success {
    background: var(--clean-success) !important;
}

.erp-kpi-card-receivable .erp-kpi-card-icon,
.erp-kpi-card-alerts .erp-kpi-card-icon,
.bg-danger,
.text-bg-danger {
    background: var(--clean-danger) !important;
}

.erp-kpi-card-payable .erp-kpi-card-icon,
.bg-warning,
.text-bg-warning {
    background: var(--clean-warning) !important;
}

.erp-kpi-card-shipping .erp-kpi-card-icon {
    background: linear-gradient(135deg, #0891b2, var(--clean-cyan)) !important;
}

.erp-kpi-label,
.premium-stat-label,
.erp-status-label {
    color: var(--clean-muted) !important;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.025em;
}

.erp-kpi-value,
.premium-stat-value,
.erp-status-value {
    color: var(--clean-text) !important;
    font-size: clamp(1.65rem, 2.1vw, 2.15rem);
    font-weight: 750;
}

.erp-kpi-meta {
    color: var(--clean-muted) !important;
    border-color: #dbeafe !important;
    background: #eff6ff !important;
    box-shadow: none !important;
}

.erp-kpi-progress,
.erp-kpi-bar {
    background: #e5e7eb !important;
    box-shadow: none !important;
}

.erp-kpi-progress span,
.erp-kpi-bar span,
.kpi-progress-bar,
.progress-bar {
    background: linear-gradient(90deg, var(--clean-blue), var(--clean-cyan)) !important;
    box-shadow: none !important;
}

.table-responsive,
.enterprise-grid-wrap,
.app-table-responsive {
    border: 1px solid var(--clean-border) !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: var(--clean-shadow-sm) !important;
}

.table {
    color: var(--clean-text);
    font-size: 13px;
}

.table thead th,
.table-modern thead th,
.erp-table thead th {
    color: var(--clean-muted) !important;
    background: #f8fafc !important;
    border-bottom-color: var(--clean-border) !important;
    box-shadow: none !important;
    letter-spacing: 0.025em;
}

.table td {
    border-bottom-color: var(--clean-border) !important;
}

.table tbody tr:nth-child(even) {
    background: #fbfdff !important;
}

.table-hover tbody tr:hover,
.table tbody tr:hover {
    background: #f1f7ff !important;
    box-shadow: inset 3px 0 0 rgba(37, 99, 235, 0.36) !important;
}

.badge,
.status-pill,
.data-pill,
.erp-badge {
    border-color: var(--clean-border) !important;
    box-shadow: none !important;
}

.form-control,
.form-select,
.input-group-text {
    border-color: var(--clean-border) !important;
    background: #ffffff !important;
    color: var(--clean-text) !important;
    box-shadow: none !important;
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(37, 99, 235, 0.45) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12) !important;
}

.btn-primary,
.btn-success {
    border-color: var(--clean-blue) !important;
    background: linear-gradient(135deg, var(--clean-blue), var(--clean-cyan)) !important;
    box-shadow: 0 10px 20px rgba(37, 99, 235, 0.12) !important;
}

.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-dark,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-danger,
.btn-outline-info {
    color: var(--clean-text) !important;
    border-color: var(--clean-border) !important;
    background: #ffffff !important;
}

.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline-dark:hover,
.btn-outline-success:hover,
.btn-outline-warning:hover,
.btn-outline-danger:hover,
.btn-outline-info:hover {
    color: var(--clean-blue) !important;
    border-color: #bfdbfe !important;
    background: #eff6ff !important;
}

.ui-empty-state,
.app-empty-state-card {
    border-color: var(--clean-border) !important;
    background: #ffffff !important;
    box-shadow: var(--clean-shadow-sm) !important;
}

@media (min-width: 1200px) and (max-width: 1500px) {
    .app-layout {
        grid-template-columns: 248px minmax(0, 1fr);
    }
}

/* Job details premium workspace */
.job-details-page {
    display: grid;
    gap: 16px;
    max-width: 100%;
}

.job-details-page .job-details-command-center {
    padding: 18px;
    border: 1px solid var(--clean-border) !important;
    border-radius: 22px !important;
    background: linear-gradient(135deg, #ffffff 0%, #f8fbff 68%, #eef7ff 100%) !important;
    box-shadow: var(--clean-shadow-sm) !important;
}

.job-details-page .erp-job-command-header {
    display: grid;
    grid-template-columns: minmax(280px, 0.9fr) minmax(420px, 1.2fr);
    gap: 16px;
    align-items: start;
}

.job-details-page .erp-job-identity .page-title {
    margin: 0;
    font-size: clamp(1.75rem, 2.4vw, 2.2rem);
}

.job-details-page .erp-job-identity-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 10px;
}

.job-details-page .erp-job-identity-grid > div,
.job-details-page .erp-status-card,
.job-details-page .erp-info-item,
.job-details-page .kpi-strip-card {
    border: 1px solid var(--clean-border) !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

.job-details-page .erp-job-identity-grid span,
.job-details-page .erp-status-label,
.job-details-page .erp-info-item span,
.job-details-page .kpi-strip-label {
    color: var(--clean-muted) !important;
    font-size: 11.5px;
    font-weight: 650;
    letter-spacing: 0.02em;
}

.job-details-page .erp-job-identity-grid strong,
.job-details-page .erp-status-badge,
.job-details-page .erp-info-item strong,
.job-details-page .kpi-strip-value {
    color: var(--clean-text) !important;
    font-size: 13px;
    font-weight: 720;
}

.job-details-page .erp-job-status-board,
.job-details-page .erp-status-card-grid,
.job-details-page .erp-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 8px;
}

.job-details-page .erp-status-card {
    min-height: 70px;
    padding: 10px;
}

.job-command-toolbar {
    display: grid;
    gap: 10px;
    margin-top: 12px !important;
}

.job-compact-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.job-action-board {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.job-action-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    padding: 10px;
    border: 1px solid var(--clean-border);
    border-radius: 16px;
    background: #ffffff;
}

.job-action-group > span {
    flex: 0 0 100%;
    color: var(--clean-muted);
    font-size: 11px;
    font-weight: 750;
}

.job-action-group .btn {
    min-height: 32px;
    padding: 0.32rem 0.56rem;
    font-size: 12px;
}

.job-kpi-grid.erp-command-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
}

.job-kpi-grid .erp-kpi-card {
    min-height: 96px;
    padding: 12px;
    border-radius: 18px !important;
}

.job-kpi-grid .erp-kpi-label {
    font-size: 11px;
}

.job-kpi-grid .erp-kpi-value {
    font-size: clamp(1.1rem, 1.4vw, 1.35rem);
}

.job-photo-command-card {
    max-height: 300px;
    overflow: hidden;
}

.job-photo-command-card .erp-command-card-header {
    padding-bottom: 8px;
}

.job-photo-command-card .erp-photo-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    gap: 10px;
    max-height: 210px;
    overflow-y: auto;
    padding-right: 4px;
}

.job-photo-command-card .job-photo-tile {
    min-height: 118px;
    max-height: 132px;
    border-radius: 14px;
}

.job-photo-command-card .job-photo-tile img {
    width: 100%;
    height: 92px;
    object-fit: cover;
}

.job-details-page .erp-command-card,
.job-details-page .card {
    border: 1px solid var(--clean-border) !important;
    border-radius: 20px !important;
    background: #ffffff !important;
    box-shadow: var(--clean-shadow-sm) !important;
}

.job-details-page .erp-command-card {
    padding: 14px;
}

.job-details-page .erp-command-card-header,
.job-details-page .card-body > .d-flex:first-child {
    gap: 10px;
    margin-bottom: 10px !important;
}

.job-details-page .erp-command-title,
.job-details-page h5 {
    color: var(--clean-text);
    font-size: 16px;
    font-weight: 750;
}

.job-details-page .erp-command-note,
.job-details-page .small,
.job-details-page .text-muted {
    font-size: 12px;
}

.job-details-page .erp-command-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.job-details-page .erp-info-item {
    padding: 9px 10px;
}

.job-details-page .erp-inline-warning {
    padding: 10px 12px;
    border: 1px solid #fed7aa;
    border-radius: 14px;
    color: #9a3412;
    background: #fff7ed;
    font-size: 12.5px;
}

.job-details-page .nav-tabs {
    border-bottom-color: var(--clean-border);
}

.job-details-page .nav-tabs .nav-link {
    border-radius: 12px 12px 0 0;
    font-size: 13px;
    font-weight: 650;
}

.job-details-page .tab-content {
    padding-top: 12px;
}

.job-details-page .kpi-strip-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.job-details-page .table-responsive {
    border-radius: 16px !important;
    box-shadow: none !important;
}

.job-details-page .table {
    font-size: 12.5px;
}

.job-details-page .table td,
.job-details-page .table th {
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
}

.job-details-page .table-empty-row td,
.job-details-page tr td.text-center.py-4 {
    padding: 16px !important;
}

.job-details-page .ui-empty-state,
.job-details-page .erp-empty-state {
    max-width: 420px;
    margin: 0 auto;
    padding: 14px;
}

.job-details-page .accordion-item {
    border: 1px solid var(--clean-border) !important;
    border-radius: 16px !important;
    overflow: hidden;
    box-shadow: none;
}

.job-details-page .accordion-item + .accordion-item {
    margin-top: 8px;
}

.job-details-page .accordion-button {
    padding: 12px 14px;
    color: var(--clean-text);
    background: #ffffff;
    font-size: 13px;
    font-weight: 700;
}

.job-details-page .accordion-button:not(.collapsed) {
    color: var(--clean-blue);
    background: #f8fbff;
    box-shadow: inset 0 -1px 0 var(--clean-border);
}

.job-details-page .accordion-body {
    padding: 12px;
}

.job-details-page .owner-delete-form {
    max-width: 230px;
}

@media (max-width: 1399.98px) {
    .job-details-page .erp-job-command-header,
    .job-action-board {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .job-kpi-grid.erp-command-kpi-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .job-details-page .erp-job-command-header,
    .job-action-board,
    .job-details-page .erp-command-grid {
        grid-template-columns: 1fr;
    }

    .job-details-page .erp-job-identity-grid,
    .job-details-page .kpi-strip-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .job-kpi-grid.erp-command-kpi-grid,
    .job-details-page .erp-job-identity-grid,
    .job-details-page .kpi-strip-grid {
        grid-template-columns: 1fr;
    }

    .job-photo-command-card {
        max-height: none;
    }

    .job-photo-command-card .erp-photo-gallery {
        max-height: 240px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Job cost payments workspace */
.job-cost-page {
    display: grid;
    gap: 18px;
    max-width: 100%;
}

.job-cost-hero,
.job-cost-snapshot,
.job-cost-form-card,
.job-cost-summary-card,
.job-cost-trace-table {
    border: 1px solid var(--clean-border);
    border-radius: 22px;
    background: #ffffff;
    box-shadow: var(--clean-shadow-sm);
}

.job-cost-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 20px;
    background: linear-gradient(135deg, #ffffff 0%, #f8fbff 66%, #eef7ff 100%);
}

.job-cost-hero-copy {
    min-width: 0;
}

.job-cost-hero .page-title {
    margin: 0;
    font-size: clamp(1.55rem, 2vw, 2rem);
}

.job-cost-pill-row,
.job-cost-hero-actions,
.job-cost-actionbar-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.job-cost-pill,
.job-cost-soft-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    padding: 4px 10px;
    border: 1px solid #dbeafe;
    border-radius: 999px;
    color: #1e3a8a;
    background: #eff6ff;
    font-size: 12px;
    font-weight: 650;
}

.job-cost-hero-actions {
    justify-content: flex-end;
}

.job-cost-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.job-cost-kpi {
    display: flex;
    gap: 12px;
    min-width: 0;
    padding: 16px;
    border: 1px solid var(--clean-border);
    border-radius: 20px;
    background: #ffffff;
    box-shadow: var(--clean-shadow-sm);
}

.job-cost-kpi-icon,
.job-cost-guidance-card i,
.job-cost-guardrail i {
    width: 36px;
    height: 36px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: #ffffff;
    background: linear-gradient(135deg, var(--clean-blue), var(--clean-cyan));
}

.job-cost-kpi-label {
    color: var(--clean-muted);
    font-size: 12px;
    font-weight: 650;
}

.job-cost-kpi-value {
    color: var(--clean-text);
    font-size: clamp(1.25rem, 1.7vw, 1.65rem);
    font-weight: 760;
    line-height: 1.2;
}

.job-cost-kpi-note {
    color: var(--clean-muted);
    font-size: 12px;
    line-height: 1.35;
}

.job-cost-snapshot,
.job-cost-form-card,
.job-cost-summary-card,
.job-cost-trace-table {
    padding: 18px;
}

.job-cost-section-head,
.job-cost-table-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.job-cost-section-head h2,
.job-cost-table-head h2 {
    margin: 0;
    color: var(--clean-text);
    font-size: 18px;
    font-weight: 750;
}

.job-cost-section-head p,
.job-cost-table-head p {
    margin: 3px 0 0;
    color: var(--clean-muted);
    font-size: 13px;
}

.job-cost-table-head span {
    flex: 0 0 auto;
    color: var(--clean-muted);
    font-size: 12px;
    font-weight: 650;
}

.job-cost-snapshot-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.job-cost-snapshot-row,
.job-cost-summary-grid > div {
    display: grid;
    gap: 4px;
    padding: 12px;
    border: 1px solid var(--clean-border);
    border-radius: 14px;
    background: #fbfdff;
}

.job-cost-snapshot-row span,
.job-cost-summary-grid span {
    color: var(--clean-muted);
    font-size: 12px;
    font-weight: 650;
}

.job-cost-snapshot-row strong,
.job-cost-summary-grid strong {
    color: var(--clean-text);
    font-size: 13px;
    font-weight: 720;
    overflow-wrap: anywhere;
}

.job-cost-form-card {
    display: grid;
    gap: 16px;
}

.job-cost-form-section {
    padding: 14px;
    border: 1px solid var(--clean-border);
    border-radius: 18px;
    background: #fbfdff;
}

.job-cost-form-section h3 {
    margin: 0 0 10px;
    color: var(--clean-text);
    font-size: 14px;
    font-weight: 750;
}

.job-cost-form-section p {
    margin: -4px 0 12px;
    color: var(--clean-muted);
    font-size: 12.5px;
}

.job-cost-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: 12px;
}

.job-cost-form-grid.two-column {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
}

.job-cost-form-card .form-label {
    margin-bottom: 5px;
    font-size: 13px;
}

.job-cost-form-card .form-control,
.job-cost-form-card .form-select {
    min-height: 40px;
}

.job-cost-guidance-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.job-cost-guidance-card {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    column-gap: 10px;
    row-gap: 2px;
    align-items: center;
    padding: 12px;
    border: 1px solid #dbeafe;
    border-radius: 16px;
    background: #f8fbff;
}

.job-cost-guidance-card i {
    grid-row: span 2;
    width: 32px;
    height: 32px;
    border-radius: 11px;
}

.job-cost-guidance-card strong {
    font-size: 13px;
    font-weight: 750;
}

.job-cost-guidance-card span {
    color: var(--clean-muted);
    font-size: 12px;
    line-height: 1.35;
}

.job-cost-actionbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px;
    border: 1px solid var(--clean-border);
    border-radius: 18px;
    background: #ffffff;
}

.job-cost-actionbar strong,
.job-cost-actionbar span {
    display: block;
}

.job-cost-actionbar strong {
    font-size: 14px;
}

.job-cost-actionbar span {
    color: var(--clean-muted);
    font-size: 12px;
}

.job-cost-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.job-cost-guardrail {
    display: flex;
    gap: 10px;
    margin-top: 14px;
    padding: 12px;
    border: 1px solid #dbeafe;
    border-radius: 16px;
    background: #f8fbff;
}

.job-cost-guardrail i {
    width: 32px;
    height: 32px;
    border-radius: 11px;
}

.job-cost-guardrail strong,
.job-cost-guardrail span {
    display: block;
}

.job-cost-guardrail strong {
    font-size: 13px;
}

.job-cost-guardrail span {
    color: var(--clean-muted);
    font-size: 12.5px;
}

.job-cost-trace-table {
    overflow: hidden;
}

.job-cost-trace-table .enterprise-grid-wrap {
    border-radius: 16px !important;
    box-shadow: none !important;
}

.job-cost-trace-table .table {
    table-layout: auto;
}

.job-cost-trace-table .table th,
.job-cost-trace-table .table td {
    padding: 9px 11px;
    vertical-align: middle;
    white-space: nowrap;
}

.job-cost-trace-table .table td:nth-child(8),
.job-cost-trace-table .table td:nth-child(9) {
    white-space: normal;
    min-width: 150px;
}

.job-cost-trace-table .table-action-btn {
    min-width: 64px;
    padding: 4px 10px;
}

.job-cost-trace-table .table-empty-row td {
    padding: 18px !important;
}

.job-cost-trace-table .app-empty-state-card {
    max-width: 360px;
    padding: 16px;
}

.job-cost-trace-table .owner-delete-form {
    max-width: 240px;
}

@media (max-width: 1399.98px) {
    .job-cost-kpi-grid,
    .job-cost-guidance-grid,
    .job-cost-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .job-cost-form-grid {
        grid-template-columns: repeat(2, minmax(150px, 1fr));
    }
}

@media (max-width: 991.98px) {
    .job-cost-hero,
    .job-cost-actionbar,
    .job-cost-section-head,
    .job-cost-table-head {
        align-items: stretch;
        flex-direction: column;
    }

    .job-cost-hero-actions,
    .job-cost-actionbar-buttons {
        justify-content: flex-start;
    }

    .job-cost-snapshot-grid,
    .job-cost-form-grid,
    .job-cost-form-grid.two-column {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .job-cost-kpi-grid,
    .job-cost-guidance-grid,
    .job-cost-summary-grid {
        grid-template-columns: 1fr;
    }

    .job-cost-hero,
    .job-cost-snapshot,
    .job-cost-form-card,
    .job-cost-summary-card,
    .job-cost-trace-table {
        padding: 14px;
        border-radius: 18px;
    }
}

/* Supplier finance operation pages */
.finance-operation-page {
    display: grid;
    gap: 18px;
}

.finance-operation-form-card {
    display: grid;
    gap: 16px;
    padding: 18px;
    border: 1px solid var(--clean-border);
    border-radius: 22px;
    background: #ffffff;
    box-shadow: var(--clean-shadow-sm);
}

.finance-operation-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 16px;
    align-items: start;
}

.finance-operation-main {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.finance-operation-side {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.finance-operation-side .job-cost-guidance-card {
    grid-template-columns: 34px minmax(0, 1fr);
    background: #f8fbff;
}

.finance-operation-check {
    min-height: 40px;
    padding: 10px 12px;
    border: 1px solid var(--clean-border);
    border-radius: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    background: #ffffff;
}

.finance-operation-check .form-check-input {
    margin: 0;
}

@media (max-width: 1199.98px) {
    .finance-operation-layout {
        grid-template-columns: 1fr;
    }

    .finance-operation-side {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .finance-operation-side {
        grid-template-columns: 1fr;
    }

    .finance-operation-form-card {
        padding: 14px;
        border-radius: 18px;
    }
}

/* Global ERP alignment polish */
.app-aligned-header,
.table-shell-header,
.page-hero-content,
.erp-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    min-width: 0;
}

.app-aligned-header > div:first-child,
.table-shell-header > div:first-child,
.page-hero-content > div:first-child,
.erp-page-header > div:first-child {
    min-width: min(100%, 280px);
}

.app-aligned-actions,
.toolbar-actions,
.page-hero-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.app-filter-card,
form.card.shadow-sm.p-3,
.filter-toolbar,
.filter-panel {
    border: 1px solid var(--clean-border, #e8edf3) !important;
    border-radius: 20px !important;
    background: #ffffff !important;
    box-shadow: var(--clean-shadow-sm, 0 8px 20px rgba(15, 23, 42, 0.06)) !important;
    margin-bottom: 16px !important;
}

.app-filter-card .row,
form.card.shadow-sm.p-3 .row,
.filter-toolbar .row,
.filter-panel .row {
    align-items: end;
    row-gap: 12px;
}

.app-filter-card .form-label,
form.card.shadow-sm.p-3 .form-label,
.filter-toolbar .form-label,
.filter-panel .form-label {
    display: block;
    min-height: 18px;
    margin-bottom: 6px;
    color: var(--clean-muted, #64748b);
    font-size: 12.5px;
    font-weight: 650;
}

.app-filter-card .btn,
form.card.shadow-sm.p-3 .btn,
.filter-toolbar .btn,
.filter-panel .btn {
    min-height: 42px;
}

.app-metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    align-items: stretch;
    margin-bottom: 16px;
}

.app-metric-card,
.metric-card,
.portal-summary-card {
    height: 100%;
}

.app-metric-card,
.metric-card .card-body,
.portal-summary-card,
.erp-card.metric-surface {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 112px;
    padding: 16px;
}

.app-metric-label,
.metric-label,
.portal-summary-label,
.summary-stack-label {
    color: var(--clean-muted, #64748b) !important;
    font-size: 12px !important;
    font-weight: 650 !important;
    line-height: 1.25;
    margin-bottom: 8px;
}

.app-metric-value,
.metric-value,
.portal-summary-value,
.summary-stack-value {
    color: var(--clean-text, #17231d);
    font-size: clamp(20px, 2vw, 26px) !important;
    font-weight: 740 !important;
    line-height: 1.18;
    overflow-wrap: anywhere;
}

.app-metric-note,
.metric-note,
.portal-summary-note {
    color: var(--clean-muted, #64748b) !important;
    font-size: 12px !important;
    line-height: 1.35;
    margin-top: 6px;
}

.row.g-3 > [class*="col-"] > .card,
.row.g-3 > [class*="col-"] > .erp-card,
.row.g-3 > [class*="col-"] > .metric-card,
.row.g-3 > [class*="col-"] > .alert {
    height: 100%;
}

.row.g-3 > [class*="col-"] > .alert.alert-light {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 88px;
    padding: 14px 16px;
}

.card > .table-responsive,
.erp-card > .table-responsive {
    border-left: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0;
}

.table-shell,
.app-table-card,
.erp-card,
.card {
    min-width: 0;
}

.table-shell-header h1,
.table-shell-header h2,
.app-aligned-header h1,
.app-aligned-header h2 {
    margin-bottom: 4px;
}

.ui-section-total,
.app-total-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 42px;
}

@media (max-width: 1199.98px) {
    .app-metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .app-aligned-header,
    .table-shell-header,
    .page-hero-content,
    .erp-page-header {
        align-items: stretch;
        flex-direction: column;
    }

    .app-aligned-actions,
    .toolbar-actions,
    .page-hero-actions {
        justify-content: flex-start;
    }

    .app-metric-grid {
        grid-template-columns: 1fr;
    }

    .app-filter-card,
    form.card.shadow-sm.p-3,
    .filter-toolbar,
    .filter-panel {
        padding: 14px !important;
    }
}