:root {
    /*    --wm-dark-green: #346132;
    --wm-dark-green-rgb: 52, 97, 50;
    --wm-green: #3AAA35;
    --wm-green-rgb: 58, 170, 53;
    --wm-yellow: #D3D800;
    --wm-yellow-rgb: 211, 216, 0;*/
    /*    --wm-body-bg: #e6F4e5;*/
    --wm-border-radius: .65rem;
    --wm-body-bg: #3aaa3521;
    /*    --wm-body-bg-2: #f5f5f5;*/
    --wm-green-100: #f2fAf1;
    --wm-border-color: #dee2e6;
    /*    --wm-green-100: var(--bs-light);*/
    /*    --wm-border-color: rgba(var(--bs-wm-green-rgb), .35);*/
    /*    --bs-border-color: var(--wm-border-color);*/
    --wm-caret-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708'/%3e%3c/svg%3e");
    --bs-border-color: var(--wm-border-color);
    --wm-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
    --bg-soft: #f7f9fb;
    --text-muted: #8a98ad;
    --primary-green: #159570;
    --light-green: #eaf9f3;
}

html {
    font-size: 0.85rem;
}

.toast {
    --bs-toast-spacing: 0.75rem;
}

.wm-action-toast {
    --wm-action-toast-accent: var(--bs-info-text-emphasis);
    --wm-action-toast-icon-bg: var(--bs-info-bg-subtle);
    display: grid;
    width: min(28rem, calc(100vw - 2rem));
    max-width: none;
    grid-template-columns: 2.75rem minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.875rem;
    padding: 1rem;
    overflow: hidden;
    color: var(--bs-body-color);
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--wm-radius-xl);
    box-shadow: var(--wm-shadow-lg, 0 1rem 2.5rem rgba(0, 0, 0, 0.16));
}

.wm-action-toast--success {
    --wm-action-toast-accent: var(--bs-success-text-emphasis);
    --wm-action-toast-icon-bg: var(--bs-success-bg-subtle);
}

.wm-action-toast--warning {
    --wm-action-toast-accent: var(--bs-warning-text-emphasis);
    --wm-action-toast-icon-bg: var(--bs-warning-bg-subtle);
}

.wm-action-toast--danger {
    --wm-action-toast-accent: var(--bs-danger-text-emphasis);
    --wm-action-toast-icon-bg: var(--bs-danger-bg-subtle);
}

.wm-action-toast--primary {
    --wm-action-toast-accent: var(--bs-primary-text-emphasis);
    --wm-action-toast-icon-bg: var(--bs-primary-bg-subtle);
}

.wm-action-toast__icon {
    display: inline-flex;
    width: 2.75rem;
    height: 2.75rem;
    align-items: center;
    justify-content: center;
    color: var(--wm-action-toast-accent);
    font-size: 1.1rem;
    background: var(--wm-action-toast-icon-bg);
    border-radius: var(--wm-radius-lg);
}

.wm-action-toast__content {
    min-width: 0;
}

.wm-action-toast__label {
    margin-bottom: 0.2rem;
    color: var(--wm-action-toast-accent);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.035em;
    line-height: 1.2;
    text-transform: uppercase;
}

.wm-action-toast__message {
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.wm-action-toast__close {
    margin: 0.1rem 0 0;
    opacity: 0.58;
}

.wm-action-toast__close:hover,
.wm-action-toast__close:focus-visible {
    opacity: 1;
}

.address-selector-result {
    margin-top: 0.875rem;
}

.address-result-card {
    display: grid;
    grid-template-columns: 2.75rem minmax(0, 1fr);
    align-items: start;
    gap: 0.875rem;
    padding: 1rem;
    background: #fff;
    border: 1px solid var(--wm-border);
    border-radius: var(--wm-radius-xl);
    box-shadow: var(--wm-shadow-sm);
}

.address-result-card--found {
    border-color: rgba(var(--wm-primary-rgb), 0.22);
}

.address-result-card--not-found {
    color: var(--bs-body-color);
}

.address-result-card__icon {
    display: inline-flex;
    width: 2.75rem;
    height: 2.75rem;
    align-items: center;
    justify-content: center;
    color: var(--wm-primary);
    font-size: 1.05rem;
    background: #fff;
    border: 1px solid rgba(var(--wm-primary-rgb), 0.14);
    border-radius: var(--wm-radius-lg);
    box-shadow: var(--wm-shadow-sm);
}

.address-result-card--not-found .address-result-card__icon {
    color: var(--wm-danger-text);
}

.address-result-card__content {
    min-width: 0;
}

.address-result-card__heading {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.75rem;
    margin-bottom: 0.3rem;
}

.address-result-card__eyebrow {
    color: var(--wm-primary);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.055em;
    line-height: 1.2;
    text-transform: uppercase;
}

.address-result-card__address {
    margin: 0;
    font-style: normal;
}

.address-result-card__address > strong {
    display: block;
    margin-bottom: 0.35rem;
    color: var(--bs-body-color);
    font-size: 1rem;
    font-weight: 650;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.address-result-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 1rem;
    color: var(--wm-muted);
    font-size: 0.82rem;
}

.address-result-card__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    white-space: nowrap;
}

.address-result-card__meta-item > i {
    width: 0.9rem;
    color: var(--wm-primary);
    font-size: 0.75rem;
    text-align: center;
}

.address-result-card__title {
    margin: 0 0 0.2rem;
    color: var(--wm-danger-text);
    font-size: 1rem;
    font-weight: 650;
    line-height: 1.35;
}

.address-result-card__description {
    margin: 0;
    color: var(--wm-muted);
    font-size: 0.82rem;
    line-height: 1.45;
}

/* Reusable identity header and key-information summary. */
.wm-identity-panel {
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(var(--wm-primary-rgb), 0.12);
    border-radius: var(--wm-radius-xl);
    box-shadow: var(--wm-shadow-sm);
}

.wm-identity-panel__body {
    padding: 1.5rem 2rem 2rem;
}

.wm-identity-header {
    position: relative;
    display: flex;
    overflow: hidden;
    align-items: center;
    gap: 1.25rem;
    padding: 1.75rem 2rem;
    background: #fff;
    border-bottom: 1px solid rgba(var(--wm-primary-rgb), 0.09);
}

.wm-identity-header::after {
    position: absolute;
    top: -5rem;
    right: -4rem;
    width: 13rem;
    height: 13rem;
    border: 2.5rem solid rgba(var(--wm-primary-rgb), 0.05);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.wm-identity-media {
    position: relative;
    z-index: 1;
    display: inline-flex;
    width: 5rem;
    height: 5rem;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    padding: 0.35rem;
    color: var(--wm-primary);
    background: #fff;
    border: 1px solid rgba(var(--wm-primary-rgb), 0.14);
    border-radius: var(--wm-radius-lg);
    box-shadow: var(--wm-shadow-md);
}

.wm-identity-media > img {
    width: 100%;
    height: 100%;
    border-radius: calc(var(--wm-radius-lg) - 0.25rem);
    object-fit: cover;
}

.wm-identity-media > i {
    font-size: 1.75rem;
}

.wm-person-photo-button {
    cursor: pointer;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.wm-person-photo-button:hover,
.wm-person-photo-button:focus-visible {
    border-color: var(--wm-primary);
    box-shadow: 0 0 0 3px rgba(var(--wm-primary-rgb), 0.15);
}

.wm-person-photo-edit {
    position: absolute;
    right: 0.15rem;
    bottom: 0.15rem;
    display: grid;
    place-items: center;
    width: 1.35rem;
    height: 1.35rem;
    border-radius: 50%;
    background: #fff;
    box-shadow: var(--wm-shadow-sm);
    font-size: 0.75rem;
}

.wm-identity-content {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    min-width: 0;
}

.wm-identity-content .page-details-title {
    margin: 0;
}

.wm-identity-header .wm-identity-content > h1,
.wm-identity-header .reservation-title-row > h1 {
    color: var(--wm-primary);
    font-size: clamp(1.55rem, 3vw, 2.2rem);
}

.wm-identity-actions {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
}

.wm-identity-eyebrow {
    margin-bottom: 0.2rem;
    color: var(--wm-muted);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.wm-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.75rem;
    color: var(--wm-success-text);
    font-size: 0.78rem;
    font-weight: 500;
    line-height: 1;
    background: var(--wm-success-bg);
    border: 1px solid rgba(var(--wm-primary-rgb), 0.09);
    border-radius: var(--wm-radius-pill);
}

.wm-status-badge__dot {
    width: 0.45rem;
    height: 0.45rem;
    flex: 0 0 auto;
    background: var(--wm-green);
    border-radius: 50%;
}

.wm-status-badge--inactive {
    color: var(--wm-danger-text);
    background: var(--wm-danger-bg);
}

.wm-status-badge--inactive .wm-status-badge__dot {
    background: var(--wm-danger-text);
}

.wm-status-badge--archived {
    color: var(--wm-info-text);
    background: var(--wm-info-bg);
}

.wm-status-badge--archived .wm-status-badge__dot {
    background: var(--wm-info-text);
}

.wm-status-badge--neutral {
    color: var(--wm-muted);
    background: var(--wm-surface);
}

.wm-status-badge--neutral .wm-status-badge__dot {
    background: var(--wm-muted);
}

.wm-info-note {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    margin: 0;
    color: var(--wm-muted);
    font-size: .85rem;
    line-height: 1.7;
}

.wm-info-note > i {
    flex-shrink: 0;
    color: var(--wm-primary);
}

.wm-info-note > span {
    min-width: 0;
    color: var(--wm-gray);
    font-style: italic;
    overflow-wrap: anywhere;
}

.wm-info-section {
    display: grid;
    grid-template-columns: 2.65rem minmax(0, 1fr);
    align-items: start;
    gap: 0.7rem;
    padding: 1.5rem 2rem 1.75rem;
    background: #fff;
}

.wm-info-section__body {
    display: grid;
    min-width: 0;
    gap: 0;
}

.wm-info-section-header {
    min-width: 0;
}

.wm-info-section-header__icon {
    display: inline-flex;
    width: 2.65rem;
    height: 2.65rem;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    color: var(--wm-primary);
    font-size: 1.08rem;
    background: rgba(var(--wm-primary-rgb), 0.1);
    border-radius: 0.7rem;
}

.wm-info-section-header h2 {
    margin: 0;
    color: var(--wm-success-text);
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.3;
}

.wm-info-section-header p {
    max-width: 42rem;
    margin: 0.12rem 0 0;
    color: var(--wm-gray);
    font-size: 0.85rem;
    line-height: 1.4;
}

.wm-info-grid {
    display: grid;
    gap: 1.35rem 0;
    margin: 0;
}

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

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

.wm-info-item {
    display: flex;
    min-width: 0;
    min-height: 3.65rem;
    flex-direction: column;
    padding: 0.15rem clamp(1.25rem, 2vw, 2rem) 0.15rem 0;
}

.wm-info-grid--3 .wm-info-item:nth-child(3n + 2),
.wm-info-grid--3 .wm-info-item:nth-child(3n + 3) {
    padding-left: clamp(1.25rem, 2vw, 2rem);
}

.wm-info-grid--4 .wm-info-item:nth-child(4n + 2),
.wm-info-grid--4 .wm-info-item:nth-child(4n + 3),
.wm-info-grid--4 .wm-info-item:nth-child(4n + 4) {
    padding-left: clamp(1.25rem, 2vw, 2rem);
}

.wm-info-item__label {
    display: block;
    margin: 0 0 0.28rem;
    color: var(--wm-gray);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    line-height: 1.25;
    text-transform: uppercase;
}

.wm-info-item__value {
    margin: 0;
    color: var(--wm-success-text);
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.wm-info-item__meta {
    display: block;
    margin-top: 0.16rem;
    color: var(--wm-gray);
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

@media (max-width: 1199.98px) {
    .wm-info-grid--3,
    .wm-info-grid--4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    :is(.wm-info-grid--3, .wm-info-grid--4) .wm-info-item:nth-child(n) {
        padding-left: 0;
    }

    :is(.wm-info-grid--3, .wm-info-grid--4) .wm-info-item:nth-child(even) {
        padding-left: clamp(1.25rem, 3vw, 2rem);
    }
}

@media (max-width: 767.98px) {
    .wm-info-grid--3,
    .wm-info-grid--4 {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    :is(.wm-info-grid--3, .wm-info-grid--4) .wm-info-item:nth-child(n) {
        padding-right: 0;
        padding-left: 0;
    }
}

@media (max-width: 575.98px) {
    .wm-identity-header {
        align-items: flex-start;
        flex-direction: column;
        padding: 1.25rem;
    }

    .wm-identity-media {
        width: 4rem;
        height: 4rem;
    }

    .wm-identity-panel__body {
        padding: 1rem;
    }

    .wm-info-section {
        padding: 1rem;
    }

    .address-result-card {
        grid-template-columns: 2.4rem minmax(0, 1fr);
        gap: 0.75rem;
        padding: 0.875rem;
    }

    .address-result-card__icon {
        width: 2.4rem;
        height: 2.4rem;
    }

    .address-result-card__heading {
        align-items: flex-start;
    }

    .address-result-card__meta {
        flex-direction: column;
        gap: 0.25rem;
    }
}

.notification-toast-container {
    --bs-toast-zindex: 1090;
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: var(--bs-toast-zindex);
    display: grid;
    width: min(24rem, calc(100vw - 2rem));
    gap: 0.75rem;
    pointer-events: none;
}

.wm-notification-toast
{
    --wm-notification-toast-accent: var(--wm-warning-text);
    --wm-notification-toast-icon-bg: var(--wm-warning-bg);
    display: grid;
    width: 100%;
    max-width: none;
    min-height: 6.25rem;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 1rem;
    padding: 1rem;
    overflow: hidden;
    color: var(--bs-body-color);
    background: #fff;
    border: 1px solid var(--bs-border-color);
    border-radius: var(--wm-radius-xl);
    box-shadow: var(--wm-shadow-md);
    pointer-events: auto;
    transition: transform 160ms ease, box-shadow 160ms ease;
}

.wm-notification-toast--task {
    --wm-notification-toast-accent: var(--wm-primary);
    --wm-notification-toast-icon-bg: var(--wm-primary-light);
}

.wm-notification-toast__content {
    min-width: 0;
}

.wm-notification-toast__label
{
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 1.35rem;
    padding: 0.18rem 0.48rem;
    color: var(--wm-notification-toast-accent);
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    line-height: 1.2;
    background: var(--wm-notification-toast-icon-bg);
    border-radius: var(--wm-radius-pill);
    text-transform: uppercase;
}

.wm-notification-toast__title {
    margin-top: 0.38rem;
    overflow: hidden;
    color: var(--bs-emphasis-color);
    font-size: 0.92rem;
    font-weight: 750;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wm-notification-toast__description {
    display: -webkit-box;
    margin-top: 0.28rem;
    overflow: hidden;
    color: var(--wm-muted);
    font-size: 0.76rem;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.wm-notification-toast__meta {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin-top: 0.55rem;
    color: var(--wm-muted);
    font-size: 0.68rem;
}

.wm-notification-toast__close {
    width: 0.7rem;
    height: 0.7rem;
    padding: 0.4rem;
    margin: 0;
    font-size: 0.65rem;
    background-color: transparent;
    border-radius: var(--wm-radius-pill);
    opacity: 0.5;
}

.wm-notification-toast__link {
    text-decoration: none;
}

.wm-notification-toast__close:hover,
.wm-notification-toast__close:focus-visible {
    opacity: 0.8;
}

.wm-notification-toast:hover {
    transform: translateY(-0.1rem);
}

@media (max-width: 575.98px) {
    .notification-toast-container {
        top: 0.75rem;
        right: 0.75rem;
        width: calc(100vw - 1.5rem);
    }
}

@media (prefers-reduced-motion: reduce) {
    .wm-notification-toast,
    .header-nav-badge {
        transition: none;
    }
}

.avatar {
    --bs-avatar-width: 2rem;
    --bs-avatar-height: 2rem;
    --bs-avatar-font-size: 0.8rem;
    --bs-avatar-border-radius: 50em;
    --bs-avatar-status-width: 0.5rem;
    --bs-avatar-status-height: 0.5rem;
    --bs-avatar-status-border-radius: 50em;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--bs-avatar-width);
    height: var(--bs-avatar-height);
    font-size: var(--bs-avatar-font-size);
    vertical-align: middle;
    border-radius: var(--bs-avatar-border-radius);
    transition: margin 0.15s;
}

@media (prefers-reduced-motion: reduce) {
    .avatar {
        transition: none;
    }
}

.avatar-img {
    width: 100%;
    height: auto;
    border-radius: var(--bs-avatar-border-radius);
}

.avatar-sm {
    --bs-avatar-width: 1.5rem;
    --bs-avatar-height: 1.5rem;
    --bs-avatar-font-size: 0.6rem;
    --bs-avatar-status-width: 0.4rem;
    --bs-avatar-status-height: 0.4rem;
}

.avatar-md {
    --bs-avatar-width: 2.5rem;
    --bs-avatar-height: 2.5rem;
    --bs-avatar-font-size: 1rem;
    --bs-avatar-status-width: 0.7rem;
    --bs-avatar-status-height: 0.7rem;
}

.avatar-lg {
    --bs-avatar-width: 3rem;
    --bs-avatar-height: 3rem;
    --bs-avatar-font-size: 1.2rem;
    --bs-avatar-status-width: 0.8rem;
    --bs-avatar-status-height: 0.8rem;
}

.avatar-xl {
    --bs-avatar-width: 4rem;
    --bs-avatar-height: 4rem;
    --bs-avatar-font-size: 1.6rem;
    --bs-avatar-status-width: 1rem;
    --bs-avatar-status-height: 1rem;
}

.icon {
    display: inline-block;
    color: inherit;
    text-align: center;
    vertical-align: -0.125rem;
    fill: currentcolor;

}

.icon-normal {
    width: 1rem;
    height: 1rem;
    font-size: 1rem;
}

.icon-xxl {
    width: 2rem;
    height: 2rem;
    font-size: 2rem;
}

.icon-xl {
    width: 1.5rem;
    height: 1.5rem;
    font-size: 1.5rem;
}

.icon-lg {
    width: 1.25rem;
    height: 1.25rem;
    font-size: 1.25rem;
}

.icon-sm {
    width: 0.875rem;
    height: 0.875rem;
    font-size: 0.875rem;
}

.icon-3xl {
    width: 3rem;
    height: 3rem;
    font-size: 3rem;
}

.icon-4xl {
    width: 4rem;
    height: 4rem;
    font-size: 4rem;
}

.icon-5xl {
    width: 5rem;
    height: 5rem;
    font-size: 5rem;
}

.icon-6xl {
    width: 6rem;
    height: 6rem;
    font-size: 6rem;
}

.icon-7xl {
    width: 7rem;
    height: 7rem;
    font-size: 7rem;
}

.icon-8xl {
    width: 8rem;
    height: 8rem;
    font-size: 8rem;
}

.icon-9xl {
    width: 9rem;
    height: 9rem;
    font-size: 9rem;
}

body {
    font-family: 'Google Sans', 'Nunito', sans-serif;
    background: radial-gradient(circle at 5% 5%, rgba(var(--wm-green-rgb), 0.13), transparent 0), #f4f7f3;
}

/* Shared authentication layout */
.wm-login-page {
    display: grid;
    min-height: 100vh;
    min-height: 100svh;
    padding: clamp(1rem, 3vw, 2rem);
    place-items: center;
    background: #f4f7f3;
}

.wm-login-shell {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    width: min(100%, 68rem);
    min-height: min(42rem, calc(100svh - 4rem));
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(var(--wm-primary-rgb), 0.1);
    border-radius: 1.5rem;
}

.wm-login-brand-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    isolation: isolate;
    padding: clamp(2rem, 5vw, 4rem);
    overflow: hidden;
    color: #fff;
    background:
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(145deg, rgba(255, 255, 255, 0.08), transparent 45%),
        linear-gradient(145deg, #2b542b, var(--wm-primary));
    background-size: 2.5rem 2.5rem, 2.5rem 2.5rem, auto, auto;
}

.wm-login-brand-panel::before,
.wm-login-brand-panel::after {
    position: absolute;
    z-index: -1;
    content: "";
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 50%;
}

.wm-login-brand-panel::before {
    right: -11rem;
    bottom: -8rem;
    width: 28rem;
    height: 28rem;
}

.wm-login-brand-panel::after {
    right: -3rem;
    bottom: -13rem;
    width: 22rem;
    height: 22rem;
    background: rgba(var(--wm-green-rgb), 0.18);
}

.wm-login-brand-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 2rem;
    margin: 0;
    text-align: left;
}

.wm-login-brand-header > div {
    padding-left: 0;
    border-left: 0;
}

.wm-login-mark {
    display: grid;
    flex: 0 0 auto;
    width: 4.75rem;
    height: 4.75rem;
    background: #fff;
    border-radius: 1.25rem;
    box-shadow: 0 0.75rem 2rem rgba(0, 0, 0, 0.12);
    place-items: center;
}

.wm-login-mark-image {
    width: 2.9rem;
    height: 2.9rem;
}

.wm-login-app-name {
    max-width: 12ch;
    margin: 0;
    color: #fff;
    font-size: clamp(2.5rem, 4.5vw, 3.75rem);
    font-weight: 600;
    letter-spacing: -0.05em;
    line-height: 1.08;
}

.wm-login-app-name-secondary {
    display: block;
    margin-top: 0.35rem;
    color: var(--wm-yellow);
    font-size: 0.62em;
    font-weight: 600;
    letter-spacing: -0.025em;
    line-height: 1.15;
}

.wm-login-product {
    width: fit-content;
    padding: 0.45rem 0.75rem;
    margin: 1rem 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    background: rgba(255, 255, 255, 0.09);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--wm-radius-pill);
}

.wm-login-brand-footer {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    padding-top: 1.25rem;
    margin-top: auto;
    gap: 0.55rem;
    color: rgba(255, 255, 255, 0.65);
    font-size: 0.8rem;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.wm-login-form-panel {
    display: grid;
    padding: clamp(2rem, 6vw, 5rem);
    background: #fff;
    place-items: center;
}

.wm-login-form-container {
    width: min(100%, 27rem);
}

.wm-login-form-kicker {
    margin: 0 0 0.6rem;
    color: var(--wm-green);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.wm-login-title {
    margin: 0;
    color: #1d2a1d;
    font-size: clamp(2rem, 4vw, 2.65rem);
    font-weight: 600;
    letter-spacing: -0.035em;
    line-height: 1.1;
}

.wm-login-intro {
    margin: 0.85rem 0 2rem;
    color: var(--wm-muted);
    font-size: 0.95rem;
    line-height: 1.6;
}

.wm-login-form-group {
    margin-bottom: 1.25rem;
}

.wm-login-label {
    display: block;
    margin-bottom: 0.5rem;
    color: #304030;
    font-size: 0.85rem;
    font-weight: 650;
}

.wm-login-field {
    display: flex;
    align-items: center;
    min-height: 3.65rem;
    overflow: hidden;
    background: #f8faf8;
    border: 1px solid #dce5dc;
    border-radius: 0.8rem;
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.wm-login-field:focus-within {
    background: #fff;
    border-color: var(--wm-green);
    box-shadow: 0 0 0 0.22rem rgba(var(--wm-green-rgb), 0.12);
}

.wm-login-field-icon {
    display: grid;
    flex: 0 0 3.5rem;
    color: #718071;
    place-items: center;
}

.wm-login-control {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0.9rem 0.75rem 0.9rem 0.35rem;
    font-family: inherit;
    font-size: 0.95rem;
    line-height: 1.5;
    background-color: transparent;
    background-image: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.wm-login-control::placeholder {
    color: var(--wm-muted);
    font: inherit;
    opacity: 0.75;
}

.wm-login-field .wm-login-control:focus {
    background-color: transparent;
    background-image: none;
    outline: 0;
    box-shadow: none;
}

.wm-login-field .wm-login-control:-webkit-autofill,
.wm-login-field .wm-login-control:-webkit-autofill:hover,
.wm-login-field .wm-login-control:-webkit-autofill:focus {
    -webkit-text-fill-color: #212529;
    caret-color: #212529;
    -webkit-box-shadow: 0 0 0 1000px #f8faf8 inset;
}

.wm-login-field:focus-within .wm-login-control:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #fff inset;
}

.wm-login-field:has(.input-validation-error) {
    border-color: var(--bs-danger);
}

.wm-login-password-toggle {
    display: grid;
    flex: 0 0 3.25rem;
    align-self: stretch;
    padding: 0;
    color: #718071;
    background: transparent;
    border: 0;
    border-radius: 0.75rem;
    place-items: center;
}

.wm-login-password-toggle:hover,
.wm-login-password-toggle:focus-visible {
    color: var(--wm-primary);
}

.wm-login-password-toggle:focus-visible {
    outline: 2px solid var(--wm-green);
    outline-offset: -4px;
}

.wm-login-validation {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.8rem;
}

.wm-login-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    min-height: 3.65rem;
    margin-top: 1.6rem;
    font-weight: 700;
    border-radius: 0.45rem;
    box-shadow: none;
}

.wm-login-alert {
    padding: 0.85rem 1rem;
    margin: 0 0 1.25rem;
    border-radius: var(--wm-radius-md);
}

.wm-login-alert ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.wm-login-alert.validation-summary-valid {
    display: none;
}

.wm-validation-alert {
    display: flex;
    align-items: center;
}

.wm-validation-alert ul {
    margin-bottom: 0;
}

.wm-validation-alert.validation-summary-valid {
    display: none;
}

.wm-login-security {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    margin: 1.5rem 0 0;
    color: #7a877a;
    font-size: 0.78rem;
}

@media (max-width: 767.98px) {
    .wm-login-page {
        padding: 0;
        background: #fff;
        place-items: stretch;
    }

    .wm-login-shell {
        grid-template-columns: 1fr;
        min-height: 100svh;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .wm-login-brand-panel {
        display: block;
        padding: 1.25rem 1.5rem;
        border-radius: 0 0 1.5rem 1.5rem;
    }

    .wm-login-brand-footer {
        display: none;
    }

    .wm-login-brand-header {
        flex-direction: row;
        align-items: center;
        gap: 0.85rem;
        margin: 0;
        text-align: left;
    }

    .wm-login-brand-header > div {
        padding-left: 0;
        border-left: 0;
    }

    .wm-login-mark {
        width: 2.6rem;
        height: 2.6rem;
        border-radius: 0.75rem;
    }

    .wm-login-mark-image {
        width: 1.65rem;
        height: 1.65rem;
    }

    .wm-login-app-name {
        max-width: none;
        font-size: clamp(1.3rem, 6vw, 1.75rem);
        letter-spacing: -0.025em;
        line-height: 1.15;
    }

    .wm-login-product {
        padding: 0;
        margin: 0.25rem 0 0;
        font-size: 0.7rem;
        background: transparent;
        border: 0;
        border-radius: 0;
    }

    .wm-login-form-panel {
        align-items: start;
        padding: clamp(2.25rem, 10vw, 4rem) 1.5rem 2rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wm-login-field,
    .wm-login-submit {
        transition: none;
    }
}

.wrapper {
    width: 100%;
    padding-inline: var(--bs-sidebar-occupy-start, 0) var(--bs-sidebar-occupy-end, 0);
    will-change: auto;
    transition: padding 0.15s;
}

@media (prefers-reduced-motion: reduce) {
    .wrapper {
        transition: none;
    }
}

.sidebar-header, header {
    min-height: 5rem;
}

[data-bs-theme=dark] body {
    background-color: var(--bs-dark-bg-subtle);
}

[data-bs-theme=dark] .footer {
    --bs-footer-bg: var(--bs-body-bg);
}

.bg-body {
    background-color: var(--wm-body-bg);
}

.bg-wm-green-100 {
    background-color: var(--wm-green-100);
}

.text-wm-green-100 {
    color: var(--wm-green-100);
}

.card {
    --bs-card-border-color: var(--wm-border-color);
    /*--bs-card-border-width: 1px;*/
    --bs-card-border-radius: var(--wm-border-radius);
    /*    border: none;*/
    /*    box-shadow: var(--bs-box-shadow-sm);*/
    /*    box-shadow: 0 0.125rem 0.25rem var(--bs-wm-green-subtle);*/
}

.card .card-header {
    background-color: transparent;
}

.card .card-body {
    padding: 1.5rem 2rem;
}

.card .card-footer {
    background-color: transparent;
}

.card-body .card-body-title {
    font-weight: normal;
    font-size: 1.75rem;
    margin-bottom: .5rem;
/*    color: var(--bs-wm-dark-green);*/
}

.badge {
    --bs-badge-font-size: 0.875em;
    --bs-badge-font-weight: normal;
}
.booking-indicator-direct .booking-indicator-quote {
    --bs-badge-font-size: 0.8em;
    --bs-badge-font-weight: normal;
    top: -2px;
}

.list-group-table {
    --bs-list-group-border-width: 0;
    --bs-list-group-border-radius: 0;
    gap: 0;
    background: #fff;
    border: 0;
    border-radius: 0;
    overflow: hidden;
}

.list-group-table > .list-group-item {
    min-height: 3.75rem;
    padding: .95rem 1.25rem;
    align-items: center;
    color: var(--bs-body-color);
    font-size: .9rem;
    line-height: 1.45;
    background: #fff;
    border: 0;
    border-bottom: 1px solid var(--wm-border);
    border-radius: 0;
    transition: background-color 120ms ease;
}

.list-group-table > .list-group-item-header
{
    min-height: 2.75rem;
    padding: .7rem 1.25rem;
    align-items: center;
    color: var(--wm-primary);
    font-size: .875rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: normal;
    text-transform: none;
    background: var(--wm-primary-light);
    border: 0;
    border-bottom: 1px solid var(--wm-border);
}

.list-group-table > .list-group-item-header > [class*="col"],
.list-group-table > .list-group-item > [class*="col"] {
    min-width: 0;
    padding-inline-end: 1rem;
}

.list-group-table > .list-group-item-header > [class*="col"]:last-child,
.list-group-table > .list-group-item > [class*="col"]:last-child {
    padding-inline-end: 0;
}

.list-group-table > .list-group-item-action:hover,
.list-group-table > .list-group-item-action:focus-visible {
    color: var(--bs-list-group-action-hover-color);
    background: var(--bs-list-group-action-hover-bg);
}

.list-group-table > .list-group-item-action:active {
    color: var(--bs-list-group-action-active-color);
    background: var(--bs-list-group-action-active-bg);
}

.list-group-table > .list-group-item-action:focus-visible {
    position: relative;
    z-index: 1;
    outline: 2px solid rgba(var(--wm-primary-rgb), .35);
    outline-offset: -2px;
    box-shadow: none;
}

@media (max-width: 767.98px) {
    .list-group-table:has(> .list-group-item-header) {
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scrollbar-color: rgba(var(--wm-primary-rgb), .35) transparent;
        scrollbar-width: thin;
    }

    .list-group-table:has(> .list-group-item-header) > .list-group-item-header,
    .list-group-table:has(> .list-group-item-header) > .list-group-item {
        min-width: 48rem;
    }
}

.list-group-table.wm-reservation-list > .list-group-item-header,
.list-group-table.wm-reservation-list > .list-group-item
{
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 2fr) minmax(0, 1.5fr) minmax(0, 1.1fr) minmax(0, 1fr);
    gap: 1rem;
    min-width: 0;
}

.wm-reservation-list > .list-group-item > div
{
    min-width: 0;
    overflow-wrap: anywhere;
}

@media (max-width: 767.98px)
{
    .list-group-table.wm-reservation-list
    {
        overflow: visible;
    }

    .list-group-table.wm-reservation-list > .list-group-item-header
    {
        display: none;
    }

    .list-group-table.wm-reservation-list > .list-group-item
    {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.wm-quotation-request-list > .list-group-item
{
    padding-block: .75rem;
}

.wm-details-modal .modal-dialog {
    height: calc(100vh - 3rem);
    width: 80% !important;
    max-width: 80% !important;
    margin: 1.5rem auto;
    display: flex;
    align-items: flex-start;
}

.wm-details-modal .modal-header {
    font-weight: bold;
    padding-top: .75rem;
    padding-bottom: 0;
    border: 0;
}

.wm-details-modal .modal-content {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.wm-details-modal .modal-body {
    overflow-y: auto;
    flex: 1 1 auto;
}

.wm-details-modal .modal-footer {
    padding-top: .25rem;
    padding-bottom: .25rem;
    border: 0;
}

.modal .modal-header {
    border: 0;
}

.modal .modal-footer {
    border: 0;
}

.nav a, .nav-tabs {
    --bs-nav-link-color: var(--bs-wm-dark-green);
    --bs-nav-link-hover-color: var(--bs-wm-green);
    --bs-nav-tabs-link-active-color: var(--bs-wm-dark-green);
    --bs-nav-link-hover-color: var(--bs-secondary-color);
    --bs-link-color-rgb: var(--bs-wm-dark-green);
    /*    --bs-nav-tabs-border-radius: 1rem;*/
    /*    --bs-nav-tabs-border-color: var(--bs-wm-green-subtle);
    --bs-nav-tabs-link-active-border-color: var(--bs-wm-green-subtle) var(--bs-wm-green-subtle) white;*/
    /*    --bs-nav-link-color: var(--bs-wm-green);
    --bs-nav-link-hover-color: var(--bs-wm-dark-green);
    --bs-nav-tabs-link-active-color: var(--bs-white);
    --bs-nav-link-hover-color: var(--bs-wm-dark-green);
    --bs-link-color-rgb: var(--bs-wm-dark-green);
    --bs-nav-tabs-link-active-bg: var(--bs-wm-dark-green);
    --bs-nav-tabs-border-color: var(--bs-wm-green-subtle);
    --bs-nav-tabs-border-radius: var(--bs-border-radius);*/
}

.nav-tabs {
    --wm-tab-ink: #465248;
    --wm-tab-muted: #738076;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: .3rem;
    width: 100%;
    padding: .35rem;
    margin-bottom: 1rem;
    overflow-x: auto;
    overflow-y: hidden;
    background: var(--bs-light);
    border: 1px solid var(--bs-border-color);
    border-radius: .75rem;
    box-shadow: var(--bs-shadow-sm);
    scrollbar-color: rgba(var(--wm-primary-rgb), .3) transparent;
    scrollbar-width: thin;
}

.nav-tabs::-webkit-scrollbar {
    height: .25rem;
}

.nav-tabs::-webkit-scrollbar-track {
    background: transparent;
}

.nav-tabs::-webkit-scrollbar-thumb {
    background: rgba(var(--wm-primary-rgb), .3);
    border-radius: var(--wm-radius-pill);
}

.nav-tabs .nav-item {
    flex: 0 0 auto;
}

.nav-tabs .nav-link {
    position: relative;
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: .6rem .9rem;
    margin: 0;
    color: var(--wm-tab-ink);
    font-weight: 600;
    font-size: .875rem;
    letter-spacing: .005em;
    line-height: 1.15;
    text-transform: none;
    white-space: nowrap;
    background: transparent;
    border: 1px solid transparent;
    border-radius: .7rem;
    transition: color .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.nav-tabs .nav-link i {
    display: inline-flex;
    width: 1.7rem;
    height: 1.7rem;
    align-items: center;
    justify-content: center;
    margin-right: .05rem !important;
    color: #607162;
    font-size: .9rem;
    background: rgba(255, 255, 255, .68);
    border: 1px solid rgba(var(--wm-primary-rgb), .08);
    border-radius: .5rem;
    box-shadow: 0 1px 2px rgba(24, 52, 24, .04);
    transition: color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s ease;
}

.nav-tabs .nav-link:hover {
    color: #294d2c;
    background: rgba(255, 255, 255, .7);
    border-color: #d6e2d6;
    box-shadow: none;
}

.nav-tabs .nav-link:hover i {
    color: var(--wm-primary);
    background: #e7f1e7;
    border-color: #cfdfcf;
    transform: translateY(-1px);
}

.nav-tabs .nav-link:focus-visible {
    color: var(--wm-primary);
    outline: 3px solid rgba(var(--wm-green-rgb), .25);
    outline-offset: 1px;
    box-shadow: none;
}

.nav-tabs .nav-link.active {
    color: #264829;
    background: #fff;
    border-color: var(--bs-border-color);
    box-shadow: var(--bs-box-shadow-sm);
}

.nav-tabs .nav-link.active i {
    color: #fff;
    background: var(--wm-primary);
    border-color: var(--wm-primary);
    box-shadow: none;
}

.nav-tabs .nav-link:active {
    transform: translateY(1px);
}

.nav-tabs .nav-link:disabled,
.nav-tabs .nav-link.disabled {
    color: var(--wm-tab-muted);
    pointer-events: none;
    opacity: .55;
}

@media (max-width: 575.98px) {
    .nav-tabs {
        padding: .3rem !important;
        border-radius: .75rem;
    }

    .nav-tabs .nav-link {
        min-height: 2.55rem;
        padding: .5rem .7rem;
        font-size: .825rem;
    }

    .nav-tabs .nav-link i {
        width: 1.5rem;
        height: 1.5rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .nav-tabs .nav-link,
    .nav-tabs .nav-link i {
        transition: none;
    }
}

.btn-link {
    --bs-link-color: var(--bs-wm-dark-green);
    --bs-link-hover-color: var(--bs-wm-green);
}

.services-grid {
    display: grid;
    grid-template-columns: 100px repeat(3, minmax(0, 100px));
    align-items: center;
    gap: 10px;
}

.services-grid.header-row span {
    text-align: center;
    opacity: .7;
}

.list-item-collapsible .caret-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    background-color: currentColor;
    -webkit-mask-image: var(--wm-caret-icon);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    mask-image: var(--wm-caret-icon);
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    transition: transform 0.2s ease;
    transform: rotate(-90deg);
}

.list-item-collapsible {
    /*    border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    border-radius: var(--bs-border-radius) !important;*/
    /*    background-color: var(--wm-green-100);*/
    /*    border-radius: var(--bs-border-radius-lg);*/
    border-bottom: 1px solid var(--wm-border-color);
    background-color: white;
    /*    box-shadow: var(--bs-box-shadow-sm);*/
}

.list-item-collapsible .list-item-header {
    padding: .8rem 1rem;
    /*    padding: .875rem;*/
    cursor: pointer;
/*    background-color: var(--bs-light);*/
/*    border-radius: var(--bs-border-radius-lg);*/
    /*    border-bottom: 1px solid var(--bs-wm-green-subtle);*/
}

.list-item-collapsible .list-item-header:hover {
/*    background-color: var(--bs-light) !important;*/
/*    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;*/
}

.list-item-collapsible .list-item-collapse {
    display: none;
/*    background-color: white;
    border-radius: .5rem;*/
    padding: 1rem;

}

.list-item-collapsible .list-item-footer {
    display: none;
    padding: 0 1rem 1rem 1rem;
}

.list-item-collapsible.open > .list-item-footer,
.list-item-collapsible.open > :is(edit-view-content, .edit-view-content) > .list-item-footer {
    display: block;
}

.list-item-collapsible.open > .list-item-header .list-item-header-hidable,
.list-item-collapsible.open > :is(edit-view-content, .edit-view-content) > .list-item-header .list-item-header-hidable {
    opacity: 0;
}

.list-item-collapsible.open > .list-item-header,
.list-item-collapsible.open > :is(edit-view-content, .edit-view-content) > .list-item-header {
    border-top-right-radius: var(--bs-border-radius-lg);
    border-top-left-radius: var(--bs-border-radius-lg);
/*    background-color: var(--bs-wm-green-subtle);*/
}

.list-item-collapsible.open > .list-item-collapse,
.list-item-collapsible.open > :is(edit-view-content, .edit-view-content) > .list-item-collapse {
    display: block;
}

.list-item-collapsible.open > .list-item-header .caret-icon,
.list-item-collapsible.open > :is(edit-view-content, .edit-view-content) > .list-item-header .caret-icon {
    transform: rotate(0deg);
}

/* A locked invoice review shows its lists without edit or delete actions. */
.wm-review-fieldset:disabled .action-btn {
    display: none;
}

.wm-form .form-label {
    font-size: 0.875em;
    color: var(--bs-secondary-color);
    font-weight: 600;
}

.form-check-input {
    border-color: var(--bs-wm-dark-green);
}

.form-check-input:checked {
    background-color: var(--bs-wm-dark-green);
    border-color: rgba(var(--bs-wm-dark-green-rgb));
}

.form-check-input:focus {
    border-color: var(--bs-wm-dark-green);
    box-shadow: 0 0 0 0.25rem rgba(var(--bs-wm-dark-green-rgb), 0.25);
}

.item-adder .item-adder-container {
    width: 100%;
    padding: 1rem 1.5rem;
    background-color: var(--bs-light);
    border-radius: var(--bs-border-radius);
    border: 1px solid var(--bs-border-color);
}

.item-adder .item-adder-container .item-adder-header {
    font-weight: 600;
/*    text-transform: uppercase;*/
    margin-bottom: 1rem;
    color: var(--bs-wm-dark-green);
/*    font-size: .875rem;*/
}

.item-adder .item-adder-container .item-adder-body {
    padding: .5rem 1rem 1rem 1rem;
    background-color: white;
    border-radius: var(--bs-border-radius-lg);
    padding: 1rem;
    
}

.overlay-spinner {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    overflow: hidden;
    background: transparent;
    display: none;
    z-index: 9999;
    pointer-events: none;
}

.spinner {
    width: 35%;
    height: 100%;
    background: var(--bs-wm-green);
    box-shadow: 0 0 0.65rem rgba(var(--bs-wm-green-rgb), 0.65);
    animation: wm-loading-progress 1.1s ease-in-out infinite;
}

.htmx-request.overlay-spinner,
.overlay-spinner.is-active {
    display: block;
}

@keyframes wm-loading-progress {
    from { transform: translateX(-110%); }
    to { transform: translateX(300%); }
}

.sidebar-nav .nav-link.is-navigation-pending::after {
    width: 0.85rem;
    height: 0.85rem;
    margin-inline-start: auto;
    flex: 0 0 auto;
    border: 2px solid rgba(255, 255, 255, 0.38);
    border-top-color: currentcolor;
    border-radius: 50%;
    content: "";
    animation: wm-navigation-spin 0.75s linear infinite;
    pointer-events: none;
}

@keyframes wm-navigation-spin {
    to { transform: rotate(360deg); }
}

.wm-login-submit .spinner-border {
    width: 1rem;
    height: 1rem;
    border-width: 0.15em;
}

@media (prefers-reduced-motion: reduce) {
    .spinner {
        width: 100%;
        animation: none;
    }

    .sidebar-nav .nav-link.is-navigation-pending::after {
        animation: none;
    }
}

/* ==========================================================================
   Utility Classes
   ========================================================================== */

/* Button reset for icon-only triggers */
.btn-icon {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: inherit;
}

/* Font-size utilities (rem-based) */
.fs-xs  { font-size: 0.75rem !important; }   /* 12px */
.fs-sm  { font-size: 0.875rem !important; }  /* 14px */
.fs-xxs { font-size: 0.6875rem !important; } /* 11px */

/* Semantic badge utilities */
.badge-open      { background-color: var(--wm-success-bg);   color: var(--wm-success-text); }
.badge-closed    { background-color: var(--wm-surface);      color: #4A4F54; }
.badge-warning   { background-color: var(--wm-warning-bg);   color: var(--wm-warning-text); }
.badge-danger    { background-color: var(--wm-danger-bg);    color: var(--wm-danger-text); }
.badge-info      { background-color: var(--wm-info-bg);      color: var(--wm-info-text); }

/* Shake animation (migrated from animation.css) */
.shake {
    animation: shake 0.2s;
}

@keyframes shake {
    0%   { transform: translateX(0); }
    25%  { transform: translateX(-2px); }
    50%  { transform: translateX(2px); }
    75%  { transform: translateX(-2px); }
    100% { transform: translateX(0); }
}

.btn-badge {
    padding: 0.25rem 0.7rem;
    font-size: 0.75rem;
    line-height: 1;
    border-radius: 50rem;
}

.field-validation-error {
    font-size: 0.875em;
    font-weight: normal;
}

.list-group-item-action:hover,
.list-group-item-action:focus {
    z-index: auto !important;
}

.hotel-carousel-indicators {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%);
    width: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    gap: 6px;
}

.hotel-carousel-indicators button {
    flex: 0 0 8px !important;
    width: 6px !important;
    height: 6px !important;
    min-width: 6px !important;
    max-width: 6px !important;
    min-height: 6px !important;
    max-height: 6px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    opacity: 0.6;
}

.hotel-carousel-indicators button.active {
    opacity: 1;
}

.img-container {
    width: 100%;
    height: 200px; /* fixed height */
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    border-radius: var(--bs-border-radius);
    background-color: #e9ecef; /* light gray placeholder */
    overflow: hidden;
}

.img-preview {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--bs-border-radius);
    display: none; /* hidden until an image is selected */
}

.table-rounded {
    border-radius: var(--bs-border-radius) !important;
}

.table-rounded tbody tr:last-child > * {
    border-bottom: none;
}

.schedule-opener:hover{
    border-color: var(--bs-wm-dark-green)!important;
}

.opening-schedule-tr td:last-child {
    border-right: none !important;
}

.photo-list .arrow-order {
    cursor: pointer;
}

.photo-list .arrow-order:hover {
    background-color: rgba(255,255,255,0.175);
}

.photo-list .upload-photo {
    cursor: pointer;
}

.photo-list .upload-photo:hover {
    background-color: rgba(255,255,255,0.175);
}

.photo-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1rem;
    width: 100%;
    justify-items: center;
}

.photo-list .card {
    transition: opacity 0.15s ease;
    min-height: 200px;
    max-height: 200px;
    width: 100%;
}

.photo-list .card.card-adder:hover {
    background-color: var(--bs-secondary-bg-subtle) !important;
}

.photo-list .photo-adder:hover {
    background-color: var(--bs-secondary-bg-subtle) !important;
}

.photo-list .card.moving {
    opacity: 0.6;
}

.photo-list.photo-list-rearrange .card.photo-card-draggable {
    cursor: grab;
    -webkit-user-drag: element;
}

.photo-list.photo-list-rearrange .card.photo-card-draggable.dragging {
    opacity: 0.55;
    cursor: grabbing;
}

.photo-list.photo-list-rearrange .card.photo-card-draggable img {
    -webkit-user-drag: element;
}

.photo-list.photo-list-rearrange .card.photo-card-draggable.drag-over {
    outline: 2px dashed var(--bs-wm-dark-green, #1f5c4d);
    outline-offset: 2px;
}

.pagination-wm .page-link {
    color: var(--bs-wm-dark-green);
}

.pagination-wm .page-item.active .page-link {
    background-color: var(--bs-wm-dark-green);
    border-color: var(--bs-wm-dark-green);
    color: #fff;
}

.pagination-wm .page-link:hover {
    color: #fff;
    background-color: var(--bs-wm-dark-green);
    border-color: var(--bs-wm-dark-green);
}

/* Remove border when collapsed */
.card-header.collapsed {
    border-bottom: none;
}

.wm-card {
    /*    background-color: var(--bs-light);*/
    /*    border: 1px solid var(--bs-wm-green-subtle);*/
    border-radius: var(--wm-border-radius);
    padding: 1rem;
    /*    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);*/
    /*    box-shadow: var(--bs-box-shadow-sm);*/
   
}

.wm-card .wm-card-title {
/*    margin: 0 .5rem .5rem;*/
    text-transform: uppercase;
    font-weight: 600;
    font-size: .875rem;
    color: var(--bs-secondary-color);
}

.wm-card .wm-card-body {
    background-color: white;
    border-radius: .5rem; 
    padding: 1rem;
}

.wm-card-light {
    background-color: var(--bs-light);
    border-radius: .5rem;
    padding: 1rem;
}

.wm-card-light .wm-card-light-title {
    font-weight: 600;
    padding: 0 .5rem .5rem;
    font-size: .875rem;
}

.wm-card-light .wm-card-light-body {
    background-color: white;
    border-radius: .5rem; 
    padding: 1.25rem 1rem;
}
.main-list-filter {
    background-color: var(--wm-green-100);
    border-radius: .5rem;
    padding: .5rem;
}

.form-control,
.form-select {
    border-color: var(--wm-border-color);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--wm-border-color);
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--wm-border-color) 25%, transparent);
}

.form-control.wm-file-input {
    min-width: 0;
    padding: .65rem .85rem;
    color: var(--bs-body-color);
    background: var(--bs-white);
    border-color: var(--wm-border);
    border-radius: var(--wm-radius-sm);
    font-size: .875rem;
}

.form-control.wm-file-input::file-selector-button {
    margin: -.65rem .85rem -.65rem -.85rem;
    padding: .65rem .9rem;
    color: var(--bs-body-color);
    background: var(--wm-surface);
    border-right: 1px solid var(--wm-border);
    font-weight: 600;
}

.form-control.wm-file-input:hover:not(:disabled):not([readonly])::file-selector-button {
    background: var(--wm-border-light);
}

/* Utility classes to replace inline styles (Razor CSS audit compliance) */
.w-100px {
    width: 100px;
}

.btn-icon-clean {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
}

.fs-85 {
    font-size: 0.85em;
}

.list-group-item {
    transition: background-color 0.2s ease, color 0.2s ease;
}

.list-group-item:hover {
/*    background-color: var(--bs-list-group-action-hover-bg);
    color: var(--bs-list-group-action-hover-color);*/
}

.dropdown-item.active, .dropdown-item:active {
    --bs-dropdown-link-active-bg: var(--wm-border-color);
    --bs-dropdown-link-active-color: var(--bs-dark);
}

.text-secondary-color {
    color: var(--bs-secondary-color);
}

.bg-secondary-color {
    background-color: var(--bs-secondary-color);
}

.modal-title {
    font-size: 1.5rem;
    font-weight: 600;
}

.rounded-wm {
    border-radius: var(--wm-border-radius);
}

.header-dropdown-items {
    --dash-accent: var(--wm-primary);
    --dash-accent-rgb: var(--wm-primary-rgb);
    --dash-ink: var(--bs-body-color);
    --dash-muted: var(--bs-secondary-color);
    --dash-line: var(--bs-border-color);
    width: 450px;
    max-width: calc(100vw - 20px);
    top: calc(100% + 0.5rem);
    right: 0;
    left: auto;
    padding: 0;
    margin-top: 0;
    background: #fff;
    border: 1px solid var(--bs-border-color);
    border-radius: var(--wm-radius-xl);
    box-shadow: var(--wm-shadow-md);
    overflow: hidden;
}

.header-dropdown-items[data-bs-popper] {
    top: calc(100% + 0.5rem);
    right: 0;
    left: auto;
    margin-top: 0;
}

.header-dropdown-trigger {
    position: relative;
    display: inline-flex;
    width: 2.75rem;
    height: 2.75rem;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: var(--wm-radius-lg);
}

.header-nav-badge {
    position: absolute;
    top: -0.15rem;
    right: -0.2rem;
    display: inline-flex;
    min-width: 1.3rem;
    height: 1.3rem;
    align-items: center;
    justify-content: center;
    padding: 0 0.3rem;
    color: #fff;
    font-size: 0.62rem;
    font-weight: 800;
    line-height: 1;
    background: var(--bs-danger);
    border: 2px solid #fff;
    border-radius: var(--wm-radius-pill);
    box-shadow: var(--wm-shadow-sm);
    pointer-events: none;
    transition: opacity 160ms ease, transform 160ms ease;
}

.header-nav-badge.opacity-0 {
    transform: scale(0.75);
}

.header-dropdown-heading {
    display: flex;
    min-height: 3rem;
    align-items: center;
    padding: 0 1rem;
    background: #fff;
}

.header-dropdown-title {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    color: var(--bs-emphasis-color);
    font-size: 0.9rem;
    font-weight: 750;
}

.header-dropdown-title-icon {
    display: inline-flex;
    width: 2rem;
    height: 2rem;
    align-items: center;
    justify-content: center;
    color: var(--wm-primary);
    background: var(--wm-primary-light);
    border-radius: var(--wm-radius-md);
}

.header-dropdown-title-icon--notification {
    color: var(--wm-warning-text);
    background: var(--wm-warning-bg);
}

.header-dropdown-list {
    padding: 0.5rem 0.65rem 0.75rem;
}

.header-dropdown-list--empty {
    padding: 0;
}

.header-dropdown-empty {
    padding: 0.65rem;
}

.notifications-header-items {
    max-height: 50vh;
    overflow-y: auto;
    /* smoother scrolling feel */
    scroll-behavior: smooth;
    /* Firefox scrollbar */
    scrollbar-width: thin;
    scrollbar-color: rgba(100, 100, 100, 0.5) transparent;
}

.header-list-end {
    margin-top: 1rem;
    padding: 0.25rem 0;
    color: var(--wm-muted);
    font-size: 0.875em;
    text-align: center;
}

.header-list-loader {
    padding: 0.5rem 0;
    text-align: center;
}

/* Chrome, Edge, Safari */
.notifications-header-items::-webkit-scrollbar {
    width: 8px;
}

.notifications-header-items::-webkit-scrollbar-track {
    background: transparent;
}

.notifications-header-items::-webkit-scrollbar-thumb {
    background: rgba(100, 100, 100, 0.4);
    border-radius: 10px;
    border: 2px solid transparent;
    background-clip: content-box;
}

.notifications-header-items::-webkit-scrollbar-thumb:hover {
    background: rgba(100, 100, 100, 0.7);
}

.text-not-read {
    color: #0d6efd;
}

.disabled-link {
    pointer-events: none;
    opacity: 0.5;
    cursor: not-allowed!important;
}

.wm-btn {
/*    border: none;*/
    font-size: 0.875rem;
}

.btn-week-nav-left {
    left: -100px;
}

.btn-week-nav-right {
    right: 50px;
}

.wm-table-row{
    padding: .5rem;
}

.wm-table-row .wm-table-row-header {
/*    text-transform: uppercase;*/
    font-weight: 600;
    margin-bottom: 1rem;
}

.wm-table-row .wm-table-row-body {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.wm-table-row.wm-table-row-small .wm-table-row-header {
    font-size: .875rem;
    color: var(--bs-secondary-color);
}

.wm-table-row.wm-table-row-small .wm-table-row-body {
    font-size: .875rem;
}

.wm-description-title {
    font-size: .875rem;
    color: var(--bs-secondary-color);
/*    text-transform: uppercase;*/
    font-weight: 600;
    margin-bottom: .25rem;
}
.wm-description-title {
    font-size: .875rem;
    color: var(--bs-secondary-color);
/*    text-transform: uppercase;*/
    font-weight: 600;
    margin-bottom: .25rem;
}

.wm-inside-title {
    font-size: .875rem;
    color: var(--bs-secondary-color);
    font-weight: bold;
    text-transform: uppercase;
}

.pagination-controls .dropdown-menu {
    max-height: 50vh;
    overflow-y: auto;
}

.wm-card-min-height {
    min-height: 35rem;
}

/* =========================
   ROOT VARIABLES
========================= */
.wm-stepper {
    --color-neutral: #e5e7eb;
    --color-gray: #6b7280;
    --color-success: var(--bs-success);
    --color-warning: #f59e0b;
    --color-error: var(--bs-danger);
}

/* =========================
   LAYOUT
========================= */
.wm-stepper {
    display: flex;
    justify-content: space-between;
/*    padding: 20px 10px;*/
}

.wm-stepper .step {
    position: relative;
    flex: 1;
    text-align: center;
}

/* =========================
   ICON
========================= */
.wm-stepper .icon {
    width: 35px;
    height: 35px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid #d1d5db;
    background: #fff;
    color: var(--color-gray);
    transition: all 0.25s ease;
    position: relative;
    z-index: 2;
}

/* =========================
   LABEL
========================= */
.wm-stepper .label {
    margin-top: 10px;
    font-size: 12px;
    color: var(--color-gray);
}

/* =========================
   LINES
========================= */
.wm-stepper .line {
    position: absolute;
    top: 17px;
    height: 1px;
    background: var(--color-neutral);
    transition: background 0.3s ease;
}

.wm-stepper .line.left {
    left: 0;
    right: 50%;
}

.wm-stepper .line.right {
    left: 50%;
    right: 0;
}

/* =========================
   SUCCESS (includes active + completed + approved)
========================= */
.wm-stepper .step.success .icon {
    border-color: var(--color-success);
    color: var(--color-success);
}

.wm-stepper .step.success .line.left,
.wm-stepper .step.success .line.right {
    background: var(--color-success);
}

/* ✅ SIMPLE RULE: CONNECT TO ACTIVE */
.wm-stepper .step.success + .step.active .line.left {
    background: var(--color-success);
}

/* =========================
   WARNING (incomplete)
========================= */
    .wm-stepper .step.warning .icon {
        border-color: var(--color-warning);
        color: var(--color-warning);
    }

    /* =========================
   REJECTED
========================= */
.wm-stepper .step.rejected .icon {
    border-color: var(--color-error);
    color: var(--color-error);
}

.wm-stepper .step.rejected .line.left {
    background: var(--color-error);
}

.wm-stepper .step.active.success .label::after {
    background: var(--color-success);
}

.wm-stepper .step.active.warning .label::after {
    background: var(--color-warning);
}

.wm-stepper .step.active.rejected .label::after {
    background: var(--color-error);
}

.card-visit-link {
    background-color: var(--bs-light);
    /*    box-shadow: var(--wm-box-shadow);*/
    box-shadow: var(--bs-box-shadow-sm);
    padding: 1.5rem;
    border-radius: var(--bs-border-radius-lg);
    box-shadow: 0 0.125rem 0.25rem rgb(0 0 0 / 15%);
    transition: background-color 0.3s ease;
}

.card-visit-link:hover {
    background-color: var(--bs-gray-200);
/*    box-shadow: 0 0.125rem 0.25rem rgb(0 0 0 / 15%);*/
}

/*.card-visit-link .card-visit-link-icon {
    transition: color 0.2s ease;
    color: var(--bs-wm-dark-green);
}

.card-visit-link:hover .card-visit-link-icon {
    color: var(--bs-wm-green);
}
*/
.page-details-title {
    font-weight: 600;
    font-size: 2rem;
    color: var(--bs-wm-dark-green);
}

.form-floating > label {
    font-size: 0.875em;
/*    color: var(--bs-dark);*/
    font-weight: 600;
}

.pagination-controls .next-btn.disabled,
.pagination-controls .previous-btn.disabled {
    color: var(--bs-gray-500);
}

.date-picker-input-container {
    position: relative;
}

.date-picker-input-container .date-picker-input-hidden {
    position: absolute;
    opacity: 0;
}

/* ==========================================================================
   NexSys application shell
   Shared visual foundation for internal and client-facing applications.
   ========================================================================== */

.wm-app-shell {

}

.wm-app-header {
    position: sticky;
    top: 0;
    z-index: 1020;
    align-items: center;
    min-height: 5rem;
    background: rgba(255, 255, 255, 0.88);
    border-bottom: 1px solid rgba(var(--wm-primary-rgb), 0.09);
    box-shadow: 0 0.25rem 1.5rem rgba(24, 52, 24, 0.035);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
}

.wm-app-header > .nav .nav-link {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    min-height: 2.5rem;
    border-radius: 0.75rem;
    transition: color 0.15s ease;
}

.wm-app-header > .nav .nav-link > :is(i, svg, img) {
    transition: transform 150ms ease;
}

.wm-app-header > .nav .nav-link:hover,
.wm-app-header > .nav .nav-link:focus-visible {
    color: var(--wm-primary);
    background: transparent;
}

.wm-app-header > .nav .nav-link:hover > :is(i, svg, img),
.wm-app-header > .nav .nav-link:focus-visible > :is(i, svg, img) {
    transform: translateY(-0.1rem);
}

.wm-app-header > .nav .nav-link:focus-visible {
    outline: 2px solid rgba(var(--wm-primary-rgb), 0.22);
    outline-offset: 1px;
}

.wm-app-header > .nav .border-start {
    border-color: rgba(var(--wm-primary-rgb), 0.12);
}

.wm-app-header > .nav:first-of-type,
.wm-app-header > ul:first-of-type {
    margin-bottom: 0;
}

.wm-app-main {
    padding-top: 1.75rem;
}

.wm-app-shell .card {
    background: rgba(255, 255, 255, 0.96);
    border-color: rgba(var(--wm-primary-rgb), 0.11);
    border-radius: 1rem;
    box-shadow: var(--wm-shadow-sm)
}

.wm-app-shell .card .card-header {
    padding-top: 1rem;
    padding-bottom: 1rem;
    border-color: rgba(var(--wm-primary-rgb), 0.09);
}

.wm-app-shell .card .card-footer {
    border-color: rgba(var(--wm-primary-rgb), 0.09);
}

.wm-app-shell .dropdown-menu {
    padding: 0.45rem;
    border-color: rgba(var(--wm-primary-rgb), 0.11);
    border-radius: 0.8rem;
    box-shadow: 0 1rem 2.5rem rgba(24, 52, 24, 0.13);
}

.wm-app-shell .dropdown-item {
    border-radius: 0.55rem;
}

.wm-app-shell .dropdown-item:hover,
.wm-app-shell .dropdown-item:focus {
    background: var(--wm-primary-light);
}

.wm-app-shell .btn {
    border-radius: 0.45rem;
    box-shadow: none;
}

.wm-app-shell .btn-wm-dark-green {
    box-shadow: none;
}

.wm-app-shell .wm-btn-reset {
    --bs-btn-color: var(--wm-muted);
    --bs-btn-bg: var(--wm-surface);
    --bs-btn-border-color: var(--wm-border);
    --bs-btn-hover-color: var(--wm-primary-ink);
    --bs-btn-hover-bg: var(--wm-primary-light);
    --bs-btn-hover-border-color: var(--wm-border-light);
    --bs-btn-active-color: var(--wm-primary-ink);
    --bs-btn-active-bg: var(--wm-primary-lighter);
    --bs-btn-active-border-color: var(--wm-primary);
    --bs-btn-focus-shadow-rgb: var(--wm-primary-rgb);
}

.wm-app-shell .wm-btn-reset:focus-visible {
    outline: 2px solid var(--wm-primary);
    outline-offset: 2px;
}

.wm-app-shell .wm-collapse-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-color: var(--wm-border-light);
}

.wm-app-shell .wm-collapse-toggle[aria-expanded="true"] {
    color: var(--bs-wm-dark-green-emphasis);
    background-color: var(--bs-wm-dark-green-subtle);
    border-color: var(--bs-wm-dark-green);
}

.wm-app-shell .form-control,
.wm-app-shell .form-select {
    min-height: 2.75rem;
    background-color: rgba(255, 255, 255, 0.94);
    border-color: rgba(var(--wm-primary-rgb), 0.16);
    border-radius: 0.7rem;
}

.wm-app-shell .form-control:disabled,
.wm-app-shell .form-select:disabled {
    background-color: var(--bs-secondary-bg);
    cursor: not-allowed;
}

.wm-app-shell .form-control:focus,
.wm-app-shell .form-select:focus {
    border-color: var(--wm-green);
    box-shadow: 0 0 0 0.2rem rgba(var(--wm-green-rgb), 0.12);
}

.wm-app-shell .input-group > .form-control:not(:last-child),
.wm-app-shell .input-group > .form-select:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.wm-app-shell .input-group > :not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.wm-app-shell .table > :not(caption) > * > * {
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
    border-color: rgba(var(--wm-primary-rgb), 0.08);
}

.wm-app-shell .table thead th {
    color: #526052;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    background: #f7faf7;
}

.wm-app-shell .page-details-title,
.wm-app-shell .card-body-title {
    color: #243424;
    font-weight: 500;
    letter-spacing: -0.025em;
}

@media (max-width: 767.98px) {
    .wm-app-header,
    .wm-app-main {
        padding-right: 1rem;
        padding-left: 1rem;
    }

    .wm-app-main {
        padding-top: 1.25rem;
    }

    .wm-app-shell .card .card-body {
        padding: 1.25rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wm-app-header > .nav .nav-link,
    .wm-app-header > .nav .nav-link > :is(i, svg, img) {
        transition: none;
    }
}

/* Dashboard */
.dashboard-content {
    --dashboard-ink: #1f2f24;
    --dashboard-muted: #66736a;
    gap: 1.5rem;
}

.dashboard-overview-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 0.25rem 0 0.35rem;
}

.dashboard-overview-product {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--wm-primary);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.dashboard-overview-title {
    margin: 0;
    color: var(--dashboard-ink);
    font-size: clamp(1.7rem, 2.25vw, 2.2rem);
    font-weight: 700;
    letter-spacing: -0.045em;
}

.dashboard-overview-description {
    max-width: 46rem;
    margin: 0.35rem 0 0;
    color: var(--dashboard-muted);
    font-size: 0.92rem;
}

.dashboard-workspace-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.8rem;
    color: var(--wm-primary);
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
    background: #fff;
    border-radius: 999px;
    box-shadow: 0 0.3rem 1rem rgba(24, 52, 24, 0.06);
}

.dashboard-workspace-badge-dot {
    width: 0.5rem;
    height: 0.5rem;
    background: var(--wm-green);
    border-radius: 50%;
    box-shadow: 0 0 0 0.2rem rgba(var(--wm-green-rgb), 0.12);
}

.dashboard-panel-kicker {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

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

.dashboard-metric-card {
    --metric-accent: var(--wm-primary);
    --metric-soft: var(--wm-primary-light);
    position: relative;
    display: block;
    min-height: 10rem;
    padding: 1.35rem 4.25rem 1.25rem 1.35rem;
    overflow: hidden;
    color: var(--dashboard-ink);
    text-decoration: none;
    background:
        radial-gradient(circle at 100% 0, rgba(var(--wm-primary-rgb), 0.055), transparent 42%),
        #fff;
    border: 0;
    border-radius: 1.1rem;
    box-shadow: 0 0.45rem 1.5rem rgba(24, 52, 24, 0.07);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.dashboard-metric-card:hover,
.dashboard-metric-card:focus-visible {
    color: var(--dashboard-ink);
    outline: none;
    box-shadow: 0 0.9rem 2rem rgba(24, 52, 24, 0.1);
    transform: translateY(-2px);
}

.dashboard-metric-icon {
    position: absolute;
    top: 1.2rem;
    right: 1.2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    color: var(--metric-accent);
    font-size: 1.3rem;
    background: var(--metric-soft);
    border-radius: 50%;
}

.dashboard-metric-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.dashboard-metric-label {
    max-width: 11rem;
    color: var(--wm-primary);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.055em;
    line-height: 1.25;
    text-transform: uppercase;
}

.dashboard-metric-value {
    margin: 0.45rem 0 0.25rem;
    color: var(--dashboard-ink);
    font-size: 2.35rem;
    font-weight: 700;
    letter-spacing: -0.055em;
    line-height: 1;
}

.dashboard-metric-detail {
    max-width: 13rem;
    color: var(--dashboard-muted);
    font-size: 0.76rem;
    line-height: 1.35;
}

.dashboard-metric-arrow {
    position: absolute;
    right: 1.35rem;
    bottom: 1.15rem;
    color: #91a097;
    font-size: 0.9rem;
    transition: color 0.18s ease, transform 0.18s ease;
}

.dashboard-metric-card:hover .dashboard-metric-arrow {
    color: var(--metric-accent);
    transform: translate(2px, -2px);
}

.dashboard-metrics--admin .dashboard-metric-card:first-child,
.dashboard-metrics--client .dashboard-metric-card:nth-child(2) {
    background:
        radial-gradient(circle at 100% 0, rgba(var(--wm-primary-rgb), 0.09), transparent 44%),
        linear-gradient(135deg, var(--wm-primary-light), #fff 72%);
    box-shadow: 0 0.65rem 1.7rem rgba(24, 52, 24, 0.09);
}

.dashboard-workspace {
    display: grid;
    gap: 1.5rem;
    min-height: 0;
}

.dashboard-workspace--admin {
    grid-template-areas: "tasks reservations ebirds";
    grid-template-columns: minmax(18rem, 0.9fr) minmax(28rem, 1.35fr) minmax(19rem, 1fr);
}

.dashboard-workspace--client {
    grid-template-areas: "reservations tasks ebirds";
    grid-template-columns: minmax(28rem, 1.35fr) minmax(18rem, 0.85fr) minmax(19rem, 1fr);
}

.dashboard-workspace-section {
    display: flex;
    min-width: 0;
}

.dashboard-workspace-tasks {
    grid-area: tasks;
}

.dashboard-workspace-ebirds {
    grid-area: ebirds;
}

.dashboard-workspace-reservations {
    grid-area: reservations;
}

.wm-app-shell .dashboard-panel {
    height: 35rem;
    min-height: 35rem;
    overflow: hidden;
    border: 0;
    box-shadow: 0 0.55rem 1.8rem rgba(24, 52, 24, 0.055);
}

.wm-app-shell .dashboard-panel > .card-body {
    padding: 1.5rem;
}

.dashboard-panel--scrollable > .card-body {
    min-height: 0;
}

.dashboard-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 4.5rem;
    margin: -1.5rem -1.5rem 1.25rem;
    padding: 1rem 1.5rem;
    background: #fff;
    border: 0;
    flex: 0 0 auto;
}

.dashboard-panel-heading {
    min-width: 0;
}

.dashboard-panel-kicker {
    margin-bottom: 0.2rem;
    color: var(--wm-primary);
}

.dashboard-panel-title {
    margin: 0;
    color: var(--dashboard-ink);
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: -0.035em;
}

.dashboard-view-all {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--wm-primary);
    font-size: 0.82rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.dashboard-view-all:hover,
.dashboard-view-all:focus {
    color: var(--wm-primary);
    text-decoration: underline;
    text-underline-offset: 0.2rem;
}

.dashboard-panel-content {
    min-height: 0;
    flex: 1 1 auto;
}

.dashboard-panel--scrollable .dashboard-panel-content {
    padding-right: 0.3rem;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-color: rgba(var(--wm-primary-rgb), 0.3) transparent;
    scrollbar-width: thin;
}

.dashboard-panel--scrollable .dashboard-panel-content::-webkit-scrollbar {
    width: 0.35rem;
}

.dashboard-panel--scrollable .dashboard-panel-content::-webkit-scrollbar-thumb {
    background: rgba(var(--wm-primary-rgb), 0.3);
    border-radius: 999px;
}

.dashboard-panel--scrollable .dashboard-panel-content::-webkit-scrollbar-track {
    background: transparent;
}

.dashboard-panel-content .list-group-item {
    border-right: 0;
    border-left: 0;
}

.dashboard-panel-content .list-group-item:first-child {
    border-top: 0;
}

.dashboard-count-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.8rem;
    height: 1.8rem;
    padding: 0 0.5rem;
    color: var(--wm-primary);
    font-size: 0.75rem;
    font-weight: 800;
    background: #fff;
    border-radius: 999px;
}

.dashboard-panel-header--with-pagination {
    padding-right: 15rem;
}

@media (max-width: 1499.98px) {
    .dashboard-workspace--admin {
        grid-template-areas:
            "tasks ebirds"
            "reservations reservations";
        grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.8fr);
    }

    .dashboard-workspace--client {
        grid-template-areas:
            "reservations ebirds"
            "tasks tasks";
        grid-template-columns: minmax(0, 1.25fr) minmax(20rem, 0.8fr);
    }
}

@media (max-width: 1199.98px) {
    .dashboard-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-workspace--admin {
        grid-template-areas:
            "tasks"
            "reservations"
            "ebirds";
        grid-template-columns: minmax(0, 1fr);
    }

    .dashboard-workspace--client {
        grid-template-areas:
            "reservations"
            "tasks"
            "ebirds";
        grid-template-columns: minmax(0, 1fr);
    }

    .dashboard-panel-header--with-pagination {
        padding-right: 0;
    }

    .dashboard-reservations-link {
        margin-right: 13rem;
    }
}

@media (max-width: 575.98px) {
    .dashboard-content {
        gap: 1rem;
    }

    .dashboard-metrics {
        grid-template-columns: 1fr;
    }

    .dashboard-overview-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.85rem;
    }

    .dashboard-metric-card {
        min-height: 9.25rem;
    }

    .wm-app-shell .dashboard-panel > .card-body {
        padding: 1.15rem;
    }

    .dashboard-panel-header {
        margin: -1.15rem -1.15rem 1rem;
        padding: 0.9rem 1.15rem;
        align-items: flex-start;
    }

    .dashboard-panel-header--with-pagination {
        min-height: 6rem;
    }

    .dashboard-reservations-link {
        margin-right: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dashboard-metric-card,
    .dashboard-metric-arrow {
        transition: none;
    }
}

/* Dashboard redesign */
.dashboard-shell {
    --dash-accent: var(--wm-primary);
    --dash-accent-rgb: var(--wm-primary-rgb);
    --dash-strong: #1d2b21;
    --dash-ink: #1b251e;
    --dash-muted: #68736b;
    --dash-line: rgba(27, 52, 34, 0.1);
    display: flex;
    height: calc(100svh - 8.25rem);
    height: calc(100dvh - 8.25rem);
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 1.4rem;
    min-width: 0;
}

.dashboard-shell--client { --dash-strong: var(--wm-primary); }

.dashboard-overview {
    overflow: hidden;
    flex: 0 0 auto;
    background: #fff;
    border: 1px solid #e4ebe4;
    border-radius: 1.15rem;
    box-shadow: 0 0.5rem 1.75rem rgba(24, 52, 24, 0.06);
}

.dashboard-shell > .dashboard-header,
.dashboard-shell > .dashboard-stats {
    flex: 0 0 auto;
}

.dashboard-overview .dashboard-header,
.dashboard-overview .dashboard-stats {
    border-radius: 0;
    box-shadow: none;
}

.wm-badge
{
    display: inline-flex;
    align-items: center;
    gap: 0.32rem;
    min-height: 1.75rem;
    padding: 0.25rem 0.55rem;
    color: var(--wm-badge-color, var(--bs-secondary-text-emphasis));
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1;
    background-color: var(--wm-badge-background, var(--bs-secondary-bg-subtle));
    border-radius: var(--bs-border-radius-pill);
}

.wm-badge--small
{
    gap: 0.28rem;
    min-height: 1.45rem;
    padding: 0.18rem 0.48rem;
    font-size: 0.65rem;
}

.wm-badge--primary
{
    --wm-badge-color: var(--bs-primary-text-emphasis);
    --wm-badge-background: var(--bs-primary-bg-subtle);
}

.wm-badge--secondary
{
    --wm-badge-color: var(--bs-secondary-text-emphasis);
    --wm-badge-background: var(--bs-secondary-bg-subtle);
}

.wm-badge--success
{
    --wm-badge-color: var(--bs-success-text-emphasis);
    --wm-badge-background: var(--bs-success-bg-subtle);
}

.wm-badge--danger
{
    --wm-badge-color: var(--bs-danger-text-emphasis);
    --wm-badge-background: var(--bs-danger-bg-subtle);
}

.wm-badge--warning
{
    --wm-badge-color: var(--bs-warning-text-emphasis);
    --wm-badge-background: var(--bs-warning-bg-subtle);
}

.wm-badge--info
{
    --wm-badge-color: var(--bs-info-text-emphasis);
    --wm-badge-background: var(--bs-info-bg-subtle);
}

.wm-badge--light
{
    --wm-badge-color: var(--bs-light-text-emphasis);
    --wm-badge-background: var(--bs-light-bg-subtle);
}

.wm-badge--dark
{
    --wm-badge-color: var(--bs-dark-text-emphasis);
    --wm-badge-background: var(--bs-dark-bg-subtle);
}

.wm-service-category-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.wm-service-badge,
.wm-label-badge
{
    --wm-badge-font-size: .7rem;
    --wm-badge-line-height: 1.2;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 1.85rem;
    padding: 0.3rem 0.6rem;
    font-size: var(--wm-badge-font-size);
    font-weight: 600;
    line-height: var(--wm-badge-line-height);
    color: var(--wm-primary);
    border: 1px solid transparent;
}

.wm-service-category-badge
{
    background: #fff;
    border-color: var(--wm-primary);
    border-radius: var(--wm-radius-pill);
}

.wm-label-badge
{
    background-color: var(--wm-primary-light);
    border-radius: var(--wm-radius-sm);
}

.wm-label-badge > i,
.wm-service-badge > i,
.wm-service-badge .reservation-status-text > i
{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
    color: inherit;
    font-size: 0.9rem;
    line-height: 1;
}

.wm-status-pill
{
    color: var(--bs-body-color, var(--wm-muted));
    border-color: var(--wm-border);
    border-radius: var(--wm-radius-pill);
    white-space: nowrap;
}

.wm-status-pill > i::before,
.wm-status-pill .reservation-status-text > i::before
{
    display: block;
    line-height: 1;
    vertical-align: middle;
}

.wm-ui-guide-status-table
{
    min-width: 60rem;
}

.wm-ui-guide-status-table th,
.wm-ui-guide-status-table td
{
    width: 20%;
    padding: 0.75rem;
    vertical-align: middle;
}

.wm-status-summary
{
    display: flex;
    min-width: 0;
    align-items: center;
    gap: var(--wm-status-summary-gap, 0.65rem);
}

.wm-status-summary__icon
{
    display: inline-flex;
    width: var(--wm-status-summary-icon-size, 2.25rem);
    height: var(--wm-status-summary-icon-size, 2.25rem);
    flex: 0 0 auto;
    font-size: var(--wm-status-summary-icon-font-size, inherit);
    align-items: center;
    justify-content: center;
    color: var(--wm-primary);
    background: var(--wm-primary-light);
    border-radius: var(--wm-radius-md);
}

.wm-status-summary__content
{
    min-width: 0;
}

.wm-status-summary__content--accent
{
    padding-left: 0.5rem;
    border-left: 2px solid rgba(var(--wm-primary-rgb), 0.3);
}

.wm-status-summary__type
{
    color: var(--wm-primary-ink);
    font-size: var(--wm-status-summary-title-size, 0.875rem);
    font-weight: 600;
    line-height: 1.3;
}

.wm-status-summary__reservation,
.wm-status-summary__meta
{
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    margin-top: 0.25rem;
    color: var(--wm-muted);
    font-size: var(--wm-status-summary-meta-size, 0.78rem);
    line-height: 1.2;
}

.wm-status-summary--small
{
    --wm-status-summary-icon-size: 1.375rem;
    --wm-status-summary-icon-font-size: 0.75rem;
    --wm-status-summary-title-size: 0.6875rem;
    --wm-status-summary-meta-size: 0.78rem;
    --wm-status-summary-gap: 0.375rem;
}

.dashboard-header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    min-height: 9rem;
    padding: 1.75rem 2rem 0 1.75rem;
    overflow: hidden;
    color: #fff;
    background: radial-gradient(circle at 92% 12%, rgba(255, 255, 255, 0.16), transparent 28%), var(--wm-primary);
    border-radius: 1.15rem;
    box-shadow: 0 0.5rem 1.75rem rgba(24, 52, 24, 0.06);
}

.dashboard-header-main {
    display: flex;
    align-items: center;
    gap: 1.15rem;
    min-width: 0;
}

.dashboard-header-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    flex: 0 0 auto;
    color: var(--dash-accent);
    font-size: 1.65rem;
    background: #fff;
    border-radius: 1rem;
    box-shadow: 0 0.6rem 1.4rem rgba(15, 45, 24, 0.18);
}

.dashboard-header-icon .nav-icon,
.dashboard-stat-icon .nav-icon {
    color: inherit;
}

.dashboard-heading {
    min-width: 0;
}

.dashboard-heading h1 {
    margin: 0.25rem 0 0;
    color: var(--dash-ink);
    font-size: clamp(1.8rem, 2.5vw, 2.5rem);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 1.1;
}

.dashboard-header .dashboard-heading h1 {
    color: #fff;
}

.dashboard-heading p {
    max-width: 47rem;
    margin: 0.45rem 0 0;
    color: var(--dash-muted);
    font-size: 0.92rem;
}

.dashboard-header .dashboard-heading p {
    color: rgba(255, 255, 255, 0.74);
}

.dashboard-header-side {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    gap: 0.7rem;
}

.dashboard-date {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--dash-muted);
    font-size: 0.76rem;
    font-weight: 700;
}

.dashboard-header .dashboard-date {
    color: rgba(255, 255, 255, 0.75);
}

.dashboard-header-actions {
    display: flex;
    gap: 0.55rem;
}

.dashboard-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 2.6rem;
    padding: 0.6rem 0.9rem;
    font-size: 0.78rem;
    font-weight: 800;
    text-decoration: none;
    border-radius: 0.65rem;
    transition: transform 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

.dashboard-button:hover,
.dashboard-button:focus-visible {
    transform: translateY(-1px);
}

.dashboard-button--primary {
    color: #fff;
    background: var(--dash-accent);
    box-shadow: 0 0.45rem 1rem rgba(var(--dash-accent-rgb), 0.2);
}

.dashboard-header .dashboard-button--primary {
    color: var(--wm-primary);
    background: #fff;
    box-shadow: 0 0.45rem 1rem rgba(15, 45, 24, 0.16);
}

.dashboard-header .dashboard-button--primary:hover,
.dashboard-header .dashboard-button--primary:focus-visible {
    color: var(--wm-primary);
    background: var(--wm-primary-light);
}

.dashboard-button--primary:hover,
.dashboard-button--primary:focus-visible {
    color: #fff;
    background: var(--wm-primary);
}

.dashboard-button--secondary {
    color: var(--dash-ink);
    background: #fff;
    box-shadow: inset 0 0 0 1px var(--dash-line);
}

.dashboard-header .dashboard-button--secondary {
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28);
}

.dashboard-header .dashboard-button--secondary:hover,
.dashboard-header .dashboard-button--secondary:focus-visible {
    color: #fff;
    background: rgba(255, 255, 255, 0.18);
}

.dashboard-button--secondary:hover,
.dashboard-button--secondary:focus-visible {
    color: var(--dash-accent);
    background: rgba(var(--dash-accent-rgb), 0.06);
}

.dashboard-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: hidden;
    color: var(--dash-ink);
    background: #fff;
    border-radius: 1.1rem;
    box-shadow: 0 0.5rem 1.75rem rgba(24, 52, 24, 0.06);
}

.dashboard-stat {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.85rem;
    min-height: 7.4rem;
    padding: 1.25rem 1.35rem;
    color: var(--dash-ink);
    text-decoration: none;
    border-right: 1px solid var(--dash-line);
    transition: background-color 0.15s ease;
}

.dashboard-stat:last-child {
    border-right: 0;
}

.dashboard-stat--pending,
.dashboard-stat--pending .dashboard-stat-body span {
    color: var(--wm-warning-text-aa);
}

.dashboard-stat--pending .dashboard-stat-icon {
    color: var(--wm-warning-text-aa);
    background: var(--wm-warning-bg);
}

.dashboard-stat--upcoming .dashboard-stat-body span,
.dashboard-stat--quotation .dashboard-stat-body span {
    color: var(--wm-primary);
}

.dashboard-stat:hover,
.dashboard-stat:focus-visible {
    color: var(--dash-ink);
    background: rgba(var(--dash-accent-rgb), 0.065);
    outline: none;
}

.dashboard-stat--pending:hover,
.dashboard-stat--pending:focus-visible {
    color: var(--wm-warning-text-aa);
    background: rgba(var(--bs-warning-rgb), 0.1);
}

.dashboard-stat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.65rem;
    height: 2.65rem;
    color: var(--dash-accent);
    font-size: 1.08rem;
    background: rgba(var(--dash-accent-rgb), 0.1);
    border-radius: 0.7rem;
}

.dashboard-stat-body {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.dashboard-stat-body strong {
    font-size: 1.9rem;
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 1;
}

.dashboard-stat-body span {
    margin-top: 0.3rem;
    overflow: hidden;
    color: var(--dash-muted);
    font-size: 0.74rem;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-grid {
    --dashboard-card-row-height: clamp(18rem, 32vh, 23rem);
    display: grid;
    height: auto;
    min-height: 24rem;
    max-height: none;
    align-items: stretch;
    gap: 1rem;
    min-width: 0;
    flex: 1 1 auto;
}

.dashboard-grid--admin,
.dashboard-grid--client {
    grid-template-areas: "tasks reservations ebirds";
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: minmax(0, 1fr);
}

.dashboard-card--tasks { grid-area: tasks; }
.dashboard-card--reservations { grid-area: reservations; }
.dashboard-card--ebirds { grid-area: ebirds; }

/* Opt-in reservation workspace used by the Location Management dashboard. */
.dashboard-workspace-page {
    background: var(--bs-white);
}

.dashboard-grid.dashboard-grid--reservation-workspace {
    grid-template-areas: "reservations tasks ebirds";
}

.dashboard-grid--reservation-workspace > .dashboard-card > .dashboard-card-header {
    min-height: 4.25rem;
    padding-block: 0.85rem;
}

.dashboard-grid--reservation-workspace > .dashboard-card > .dashboard-card-header h2 {
    margin: 0;
}

.dashboard-reservations-workspace {
    container-type: inline-size;
}

.dashboard-card-header.dashboard-reservation-header {
    display: grid;
    grid-template-areas: "title tabs controls";
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
}

.dashboard-reservation-header h2 {
    grid-area: title;
}

.dashboard-reservation-tabs {
    grid-area: tabs;
    flex: 0 0 auto;
    flex-wrap: nowrap;
    width: fit-content;
    max-width: 100%;
    gap: 0.5rem;
}

.dashboard-reservation-header-controls {
    grid-area: controls;
    justify-self: end;
    min-width: 0;
}

.dashboard-reservation-controls--upcoming {
    display: none;
}

.dashboard-reservations-workspace:has(.dashboard-reservation-tab--pending:not(.active)) .dashboard-reservation-controls--pending {
    display: none;
}

.dashboard-reservations-workspace:has(.dashboard-reservation-tab--pending:not(.active)) .dashboard-reservation-controls--upcoming {
    display: block;
}

@container (max-width: 36rem) {
    .dashboard-card-header.dashboard-reservation-header {
        grid-template-areas:
            "title controls"
            "tabs tabs";
        grid-template-columns: minmax(0, 1fr) auto;
        row-gap: 0.25rem;
    }
}

@container (max-width: 24rem) {
    .dashboard-card-header.dashboard-reservation-header {
        column-gap: 0.5rem;
        padding-inline: 0.75rem;
    }

    .dashboard-card-header.dashboard-reservation-header h2 {
        font-size: 1.35rem;
    }
}

.dashboard-reservation-tab
{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    min-width: 0;
    min-height: 2.2rem;
    padding: 0.4rem 0.8rem;
    color: var(--wm-upcoming);
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.2;
    background: var(--bs-gray-100);
    border: 1px solid transparent;
    border-radius: var(--wm-radius-pill);
}

.dashboard-reservation-tab:hover {
    border-color: currentColor;
}

.dashboard-reservation-tab.active
{
    color: var(--bs-white);
    background: var(--wm-upcoming);
    border-color: var(--wm-upcoming);
}

.dashboard-reservation-tab:focus-visible {
    outline: 2px solid var(--wm-upcoming);
    outline-offset: 2px;
}

.dashboard-reservation-tab.reservation-state-pending {
    color: var(--reservation-state-accent);
    background: var(--bs-gray-100);
}

.dashboard-reservation-tab.reservation-state-pending.active {
    color: var(--wm-warning-text);
    background: var(--bs-warning);
    border-color: var(--bs-warning);
}

.dashboard-reservation-tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 1.3rem;
    min-height: 1.3rem;
    padding: 0.15rem 0.35rem;
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1;
    background: rgba(var(--bs-white-rgb), 0.65);
    border-radius: var(--wm-radius-pill);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.dashboard-reservation-tab.active .dashboard-reservation-tab-count
{
    color: var(--wm-upcoming);
    background: rgba(var(--bs-white-rgb), 0.9);
}

.dashboard-reservation-tab--pending .dashboard-reservation-tab-count,
.dashboard-reservation-tab--pending.active .dashboard-reservation-tab-count {
    color: var(--wm-warning-text);
    background: rgba(var(--bs-white-rgb), 0.9);
}

.dashboard-reservation-tab:not(.active) .dashboard-reservation-tab-count {
    color: var(--wm-upcoming);
    background: var(--wm-primary-light);
}

.dashboard-reservation-tab--pending:not(.active) .dashboard-reservation-tab-count {
    color: var(--wm-warning-text);
    background: var(--wm-warning-bg);
}

.dashboard-reservation-panes,
.dashboard-reservation-list {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.dashboard-reservation-panes > .tab-pane.active {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.dashboard-reservation-controls .dashboard-card-header-actions {
    width: auto;
    justify-content: flex-end;
    margin-left: auto;
}

.dashboard-card {
    position: relative;
    display: flex;
    height: auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--dash-line);
    border-radius: 1rem;
    box-shadow: 0 0.45rem 1.4rem rgba(24, 52, 24, 0.045);
}

.dashboard-card.dashboard-card--tasks,
.dashboard-card.dashboard-card--reservations,
.dashboard-card.dashboard-card--ebirds {
    height: 100%;
    min-height: 24rem;
    max-height: none;
}

.dashboard-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 4.25rem;
    padding: 0.85rem 1.35rem 0.8rem 1.55rem;
    flex: 0 0 auto;
}

.dashboard-card-header--pagination {
    flex-wrap: wrap;
    row-gap: 0.45rem;
}

.dashboard-card-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    min-width: 0;
    margin-left: auto;
}

.dashboard-card-header h2 {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin: 0.25rem 0 0;
    color: var(--dash-ink);
    font-size: 1.5rem;
    letter-spacing: -0.035em;
}

.dashboard-card-header > a,
.dashboard-card-header-actions > a {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--dash-accent);
    font-size: 0.75rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.dashboard-card-header > a:hover,
.dashboard-card-header > a:focus-visible,
.dashboard-card-header-actions > a:hover,
.dashboard-card-header-actions > a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 0.2rem;
}

.dashboard-card-pagination .btn {
    min-width: 2rem;
    min-height: 2rem;
    padding: 0.3rem 0.45rem;
    color: var(--dash-ink);
    font-size: 0.72rem;
    border-radius: 0.5rem;
}

.dashboard-card-pagination .previous-btn,
.dashboard-card-pagination .next-btn {
    display: inline-grid;
    place-items: center;
}

.dashboard-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.55rem;
    height: 1.55rem;
    padding: 0 0.4rem;
    color: var(--dash-accent);
    font-size: 0.68rem;
    background: rgba(var(--dash-accent-rgb), 0.09);
    border-radius: 999px;
}

.dashboard-card-content {
    min-width: 0;
    min-height: 0;
    padding: 0 1rem 1.25rem 1rem;
    flex: 1 1 auto;
}

.dashboard-card-content--scroll {
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-gutter: stable;
}

.wm-scrollbar {
    --wm-scrollbar-color-rgb: var(--bs-wm-dark-green-rgb);
    scrollbar-color: var(--bs-wm-dark-green) transparent;
    scrollbar-width: thin;
}

.dashboard-shell .wm-scrollbar {
    --wm-scrollbar-color-rgb: var(--bs-secondary-rgb);
    scrollbar-color: var(--bs-gray-400) var(--bs-gray-100);
}

.dashboard-shell .wm-scrollbar:hover,
.dashboard-shell .wm-scrollbar:focus-within {
    scrollbar-color: var(--bs-gray-500) var(--bs-gray-100);
}

.dashboard-shell .wm-scrollbar::-webkit-scrollbar-thumb {
    background-color: var(--bs-gray-400);
}

.dashboard-shell .wm-scrollbar::-webkit-scrollbar-thumb:hover,
.dashboard-shell .wm-scrollbar::-webkit-scrollbar-thumb:active {
    background-color: var(--bs-gray-500);
}

.wm-scrollbar::-webkit-scrollbar {
    width: 0.65rem;
    height: 0.65rem;
}

.wm-scrollbar::-webkit-scrollbar-track {
    background: transparent;
    border-radius: 999px;
}

.wm-scrollbar.wm-scrollbar-white-track {
    scrollbar-color: var(--bs-wm-dark-green) var(--bs-white);
}

.wm-scrollbar.wm-scrollbar-white-track::-webkit-scrollbar-track,
.wm-scrollbar.wm-scrollbar-white-track::-webkit-scrollbar-corner {
    background: var(--bs-white);
}

.wm-scrollbar::-webkit-scrollbar-thumb {
    background-color: var(--bs-wm-dark-green);
    background-clip: padding-box;
    border: 1px solid transparent;
    border-radius: 999px;
}

.wm-scrollbar::-webkit-scrollbar-thumb:hover {
    background-color: var(--bs-wm-dark-green);
}

.wm-scrollbar::-webkit-scrollbar-thumb:active {
    background-color: var(--bs-wm-dark-green);
}

.dashboard-scroll-region {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
}

.dashboard-card-content.dashboard-scroll-body {
    position: absolute;
    inset: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scrollbar-gutter: stable;
    scrollbar-color: var(--bs-gray-400) var(--bs-gray-100);
    scrollbar-width: thin;
    background:
        linear-gradient(var(--bs-white) 30%, transparent) center top / 100% 32px local,
        linear-gradient(transparent, var(--bs-white) 70%) center bottom / 100% 32px local,
        radial-gradient(farthest-side at 50% 0, rgba(var(--bs-black-rgb), 0.1), transparent) center top / 100% 12px scroll,
        radial-gradient(farthest-side at 50% 100%, rgba(var(--bs-black-rgb), 0.1), transparent) center bottom / 100% 12px scroll;
    background-repeat: no-repeat;
}

.dashboard-shell .wm-scrollbar::-webkit-scrollbar-track {
    background: var(--bs-gray-100);
}

.dashboard-scroll-body::-webkit-scrollbar-button {
    display: none;
}

@media (hover: hover) and (pointer: fine)
{
    @supports selector(::-webkit-scrollbar)
    {
        .dashboard-shell .wm-scrollbar,
        .dashboard-shell .wm-scrollbar:hover,
        .dashboard-shell .wm-scrollbar:focus-within
        {
            scrollbar-color: auto;
            scrollbar-width: auto;
        }

        .dashboard-shell .wm-scrollbar::-webkit-scrollbar
        {
            width: 6px;
            height: 6px;
        }
    }
}

.dashboard-card .list-group-item {
    background: transparent;
    border-right: 0;
    border-left: 0;
    border-color: var(--dash-line);
}

.dashboard-card .list-group-item:first-child {
    border-top: 0;
}

/* Reusable eBird inquiry list */
.inquiry-list {
    gap: 0;
    padding: 0;
}

.list-group-table .inquiry-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    min-height: 5.75rem;
    padding: 0.9rem 0.85rem;
    color: var(--dash-ink, var(--bs-dark));
    background: #fff;
    border: 0;
    border-bottom: 1px solid var(--dash-line, var(--wm-border-color));
    border-radius: 0;
    box-shadow: none;
    cursor: pointer;
    transition: background-color 160ms ease;
}

.dashboard-card--ebirds .inquiry-list,
.dashboard-card--ebirds .inquiry-item
{
    background-color: transparent;
}

.list-group-table .inquiry-item:last-child {
    border-bottom: 0;
}

.list-group-table .inquiry-item:hover,
.list-group-table .inquiry-item:focus-visible {
    color: var(--dash-ink, var(--bs-dark));
    background: rgba(var(--wm-primary-rgb), 0.035);
    box-shadow: none;
    outline: none;
}

.inquiry-item--awaiting-reply .inquiry-item-subject
{
    font-weight: 800;
}

.dashboard-waiting-state
{
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    gap: 0.25rem;
    color: var(--dash-muted, var(--bs-secondary-color));
    font-size: 0.68rem;
    font-weight: 400;
    white-space: nowrap;
}

.dashboard-waiting-state--action
{
    color: var(--wm-warning-text);
    font-weight: 700;
}

.inquiry-item-body,
.inquiry-item-heading {
    display: flex;
    min-width: 0;
}

.inquiry-item-body {
    flex-direction: column;
}

.inquiry-item-heading {
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.inquiry-item-subject {
    overflow: hidden;
    font-size: 0.92rem;
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inquiry-item-identity {
    display: flex;
    flex-wrap: wrap;
    margin-top: 0.2rem;
}

.inquiry-item-identity,
.dashboard-item-meta.inquiry-item-meta,
.dashboard-task-item .dashboard-item-meta
{
    gap: 0.4rem 0.35rem;
}

.inquiry-item-identity
{
    color: var(--dash-muted, var(--bs-secondary-color));
    font-size: 0.74rem;
}

.inquiry-item-identity > span {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 0.3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inquiry-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.48rem;
}

.inquiry-item-customer-waiting
{
    display: inline-flex;
    align-items: center;
    gap: inherit;
}

.dashboard-card--ebirds .inquiry-item-customer-waiting
{
    display: none;
}

.inquiry-tag-dot {
    width: 0.38rem;
    height: 0.38rem;
    background: currentColor;
    border-radius: 50%;
}

.inquiry-tag--general,
.inquiry-tag--pending
{
    --wm-badge-color: #42677a;
    --wm-badge-background: #edf5f8;
}

.inquiry-tag--reservation,
.inquiry-tag--open
{
    --wm-badge-color: #276b58;
    --wm-badge-background: #eaf4ef;
}

.inquiry-tag--complaint,
.inquiry-tag--high
{
    --wm-badge-color: #9c3d3d;
    --wm-badge-background: #f9ecec;
}

.inquiry-tag--closed
{
    --wm-badge-color: #687169;
    --wm-badge-background: #eef0ee;
}

.inquiry-tag--medium
{
    --wm-badge-color: #7d5c1d;
    --wm-badge-background: #fbf2df;
}

.inquiry-item-note {
    display: -webkit-box;
    margin-top: 0.65rem;
    overflow: hidden;
    color: var(--dash-muted, var(--bs-secondary-color));
    font-size: 0.73rem;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

@media (max-width: 575.98px) {
    .list-group-table .inquiry-item {
        padding: 0.85rem;
    }
}

.dashboard-card-content--reservations {
    position: relative;
    min-height: 0;
    overflow-y: auto;
    scrollbar-gutter: stable;
    flex: 1 1 auto;
}

/* Dashboard task and reservation items */
.dashboard-item-list {
    display: flex;
    flex-direction: column;
}

.task-page-list {
    --dash-accent: var(--bs-wm-dark-green);
    --dash-accent-rgb: var(--bs-wm-dark-green-rgb);
    --dash-ink: var(--bs-body-color);
    --dash-muted: var(--bs-secondary-color);
    --dash-line: var(--bs-border-color);
    margin-top: 0.75rem;
    overflow: hidden;
}

.task-page-item {
    padding: 1rem 1.1rem;
}

.dashboard-item {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: 0.9rem;
    min-height: 5.75rem;
    padding: 0.9rem 0.85rem;
    color: var(--dash-ink);
    text-decoration: none;
    border-bottom: 1px solid var(--dash-line);
}

.dashboard-item:last-child {
    border-bottom: 0;
}

.dashboard-item:hover,
.dashboard-item:focus-visible {
    color: var(--dash-ink);
    background: rgba(var(--dash-accent-rgb), 0.045);
    outline: none;
}

.dashboard-item-main,
.dashboard-item-heading {
    display: flex;
    min-width: 0;
}

.dashboard-item-heading-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    flex: 0 0 auto;
}

.dashboard-reservation-details {
    margin-top: 0.3rem;
    color: var(--dash-muted);
    font-size: 0.74rem;
    line-height: 1.4;
}

.dashboard-reservation-summary
{
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
    overflow-wrap: anywhere;
}

.dashboard-reservation-summary .wm-badge
{
    white-space: nowrap;
}

.dashboard-item-main {
    flex-direction: column;
}

.dashboard-item-heading {
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.dashboard-item-title {
    overflow: hidden;
    font-size: 0.9rem;
    font-weight: 750;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-item-description {
    display: -webkit-box;
    margin-top: 0.2rem;
    overflow: hidden;
    color: var(--dash-muted);
    font-size: 0.74rem;
    line-height: 1.4;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.dashboard-shell .inquiry-item-identity,
.dashboard-shell .dashboard-reservation-details,
.dashboard-shell .dashboard-task-item .dashboard-item-description
{
    color: var(--dash-ink, var(--bs-body-color));
}

.dashboard-item-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.35rem 0.85rem;
    margin-top: 0.48rem;
    color: var(--dash-muted, var(--bs-secondary-color));
    font-size: 0.68rem;
}

.dashboard-item-meta > span,
.dashboard-status {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.dashboard-status {
    min-height: 1.45rem;
    font-size: 0.68rem;
    font-weight: 750;
    padding: 0.18rem 0.48rem;
    border-radius: 999px;
}

.dashboard-status--progress
{
    color: #7d5c1d;
    background: #fbf2df;
}

.dashboard-status--done {
    color: #2e6b4a;
    background: #e9f4ed;
}

.dashboard-unread-dot {
    width: 0.45rem;
    height: 0.45rem;
    flex: 0 0 auto;
    background: var(--dash-accent);
    border-radius: 50%;
    box-shadow: 0 0 0 0.2rem rgba(var(--dash-accent-rgb), 0.1);
}

.dashboard-waiting-state--action .dashboard-unread-dot
{
    background: currentColor;
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, currentColor 10%, transparent);
}

.dashboard-item-arrow {
    color: #9aa39c;
    font-size: 0.72rem;
    transition: color 160ms ease, transform 160ms ease;
}

.dashboard-item:hover .dashboard-item-arrow,
.dashboard-item:focus-visible .dashboard-item-arrow {
    color: var(--dash-accent);
    transform: translateX(0.15rem);
}

@media (max-width: 1199.98px) {
    .dashboard-shell {
        height: auto;
    }

    .dashboard-grid {
        height: auto;
        min-height: 0;
        max-height: none;
    }

    .dashboard-grid--admin,
    .dashboard-grid--client,
    .dashboard-grid.dashboard-grid--reservation-workspace {
        grid-template-areas:
            "reservations reservations"
            "tasks ebirds";
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: repeat(2, auto);
    }

    .dashboard-grid > .dashboard-card {
        height: auto;
    }

    .dashboard-card-content--scroll,
    .dashboard-card-content--reservations {
        overflow-y: visible;
        scrollbar-gutter: auto;
    }

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

    .dashboard-stat:nth-child(2) {
        border-right: 0;
    }

    .dashboard-stat:nth-child(-n + 2) {
        border-bottom: 1px solid var(--dash-line);
    }
}

@media (max-width: 767.98px) {
    .dashboard-grid--admin,
    .dashboard-grid--client,
    .dashboard-grid.dashboard-grid--reservation-workspace {
        grid-template-areas:
            "reservations"
            "tasks"
            "ebirds";
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: repeat(3, auto);
    }

    .dashboard-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .dashboard-header-side {
        align-items: flex-start;
        width: 100%;
    }

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

    .dashboard-stat,
    .dashboard-stat:nth-child(2) {
        min-height: 6.5rem;
        border-right: 0;
        border-bottom: 1px solid var(--dash-line);
    }

    .dashboard-stat:last-child {
        border-bottom: 0;
    }

}

@media (max-width: 479.98px) {
    .dashboard-header-actions,
    .dashboard-button {
        width: 100%;
    }

    .dashboard-header-actions {
        flex-direction: column;
    }

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

    .dashboard-card-header-actions {
        width: 100%;
        justify-content: space-between;
        margin-left: 0;
    }

    .dashboard-card-content {
        padding-right: 1rem;
        padding-left: 1.2rem;
    }

    .dashboard-card-content--reservations {
        padding-right: 1rem;
        padding-left: 1.2rem;
    }

    .dashboard-item {
        gap: 0.7rem;
        padding-right: 0.45rem;
        padding-left: 0.45rem;
    }

}

@media (prefers-reduced-motion: reduce) {
    .dashboard-button,
    .dashboard-stat,
    .dashboard-item,
    .dashboard-item-arrow {
        transition: none;
    }
}

/* Shared empty state */
.wm-empty-state {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 8rem;
    padding: 1.35rem;
    overflow: hidden;
    flex-direction: column;
    color: #27342b;
    text-align: center;
    border-radius: 0.9rem;
}

.wm-empty-state-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    margin-bottom: 0.75rem;
    color: var(--wm-primary);
    font-size: 1.25rem;
    border-radius: 50%;
}

.wm-empty-state-icon::after {
    position: absolute;
    inset: -0.3rem;
    content: "";
    border: 1px solid rgba(var(--wm-primary-rgb), 0.1);
    border-radius: 50%;
}

.wm-empty-state-title {
    color: #27342b;
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.3;
}

.wm-empty-state-description {
    max-width: 22rem;
    margin-top: 0.25rem;
    color: var(--wm-muted);
    font-size: 0.76rem;
    line-height: 1.4;
}

.wm-page-empty-state
{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 12rem;
    padding: 1.5rem;
    flex-direction: column;
    color: var(--dash-muted, var(--wm-muted));
    text-align: center;
}

.wm-page-empty-state--compact
{
    min-height: 8rem;
    padding: 1.35rem;
}

.wm-page-empty-state-icon
{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    color: var(--dash-accent, var(--wm-primary));
    font-size: 1.2rem;
    background: rgba(var(--dash-accent-rgb, var(--wm-primary-rgb)), 0.09);
    border-radius: 0.85rem;
}

.wm-page-empty-state-title
{
    margin-top: 0.65rem;
    color: var(--dash-ink, var(--bs-body-color));
    font-size: 0.92rem;
}

.wm-page-empty-state-description
{
    max-width: 22rem;
    margin-top: 0.25rem;
    font-size: 0.74rem;
    line-height: 1.4;
}

.modal .wm-modal-header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem 1.5rem 1.15rem;
    background: #fff;
    border-bottom: 1px solid var(--wm-border);
}

.modal .wm-modal-header .wm-modal-header-icon {
    display: grid;
    flex: 0 0 3rem;
    width: 3rem;
    height: 3rem;
    place-items: center;
    color: #fff;
    font-size: 1.2rem;
    background: var(--wm-primary);
    border-radius: var(--wm-radius-lg);
    box-shadow: var(--wm-shadow-sm);
}

.modal .wm-modal-header .wm-modal-header-heading {
    min-width: 0;
    flex: 1;
}

.modal .wm-modal-header .wm-modal-header-heading .modal-title {
    min-width: 0;
    flex: 1;
}

/* =========================================
   Global HTMX Skeleton Loader States
   ========================================= */

/* Hide actual results when loading */
#htmx-update-area.htmx-request #hotelResultHeader,
#htmx-update-area.htmx-request #hotelResults {
    display: none !important;
}

/* Show skeletons when loading */
#htmx-update-area.htmx-request #hotelResultHeaderSkeleton,
#htmx-update-area.htmx-request #hotelSkeleton {
    display: flex !important;
    width: 100%;
}

/* Dim the pagination controls */
#htmx-update-area.htmx-request .paging,
#htmx-update-area.htmx-request select[data-agent-field="pageSize"] {
    opacity: 0.5;
    pointer-events: none;
}

/* Let contract pricing use the full available workspace. */
.contract-pricing {
    width: 100%;
    min-width: 0;
}

.contract-pricing-table {
    min-width: 46rem;
    --bs-table-bg: transparent;
}

.contract-pricing-table > :not(caption) > * > * {
    padding: .7rem .85rem !important;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.contract-pricing-table > thead > tr > th {
    font-size: .8rem;
    text-transform: none;
    color: var(--bs-secondary-color);
    border-bottom: 1px solid var(--bs-border-color);
}

.contract-pricing-table > .contract-pricing-category + .contract-pricing-category > tr:first-child > * {
    border-top: 1px solid var(--bs-border-color);
    padding-top: 1.1rem !important;
}

.contract-pricing-table th:nth-child(1) { width: 23%; }
.contract-pricing-table th:nth-child(2) { width: 9%; }
.contract-pricing-table th:nth-child(3) { width: 28%; }
.contract-pricing-table thead th:nth-child(n+4) { width: 20%; }

.contract-pricing-fee {
    font-variant-numeric: tabular-nums;
}

.contract-pricing-fee + .contract-pricing-fee { margin-top: .65rem; }
.contract-pricing-fee .edit-content { min-width: 19rem; }

@media (hover: hover) and (pointer: fine) {
    .contract-pricing-fee .edit-button { opacity: 0; }
    .contract-pricing-table tr:hover .edit-button,
    .contract-pricing-fee:focus-within .edit-button { opacity: 1; }
}

#editClientModal {
    z-index: 1060;
}

.modal-backdrop {
    z-index: 1050;
}

#editClientModal .modal-content {
    position: relative;
    pointer-events: auto;
}
