html,
body,
body.abp-application-layout {
    background: var(--hcs-color-background, #f5f8f7) !important;
    color: var(--hcs-color-ink, #19334c);
    font-family: "Be Vietnam Pro", "Segoe UI", system-ui, sans-serif !important;
}

.hcs-boot-screen {
    align-items: center;
    background:
        radial-gradient(circle at 92% 8%, rgba(61, 92, 255, .14), transparent 18rem),
        linear-gradient(135deg, #edf0ef 0%, #e6ebe9 100%);
    color: #19334c;
    display: grid;
    font-family: "Be Vietnam Pro", "Segoe UI", system-ui, sans-serif;
    inset: 0;
    justify-items: center;
    place-content: center;
    position: fixed;
    transition: opacity .28s ease, visibility .28s ease;
    z-index: 2000;
}

body:has(.hcs-app-shell) .hcs-boot-screen {
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
}

.hcs-boot-screen__card {
    padding: 1.5rem 1.25rem;
    text-align: center;
    width: min(22rem, calc(100vw - 2rem));
}

.hcs-boot-screen__logo {
    display: block;
    height: auto;
    margin: 0 auto .35rem;
    max-width: 5.5rem;
    object-fit: contain;
}

.hcs-boot-screen__spinner {
    animation: hcs-boot-spin .7s linear infinite;
    border: .22rem solid #d7e2e8;
    border-radius: 50%;
    border-top-color: #3d5cff;
    height: 2.35rem;
    margin: 1.15rem auto .9rem;
    width: 2.35rem;
}

.hcs-boot-screen__title {
    color: #173b56;
    font-size: 1.2rem;
    font-weight: 750;
    letter-spacing: -.02em;
    margin: 0 0 .2rem;
}

.hcs-boot-screen__brand {
    color: #3d5cff;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .08em;
    margin: 0 0 .55rem;
    text-transform: uppercase;
}

.hcs-boot-screen__hint {
    color: #6d8596;
    display: flex;
    font-size: .95rem;
    justify-content: center;
    margin: 0;
}

.hcs-boot-screen__hint span {
    animation: hcs-boot-letter-jump 2.6s ease-in-out infinite;
    animation-delay: calc(var(--i) * .07s);
    display: inline-block;
}

@keyframes hcs-boot-letter-jump {
    0%, 18%, 100% { transform: translateY(0); }
    8% { transform: translateY(-.42em); }
}

@media (prefers-reduced-motion: reduce) {
    .hcs-boot-screen__hint span {
        animation: none;
    }
}

@keyframes hcs-boot-spin {
    to { transform: rotate(360deg); }
}

#blazorise-license-banner-host {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    height: 0 !important;
    overflow: hidden !important;
}

#blazor-error-ui {
    background: lightyellow;
    color: #212529;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1030;
}

#blazor-error-ui .reload {
    color: #0d6efd;
    text-decoration: underline;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}


:root {
    --lpx-logo: url('/images/logo/leptonxlite/logo-light-thumbnail.png') !important;
    --lpx-logo-icon: url('/images/logo/leptonxlite/logo-light-thumbnail.png') !important;
    --hcs-button-max-height: var(--hcs-control-height-compact, 40px);
    --hcs-button-compact-height: var(--hcs-control-height-compact, 40px);
    --hcs-radius: var(--hcs-radius-sm, 5px);
    --bs-body-font-family: "Be Vietnam Pro", "Segoe UI", system-ui, sans-serif;
    --bs-font-sans-serif: "Be Vietnam Pro", "Segoe UI", system-ui, sans-serif;
    --bs-border-radius: 5px;
    --bs-border-radius-sm: 5px;
    --bs-border-radius-lg: 5px;
    --bs-btn-border-radius: 5px;
    --bs-card-border-radius: 5px;
    --bs-modal-border-radius: 5px;
    --bs-input-border-radius: 5px;
}

.lpx-heading,
.modal-header,
.alert-heading,
.lpx-nav-menu .menu-item .menu-item-text,
.lpx-topbar,
.lpx-mobile-navbar,
.lpx-mobile-menu {
    font-family: "Be Vietnam Pro", "Segoe UI", system-ui, sans-serif !important;
}
:root .abp-account-layout .lpx-brand-logo{
    --lpx-logo: url('/images/logo/leptonxlite/logo-dark-thumbnail.png') !important;
    background-position: left;
    background-size: contain;
}

@media (min-width: 768px) {
    .hcs-app-shell .btn,
    .hcs-app-shell button.btn,
    .hcs-app-shell a.btn {
        box-sizing: border-box;
        border-radius: var(--hcs-radius) !important;
        max-height: var(--hcs-button-max-height);
        min-height: var(--hcs-button-max-height);
        line-height: 1;
    }

    .hcs-app-shell .hcs-catalog-create,
    .hcs-app-shell .hcs-catalog-export,
    .hcs-app-shell .hcs-users-create-button {
        max-height: var(--hcs-button-compact-height);
        min-height: var(--hcs-button-compact-height);
    }
}

/* Keep search inputs, filter toggles, and advanced-filter selects the same height as compact buttons. */
.hcs-app-shell .hcs-catalog-filter-row,
.hcs-app-shell .hcs-users-filter-row {
    align-items: stretch;
    display: flex;
    gap: 1.1rem;
}

.hcs-app-shell .hcs-catalog-search,
.hcs-app-shell .hcs-users-search-bar {
    align-items: stretch;
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
}

.hcs-app-shell .hcs-catalog-search .addon-body,
.hcs-app-shell .hcs-catalog-search .addon-end,
.hcs-app-shell .hcs-users-search-bar .addon-body,
.hcs-app-shell .hcs-users-search-bar .addon-end {
    display: flex;
    min-height: 0;
}

.hcs-app-shell .hcs-catalog-advanced-filter,
.hcs-app-shell .hcs-users-advanced-filters {
    align-items: flex-end;
    display: flex;
    gap: .75rem;
}

.hcs-app-shell .hcs-catalog-advanced-filter .mb-3,
.hcs-app-shell .hcs-catalog-advanced-filter .field,
.hcs-app-shell .hcs-catalog-advanced-filter .form-group,
.hcs-app-shell .hcs-users-advanced-filters .mb-3,
.hcs-app-shell .hcs-users-advanced-filters .field,
.hcs-app-shell .hcs-users-advanced-filters .form-group {
    margin: 0 !important;
}

@media (min-width: 768px) {
    .hcs-app-shell .hcs-catalog-search .form-control,
    .hcs-app-shell .hcs-catalog-search .btn,
    .hcs-app-shell .hcs-catalog-filter-toggle,
    .hcs-app-shell .hcs-users-search-input,
    .hcs-app-shell .hcs-users-search-bar .btn,
    .hcs-app-shell .hcs-users-filter-toggle,
    .hcs-app-shell .hcs-catalog-advanced-filter .form-select,
    .hcs-app-shell .hcs-catalog-advanced-filter .btn,
    .hcs-app-shell .hcs-users-advanced-filters .form-select,
    .hcs-app-shell .hcs-users-advanced-filters .btn {
        box-sizing: border-box;
        height: var(--hcs-button-max-height);
        max-height: var(--hcs-button-max-height) !important;
        min-height: var(--hcs-button-max-height) !important;
        padding-top: 0;
        padding-bottom: 0;
        line-height: 1.2;
    }

    .hcs-app-shell .hcs-catalog-advanced-filter .form-select,
    .hcs-app-shell .hcs-users-advanced-filters .form-select {
        padding-right: 2.25rem;
    }

    .hcs-app-shell .hcs-catalog-search .btn,
    .hcs-app-shell .hcs-catalog-filter-toggle,
    .hcs-app-shell .hcs-users-search-bar .btn,
    .hcs-app-shell .hcs-users-filter-toggle,
    .hcs-app-shell .hcs-catalog-advanced-filter .btn,
    .hcs-app-shell .hcs-users-advanced-filters .btn {
        align-items: center;
        display: inline-flex;
        justify-content: center;
        line-height: 1;
    }
}

/* Shared 5px corners on form chrome. Keep circles for avatars/spinners. */
.hcs-app-shell .btn,
.hcs-app-shell .card,
.hcs-app-shell .card-header,
.hcs-app-shell .card-footer,
.hcs-app-shell .form-control,
.hcs-app-shell .form-select,
.hcs-app-shell .input-group-text,
.hcs-app-shell .modal-content,
.hcs-app-shell .dropdown-menu,
.hcs-app-shell .alert,
.hcs-app-shell .badge,
.hcs-app-shell .pagination .page-link,
.hcs-app-shell .page-item .page-link,
.hcs-app-shell .nav-pills .nav-link,
.hcs-app-shell .form-check-input,
.hcs-app-shell .list-group,
.hcs-app-shell .list-group-item,
.hcs-app-shell .table,
.hcs-app-shell .b-table,
.hcs-app-shell select,
.hcs-app-shell textarea,
.hcs-app-shell input:not([type="checkbox"]):not([type="radio"]),
.hcs-app-shell .hcs-action-button,
.hcs-app-shell .b-is-datepicker,
.hcs-app-shell .b-is-datepicker .form-control,
.hcs-app-shell .numeric-picker,
.hcs-app-shell .select2-container .select2-selection,
.hcs-app-shell .hcs-status-badge,
.hcs-app-shell .hcs-priority-badge,
.hcs-app-shell .hcs-progress-badge {
    border-radius: var(--hcs-radius) !important;
}

.hcs-app-shell .input-group > :first-child:not(:last-child) {
    border-radius: var(--hcs-radius) 0 0 var(--hcs-radius) !important;
}

.hcs-app-shell .input-group > :last-child:not(:first-child) {
    border-radius: 0 var(--hcs-radius) var(--hcs-radius) 0 !important;
}

.hcs-app-shell .input-group > :first-child:last-child {
    border-radius: var(--hcs-radius) !important;
}

.hcs-app-shell .input-group > :not(:first-child):not(:last-child) {
    border-radius: 0 !important;
}

.hcs-app-shell .form-switch .form-check-input {
    border-radius: 2rem !important;
}

.hcs-app-shell .hcs-avatar,
.hcs-app-shell .hcs-icon-button,
.hcs-boot-screen__spinner {
    border-radius: 50% !important;
}

.hcs-user-option {
    align-items: center;
    display: inline-flex;
    gap: .6rem;
    min-width: 0;
    vertical-align: middle;
}

.hcs-user-option__avatar {
    align-items: center;
    background: #e8efff;
    border-radius: 50%;
    color: #3154b8;
    display: inline-flex;
    flex: 0 0 2rem;
    height: 2rem;
    justify-content: center;
    object-fit: cover;
    overflow: hidden;
    width: 2rem;
}

.hcs-user-option__copy {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    min-width: 0;
}

.hcs-user-option__name,
.hcs-user-option__phone {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcs-user-option__phone {
    color: #718096;
    font-size: .78rem;
}

.hcs-workflow-step-meta-row {
    align-items: end;
}

.hcs-workflow-step-meta-row > .field:first-child {
    flex: 1.5 1 0;
}

.hcs-workflow-step-meta-row > .field:last-child {
    flex: 1 1 0;
}

@media (max-width: 575.98px) {
    .hcs-workflow-step-meta-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

.hcs-app-shell .hcs-main-content:has(.hcs-chat-page) {
    display: flex;
    flex-direction: column;
    height: calc(100dvh - var(--hcs-header-h, 8.75rem));
    max-width: none;
    min-height: 0;
    overflow: hidden;
    padding: 1.5rem clamp(.9rem, 3vw, 2.5rem);
}



.pagination .form-select {
    padding: .375rem 1.25rem !important;
}

#ApplicationContainer > div:first-child:not(:only-child) {
    display: none !important;
}

body:has(.hcs-chat-page) {
    overflow: hidden;
}

.pagination .form-select {
    padding: .375rem 1.25rem !important;
}

/* === Catalog styles === */
/* Shared catalog CRUD chrome used by Organization, Projects, Tasks, Documents. */
.hcs-catalog-page {
    --catalog-primary: var(--hcs-color-primary, #3d5cff);
    --catalog-primary-dark: var(--hcs-color-primary-strong, #2447df);
    --catalog-ink: var(--hcs-color-ink, #294d68);
    --catalog-muted: var(--hcs-color-muted, #6d8596);
    --catalog-line: var(--hcs-color-border, #e1e9ee);
    --catalog-input: #eef3f7;
    --catalog-green: #48bd73;
    --catalog-danger: #df1e53;
    font-family: "Be Vietnam Pro", "Segoe UI", system-ui, sans-serif;
    background:
        radial-gradient(circle at 96% 8%, rgba(123, 173, 99, .16), transparent 17rem),
        linear-gradient(135deg, #edf0ef 0%, #e6ebe9 100%);
    margin: -1.5rem calc(-1 * clamp(.9rem, 3vw, 2.5rem));
    min-height: calc(100dvh - var(--hcs-header-h));
    padding: 1rem clamp(.9rem, 3vw, 2.5rem) 3rem;
}

.hcs-catalog-titlebar {
    align-items: flex-end;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin: 0 auto .5rem;
    max-width: 1720px;
}

.hcs-catalog-titlebar__eyebrow {
    color: var(--catalog-primary) !important;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
    margin: 0 0 .25rem;
    text-transform: uppercase;
}

.hcs-catalog-titlebar h1 {
    color: #173b56;
    font-size: clamp(1.65rem, 2.5vw, 2.25rem);
    font-weight: 750;
    letter-spacing: -.025em;
    margin: 0;
}

.hcs-document-layout {
    display: grid;
    gap: 1.1rem;
    grid-template-columns: minmax(12rem, 16rem) minmax(0, 1fr);
    margin: 0 auto;
    max-width: 1720px;
}

.hcs-document-type-sidebar {
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 10px 28px rgba(49, 72, 88, .07);
    padding: .75rem;
}

.hcs-document-type-tree-item {
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--catalog-ink);
    display: block;
    font-size: .9rem;
    font-weight: 600;
    padding: .55rem .75rem;
    text-align: left;
    width: 100%;
}

.hcs-document-type-tree-item:hover,
.hcs-document-type-tree-item.active {
    background: #eef2ff;
    color: var(--catalog-primary);
}

@media (max-width: 960px) {
    .hcs-document-layout {
        grid-template-columns: 1fr;
    }
}

.hcs-document-page__header {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1.1rem;
}

.hcs-document-page__header h1 {
    margin: 0;
}

.hcs-document-page__header > :last-child:not(:only-child) {
    flex: 0 0 auto;
}

/* Blazorise 2.3 applies ExtraLarge/Large via Modal.Size → .modal-xl/.modal-lg on the dialog.
   Bootstrap 5.3 still sizes dialogs with --bs-modal-width inherited from .modal (default 500px). */
.modal:has(> .modal-dialog.modal-xl),
.modal.hcs-user-modal {
    --bs-modal-width: min(94vw, 1180px);
}

.modal:has(> .modal-dialog.modal-lg) {
    --bs-modal-width: min(94vw, 800px);
}

.modal:has(> .modal-dialog.modal-xl) > .modal-dialog,
.modal.hcs-user-modal > .modal-dialog,
.modal:has(> .modal-dialog.modal-lg) > .modal-dialog {
    max-width: var(--bs-modal-width);
}

.hcs-catalog-page__actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .7rem;
    justify-content: flex-end;
}

.hcs-catalog-page .btn {
    border-radius: 5px;
    font-size: .95rem;
    font-weight: 700;
    min-height: 2.85rem;
    padding: .62rem 1.05rem;
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.hcs-catalog-page .btn:hover:not(:disabled) {
    box-shadow: 0 8px 18px rgba(61, 92, 255, .16);
    transform: translateY(-1px);
}

.hcs-catalog-page .btn-primary {
    background-color: var(--catalog-primary);
    border-color: var(--catalog-primary);
}

.hcs-catalog-page .btn-primary:hover:not(:disabled) {
    background-color: var(--catalog-primary-dark);
    border-color: var(--catalog-primary-dark);
}

.hcs-catalog-page .hcs-catalog-export {
    background: #fff;
    color: var(--catalog-primary);
}

.hcs-catalog-page .alert {
    border: 0;
    border-radius: 5px;
    margin: 0 auto 1rem;
    max-width: 1720px;
}

.hcs-catalog-page .card {
    background: #fff;
    border: 0;
    border-radius: 5px;
    box-shadow: 0 10px 28px rgba(49, 72, 88, .07);
    margin-left: auto;
    margin-right: auto;
    max-width: 1720px;
}

.hcs-catalog-filter-card .card-body {
    padding: 1rem;
}

.hcs-catalog-filter-row {
    align-items: stretch;
    display: flex;
    gap: 1.6rem;
}

.hcs-catalog-filter-row--nowrap {
    flex-wrap: nowrap;
    overflow-x: auto;
}

.hcs-catalog-page .hcs-catalog-search {
    align-items: stretch;
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
}

.hcs-catalog-page .hcs-catalog-search .addon-body,
.hcs-catalog-page .hcs-catalog-search .addon-end {
    display: flex;
    min-height: 0;
}

.hcs-catalog-page .hcs-catalog-search .addon-body {
    flex: 1 1 auto;
    min-width: 0;
}

.hcs-catalog-page .hcs-catalog-search .addon-end .btn {
    height: 100%;
}

.hcs-catalog-page .hcs-catalog-search .input-group-text,
.hcs-catalog-page .hcs-catalog-search .form-control,
.hcs-catalog-page .hcs-catalog-search .btn {
    height: 3.6rem;
    max-height: 3.6rem;
    min-height: 3.6rem;
}

.hcs-catalog-page .hcs-catalog-search .input-group-text,
.hcs-catalog-page .hcs-catalog-search .form-control {
    background: var(--catalog-input);
    border-color: var(--catalog-input);
    color: var(--catalog-ink);
    font-size: 1rem;
}

.hcs-catalog-page .hcs-catalog-search .form-control {
    border-radius: 5px 0 0 5px;
    box-shadow: none;
    padding: .5rem;
}

.hcs-catalog-page .hcs-catalog-search .form-control::placeholder {
    color: #7890a0;
    opacity: 1;
}

.hcs-catalog-page .hcs-catalog-search .btn {
    border-radius: 0 5px 5px 0;
    min-width: 8.5rem;
}

.hcs-catalog-page .hcs-catalog-filter-toggle {
    background: #fff;
    border-color: var(--catalog-primary);
    color: var(--catalog-primary);
    flex: 0 0 15.5rem;
    height: 3.6rem;
    max-height: 3.6rem;
    min-height: 3.6rem;
    justify-content: center;
}

.hcs-catalog-advanced-filter {
    align-items: flex-end;
    border-top: 1px solid var(--catalog-line);
    display: flex;
    gap: .75rem;
    margin-top: 1.35rem;
    padding-top: 1.25rem;
}

.hcs-catalog-advanced-filter .mb-3,
.hcs-catalog-advanced-filter .field,
.hcs-catalog-advanced-filter .form-group {
    margin: 0 !important;
    max-width: 18rem;
    width: 100%;
}

.hcs-catalog-advanced-filter .form-label,
.hcs-catalog-advanced-filter .field-label {
    margin-bottom: .45rem;
}

.hcs-catalog-page .hcs-catalog-filter-reset {
    flex: 0 0 auto;
}

.hcs-catalog-grid-card {
    overflow: hidden;
}

.hcs-catalog-grid-card .card-body {
    padding: 2.4rem 2rem 1.35rem;
}

.hcs-catalog-grid {
    min-width: 900px;
}

.hcs-catalog-page .hcs-catalog-grid .table {
    border-color: var(--catalog-line);
    color: var(--catalog-ink);
    margin: 0;
}

.hcs-catalog-page .hcs-catalog-grid .table > :not(caption) > * > * {
    border-bottom: 1px solid var(--catalog-line);
    padding: 1.05rem .9rem;
    vertical-align: middle;
}

.hcs-catalog-page .hcs-catalog-grid thead th {
    background: #fff;
    border-bottom: 1px solid #d8e2e8;
    border-top: 1px solid #d8e2e8;
    color: #4d6d82;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .075em;
    text-transform: uppercase;
    white-space: nowrap;
}

.hcs-catalog-page .hcs-catalog-grid tbody td {
    background: #fff;
    font-size: 1rem;
    font-weight: 560;
}

.hcs-catalog-page .hcs-catalog-grid tbody tr:hover td {
    background: #f8faff;
}

.hcs-row-check {
    appearance: none;
    background: #eef3f6;
    border: 1px solid #dfe8ee;
    border-radius: 5px;
    display: inline-block;
    height: 1.35rem;
    margin: 0;
    opacity: 1;
    vertical-align: middle;
    width: 1.35rem;
}

.hcs-status-icon {
    align-items: center;
    display: inline-flex;
    font-size: 1.1rem;
    justify-content: center;
    min-width: 1.6rem;
}

.hcs-status-icon--active {
    color: var(--catalog-green);
}

.hcs-status-icon--inactive {
    color: var(--catalog-danger);
}

.hcs-row-actions {
    display: flex;
    gap: .45rem;
}

.hcs-catalog-page .hcs-row-actions .hcs-action-button {
    align-items: center;
    background: #fff;
    border-radius: 5px;
    border-width: 1.5px;
    display: inline-flex;
    justify-content: center;
    line-height: 1;
    min-height: 2.7rem;
    min-width: 2.7rem;
    padding: .45rem;
}

.hcs-catalog-page .hcs-row-actions .hcs-action-button i,
.hcs-catalog-page .hcs-row-actions .hcs-action-button .b-icon {
    align-items: center;
    /* display: inline-flex; */
    line-height: 1;
}

.hcs-catalog-page .hcs-row-actions .hcs-action-button--preview {
    border-color: #0d6efd;
    color: #0d6efd;
}

.hcs-catalog-page .hcs-row-actions .hcs-action-button--edit {
    border-color: #7A6FF0;
    color: #7A6FF0;
}

.hcs-catalog-page .hcs-row-actions .hcs-action-button--send {
    border-color: #0dcaf0;
    color: #0dcaf0;
}

.hcs-catalog-page .hcs-row-actions .hcs-action-button--sign {
    border-color: #198754;
    color: #198754;
}

.hcs-catalog-page .hcs-row-actions .hcs-action-button--tasks {
    border-color: #198754;
    color: #198754;
}

.hcs-catalog-page .hcs-row-actions .hcs-action-button--members {
    border-color: #0dcaf0;
    color: #0dcaf0;
}

.hcs-catalog-page .hcs-row-actions .hcs-action-button--delete {
    border-color: #EB4D4B;
    color: #EB4D4B;
}

.hcs-catalog-page .hcs-catalog-grid .pagination {
    margin: 1.25rem 0 .15rem;
}

.hcs-loading,
.hcs-empty {
    align-items: center;
    color: var(--catalog-muted);
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 11rem;
    padding-top: 0 !important;
    text-align: center;
}

.hcs-loading i,
.hcs-empty i {
    color: var(--catalog-primary);
    display: block;
    font-size: 1.8rem;
    margin-bottom: .8rem;
}

.hcs-empty h2 {
    color: var(--catalog-ink);
    font-size: 1.2rem;
    font-weight: 750;
}

.hcs-catalog-page .hcs-catalog-modal .modal-content {
    border: 0;
    border-radius: 5px;
    box-shadow: 0 25px 70px rgba(23, 50, 68, .25);
    overflow: hidden;
}

.hcs-catalog-page .hcs-catalog-modal__header {
    border-bottom: 0;
    padding: 2rem 2.35rem 1.2rem;
}

.hcs-catalog-page .hcs-catalog-modal__header .modal-title {
    color: #173b56;
    font-size: 1.65rem;
    font-weight: 750;
}

.hcs-catalog-page .hcs-catalog-modal__header .btn-close {
    opacity: .55;
}

.hcs-catalog-page .hcs-catalog-modal__body {
    max-height: min(67vh, 48rem);
    overflow-y: auto;
    padding: .8rem 2.35rem 1.5rem;
}

.hcs-catalog-form {
    display: grid;
    gap: .5rem;
}

.hcs-form-row {
    display: grid;
    gap: 1.1rem 1.25rem;
    grid-template-columns: minmax(8rem, 4fr) minmax(12rem, 8fr);
    align-items: start;
}

.hcs-form-row--equal {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Member select (flex) + narrow role + action button on one row */
.hcs-form-row--with-action {
    grid-template-columns: minmax(0, 1fr) minmax(7.5rem, 9.5rem) auto;
    align-items: start;
}

.hcs-form-row--with-action-single {
    grid-template-columns: minmax(0, 1fr) auto;
}

.hcs-form-row--with-action .hcs-form-row__action {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-width: max-content;
}

/* Invisible label spacer so the button lines up with Select2 / selects */
.hcs-form-row--with-action .hcs-form-row__action-spacer {
    color: transparent;
    display: block;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.5;
    margin-bottom: .45rem;
    pointer-events: none;
    user-select: none;
    white-space: nowrap;
}

.hcs-form-row--with-action .hcs-form-row__action-btn,
.hcs-form-row--with-action .hcs-form-row__action .btn {
    align-items: center;
    display: inline-flex;
    height: 36px;
    justify-content: center;
    line-height: 1;
    max-height: 36px;
    min-height: 36px !important;
    padding: 0 .95rem;
    white-space: nowrap;
}

.hcs-member-list {
    display: flex;
    flex-direction: column;
    gap: .65rem;
    list-style: none;
    margin: 1rem 0 0;
    padding: 0;
}

.hcs-member-list__item {
    align-items: center;
    background: #fff;
    border: 1px solid #e2eaf0;
    border-radius: 8px;
    box-shadow: 0 4px 14px rgba(25, 51, 76, .08);
    display: flex;
    gap: .75rem;
    justify-content: space-between;
    padding: .7rem .9rem;
}

.hcs-member-list__meta {
    align-items: baseline;
    color: #24465e;
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    min-width: 0;
}

.hcs-member-list__name {
    color: #19334c;
    font-size: .95rem;
    font-weight: 700;
}

.hcs-member-list__sep {
    color: #8aa0b0;
    font-weight: 500;
}

.hcs-member-list__role {
    color: #5c7485;
    font-size: .9rem;
    font-weight: 500;
}

.hcs-member-list__remove,
.hcs-member-list__item .btn {
    align-items: center;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: .82rem;
    height: 28px;
    justify-content: center;
    line-height: 1;
    max-height: 28px;
    min-height: 28px !important;
    padding: 0 .7rem;
}

.hcs-member-list__link {
    color: #3d5cff;
    text-decoration: none;
}

.hcs-member-list__link:hover {
    text-decoration: underline;
}

.hcs-form-row .field {
    margin: 0;
}

@media (max-width: 767.98px) {
    .hcs-form-row,
    .hcs-form-row--equal,
    .hcs-form-row--with-action {
        grid-template-columns: 1fr;
    }
}

.hcs-catalog-form .field {
    margin: 0;
}

.hcs-catalog-form .field-label,
.hcs-catalog-form .form-label {
    color: #315873;
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: .45rem;
}

.hcs-catalog-form .form-control,
.hcs-catalog-form .form-select,
.hcs-catalog-form .numeric-picker,
.hcs-catalog-form .b-is-datepicker,
.hcs-catalog-form .b-is-datepicker .form-control,
.hcs-document-page input.form-control:not(textarea),
.hcs-document-page .form-select {
    background-color: var(--catalog-input);
    border: 1px solid #e2eaf0;
    border-radius: 5px;
    box-shadow: none;
    color: #24465e;
    font-size: 1rem;
    height: 36px;
    max-height: 36px;
    min-height: 36px;
    padding: .35rem .5rem;
}

.hcs-datepicker {
    align-items: stretch;
    display: flex;
    width: 100%;
}

.hcs-datepicker .b-is-datepicker,
.hcs-catalog-form .hcs-datepicker .b-is-datepicker,
.hcs-workspace .hcs-datepicker .b-is-datepicker {
    height: auto;
    max-height: none;
    min-height: 0;
}

.hcs-datepicker__icon {
    align-items: center;
    background: var(--catalog-input, #f4f8fb);
    border: 1px solid #e2eaf0;
    border-left: 0;
    border-radius: 0 5px 5px 0;
    color: #506b7d;
    display: inline-flex;
    height: 36px;
    justify-content: center;
    min-width: 36px;
    padding: 0 .7rem;
}

.hcs-datepicker .btn.hcs-datepicker__icon {
    box-shadow: none;
    height: 36px;
    max-height: 36px;
    min-height: 36px;
}

.hcs-catalog-form textarea.form-control {
    height: auto;
    max-height: none;
    min-height: 7rem;
}

select.hcs-catalog-select2 + .select2-container .select2-selection--single {
    height: 38px !important;
    max-height: 36px;
    min-height: 38px !important;
}

.hcs-catalog-form .form-control:focus,
.hcs-catalog-form .form-select:focus {
    background-color: #f4f8fb;
    border-color: rgba(61, 92, 255, .6);
    box-shadow: 0 0 0 .2rem rgba(61, 92, 255, .12);
}

.hcs-catalog-form select:disabled {
    color: #5c7485;
    cursor: not-allowed;
    opacity: .86;
}

.hcs-catalog-form .form-text {
    color: var(--catalog-muted);
    font-size: .82rem;
    margin-top: .35rem;
}

.hcs-catalog-active-field {
    padding-top: .15rem;
}

.hcs-catalog-active-field .form-check {
    align-items: center;
    display: flex;
    gap: .55rem;
    margin: 0;
    padding-left: 0px;
}

.hcs-catalog-active-field .form-check-input {
    accent-color: #ee3f84;
    height: 1.25rem;
    margin: 0;
    width: 1.25rem;
}

.hcs-catalog-active-field .form-check-label {
    color: #315873;
    font-size: 1rem;
    font-weight: 650;
}

.hcs-catalog-page .hcs-catalog-modal__footer {
    border-top: 0;
    gap: .8rem;
    justify-content: flex-end;
    padding: .75rem 2.35rem 2rem;
}

.hcs-catalog-modal .hcs-assignee-type {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    min-height: 2.4rem;
}

.hcs-catalog-modal .hcs-assignee-type .form-check,
.hcs-catalog-modal .hcs-allow-return .form-check {
    align-items: center;
    display: flex;
    gap: .45rem;
    margin: 0;
    min-height: 2.4rem;
}

.hcs-catalog-modal .hcs-assignee-type .form-check-input {
    margin: 0;
}

.hcs-catalog-modal .hcs-allow-return {
    align-items: center;
    display: flex;
    min-height: 2.4rem;
}

.hcs-catalog-page .btn,
.hcs-catalog-page .hcs-catalog-cancel,
.hcs-catalog-page .hcs-catalog-save {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    line-height: 1;
}

.hcs-catalog-page .hcs-catalog-cancel {
    background: #7461d2;
    border-color: #7461d2;
    color: #fff;
}

.hcs-catalog-page .hcs-catalog-save {
    min-width: 7rem;
}

@media (max-width: 767.98px) {
    .hcs-catalog-page {
        margin: -1rem -.9rem;
        padding: 1.1rem .9rem 2rem;
    }

    .hcs-catalog-titlebar {
        align-items: flex-start;
        flex-direction: column;
    }

    .hcs-document-page__header {
        align-items: flex-start;
        flex-direction: column;
    }

    .hcs-catalog-page__actions {
        justify-content: flex-start;
        width: 100%;
    }

    .hcs-catalog-page__actions .btn {
        flex: 1 1 auto;
    }

    .hcs-catalog-filter-card .card-body,
    .hcs-catalog-grid-card .card-body {
        padding: 1rem;
    }

    .hcs-catalog-filter-row {
        align-items: stretch;
        flex-direction: column;
        gap: .75rem;
    }

    .hcs-catalog-page .hcs-catalog-filter-toggle {
        flex-basis: auto;
        height: auto;
        max-height: none;
        min-height: 2.85rem;
        width: 100%;
    }

    .hcs-catalog-page .hcs-catalog-search .input-group-text,
    .hcs-catalog-page .hcs-catalog-search .form-control,
    .hcs-catalog-page .hcs-catalog-search .btn {
        height: 3.35rem;
        max-height: 3.35rem !important;
        min-height: 3.35rem !important;
    }

    .hcs-catalog-advanced-filter {
        align-items: stretch;
        flex-direction: column;
    }

    .hcs-catalog-advanced-filter .mb-3,
    .hcs-catalog-advanced-filter .field,
    .hcs-catalog-advanced-filter .form-group {
        max-width: none;
    }

    .hcs-catalog-page .hcs-catalog-modal__header,
    .hcs-catalog-page .hcs-catalog-modal__body,
    .hcs-catalog-page .hcs-catalog-modal__footer {
        padding-left: 1.15rem;
        padding-right: 1.15rem;
    }

    .hcs-catalog-page .hcs-catalog-modal__header {
        padding-top: 1.3rem;
    }

    .hcs-catalog-page .hcs-catalog-modal__footer {
        padding-bottom: 1.3rem;
    }
}

@media (min-width: 768px) {
    .hcs-catalog-page .btn {
        max-height: 36px;
        min-height: 36px;
        padding-block: .3rem;
    }

    .hcs-catalog-page .hcs-catalog-search .btn,
    .hcs-catalog-page .hcs-catalog-filter-toggle,
    .hcs-catalog-page .hcs-catalog-advanced-filter .form-select,
    .hcs-catalog-page .hcs-catalog-advanced-filter .btn {
        height: 36px;
        max-height: 36px !important;
        min-height: 36px !important;
        padding-top: 0;
        padding-bottom: 0;
    }

    .hcs-catalog-page .hcs-catalog-search .input-group-text,
    .hcs-catalog-page .hcs-catalog-search .form-control {
        height: 36px;
        max-height: 36px;
        min-height: 36px;
        padding-top: 0;
        padding-bottom: 0;
    }

    .hcs-catalog-page .hcs-catalog-create,
    .hcs-catalog-page .hcs-catalog-export {
        max-height: 32px;
        min-height: 32px;
        padding-block: .18rem;
    }
}

.hcs-status-badge,
.hcs-priority-badge,
.hcs-progress-badge {
    border-radius: 5px;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 700;
    padding: .28rem .7rem;
    white-space: nowrap;
}

.hcs-status-badge--planning { background: #e8f1ff; color: #2f6fed; }
.hcs-status-badge--info { background: #355dff; color: #fff; }
.hcs-status-badge--success { background: #e8f8ee; color: #1d9e75; }
.hcs-status-badge--danger { background: #fde8ee; color: #df1e53; }
.hcs-status-badge--warning { background: #fff4e5; color: #d97706; }
.hcs-status-badge--todo { background: #efeefe; color: #6c5ce7; }
.hcs-priority-badge--low { background: #fde8ee; color: #e8437a; }
.hcs-priority-badge--normal { background: #fff4e5; color: #d97706; }
.hcs-priority-badge--high { background: #fde8ee; color: #dc2626; }
.hcs-progress-badge { background: #eef3f7; color: #315873; }
.hcs-progress-badge--done { background: #e8f8ee; color: #1d9e75; }

.hcs-catalog-code {
    color: #6d8596;
    display: block;
    font-size: .82rem;
    font-weight: 600;
}

.hcs-catalog-desc {
    color: #6d8596;
    display: block;
    font-size: .85rem;
    margin-top: .15rem;
}

.hcs-detail-split {
    align-items: stretch;
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr;
}

@media (min-width: 992px) {
    .hcs-detail-split {
        grid-template-columns: 1fr 1fr;
    }
}

.hcs-detail-split > .card,
.hcs-detail-split > .d-flex > .card {
    height: 100%;
}

.hcs-calendar-grid,
.hcs-calendar-grid th,
.hcs-calendar-grid td {
    background: #fff;
}

.hcs-calendar-grid th {
    color: #4d6d82;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .075em;
    text-transform: uppercase;
}

.hcs-calendar-grid td {
    height: 7rem;
    min-width: 8rem;
    vertical-align: top;
}

.hcs-calendar-grid__today {
    background: rgba(13, 110, 253, 0.08) !important;
}

.hcs-cal-toolbar {
    align-items: center;
    display: grid;
    gap: .75rem;
    grid-template-columns: 1fr auto 1fr;
    margin: 0 auto .85rem;
    max-width: 1720px;
}

.hcs-cal-toolbar__nav,
.hcs-cal-toolbar__views {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.hcs-cal-toolbar__views {
    justify-content: flex-end;
}

.hcs-cal-toolbar__title {
    color: #3d4a5c;
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-align: center;
    text-transform: uppercase;
}

.hcs-cal-toolbar .btn {
    min-height: 2.35rem;
    padding: .4rem .9rem;
}

.hcs-cal-legend {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .65rem .9rem;
    margin-left: auto;
}

.hcs-cal-legend__item {
    align-items: center;
    display: inline-flex;
    font-size: .82rem;
    font-weight: 700;
    gap: .4rem;
}

.hcs-cal-legend__item::before {
    border-radius: 3px;
    content: "";
    display: inline-block;
    height: .7rem;
    width: .9rem;
}

.hcs-cal-legend__item--project {
    color: #d97706;
}

.hcs-cal-legend__item--project::before {
    background: #fff4d6;
    box-shadow: inset 3px 0 0 #d97706;
}

.hcs-cal-legend__item--task {
    color: #0f9d8e;
}

.hcs-cal-legend__item--task::before {
    background: #d9f6f3;
    box-shadow: inset 3px 0 0 #0f9d8e;
}

.hcs-cal-legend__item--event {
    color: #3d5cff;
}

.hcs-cal-legend__item--event::before {
    background: #e8f0ff;
    box-shadow: inset 3px 0 0 #3d5cff;
}

.hcs-cal-card .card-body {
    overflow: visible;
}

.hcs-fc {
    padding: .35rem .5rem .65rem;
}

.hcs-fc .fc {
    font-family: "Be Vietnam Pro", "Segoe UI", system-ui, sans-serif;
}

.hcs-fc .fc-theme-standard td,
.hcs-fc .fc-theme-standard th,
.hcs-fc .fc-theme-standard .fc-scrollgrid {
    border-color: #e1e9ee;
}

.hcs-fc .fc-col-header-cell {
    background: #f4f7f9;
}

.hcs-fc .fc-col-header-cell-cushion {
    color: #4d6d82;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .075em;
    padding: .55rem .4rem;
    text-transform: uppercase;
}

.hcs-fc .fc-daygrid-day-frame {
    min-height: 7.5rem;
    padding: .3rem .35rem .45rem;
}

.hcs-fc .fc-daygrid-day-top {
    justify-content: flex-end;
}

.hcs-fc .fc-daygrid-day-number {
    color: #19334c;
    font-size: .85rem;
    font-weight: 700;
    padding: .15rem .2rem;
}

.hcs-fc .fc-day-other .fc-daygrid-day-number {
    color: #9aafbc;
}

.hcs-fc .fc-day-today {
    background: transparent !important;
}

.hcs-fc .fc-day-today .fc-daygrid-day-number {
    align-items: center;
    background: #3d5cff;
    border-radius: 50%;
    color: #fff;
    display: inline-flex;
    height: 1.7rem;
    justify-content: center;
    width: 1.7rem;
}

.hcs-fc .fc-daygrid-event,
.hcs-fc .fc-timegrid-event,
.hcs-fc .fc-list-event {
    border: none !important;
    border-left: 3px solid currentColor !important;
    border-radius: 4px !important;
    cursor: pointer;
    font-size: .75rem;
    font-weight: 700;
}

.hcs-fc .fc-daygrid-event {
    margin: 1px 2px;
    padding: 1px 6px;
}

.hcs-fc .fc-event-title,
.hcs-fc .fc-event-title-container {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcs-fc .hcs-cal-event--project {
    background: #fff4d6 !important;
    border-left-color: #d97706 !important;
    color: #d97706 !important;
}

.hcs-fc .hcs-cal-event--task {
    background: #d9f6f3 !important;
    border-left-color: #0f9d8e !important;
    color: #0f9d8e !important;
}

.hcs-fc .hcs-cal-event--event {
    background: #e8f0ff !important;
    border-left-color: #3d5cff !important;
    color: #3d5cff !important;
}

.hcs-fc .fc-timegrid {
    min-height: 36rem;
}

.hcs-fc .fc-list {
    border: 0;
}

.hcs-fc .fc-list-event:hover td {
    background: #f5f8fb;
}

@media (max-width: 767.98px) {
    .hcs-cal-toolbar {
        grid-template-columns: 1fr;
        justify-items: stretch;
    }

    .hcs-cal-toolbar__nav,
    .hcs-cal-toolbar__views {
        justify-content: flex-start;
    }

    .hcs-cal-toolbar__title {
        order: -1;
        text-align: left;
    }

    .hcs-cal-legend {
        margin-left: 0;
    }
}

.hcs-wizard-footer {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    justify-content: flex-end;
    margin-top: 1.25rem;
}

.hcs-pdf-frame {
    background: #fff;
    border: 1px solid #d7e2e8;
    border-radius: .5rem;
    min-height: 32rem;
    overflow: hidden;
    width: 100%;
}

.hcs-pdf-frame .b-pdf-viewer,
.hcs-pdf-frame .pdf-viewer-container,
.hcs-pdf-frame [class*="pdf-viewer"] {
    height: 100%;
    min-height: 32rem;
}

.hcs-pdf-frame--fill {
    display: block;
    height: 100%;
    min-height: 0;
    width: 100%;
}

.hcs-document-preview-pane {
    display: flex;
    flex-direction: column;
    min-height: calc(100dvh - 12rem);
}

.hcs-document-preview-pane .card {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.hcs-document-preview-pane .card-body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.hcs-document-preview-pane .hcs-pdf-frame--fill {
    flex: 1 1 auto;
}

.hcs-template-split {
    align-items: stretch;
    min-height: calc(100dvh - 16rem);
}

.hcs-template-split .hcs-pdf-pane {
    display: flex;
    flex-direction: column;
    min-height: 28rem;
}

.hcs-template-split .hcs-pdf-pane .hcs-pdf-frame--fill,
.hcs-template-split .hcs-pdf-pane .card {
    flex: 1 1 auto;
    min-height: 0;
}

.hcs-catalog-modal--pdf .modal-content {
    display: flex;
    flex-direction: column;
    height: min(90dvh, 56rem);
    max-height: calc(100dvh - 2rem);
}

.hcs-catalog-modal__body--pdf {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    max-height: none;
    min-height: 0;
    overflow: hidden;
    padding: 0;
}

.hcs-catalog-modal__body--pdf .hcs-pdf-frame--fill {
    border-radius: 0;
    flex: 1 1 auto;
    min-height: 0;
}

.hcs-dropzone {
    background: #f7fafc;
    border: 1px dashed #c5d4de;
    border-radius: .5rem;
    padding: .85rem;
}

.hcs-dropzone__hint {
    color: #6d8596;
    font-size: .85rem;
    margin-top: .45rem;
}

.hcs-assignee-pills {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.hcs-pill {
    border-radius: 999px;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 700;
    padding: .2rem .65rem;
}

.hcs-pill--role {
    background: #d1f4ee;
    color: #0f766e;
}

.hcs-pill--user {
    background: #dbeafe;
    color: #1d4ed8;
}

.hcs-signing-tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: .5rem;
    overflow-x: auto;
    padding: 1rem 1.25rem .35rem;
}

.hcs-signing-tab {
    background: #fff;
    border: 1px solid #d7e2e8;
    border-radius: 999px;
    color: #315873;
    flex: 0 0 auto;
    font-weight: 700;
    padding: .35rem .9rem;
    white-space: nowrap;
}

.hcs-signing-tab--active {
    background: var(--hcs-primary, #3d5cff);
    border-color: var(--hcs-primary, #3d5cff);
    color: #fff;
}

.hcs-signing-count {
    background: rgba(255, 255, 255, .22);
    border-radius: 999px;
    display: inline-flex;
    font-size: .75rem;
    margin-left: .35rem;
    min-width: 1.4rem;
    padding: .05rem .4rem;
    justify-content: center;
}

.hcs-signing-tab:not(.hcs-signing-tab--active) .hcs-signing-count {
    background: var(--hcs-primary-soft, #eef1ff);
    color: var(--hcs-primary, #3d5cff);
}

.hcs-template-file-box,
.hcs-step-card {
    background: #f7fafc;
    border: 1px solid #e2eaf0;
    border-radius: .5rem;
    padding: .85rem 1rem;
}

.hcs-step-card {
    margin-bottom: .75rem;
}

.hcs-workflow-info {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: 1fr;
}

@media (min-width: 992px) {
    .hcs-workflow-info {
        grid-template-columns: minmax(16rem, 18rem) minmax(0, 1fr);
    }
}

.hcs-timeline-step {
    align-items: flex-start;
    display: flex;
    gap: .75rem;
    margin-bottom: .9rem;
}

.hcs-timeline-step__marker {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    height: 1.7rem;
    justify-content: center;
    width: 1.7rem;
}

.hcs-timeline-step--active .hcs-timeline-step__marker {
    background: #1d9e75;
    color: #fff;
}

.hcs-timeline-step--signed .hcs-timeline-step__marker {
    background: #e8f8ee;
    color: #1d9e75;
}

.hcs-timeline-step--return .hcs-timeline-step__marker {
    background: #fde8ee;
    color: #df1e53;
}

.hcs-timeline-step--pending .hcs-timeline-step__marker {
    background: #eef3f6;
    color: #6d8596;
}

/* === Workspace styles === */
/* Workspace dashboard chrome. Visual target: community workspace home. */
.hcs-workspace {
    --ws-pink: #e8437a;
    --ws-pink-light: #fef0f5;
    --ws-text: #111827;
    --ws-muted: #6b7280;
    --ws-faint: #9ca3af;
    --ws-line: #e5e7eb;
    --ws-bg: #f9fafb;
    color: var(--ws-text);
    font-family: "Be Vietnam Pro", "Segoe UI", system-ui, sans-serif;
    margin: -1.5rem calc(-1 * clamp(.9rem, 3vw, 2.5rem));
    min-height: calc(100dvh - var(--hcs-header-h, 4rem));
    padding: 1.25rem clamp(.9rem, 3vw, 2.5rem) 2.5rem;
}

.hcs-workspace .hcs-ws-filter {
    align-items: center;
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 5px;
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-bottom: .9rem;
    padding: .7rem 1.1rem;
}

.hcs-workspace .hcs-ws-filter-label {
    align-items: center;
    color: var(--ws-muted);
    display: inline-flex;
    font-size: .8rem;
    gap: .4rem;
    white-space: nowrap;
}

.hcs-workspace .hcs-ws-filter-dates {
    display: flex;
    flex: 1 1 18rem;
    gap: .5rem;
    max-width: 28rem;
}

.hcs-workspace .hcs-ws-filter-dates .form-control,
.hcs-workspace .hcs-ws-filter-dates .b-is-datepicker,
.hcs-workspace .hcs-ws-filter-dates .b-is-datepicker .form-control {
    height: 36px;
    max-height: 36px;
    min-height: 36px;
    padding-bottom: .35rem;
    padding-top: .35rem;
}

.hcs-workspace .hcs-ws-search {
    align-items: center;
    background: var(--hcs-primary, #3d5cff);
    border: 0;
    border-radius: 5px;
    color: #fff;
    display: inline-flex;
    font-size: .8rem;
    font-weight: 600;
    gap: .4rem;
    height: 36px;
    padding: 0 1.1rem;
}

.hcs-workspace .hcs-ws-search:hover { background: #2f4ae6; color: #fff; }

.hcs-workspace .hcs-ws-kpis {
    display: grid;
    gap: .75rem;
    grid-template-columns: repeat(4, 1fr);
    margin-bottom: .9rem;
}

.hcs-workspace .hcs-ws-kpi {
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    padding: 1rem 1.1rem;
}

.hcs-workspace .hcs-ws-kpi-top {
    display: flex;
    justify-content: space-between;
    margin-bottom: .7rem;
}

.hcs-workspace .hcs-ws-kpi-icon {
    align-items: center;
    border-radius: 5px;
    display: flex;
    height: 36px;
    justify-content: center;
    width: 38px;
}

.hcs-workspace .hcs-ws-kpi-num {
    font-size: 1.7rem;
    font-weight: 750;
    line-height: 1.1;
}

.hcs-workspace .hcs-ws-kpi-lbl {
    color: var(--ws-muted);
    font-size: .85rem;
    margin-top: .2rem;
}

.hcs-workspace .hcs-ws-grid-73,
.hcs-workspace .hcs-ws-grid-37 {
    display: grid;
    gap: .9rem;
    margin-bottom: .9rem;
}

.hcs-workspace .hcs-ws-grid-73 { grid-template-columns: 2fr 1fr; }
.hcs-workspace .hcs-ws-grid-37 { grid-template-columns: 1fr 1fr; }

.hcs-workspace .hcs-ws-card {
    background: #fff;
    border: 1px solid var(--ws-line);
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    min-height: 16rem;
}

.hcs-workspace .hcs-ws-card-hd {
    align-items: center;
    display: flex;
    gap: .7rem;
    justify-content: space-between;
    padding: .9rem 1rem .35rem;
}

.hcs-workspace .hcs-ws-card-title-wrap {
    align-items: center;
    display: flex;
    gap: .65rem;
    min-width: 0;
}

.hcs-workspace .hcs-ws-card-icon {
    align-items: center;
    border-radius: 5px;
    display: flex;
    flex-shrink: 0;
    height: 34px;
    justify-content: center;
    width: 34px;
}

.hcs-workspace .hcs-ws-card-title { font-size: .95rem; font-weight: 750; }
.hcs-workspace .hcs-ws-card-sub { color: var(--ws-muted); font-size: .75rem; }

.hcs-workspace .hcs-ws-action {
    align-items: center;
    background: var(--hcs-primary, #3d5cff);
    border: 0;
    border-radius: 5px;
    color: #fff;
    display: inline-flex;
    font-size: .75rem;
    font-weight: 650;
    gap: .3rem;
    padding: .35rem .7rem;
    white-space: nowrap;
}

.hcs-workspace .hcs-ws-action:hover { background: #2f4ae6; color: #fff; }

.hcs-workspace .hcs-ws-card-body {
    flex: 1;
    padding: .5rem 1rem 1rem;
}

.hcs-workspace .hcs-ws-week {
    display: flex;
    gap: .2rem;
    margin-bottom: .8rem;
    width: 100%;
}

.hcs-workspace .hcs-ws-ev-day {
    display: flex;
    flex-direction: column;
    gap: .45rem;
}

.hcs-workspace .hcs-ws-ev-day-label {
    color: var(--ws-muted);
    font-size: .72rem;
    font-weight: 700;
    text-transform: capitalize;
}

.hcs-workspace .hcs-ws-ev-day.is-selected .hcs-ws-ev-day-label {
    color: var(--ws-pink);
}

.hcs-workspace .hcs-ws-day {
    align-items: center;
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    gap: .2rem;
    min-width: 0;
}
.hcs-workspace .hcs-ws-wd { color: var(--ws-faint); font-size: .68rem; text-transform: capitalize; }

.hcs-workspace .hcs-ws-dn {
    background: transparent;
    border: 0;
    border-radius: 5px;
    color: var(--ws-text);
    font-size: .85rem;
    font-weight: 650;
    height: 2rem;
    width: 2rem;
}

.hcs-workspace .hcs-ws-dn.is-today { background: var(--ws-pink); color: #fff; }
.hcs-workspace .hcs-ws-dot { background: var(--ws-pink); border-radius: 50%; height: 5px; width: 5px; }
.hcs-workspace .hcs-ws-dot.is-empty { background: transparent; }

.hcs-workspace .hcs-ws-empty {
    align-items: center;
    color: var(--ws-muted);
    display: flex;
    justify-content: center;
    min-height: 8rem;
    text-align: center;
}

.hcs-workspace .hcs-ws-ev { display: flex; flex-direction: column; gap: .45rem; max-height: 18rem; overflow: auto; }

.hcs-workspace .hcs-ws-ev-row {
    align-items: center;
    border: 1px solid var(--ws-line);
    border-radius: 5px;
    display: flex;
    gap: .65rem;
    padding: .55rem .7rem;
}

.hcs-workspace .hcs-ws-ev-accent { align-self: stretch; background: var(--ws-pink); border-radius: 4px; width: 4px; }
.hcs-workspace .hcs-ws-ev-body { flex: 1; min-width: 0; }
.hcs-workspace .hcs-ws-ev-name { font-size: .86rem; font-weight: 650; }
.hcs-workspace .hcs-ws-ev-meta { color: var(--ws-muted); font-size: .75rem; }

.hcs-workspace .hcs-ws-view {
    background: var(--ws-pink);
    border: 0;
    border-radius: 5px;
    color: #fff;
    font-size: .75rem;
    font-weight: 650;
    padding: .28rem .7rem;
}

.hcs-workspace .hcs-ws-notif { display: flex; flex-direction: column; gap: .35rem; max-height: 18rem; overflow: auto; }

.hcs-workspace .hcs-ws-notif-row {
    align-items: start;
    border-radius: 5px;
    column-gap: .55rem;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding: .45rem .35rem;
}

.hcs-workspace .hcs-ws-notif-row.is-unread { background: #fff8fb; }
.hcs-workspace .hcs-ws-ndot { background: var(--ws-pink); border-radius: 50%; height: 7px; margin-top: .35rem; width: 7px; }
.hcs-workspace .hcs-ws-notif-content { min-width: 0; }
.hcs-workspace .hcs-ws-n-title { font-size: .82rem; font-weight: 650; }
.hcs-workspace .hcs-ws-n-detail,
.hcs-workspace .hcs-ws-n-time { color: var(--ws-faint); font-size: .72rem; }
.hcs-workspace .hcs-ws-n-time {
    align-self: start;
    justify-self: end;
    white-space: nowrap;
}

.hcs-workspace .hcs-ws-wf { display: flex; flex-direction: column; gap: .45rem; }
.hcs-workspace .hcs-ws-wf-row { align-items: center; display: flex; justify-content: space-between; }
.hcs-workspace .hcs-ws-wf-left { align-items: center; display: flex; gap: .45rem; }
.hcs-workspace .hcs-ws-wf-dot { border-radius: 50%; height: 8px; width: 8px; }
.hcs-workspace .hcs-ws-wf-val { font-weight: 700; }

.hcs-workspace .hcs-ws-doc,
.hcs-workspace .hcs-ws-proj,
.hcs-workspace .hcs-ws-task { display: flex; flex-direction: column; gap: .45rem; max-height: 16rem; overflow: auto; }

.hcs-workspace .hcs-ws-doc-row,
.hcs-workspace .hcs-ws-task-row {
    align-items: center;
    border: 1px solid var(--ws-line);
    border-radius: 5px;
    display: flex;
    gap: .55rem;
    padding: .55rem .7rem;
}

.hcs-workspace .hcs-ws-doc-name,
.hcs-workspace .hcs-ws-task-name { flex: 1; font-size: .85rem; font-weight: 650; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.hcs-workspace .hcs-ws-proj-row { border: 1px solid var(--ws-line); border-radius: 5px; padding: .65rem .75rem; }
.hcs-workspace .hcs-ws-proj-top { align-items: center; display: flex; justify-content: space-between; gap: .5rem; }
.hcs-workspace .hcs-ws-proj-name { font-size: .86rem; font-weight: 700; }
.hcs-workspace .hcs-ws-pbar { background: #f3f4f6; border-radius: 5px; height: 6px; margin: .45rem 0; overflow: hidden; }
.hcs-workspace .hcs-ws-pbf { background: var(--ws-pink); height: 100%; }
.hcs-workspace .hcs-ws-proj-foot { color: var(--ws-muted); display: flex; font-size: .75rem; justify-content: space-between; }

.hcs-workspace .hcs-ws-chart { display: flex; flex-direction: column; gap: .55rem; }
.hcs-workspace .hcs-ws-chart-row { display: grid; gap: .5rem; grid-template-columns: 7rem 1fr 2.4rem; align-items: center; }
.hcs-workspace .hcs-ws-chart-lbl { font-size: .75rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hcs-workspace .hcs-ws-chart-track { background: #f3f4f6; border-radius: 5px; height: 8px; overflow: hidden; }
.hcs-workspace .hcs-ws-chart-fill { background: #2563eb; height: 100%; }
.hcs-workspace .hcs-ws-chart-pct { font-size: .75rem; font-weight: 700; text-align: right; }

@media (max-width: 992px) {
    .hcs-workspace .hcs-ws-kpis { grid-template-columns: repeat(2, 1fr); }
    .hcs-workspace .hcs-ws-grid-73,
    .hcs-workspace .hcs-ws-grid-37 { grid-template-columns: 1fr; }
}

@media (max-width: 576px) {
    .hcs-workspace { margin: -1rem -.9rem; padding: 1rem .9rem 2rem; }
    .hcs-workspace .hcs-ws-filter { align-items: stretch; flex-direction: column; }
    .hcs-workspace .hcs-ws-filter-dates {
        flex: 0 0 auto;
        max-width: none;
        width: 100%;
    }
    .hcs-workspace .hcs-datepicker { width: 100%; }
    .hcs-workspace .hcs-ws-search { justify-content: center; width: 100%; }
}

/* === Kanban styles === */
.hcs-kanban-toolbar {
    display: flex;
    gap: .5rem;
}

.hcs-kanban-board {
    display: grid;
    gap: .85rem;
    grid-auto-flow: column;
    grid-auto-columns: minmax(16.5rem, 1fr);
    overflow-x: auto;
    padding-bottom: .5rem;
}

.hcs-kanban-column {
    background: #f7f9fc;
    border: 1px solid #e5e7eb;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    min-height: 22rem;
    min-width: 16.5rem;
}

.hcs-kanban-column.is-over { outline: 2px dashed #e8437a; outline-offset: -4px; }

.hcs-kanban-hd {
    align-items: center;
    display: flex;
    gap: .5rem;
    justify-content: space-between;
    padding: .75rem .85rem .35rem;
}

.hcs-kanban-hd h2 {
    font-size: .92rem;
    font-weight: 750;
    margin: 0;
}

.hcs-kanban-count {
    background: #fff;
    border-radius: 5px;
    color: #6b7280;
    font-size: .75rem;
    font-weight: 700;
    padding: .1rem .5rem;
}

.hcs-kanban-zone {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: .65rem;
    padding: .5rem .65rem .85rem;
}

.hcs-kanban-card {
    background: #fff;
    border: 1px solid #e9e9e9;
    border-radius: 5px;
    box-shadow: 0 6px 16px rgba(49, 72, 88, .05);
    cursor: grab;
    padding: .75rem;
}

.hcs-kanban-card:active { cursor: grabbing; }

.hcs-kanban-project {
    color: #2f6fed;
    font-size: .75rem;
    font-weight: 650;
    margin-bottom: .25rem;
}

.hcs-kanban-title { font-size: .9rem; font-weight: 750; margin: 0; }
.hcs-kanban-code { color: #6d8596; font-size: .75rem; margin: .15rem 0 .45rem; }

.hcs-kanban-parent {
    color: #1d9e75;
    display: inline-block;
    font-size: .75rem;
    margin-bottom: .45rem;
}

.hcs-kanban-pills { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .55rem; }

.hcs-kanban-dates { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .55rem; }

.hcs-kanban-date {
    border-radius: 5px;
    display: inline-flex;
    font-size: .68rem;
    padding: .2rem .35rem;
}

.hcs-kanban-date--start { border: 1px solid #22c55e; }
.hcs-kanban-date--due { border: 1px dashed #ef4444; }

.hcs-kanban-foot {
    align-items: center;
    color: #6b7280;
    display: flex;
    font-size: .75rem;
    gap: .55rem;
}

.hcs-kanban-menu { margin-left: auto; }

.hcs-kanban-menu__toggle {
    align-items: center;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #6b7280;
    display: inline-flex;
    height: 1.85rem;
    justify-content: center;
    padding: 0;
    width: 1.85rem;
}

.hcs-kanban-avatar {
    align-items: center;
    background: #6c757d;
    border-radius: 50%;
    color: #fff;
    display: inline-flex;
    font-size: .7rem;
    font-weight: 700;
    height: 1.7rem;
    justify-content: center;
    width: 1.7rem;
}


.datepicker .datepicker-calendar.dropdown-menu{
    background-color: #fff !important;
}