:root {
    --wms-primary: #155e8b;
    --wms-primary-dark: #0c3f63;
    --wms-primary-soft: #eaf4fa;
    --wms-success: #15803d;
    --wms-success-soft: #eaf7ef;
    --wms-warning: #a16207;
    --wms-warning-soft: #fff7df;
    --wms-danger: #c2413a;
    --wms-danger-soft: #fff0ef;
    --wms-surface: #f4f7fa;
    --wms-card: #ffffff;
    --wms-border: #dde5ec;
    --wms-border-soft: #edf1f4;
    --wms-text: #182433;
    --wms-muted: #6b7787;
    --wms-sidebar-width: 244px;
    --wms-sidebar-mini-width: 70px;
    --wms-navbar-height: 64px;
    --wms-radius: 14px;
    --wms-shadow: 0 8px 28px rgba(21, 42, 60, .06);
}

html,
body {
    min-height: 100%;
}

body.wms-app {
    color: var(--wms-text);
    background: var(--wms-surface);
    font-size: .875rem;
}

body.wms-app a {
    text-decoration: none;
}

body.wms-app .container-scroller {
    background: var(--wms-surface);
}

/* Global layout */
.wms-navbar {
    height: var(--wms-navbar-height);
    border-bottom: 1px solid var(--wms-border-soft);
    background: #fff;
    box-shadow: 0 3px 14px rgba(21, 42, 60, .045);
}

.navbar .navbar-brand-wrapper {
    width: var(--wms-sidebar-width);
    height: var(--wms-navbar-height);
    border-right: 1px solid var(--wms-border-soft);
    background: #fff;
}

.navbar .navbar-menu-wrapper {
    width: calc(100% - var(--wms-sidebar-width));
    height: var(--wms-navbar-height);
    padding: 0 1.25rem;
}

.navbar .navbar-menu-wrapper .navbar-toggler {
    color: #647284;
    padding: .4rem;
}

.wms-brand {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .78rem;
    margin: 0;
    padding: 0 .95rem;
    color: var(--wms-primary-dark) !important;
}

.wms-brand-identity {
    display: inline-flex;
    flex: 0 0 auto;
}

.wms-brand-mark,
.wms-brand-logo-box {
    display: inline-flex;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    align-items: center;
    justify-content: center;
    border: 1px solid #d8e5ef;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 6px 14px rgba(21, 42, 60, .06);
}

.wms-brand-mark {
    color: var(--wms-primary);
    font-size: 1rem;
    font-weight: 800;
}

.wms-brand-logo {
    max-width: 30px;
    max-height: 30px;
    object-fit: contain;
}

.wms-brand-copy {
    min-width: 0;
    line-height: 1.08;
}

.wms-brand-copy strong,
.wms-brand-copy small {
    display: block;
}

.wms-brand-copy strong {
    color: var(--wms-primary-dark);
    font-size: .96rem;
    letter-spacing: -.01em;
}

.wms-brand-copy small {
    margin-top: .22rem;
    color: #758396;
    font-size: .61rem;
    font-weight: 700;
    letter-spacing: .075em;
    text-transform: uppercase;
}

.wms-navbar-context {
    min-width: 0;
    flex-direction: column;
    margin-left: .6rem;
    line-height: 1.2;
}

.wms-navbar-context strong {
    max-width: 420px;
    overflow: hidden;
    font-size: .86rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wms-navbar-eyebrow {
    margin-bottom: .12rem;
    color: var(--wms-muted);
    font-size: .64rem;
    font-weight: 700;
    letter-spacing: .075em;
    text-transform: uppercase;
}

.wms-mode-badge {
    display: inline-flex;
    align-items: center;
    gap: .42rem;
    padding: .33rem .62rem;
    border: 1px solid #cfe2ee;
    border-radius: 999px;
    background: var(--wms-primary-soft);
    color: var(--wms-primary-dark);
    font-size: .65rem;
    font-weight: 800;
    letter-spacing: .055em;
}

.wms-mode-badge::before {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--wms-success);
    box-shadow: 0 0 0 3px rgba(21, 128, 61, .12);
    content: '';
}

.wms-profile-trigger {
    display: flex !important;
    align-items: center;
    gap: .58rem;
    min-width: 0;
    padding: .2rem .35rem !important;
}

.wms-profile-avatar {
    display: inline-flex;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: var(--wms-primary-soft);
    color: var(--wms-primary);
    font-size: .72rem;
    font-weight: 800;
}

.wms-profile-copy {
    line-height: 1.15;
}

.wms-profile-copy strong,
.wms-profile-copy small {
    display: block;
}

.wms-profile-copy strong {
    color: var(--wms-text);
    font-size: .76rem;
}

.wms-profile-copy small {
    margin-top: .12rem;
    color: var(--wms-muted);
    font-size: .64rem;
}

.wms-profile-menu {
    min-width: 220px;
    overflow: hidden;
    border: 1px solid var(--wms-border);
    border-radius: 12px;
    box-shadow: var(--wms-shadow);
}

.wms-profile-menu-head {
    padding: .9rem 1rem;
    border-bottom: 1px solid var(--wms-border-soft);
    background: #f8fafc;
}

.wms-profile-menu-head strong,
.wms-profile-menu-head small {
    display: block;
}

.wms-profile-menu-head small {
    margin-top: .2rem;
    color: var(--wms-muted);
    font-size: .72rem;
}

.wms-profile-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .7rem 1rem;
    font-size: .8rem;
}

.sidebar {
    width: var(--wms-sidebar-width);
    background: #fff;
    border-right: 1px solid var(--wms-border-soft);
    box-shadow: 6px 0 18px rgba(21, 42, 60, .03);
}

.sidebar .nav {
    padding: .9rem .8rem 1.65rem;
}

.sidebar .nav .nav-category {
    margin: 1.25rem .82rem .5rem;
    color: #8f9dad;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.sidebar .nav .nav-item {
    margin-bottom: .18rem;
}

.sidebar .nav .nav-item > .nav-link {
    display: flex;
    min-height: 44px;
    align-items: center;
    padding: .72rem .8rem;
    border: 1px solid transparent;
    border-radius: 12px;
    color: #425365;
    font-weight: 700;
    transition: all .18s ease;
}

.sidebar .nav .nav-item > .nav-link .menu-title {
    min-width: 0;
    flex: 1 1 auto;
    line-height: 1.25;
}

.sidebar .nav .nav-item > .nav-link .menu-icon {
    margin-right: .76rem;
    color: #7e8ea0;
    font-size: 1rem;
    transition: color .18s ease;
}

.sidebar .nav .nav-item > .nav-link .menu-arrow {
    margin-left: auto;
    color: #97a4b2;
    transition: transform .18s ease, color .18s ease;
}

.sidebar .nav .nav-item > .nav-link:hover {
    border-color: #e3ebf3;
    background: #f7fafc;
    color: var(--wms-primary-dark);
}

.sidebar .nav .nav-item > .nav-link:hover .menu-icon,
.sidebar .nav .nav-item > .nav-link:hover .menu-arrow {
    color: var(--wms-primary);
}

.sidebar .nav .nav-item.active > .nav-link,
.sidebar .nav .nav-item.open > .nav-link {
    border-color: #d8e7f1;
    background: linear-gradient(180deg, #f7fbfe 0%, #eef6fb 100%);
    color: var(--wms-primary-dark);
    box-shadow: inset 3px 0 0 var(--wms-primary);
}

.sidebar .nav .nav-item.active > .nav-link .menu-icon,
.sidebar .nav .nav-item.open > .nav-link .menu-icon,
.sidebar .nav .nav-item.active > .nav-link .menu-arrow,
.sidebar .nav .nav-item.open > .nav-link .menu-arrow {
    color: var(--wms-primary);
}

.sidebar .nav .nav-item.open > .nav-link .menu-arrow,
.sidebar .nav .nav-item > .nav-link[aria-expanded='true'] .menu-arrow {
    transform: rotate(90deg);
}

.sidebar .wms-submenu-collapse {
    margin-top: .25rem;
}

.sidebar .sub-menu,
.sidebar .wms-submenu-list {
    margin: 0 0 .45rem;
    padding: .55rem !important;
    border: 1px solid #e4edf4;
    border-radius: 14px;
    background: #f8fbfd !important;
}

.sidebar .sub-menu .nav-item {
    margin-bottom: .14rem;
}

.sidebar .sub-menu .nav-item::before {
    display: none;
}

.sidebar .sub-menu .nav-link {
    display: flex;
    min-height: 38px !important;
    align-items: center;
    padding: .58rem .7rem !important;
    border-radius: 10px !important;
    color: #516375 !important;
    font-size: .78rem;
    font-weight: 600 !important;
    line-height: 1.28;
    transition: all .18s ease;
}

.sidebar .sub-menu .nav-link::before {
    width: 6px;
    height: 6px;
    margin-right: .65rem;
    border-radius: 50%;
    background: #c1ccda;
    content: '';
    flex: 0 0 6px;
}

.sidebar .sub-menu .nav-link:hover {
    background: #eef4f8 !important;
    color: var(--wms-primary-dark) !important;
}

.sidebar .sub-menu .nav-link:hover::before {
    background: #93aec4;
}

.sidebar .sub-menu .nav-link.active {
    background: #e9f3fa !important;
    color: var(--wms-primary-dark) !important;
    box-shadow: inset 3px 0 0 var(--wms-primary);
    font-weight: 700 !important;
}

.sidebar .sub-menu .nav-link.active::before {
    background: var(--wms-primary);
}

.main-panel {
    width: calc(100% - var(--wms-sidebar-width));
}

.wms-content-wrapper {
    min-height: calc(100vh - var(--wms-navbar-height) - 58px);
    padding: 1.45rem 1.55rem 2rem;
    background: var(--wms-surface);
}

.wms-footer {
    padding: 1rem 1.55rem;
    border-top: 1px solid var(--wms-border-soft);
    background: #fff;
    color: var(--wms-muted);
    font-size: .7rem;
}

.sidebar-icon-only .navbar .navbar-brand-wrapper,
.sidebar-icon-only .sidebar {
    width: var(--wms-sidebar-mini-width);
}

.sidebar-icon-only .navbar .navbar-menu-wrapper,
.sidebar-icon-only .main-panel {
    width: calc(100% - var(--wms-sidebar-mini-width));
}

.sidebar-icon-only .wms-brand {
    justify-content: center;
    padding: 0;
}

.sidebar-icon-only .wms-brand-copy,
.sidebar-icon-only .sidebar .nav-category {
    display: none;
}

.sidebar-icon-only .wms-brand-logo-box,
.sidebar-icon-only .wms-brand-mark {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
}


@media (max-width: 991.98px) {
    .navbar .navbar-brand-wrapper {
        width: auto;
        padding-right: .75rem;
    }

    .wms-brand {
        padding-right: 0;
    }

    .wms-brand-copy small {
        display: none;
    }
}

/* Shared page shell */
.wms-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.wms-page-header-main {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .9rem;
}

.wms-page-icon {
    display: inline-flex;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    align-items: center;
    justify-content: center;
    border: 1px solid #d6e6ef;
    border-radius: 12px;
    background: var(--wms-primary-soft);
    color: var(--wms-primary);
    font-size: 1.05rem;
}

.wms-page-eyebrow,
.wms-section-kicker {
    display: block;
    margin-bottom: .2rem;
    color: var(--wms-primary);
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .085em;
    text-transform: uppercase;
}

.wms-page-title {
    margin: 0;
    color: var(--wms-text);
    font-size: 1.45rem;
    font-weight: 800;
    letter-spacing: -.025em;
    line-height: 1.15;
}

.wms-subtitle {
    margin: .28rem 0 0;
    color: var(--wms-muted);
    font-size: .8rem;
    line-height: 1.45;
}

.wms-page-header-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: .55rem;
}

.wms-btn-compact,
.wms-form-actions .btn,
.wms-empty-state .btn,
.wms-filter-actions .btn {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    border-radius: 9px;
    padding: .55rem .85rem;
    font-size: .78rem;
    font-weight: 700;
}

body.wms-app .btn-primary {
    border-color: var(--wms-primary);
    background: var(--wms-primary);
}

body.wms-app .btn-primary:hover,
body.wms-app .btn-primary:focus {
    border-color: var(--wms-primary-dark);
    background: var(--wms-primary-dark);
}

body.wms-app .btn-light {
    border-color: var(--wms-border);
    background: #fff;
    color: #536273;
}

body.wms-app .btn-light:hover {
    background: #f5f8fa;
}

.wms-header-badge {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    gap: .4rem;
    padding: .42rem .7rem;
    border: 1px solid var(--wms-border);
    border-radius: 999px;
    background: #fff;
    color: var(--wms-muted);
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .04em;
}

.wms-header-badge.is-success {
    border-color: #c8e7d3;
    background: var(--wms-success-soft);
    color: var(--wms-success);
}

.wms-header-badge.is-danger {
    border-color: #f0ccc8;
    background: var(--wms-danger-soft);
    color: var(--wms-danger);
}

.wms-header-badge.is-muted {
    background: #f5f7f9;
    color: #657384;
}

.wms-panel {
    overflow: hidden;
    border: 1px solid var(--wms-border);
    border-radius: var(--wms-radius);
    background: var(--wms-card);
    box-shadow: var(--wms-shadow);
}

.wms-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border-bottom: 1px solid var(--wms-border-soft);
    background: #fff;
}

.wms-card-header h2,
.wms-section-heading h2,
.wms-form-section-head h2 {
    margin: 0;
    color: var(--wms-text);
    font-size: .98rem;
    font-weight: 800;
}

.wms-result-count {
    display: inline-flex;
    align-items: center;
    padding: .3rem .6rem;
    border-radius: 999px;
    background: #f1f5f8;
    color: #687687;
    font-size: .68rem;
    font-weight: 700;
}

.wms-card-footer {
    padding: .85rem 1.15rem;
    border-top: 1px solid var(--wms-border-soft);
    background: #fff;
}

/* Alerts and notices */
.wms-alert {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    margin-bottom: 1rem;
    padding: .78rem 2.8rem .78rem .85rem;
    border-radius: 11px;
    font-size: .78rem;
}

.wms-alert-icon {
    display: inline-flex;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
}

.wms-alert strong,
.wms-alert span:not(.wms-alert-icon) {
    display: block;
}

.wms-alert strong {
    margin-bottom: .12rem;
}

.wms-alert-success {
    border-color: #c8e7d3;
    background: var(--wms-success-soft);
    color: #176333;
}

.wms-alert-success .wms-alert-icon {
    background: #d5efdd;
}

.wms-alert-danger {
    border-color: #f0ccc8;
    background: var(--wms-danger-soft);
    color: #923932;
}

.wms-alert-danger .wms-alert-icon {
    background: #f7dcd9;
}

.wms-alert-warning {
    border-color: #ecdba8;
    background: var(--wms-warning-soft);
    color: #79510a;
}

.wms-alert-warning .wms-alert-icon {
    background: #f7e9ba;
}

.wms-inline-notice {
    display: flex;
    align-items: flex-start;
    gap: .72rem;
    margin-bottom: 1rem;
    padding: .72rem .85rem;
    border: 1px solid #d7e4ec;
    border-radius: 11px;
    background: #f7fafc;
}

.wms-inline-notice > span {
    display: inline-flex;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #e8f1f6;
    color: var(--wms-primary);
}

.wms-inline-notice strong,
.wms-inline-notice p {
    display: block;
}

.wms-inline-notice strong {
    margin-top: .05rem;
    font-size: .78rem;
}

.wms-inline-notice p {
    margin: .12rem 0 0;
    color: var(--wms-muted);
    font-size: .74rem;
}

.wms-inline-notice.is-warning {
    border-color: #ead9a5;
    background: var(--wms-warning-soft);
}

.wms-inline-notice.is-warning > span {
    background: #f7e9ba;
    color: var(--wms-warning);
}

/* Forms and filters */
body.wms-app .form-label {
    margin-bottom: .38rem;
    color: #39495a;
    font-size: .72rem;
    font-weight: 700;
}

body.wms-app .form-label > span {
    color: var(--wms-danger);
}

body.wms-app .form-control,
body.wms-app .form-select {
    min-height: 41px;
    border-color: #d6dfe7;
    border-radius: 9px;
    padding: .5rem .68rem;
    color: var(--wms-text);
    font-size: .79rem;
}

body.wms-app textarea.form-control {
    min-height: 82px;
    resize: vertical;
}

body.wms-app .form-control::placeholder {
    color: #a1acb8;
}

body.wms-app .form-control:focus,
body.wms-app .form-select:focus {
    border-color: #7eb2cf;
    box-shadow: 0 0 0 3px rgba(21, 94, 139, .1);
}

body.wms-app .form-control[readonly],
body.wms-app .form-select:disabled {
    background: #f4f6f8;
    color: #657384;
}

.form-text {
    display: block;
    margin-top: .36rem;
    color: var(--wms-muted) !important;
    font-size: .68rem;
    line-height: 1.35;
}

.wms-input-group .input-group-text {
    border-color: #d6dfe7;
    border-radius: 9px 0 0 9px;
    background: #fff;
    color: #8491a0;
}

.wms-input-group .form-control {
    border-left: 0;
}

.wms-filter-panel .card-body {
    padding: .95rem 1rem;
}

.wms-filter-actions {
    display: flex;
    align-items: center;
    gap: .45rem;
}

.wms-filter-actions .btn:first-child {
    flex: 1;
}

.wms-filter-actions .btn-light {
    width: 40px;
    flex: 0 0 40px;
    padding: 0;
}

.wms-form-section {
    padding: 1.15rem;
    border: 1px solid var(--wms-border);
    border-radius: var(--wms-radius);
    background: #fff;
    box-shadow: var(--wms-shadow);
}

.wms-form-section-head {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    margin-bottom: 1rem;
    padding-bottom: .85rem;
    border-bottom: 1px solid var(--wms-border-soft);
}

.wms-form-section-head > span {
    display: inline-flex;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: var(--wms-primary-soft);
    color: var(--wms-primary);
}

.wms-form-section-head p {
    margin: .22rem 0 0;
    color: var(--wms-muted);
    font-size: .72rem;
}

.wms-field-meta {
    display: flex;
    justify-content: space-between;
    margin-top: .35rem;
    color: var(--wms-muted);
    font-size: .67rem;
}

.wms-field-note {
    display: flex;
    align-items: center;
    gap: .35rem;
    margin-top: .38rem;
    padding: .42rem .55rem;
    border-radius: 8px;
    background: var(--wms-warning-soft);
    color: #805609;
    font-size: .67rem;
}

.wms-form-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-top: 1rem;
    padding: .8rem 0 0;
}

.wms-code-preview {
    display: flex;
    align-items: center;
    gap: .72rem;
    margin-top: 1rem;
    padding: .72rem .8rem;
    border: 1px dashed #b7c9d5;
    border-radius: 10px;
    background: #f8fbfd;
}

.wms-code-preview > span {
    display: inline-flex;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: var(--wms-primary-soft);
    color: var(--wms-primary);
}

.wms-code-preview small,
.wms-code-preview code {
    display: block;
}

.wms-code-preview small {
    margin-bottom: .16rem;
    color: var(--wms-muted);
    font-size: .65rem;
}

.wms-code-preview code {
    color: var(--wms-primary-dark);
    font-size: .8rem;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.wms-summary-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid var(--wms-border);
    border-radius: 12px;
    background: #fff;
    box-shadow: var(--wms-shadow);
}

.wms-summary-strip > div {
    display: grid;
    grid-template-columns: 34px auto;
    grid-template-rows: auto auto;
    column-gap: .7rem;
    padding: .8rem 1rem;
    border-right: 1px solid var(--wms-border-soft);
}

.wms-summary-strip > div:last-child {
    border-right: 0;
}

.wms-summary-strip span {
    display: inline-flex;
    grid-row: 1 / span 2;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: var(--wms-primary-soft);
    color: var(--wms-primary);
}

.wms-summary-strip strong {
    font-size: .95rem;
    line-height: 1.1;
}

.wms-summary-strip small {
    margin-top: .15rem;
    color: var(--wms-muted);
    font-size: .66rem;
}

/* Tables */
.wms-master-table {
    min-width: 900px;
}

.wms-zone-table {
    min-width: 1120px;
}

.wms-master-table thead th {
    padding: .72rem .9rem;
    border-bottom: 1px solid var(--wms-border);
    background: #f8fafb;
    color: #6a7888;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .065em;
    text-transform: uppercase;
    white-space: nowrap;
}

.wms-master-table tbody td {
    padding: .78rem .9rem;
    border-color: var(--wms-border-soft);
    color: #344354;
    vertical-align: middle;
}

.wms-master-table tbody tr:hover {
    background: #fbfcfd;
}

.wms-master-table td > small,
.wms-master-table td div > small {
    display: block;
    margin-top: .22rem;
    color: var(--wms-muted);
    font-size: .67rem;
    line-height: 1.35;
}

.wms-entity-cell {
    display: flex;
    min-width: 220px;
    align-items: center;
    gap: .72rem;
}

.wms-code-avatar {
    display: inline-flex;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--wms-primary-dark), var(--wms-primary));
    color: #fff;
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .03em;
}

.wms-entity-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .38rem;
}

.wms-entity-title strong,
.wms-master-table td > strong {
    color: #273646;
    font-size: .78rem;
}

.wms-inline-code {
    display: inline-flex;
    width: fit-content;
    padding: .16rem .36rem;
    border: 1px solid #d9e3ea;
    border-radius: 6px;
    background: #f6f9fb;
    color: var(--wms-primary-dark);
    font-family: Consolas, Monaco, monospace;
    font-size: .64rem;
    font-weight: 700;
}

.wms-number-cell {
    display: block;
    color: var(--wms-text);
    font-size: .88rem;
}

.wms-date-cell {
    display: block;
    color: #445364;
    font-size: .73rem;
    white-space: nowrap;
}

.wms-status-badge {
    display: inline-flex;
    align-items: center;
    gap: .38rem;
    padding: .28rem .52rem;
    border-radius: 999px;
    font-size: .66rem;
    font-weight: 700;
    white-space: nowrap;
}

.wms-status-badge > span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
}

.wms-status-badge.is-active {
    background: var(--wms-success-soft);
    color: var(--wms-success);
}

.wms-status-badge.is-active > span {
    background: var(--wms-success);
}

.wms-status-badge.is-inactive {
    background: #f0f2f4;
    color: #687586;
}

.wms-status-badge.is-inactive > span {
    background: #98a3ae;
}

.wms-setup-cell {
    min-width: 210px;
}

.wms-setup-cell strong,
.wms-setup-cell small,
.wms-setup-cell code {
    display: block;
}

.wms-setup-cell code {
    max-width: 260px;
    margin-top: .34rem;
    color: #4d6578;
    font-size: .64rem;
    overflow-wrap: anywhere;
}

.wms-action-button {
    display: inline-flex;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--wms-border);
    border-radius: 9px;
    background: #fff;
    color: #687687;
}

.wms-action-button:hover,
.wms-action-button:focus {
    border-color: #b8c7d2;
    background: #f5f8fa;
    color: var(--wms-primary);
}

.wms-action-menu {
    min-width: 180px;
    padding: .4rem;
    border: 1px solid var(--wms-border);
    border-radius: 11px;
    box-shadow: var(--wms-shadow);
}

.wms-action-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: .58rem;
    padding: .55rem .65rem;
    border-radius: 7px;
    font-size: .74rem;
}

.wms-action-menu .dropdown-item i {
    width: 15px;
    text-align: center;
}

.dropdown-item:disabled,
.dropdown-item.disabled {
    cursor: not-allowed;
    opacity: .42;
}

.wms-locked-action {
    display: inline-flex;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #f2f4f6;
    color: #98a3ae;
}

.wms-empty-state {
    padding: 3rem 1rem;
    text-align: center;
}

.wms-empty-state > span,
.wms-empty-icon {
    display: inline-flex;
    width: 54px;
    height: 54px;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    background: var(--wms-primary-soft);
    color: var(--wms-primary);
    font-size: 1.25rem;
}

.wms-empty-state h3 {
    margin: .9rem 0 .25rem;
    font-size: .95rem;
    font-weight: 800;
}

.wms-empty-state p {
    max-width: 440px;
    margin: 0 auto .9rem;
    color: var(--wms-muted);
    font-size: .75rem;
}

/* Dashboard */
.wms-stat-card {
    overflow: hidden;
    border: 1px solid var(--wms-border);
    border-radius: var(--wms-radius);
    background: #fff;
    box-shadow: var(--wms-shadow);
}

.wms-stat-card .card-body {
    padding: 1rem;
}

.wms-stat-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .7rem;
}

.wms-stat-icon {
    display: inline-flex;
    width: 38px;
    height: 38px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: var(--wms-primary-soft);
    color: var(--wms-primary);
    font-size: .95rem;
}

.wms-stat-trend {
    display: inline-flex;
    align-items: center;
    padding: .24rem .46rem;
    border-radius: 999px;
    font-size: .59rem;
    font-weight: 700;
}

.wms-stat-trend.is-ready {
    background: var(--wms-success-soft);
    color: var(--wms-success);
}

.wms-stat-trend.is-muted {
    background: #f0f2f4;
    color: #7b8794;
}

.wms-stat-value {
    margin-top: .85rem;
    color: var(--wms-text);
    font-size: 1.65rem;
    font-weight: 800;
    line-height: 1;
}

.wms-stat-label {
    margin: .34rem 0 0;
    color: #334253;
    font-size: .78rem;
    font-weight: 700;
}

.wms-stat-hint {
    display: block;
    margin-top: .18rem;
    color: var(--wms-muted);
    font-size: .64rem;
}

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

.wms-section-heading p {
    margin: .28rem 0 0;
    color: var(--wms-muted);
    font-size: .72rem;
}

.wms-shortcut-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.wms-shortcut-card {
    display: grid;
    grid-template-columns: 38px 1fr auto;
    align-items: center;
    gap: .72rem;
    min-height: 74px;
    padding: .75rem;
    border: 1px solid var(--wms-border);
    border-radius: 11px;
    background: #fff;
    color: var(--wms-text);
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.wms-shortcut-card:hover {
    border-color: #aec8d8;
    box-shadow: 0 8px 20px rgba(21, 42, 60, .07);
    color: var(--wms-primary-dark);
    transform: translateY(-1px);
}

.wms-shortcut-card > span {
    display: inline-flex;
    width: 38px;
    height: 38px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: var(--wms-primary-soft);
    color: var(--wms-primary);
}

.wms-shortcut-card strong,
.wms-shortcut-card small {
    display: block;
}

.wms-shortcut-card strong {
    font-size: .75rem;
}

.wms-shortcut-card small {
    margin-top: .18rem;
    color: var(--wms-muted);
    font-size: .64rem;
}

.wms-shortcut-card > i {
    color: #9aa6b2;
    font-size: .72rem;
}

.wms-activity-empty {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-top: 1rem;
    padding: .78rem;
    border-radius: 10px;
    background: #f7f9fb;
}

.wms-activity-empty > span {
    display: inline-flex;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #eaf0f4;
    color: #667688;
}

.wms-activity-empty strong {
    display: block;
    font-size: .72rem;
}

.wms-activity-empty p {
    margin: .15rem 0 0;
    color: var(--wms-muted);
    font-size: .65rem;
}

.wms-health-hero {
    display: flex;
    align-items: center;
    gap: .72rem;
    padding: .8rem;
    border: 1px solid var(--wms-border);
    border-radius: 11px;
}

.wms-health-hero > span {
    display: inline-flex;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

.wms-health-hero small,
.wms-health-hero strong {
    display: block;
}

.wms-health-hero small {
    margin-bottom: .15rem;
    font-size: .63rem;
}

.wms-health-hero strong {
    font-size: .8rem;
}

.wms-health-hero.is-online {
    border-color: #c8e7d3;
    background: var(--wms-success-soft);
    color: #176333;
}

.wms-health-hero.is-online > span {
    background: #d5efdd;
}

.wms-health-hero.is-offline {
    border-color: #f0ccc8;
    background: var(--wms-danger-soft);
    color: #923932;
}

.wms-health-hero.is-offline > span {
    background: #f7dcd9;
}

.wms-health-list {
    margin: .8rem 0 0;
}

.wms-health-list > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .56rem 0;
    border-bottom: 1px solid var(--wms-border-soft);
}

.wms-health-list > div:last-child {
    border-bottom: 0;
}

.wms-health-list dt,
.wms-health-list dd {
    margin: 0;
    font-size: .7rem;
}

.wms-health-list dt {
    color: var(--wms-muted);
    font-weight: 500;
}

.wms-health-list dd {
    max-width: 58%;
    color: #354455;
    font-weight: 700;
    text-align: right;
    overflow-wrap: anywhere;
}

.wms-health-list .is-reference dd {
    color: var(--wms-danger);
    font-family: Consolas, Monaco, monospace;
    font-size: .62rem;
}

/* Placeholder, scanner and error pages */
.wms-placeholder {
    min-height: 360px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    text-align: center;
}

.wms-scanner-shell {
    max-width: 560px;
    margin: 0 auto;
}

.wms-scan-button {
    width: 100%;
    min-height: 72px;
    border: 0;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--wms-primary-dark), var(--wms-primary));
    color: #fff;
    font-size: .95rem;
    font-weight: 800;
    box-shadow: 0 12px 24px rgba(21, 94, 139, .2);
}

.wms-error-page {
    min-height: 100vh;
    background: radial-gradient(circle at top right, rgba(255, 255, 255, .13), transparent 34%), linear-gradient(135deg, var(--wms-primary-dark), var(--wms-primary));
}

.wms-error-card {
    width: min(900px, calc(100% - 2rem));
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 24px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .18);
}

.wms-error-code-number {
    color: var(--wms-primary);
    font-size: clamp(4.5rem, 12vw, 8.5rem);
    font-weight: 900;
    letter-spacing: -.08em;
    line-height: .9;
}

.wms-reference {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .7rem 1rem;
    border: 1px dashed #b7c6d6;
    border-radius: 12px;
    background: #f7fafc;
    color: var(--wms-primary-dark);
    font-family: Consolas, Monaco, monospace;
    font-weight: 700;
}

/* Responsive */
@media (max-width: 1199.98px) {
    .wms-content-wrapper {
        padding: 1.25rem;
    }
}

@media (max-width: 991.98px) {
    .navbar .navbar-brand-wrapper {
        width: var(--wms-sidebar-mini-width);
    }

    .navbar .navbar-menu-wrapper {
        width: calc(100% - var(--wms-sidebar-mini-width));
        padding: 0 .75rem;
    }

    .wms-brand {
        justify-content: center;
        padding: 0;
    }

    .wms-brand-copy {
        display: none;
    }

    .main-panel {
        width: 100%;
    }

    .wms-page-header {
        align-items: flex-start;
    }

    .wms-summary-strip {
        grid-template-columns: 1fr;
    }

    .wms-summary-strip > div {
        border-right: 0;
        border-bottom: 1px solid var(--wms-border-soft);
    }

    .wms-summary-strip > div:last-child {
        border-bottom: 0;
    }
}

@media (max-width: 767.98px) {
    .wms-content-wrapper {
        padding: 1rem .8rem 1.5rem;
    }

    .wms-page-header {
        flex-direction: column;
        margin-bottom: 1rem;
    }

    .wms-page-header-actions {
        width: 100%;
        flex-wrap: wrap;
    }

    .wms-page-header-actions .btn {
        flex: 1;
    }

    .wms-page-title {
        font-size: 1.25rem;
    }

    .wms-page-icon {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
    }

    .wms-shortcut-grid {
        grid-template-columns: 1fr;
    }

    .wms-form-section {
        padding: .9rem;
    }

    .wms-form-actions {
        flex-direction: column-reverse;
    }

    .wms-form-actions .btn {
        width: 100%;
    }

    .wms-filter-actions .btn:first-child {
        flex: 1;
    }

    .wms-footer {
        padding: .9rem;
        text-align: center;
    }
}
