html,
body,
body.abp-application-layout {
    background: var(--hcs-color-background, #F5F8FC) !important;
    color: var(--hcs-color-ink, #1A1A2E);
    font-family: "Be Vietnam Pro", "Segoe UI", system-ui, sans-serif !important;
    height: auto;
    max-width: 100%;
    min-height: 100%;
}

html {
    overflow-x: clip;
    overflow-y: auto;
}

body,
body.abp-application-layout {
    overflow-x: clip;
    overflow-y: auto;
}

.hcs-boot-screen {
    align-items: center;
    background:
        var(--hcs-color-background, #f6f8fb);
    color: var(--hcs-color-ink, #1A1A2E);
    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 var(--hcs-motion-duration-standard, 200ms) var(--hcs-motion-ease-exit, cubic-bezier(.3, 0, 1, 1)), visibility var(--hcs-motion-duration-standard, 200ms) var(--hcs-motion-ease-exit, cubic-bezier(.3, 0, 1, 1));
    z-index: 2000;
}

body:has(.hcs-app-shell) .hcs-boot-screen,
body:has(.hcs-public-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-loading-icon {
    animation: hcs-boot-spin var(--hcs-motion-duration-spinner, 800ms) linear infinite;
    color: var(--hcs-color-primary, #00B4A9);
    display: block;
    flex-shrink: 0;
}

.hcs-boot-screen__icon {
    color: var(--hcs-color-primary, #00B4A9);
    display: block;
    height: 3rem;
    margin: 0 auto;
    width: 3rem;
}

.hcs-boot-screen__title {
    color: var(--hcs-color-heading, var(--color-primary, #00B4A9));
    font-size: var(--hcs-font-size-section-title, 1.1rem);
    font-weight: 750;
    letter-spacing: -.02em;
    margin: 0 0 .2rem;
}

.hcs-boot-screen__brand {
    color: var(--hcs-color-primary, #00B4A9);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .08em;
    margin: 0 0 .55rem;
    text-transform: uppercase;
}

@media (prefers-reduced-motion: reduce) {
    .hcs-loading-icon {
        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: var(--hcs-color-link, var(--color-primary, #00B4A9));
    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:not(.doc-action):not(.icon-btn):not(.social-pill):not(.close):not(.btn-close):not(.b-numeric-handler),
    .hcs-app-shell button.btn:not(.doc-action):not(.icon-btn):not(.social-pill):not(.close):not(.btn-close):not(.b-numeric-handler),
    .hcs-app-shell a.btn:not(.doc-action):not(.icon-btn):not(.social-pill) {
        box-sizing: border-box;
        border-radius: var(--button-radius, var(--radius-xl, 16px)) !important;
    }

    .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-control,
    .hcs-app-shell .hcs-catalog-advanced-filter .form-select,
    .hcs-app-shell .hcs-catalog-advanced-filter .btn,
    .hcs-app-shell .hcs-catalog-advanced-filter .b-is-datepicker .form-control,
    .hcs-app-shell .hcs-catalog-advanced-filter .hcs-datepicker__icon,
    .hcs-app-shell .hcs-catalog-advanced-filter .select2-container .select2-selection,
    .hcs-app-shell .hcs-users-advanced-filters .form-control,
    .hcs-app-shell .hcs-users-advanced-filters .form-select,
    .hcs-app-shell .hcs-users-advanced-filters .btn,
    .hcs-app-shell .hcs-users-advanced-filters .b-is-datepicker .form-control,
    .hcs-app-shell .hcs-users-advanced-filters .hcs-datepicker__icon,
    .hcs-app-shell .hcs-users-advanced-filters .select2-container .select2-selection {
        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;
    }

    .hcs-app-shell .hcs-catalog-search .form-control,
    .hcs-app-shell .hcs-users-search-input,
    .hcs-app-shell .hcs-catalog-advanced-filter .form-control,
    .hcs-app-shell .hcs-catalog-advanced-filter .b-is-datepicker .form-control,
    .hcs-app-shell .hcs-users-advanced-filters .form-control,
    .hcs-app-shell .hcs-users-advanced-filters .b-is-datepicker .form-control {
        line-height: calc(var(--hcs-button-max-height) - 2px);
    }

    .hcs-app-shell .hcs-catalog-advanced-filter .form-select,
    .hcs-app-shell .hcs-users-advanced-filters .form-select {
        align-items: center;
        display: flex;
        line-height: calc(var(--hcs-button-max-height) - 2px);
        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;
    }
}

/* Control language: 16px (--radius-xl) for buttons/inputs/textareas/cards;
   table .doc-action stays 8px (--radius-md) per design system. */
.hcs-app-shell .btn:not(.doc-action):not(.icon-btn):not(.social-pill):not(.close):not(.btn-close):not(.b-numeric-handler),
.hcs-app-shell .form-control:not(textarea),
.hcs-app-shell .form-select,
.hcs-app-shell .input-group-text,
.hcs-app-shell select:not([multiple]),
.hcs-app-shell input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]),
.hcs-app-shell .b-is-datepicker .form-control,
.hcs-app-shell .numeric-picker,
.hcs-app-shell .select2-container .select2-selection {
    border-radius: var(--input-radius) !important;
}

.hcs-app-shell .btn:not(.doc-action):not(.icon-btn):not(.social-pill):not(.close):not(.btn-close):not(.b-numeric-handler) {
    border-radius: var(--button-radius) !important;
}

.hcs-app-shell .card,
.hcs-app-shell .card-header,
.hcs-app-shell .card-footer,
.hcs-app-shell .modal-content,
.hcs-app-shell .list-group,
.hcs-app-shell .alert {
    border-radius: var(--card-radius) !important;
}

.hcs-app-shell .dropdown-menu,
.hcs-app-shell .filter-menu {
    border-radius: var(--radius-lg) !important;
}

.hcs-app-shell textarea.form-control,
.hcs-app-shell textarea.input,
.hcs-app-shell .hcs-catalog-form textarea:not(.select2-search__field) {
    border-radius: var(--input-radius-multiline, var(--radius-xl)) !important;
}

.hcs-app-shell button.doc-action,
.hcs-app-shell a.doc-action {
    border-radius: var(--radius-md) !important;
}

.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-item,
.hcs-app-shell .table,
.hcs-app-shell .b-table,
.hcs-app-shell .hcs-action-button {
    border-radius: var(--hcs-radius) !important;
}

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

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

.hcs-app-shell .input-group > :first-child:last-child {
    border-radius: var(--input-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 {
    border-radius: 50% !important;
}

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

.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,
.hcs-user-option__dept {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

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

.select2-results__option--highlighted .hcs-user-option__name,
.select2-results__option--selected .hcs-user-option__name {
    color: var(--color-primary, #007f7c);
}

.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: 1 1 auto;
    flex-direction: column;
    height: auto;
    max-width: none;
    min-height: 0;
    overflow: hidden;
    padding: 0;
}



.pagination .form-select {
    box-sizing: border-box;
    width: auto;
    min-width: calc(3ch + 2.65rem + 2px);
    padding: .375rem 2rem .375rem .65rem !important;
    background-position: right .5rem center;
}

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

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

/* === Catalog styles === */
/* Shared catalog CRUD chrome used by Organization, Projects, Tasks, Documents. */
.hcs-catalog-page {
    --catalog-primary: var(--color-primary, #007F7C);
    --catalog-primary-dark: var(--color-primary-hover, #006866);
    --catalog-ink: var(--color-foreground, #1E293B);
    --catalog-muted: var(--color-muted, #64748B);
    --catalog-line: var(--color-border, #E6EEF0);
    --catalog-input: var(--color-background, #F3F7F8);
    --catalog-green: var(--color-success, #16A34A);
    --catalog-danger: var(--color-danger, #DC2626);
    font-family: var(--font-sans, "Inter", "Be Vietnam Pro", "Segoe UI", system-ui, sans-serif);
    background: var(--color-background, #F3F7F8);
    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: var(--color-primary, #007F7C);
    font-size: 1.375rem;
    font-weight: 600;
    letter-spacing: -.01em;
    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: var(--hcs-color-primary-soft, #E0F7F5);
    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,
.modal:has(.signing-action-modal) {
    --bs-modal-width: min(96vw, 1360px);
}

.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;
    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: var(--hcs-shadow-md, 0 10px 24px rgba(19, 47, 70, .1));
    transform: translateY(-1px);
}

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

.hcs-catalog-page .btn-primary:hover:not(:disabled),
.hcs-catalog-page .btn-primary:is(:active, .active):not(:disabled) {
    background-color: var(--catalog-primary-dark);
    border-color: var(--catalog-primary-dark);
    box-shadow: none;
    color: #fff;
    transform: none;
}

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

.hcs-catalog-page .hcs-catalog-export:is(:hover, :active, .active):not(:disabled) {
    background: var(--hcs-color-primary-soft, #e0f7f5);
    border-color: var(--catalog-primary);
    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: var(--hcs-control-height-compact);
    max-height: var(--hcs-control-height-compact);
    min-height: var(--hcs-control-height-compact);
}

.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;
}

/* Event filters use the same fixed label/control rhythm for search, selects, and reset. */
.hcs-app-shell .hcs-event-filters > .hcs-event-filter-field,
.hcs-app-shell .hcs-event-filters > .hcs-event-filter-action {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    margin: 0;
    min-width: 0;
}

.hcs-app-shell .hcs-event-filters .hcs-event-filter-label,
.hcs-app-shell .hcs-event-filters .hcs-event-filter-label-spacer {
    box-sizing: border-box;
    display: block;
    flex: 0 0 1.25rem;
    height: 1.25rem;
    line-height: 1.25rem;
    margin: 0 0 .45rem;
}

.hcs-app-shell .hcs-event-filters .hcs-event-filter-field > :is(.form-control, .form-select),
.hcs-app-shell .hcs-event-filters .hcs-catalog-search {
    box-sizing: border-box;
    height: var(--hcs-control-height-compact);
    max-height: var(--hcs-control-height-compact);
    min-height: var(--hcs-control-height-compact);
}

.hcs-app-shell .hcs-event-filters .hcs-catalog-search {
    align-items: stretch;
    display: flex;
    margin: 0;
}

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

.hcs-app-shell .hcs-event-filters .hcs-catalog-search .addon-body {
    flex: 1 1 auto;
    min-width: 0;
}

.hcs-app-shell .hcs-event-filters :is(.form-control, .form-select, .hcs-catalog-search .btn) {
    box-sizing: border-box;
    height: var(--hcs-control-height-compact);
    max-height: var(--hcs-control-height-compact) !important;
    min-height: var(--hcs-control-height-compact) !important;
}

.hcs-app-shell .hcs-event-filters .hcs-catalog-search .addon-end .btn {
    height: 100%;
}

.hcs-app-shell .hcs-event-filters .hcs-event-filter-action .hcs-event-reset {
    align-self: stretch;
    margin: 0;
    min-height: var(--hcs-control-height-compact);
}

.hcs-catalog-page .hcs-catalog-filter-toggle,
.hcs-app-shell .hcs-users-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;
    white-space: nowrap;
}

.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 {
    -webkit-appearance: none;
    appearance: none;
    background: #eef3f6;
    border: 1px solid #dfe8ee;
    border-radius: 5px;
    cursor: pointer;
    display: inline-grid;
    flex-shrink: 0;
    height: 1.35rem;
    margin: 0;
    opacity: 1;
    place-items: center;
    position: relative;
    vertical-align: middle;
    width: 1.35rem;
}

.hcs-row-check:checked {
    background: var(--color-primary, #007f7c);
    border-color: var(--color-primary, #007f7c);
}

.hcs-row-check:checked::after {
    border: solid #fff;
    border-width: 0 2px 2px 0;
    content: "";
    height: .55rem;
    margin-bottom: .12rem;
    transform: rotate(45deg);
    width: .28rem;
}

.hcs-row-check:focus-visible {
    outline: 2px solid var(--color-primary, #007f7c);
    outline-offset: 2px;
}

.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: var(--hcs-color-primary, var(--color-primary, #00B4A9));
    color: var(--hcs-color-primary, var(--color-primary, #00B4A9));
}

/* Keep info/link icons visible against the white action-button background. */
.hcs-app-shell .hcs-action-button.btn-outline-info:hover:not(:disabled),
.hcs-app-shell .hcs-action-button.btn-outline-info:focus-visible,
.hcs-app-shell .hcs-action-button.btn-outline-info:active:not(:disabled) {
    background-color: var(--hcs-color-primary-soft);
    border-color: var(--hcs-color-primary-strong);
    color: var(--hcs-color-primary-strong);
}

.hcs-catalog-page .hcs-row-actions .hcs-action-button--edit {
    border-color: var(--color-secondary);
    color: var(--color-secondary);
}

.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-loading .hcs-loading-icon {
    color: var(--catalog-primary);
    margin-bottom: .8rem;
}

.hcs-empty h1,
.hcs-empty h2 {
    color: var(--hcs-color-heading, var(--color-primary, #00B4A9));
    font-size: var(--hcs-font-size-section-title, 1.1rem);
    font-weight: 750;
}

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

.hcs-catalog-modal__header {
    border-bottom: 0;
    padding: 0 8px 0 16px;
}

.hcs-catalog-modal__header .modal-title {
    color: var(--hcs-color-heading, var(--color-primary, #00B4A9));
    font-size: var(--hcs-font-size-section-title, 1.1rem);
    font-weight: 750;
}

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

.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;
}

/* Bootstrap5 Steps has a fixed-width inner container and connector. */
.steps.hcs-workflow-steps {
    display: flex;
    width: 100%;
    max-width: 720px;
    margin: 24px auto 32px;
    padding: 0;
    overflow: visible;
}

.steps.hcs-workflow-steps .step {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
}

.hcs-workflow-steps .step .step-container {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: none;
    padding: 0 8px;
}

.hcs-workflow-steps .step-circle {
    box-sizing: border-box;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
}

.hcs-workflow-steps .step-circle::before {
    display: none;
}

.hcs-workflow-steps .step + .step::before {
    content: "";
    position: absolute;
    top: 15px;
    left: calc(-50% + 16px);
    width: calc(100% - 32px);
    height: 2px;
    background: var(--hcs-color-border, #adb5bd);
}

.hcs-workflow-steps .step.step-active::before,
.hcs-workflow-steps .step.step-completed::before {
    background: var(--hcs-color-primary, #00b4a9);
}

.hcs-workflow-steps .step-text {
    width: 100%;
    max-width: none;
    margin: 12px 0 0;
    font-size: 1rem;
    line-height: 1.5;
    white-space: nowrap;
    text-align: center;
    color: var(--hcs-color-ink-muted, #617184);
}

.hcs-workflow-steps .step-active .step-text {
    color: var(--hcs-color-primary-strong, #007f7c);
    font-weight: 600;
}

.hcs-workflow-steps .step-active .step-circle {
    background: var(--hcs-color-primary, #00b4a9);
    border-color: var(--hcs-color-primary, #00b4a9);
}

@media (max-width: 575.98px) {
    .steps.hcs-workflow-steps {
        flex-direction: column;
        gap: 16px;
        margin: 16px 0 24px;
    }

    .hcs-workflow-steps .step .step-container {
        flex-direction: row;
        gap: 12px;
        min-height: 44px;
        padding: 0;
    }

    .hcs-workflow-steps .step + .step::before {
        top: -10px;
        left: 15px;
        width: 2px;
        height: 28px;
    }

    .hcs-workflow-steps .step-text {
        width: auto;
        margin: 0;
        white-space: normal;
        text-align: left;
    }
}

.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: var(--button-height);
    justify-content: center;
    line-height: 1;
    max-height: none;
    min-height: var(--button-height) !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: var(--hcs-color-primary, #00B4A9);
    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 .form-control,
.hcs-catalog-form .select2-container .select2-selection,
.hcs-document-page input.form-control:not(textarea),
.hcs-document-page .form-select {
    background-color: var(--input-bg);
    border: 1px solid var(--input-border);
    border-radius: var(--input-radius);
    box-shadow: none;
    color: var(--input-fg);
    font-size: 1rem;
    height: var(--input-height);
    max-height: none;
    min-height: var(--input-height);
    padding: 0 14px;
}

.hcs-catalog-form .select2-container .select2-selection--single {
    padding: 0;
}

.hcs-datepicker {
    display: block;
    margin: 0;
    overflow: visible;
    padding: 0;
    position: relative;
    width: 100%;
}

.hcs-datepicker .b-is-datepicker,
.hcs-datepicker .datepicker:not(.datepicker-calendar):not(.dropdown-menu),
.hcs-datepicker .dropdown,
.hcs-catalog-form .hcs-datepicker .b-is-datepicker,
.hcs-workspace .hcs-datepicker .b-is-datepicker {
    display: block;
    height: auto;
    margin: 0;
    max-height: none;
    max-width: 100%;
    min-height: 0;
    min-width: 0;
    padding: 0;
    width: 100%;
}

.hcs-datepicker .form-control,
.hcs-datepicker input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]) {
    box-sizing: border-box;
    display: block;
    max-width: 100%;
    min-width: 0;
    width: 100%;
}

.hcs-datepicker__icon {
    align-items: center;
    background: var(--input-bg);
    border: 1px solid var(--input-border);
    border-left: 0;
    border-radius: 0 var(--input-radius) var(--input-radius) 0;
    color: var(--color-muted);
    display: inline-flex;
    height: var(--input-height);
    justify-content: center;
    min-width: var(--input-height);
    padding: 0 .7rem;
}

.hcs-datepicker .btn.hcs-datepicker__icon {
    box-shadow: none;
    height: var(--input-height);
    max-height: none;
    min-height: var(--input-height);
}

.hcs-catalog-form textarea.form-control {
    height: auto;
    max-height: none;
    min-height: 7rem;
    border-radius: var(--input-radius-multiline, var(--radius-lg));
    padding: 12px 14px;
}

select.hcs-catalog-select2 + .select2-container .select2-selection--single {
    box-sizing: border-box;
}

.hcs-catalog-form .form-control:focus,
.hcs-catalog-form .form-control:focus-visible,
.hcs-catalog-form .form-select:focus,
.hcs-catalog-form .form-select:focus-visible {
    background-color: var(--catalog-input);
    border-color: var(--hcs-color-primary, #00B4A9);
    box-shadow: var(--hcs-focus-ring) !important;
    outline: 0 !important;
}

.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;
}

/* Match the adjacent catalog input height, below its label. */
@media (min-width: 768px) {
    .hcs-form-row .hcs-icd-chronic-field {
        align-self: end;
        align-items: center;
        display: flex;
        min-height: var(--input-height);
        padding-top: 0;
    }
}

.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-modal__footer {
    border-top: 0;
    flex-wrap: wrap;
    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: var(--hcs-color-surface, #fff);
    border-color: var(--hcs-color-primary, #00B4A9);
    color: var(--hcs-color-primary, #00B4A9);
}

.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,
    .hcs-app-shell .hcs-users-filter-row {
        align-items: stretch;
        flex-direction: column;
        gap: .75rem;
    }

    .hcs-catalog-page .hcs-catalog-filter-toggle,
    .hcs-app-shell .hcs-users-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: var(--hcs-control-height-compact);
        max-height: var(--hcs-control-height-compact) !important;
        min-height: var(--hcs-control-height-compact) !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-modal__header,
.hcs-catalog-modal__body,
.hcs-catalog-modal__footer {
        padding-left: 1.15rem;
        padding-right: 1.15rem;
    }

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

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

@media (min-width: 768px) {
    .hcs-app-shell .hcs-catalog-page .hcs-catalog-search .btn,
    .hcs-app-shell .hcs-catalog-page .hcs-catalog-filter-toggle,
    .hcs-app-shell .hcs-catalog-page .hcs-catalog-advanced-filter .form-control,
    .hcs-app-shell .hcs-catalog-page .hcs-catalog-advanced-filter .form-select,
    .hcs-app-shell .hcs-catalog-page .hcs-catalog-advanced-filter .btn,
    .hcs-app-shell .hcs-catalog-page .hcs-catalog-advanced-filter .b-is-datepicker .form-control,
    .hcs-app-shell .hcs-catalog-page .hcs-catalog-advanced-filter .hcs-datepicker__icon {
        height: var(--hcs-button-max-height);
        max-height: var(--hcs-button-max-height) !important;
        min-height: var(--hcs-button-max-height) !important;
    }

    .hcs-app-shell .hcs-catalog-page .hcs-catalog-search .input-group-text,
    .hcs-app-shell .hcs-catalog-page .hcs-catalog-search .form-control {
        height: var(--hcs-button-max-height);
        max-height: var(--hcs-button-max-height);
        min-height: var(--hcs-button-max-height);
        padding-top: 0;
        padding-bottom: 0;
        line-height: calc(var(--hcs-button-max-height) - 2px);
    }

}

/* Document filters: keep the full filter set readable without forcing a horizontal strip. */
.hcs-document-filter-row {
    gap: 1rem;
}

.hcs-document-filter-row .hcs-catalog-filter-toggle {
    flex: 0 0 13rem;
    width: 13rem;
}

.hcs-document-filter-card .hcs-document-advanced-filter {
    align-items: end;
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.hcs-document-filter-card .hcs-document-advanced-filter > .field,
.hcs-document-filter-card .hcs-document-advanced-filter > .form-group {
    max-width: none;
    min-width: 0;
    width: auto;
}

.hcs-document-filter-card .hcs-document-advanced-filter > .hcs-catalog-filter-reset {
    align-self: end;
    min-width: 0;
    width: 100%;
}

@media (min-width: 1440px) {
    .hcs-document-filter-card .hcs-document-advanced-filter {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

@media (min-width: 1900px) {
    .hcs-document-filter-card .hcs-document-advanced-filter {
        grid-template-columns: repeat(9, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .hcs-document-filter-row .hcs-catalog-filter-toggle {
        flex-basis: auto;
        width: 100%;
    }

    .hcs-document-filter-card .hcs-document-advanced-filter {
        align-items: stretch;
        grid-template-columns: 1fr;
    }
}

.hcs-status-badge,
.hcs-priority-badge,
.hcs-progress-badge {
    align-items: center;
    border-radius: var(--radius-full, 9999px);
    box-sizing: border-box;
    display: inline-flex;
    flex-shrink: 0;
    font-size: 11px;
    font-weight: 600;
    height: 24px;
    justify-content: center;
    line-height: 1;
    max-height: 24px;
    min-height: 24px;
    overflow: hidden;
    padding: 0 8px;
    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: var(--hcs-color-danger, #E31E24); }
.hcs-status-badge--warning { background: #fff4e5; color: #d97706; }
.hcs-status-badge--todo { background: #efeefe; color: #6c5ce7; }
.hcs-priority-badge--low { background: #fde8ee; color: var(--hcs-color-danger, #E31E24); }
.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-progress-badge--cancelled { background: #fde8e8; color: #dc2626; }

.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(0, 180, 169, .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: var(--hcs-color-heading, var(--color-primary, #00B4A9));
    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: var(--color-primary);
}

.hcs-fc .fc-col-header-cell-cushion {
    color: white;
    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;
}

/* Suppress the body-cell highlight without clearing today's column header. */
.hcs-fc .fc-daygrid-day.fc-day-today,
.hcs-fc .fc-timegrid-col.fc-day-today {
    background: transparent !important;
}

.hcs-fc .fc-day-today .fc-daygrid-day-number {
    align-items: center;
    background: var(--hcs-color-primary, #00B4A9);
    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: #FEF3C7 !important;
    border-left-color: #F59E0B !important;
    color: #92400E !important;
}

.hcs-fc .hcs-cal-event--task {
    background: #E0F2FE !important;
    border-left-color: #38BDF8 !important;
    color: #075985 !important;
}

.hcs-fc .hcs-cal-event--notice {
    background: #EDE9FE !important;
    border-left-color: #8B5CF6 !important;
    color: #5B21B6 !important;
}

.hcs-fc .hcs-cal-event--event {
    background: #CCFBF1 !important;
    border-left-color: var(--color-primary, #00B4A9) !important;
    color: #0F766E !important;
}

.hcs-fc .fc-more-link {
    color: var(--color-primary, #00B4A9);
    font-weight: 600;
}

.hcs-fc .fc-list-day-cushion {
    background: var(--color-primary-soft, #E6F3F2) !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;
    display: flex;
    flex-direction: column;
    min-height: 32rem;
    overflow: hidden;
    width: 100%;
}

.hcs-pdf-toolbar {
    align-items: center;
    background: #f8fafc;
    border-bottom: 1px solid var(--hcs-line, #e2eaf0);
    display: flex;
    flex-shrink: 0;
    gap: 4px;
    height: 44px;
    justify-content: flex-end;
    padding: 0 8px;
}

.hcs-pdf-tool {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: var(--radius-xl, 16px);
    color: var(--hcs-muted, #64748b);
    cursor: pointer;
    display: inline-flex;
    height: 40px;
    justify-content: center;
    min-height: 40px;
    min-width: 40px;
    padding: 0;
    width: 40px;
}

.hcs-pdf-tool:hover:not(:disabled),
.hcs-pdf-tool:focus-visible {
    background: var(--hcs-primary-soft, #e6f3f2);
    color: var(--hcs-primary, #007f7c);
}

.hcs-pdf-tool:disabled {
    cursor: default;
    opacity: .4;
}

.hcs-pdf-zoom {
    color: var(--hcs-ink, #1e293b);
    font-size: 12px;
    font-weight: 700;
    min-width: 2.75rem;
    text-align: center;
}

.hcs-pdf-frame__viewport {
    background: #eef3f7;
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    position: relative;
    width: 100%;
}

.hcs-pdf-frame:not(.hcs-pdf-frame--fill) .hcs-pdf-frame__viewport {
    min-height: 32rem;
}

.hcs-pdf-frame__sheet {
    height: 100%;
    transform-origin: center center;
    width: 100%;
}

.hcs-pdf-frame__embed {
    border: 0;
    display: block;
    height: 100%;
    min-height: 32rem;
    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 {
    height: 100%;
    min-height: 0;
    width: 100%;
}

.hcs-pdf-frame--fill .hcs-pdf-frame__viewport,
.hcs-pdf-frame--fill .hcs-pdf-frame__sheet,
.hcs-pdf-frame--fill .hcs-pdf-frame__embed {
    min-height: 0;
}

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

.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;
}

/* Keep split document surfaces visually separate while preserving the 50/50 layout. */
.hcs-document-detail-row {
    --bs-gutter-x: 2rem;
    --bs-gutter-y: 1.5rem;
}

.hcs-document-detail-row > * {
    min-width: 0;
}

@media (max-width: 767.98px) {
    .hcs-document-detail-row {
        --bs-gutter-x: 0;
        --bs-gutter-y: 1.5rem;
    }
}

.signing-action-modal .process-split {
    min-width: 0;
}

.signing-action-modal .process-split > * {
    min-width: 0;
}

.hcs-file-preview-card {
    align-items: center;
    background: #f7fafc;
    border: 1px solid #d7e2e8;
    border-radius: .5rem;
    display: flex;
    min-height: 32rem;
    text-align: center;
}

.hcs-file-preview-card .card-body {
    align-items: center;
    gap: .65rem;
    justify-content: center;
}

.hcs-file-preview-card__icon {
    color: var(--hcs-color-primary, #00B4A9);
    font-size: 3.5rem;
    margin-bottom: .5rem;
}

.hcs-file-preview-card__name {
    color: var(--hcs-color-heading, var(--color-primary, #00B4A9));
    max-width: 100%;
    overflow-wrap: anywhere;
}

.hcs-file-preview-card__meta {
    color: #6d8596;
    font-size: .85rem;
}

.hcs-template-split {
    display: grid;
    gap: 1rem;
    align-items: start;
}

.hcs-template-form {
    align-self: start;
    height: auto;
    min-height: 0;
}

.hcs-template-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.hcs-template-preview {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 28rem;
}

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

.hcs-template-split .hcs-pdf-pane .hcs-pdf-frame--fill {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.hcs-template-preview-empty,
.hcs-template-split .hcs-pdf-pane .hcs-template-preview-empty {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    height: 100%;
    min-height: 100%;
}

.hcs-template-preview-empty .card-body {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    justify-content: center;
}

@media (min-width: 992px) {
    .hcs-template-split {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        align-items: start;
    }

    .hcs-template-split .hcs-pdf-pane {
        align-self: start;
        box-sizing: border-box;
        overflow: hidden;
    }

    .hcs-template-split .hcs-template-preview {
        flex: 1 1 auto;
        height: 100%;
        min-height: 100%;
        overflow: hidden;
    }

    .hcs-template-split .hcs-template-preview-empty {
        min-height: 100%;
    }

    .hcs-template-split .hcs-pdf-frame,
    .hcs-template-split .hcs-pdf-frame .b-pdf-viewer,
    .hcs-template-split .hcs-pdf-frame .pdf-viewer-container,
    .hcs-template-split .hcs-pdf-frame [class*="pdf-viewer"] {
        min-height: 0 !important;
    }

    .hcs-template-split .hcs-pdf-frame {
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: hidden;
    }

    .hcs-template-split .hcs-pdf-frame > * {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .hcs-template-split .hcs-pdf-frame .overflow-auto {
        flex: 1 1 auto;
        height: auto;
        min-height: 0;
        overflow: auto !important;
    }
}

.hcs-catalog-modal--pdf.modal-dialog,
.modal-dialog:has(.hcs-catalog-modal--pdf) {
    display: flex;
    height: min(92dvh, calc(100dvh - 1.5rem));
    margin: .75rem auto;
    max-width: min(96vw, 88rem);
    width: min(96vw, 88rem);
}

.hcs-catalog-modal--pdf .modal-content,
.hcs-catalog-modal--pdf.modal-content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    height: 100%;
    max-height: min(92dvh, calc(100dvh - 1.5rem));
    min-height: min(88dvh, 40rem);
    overflow: hidden;
}

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

.hcs-inbox-preview-tabs.process-side-tabs,
.hcs-inbox-preview-tabs.vb-tabs {
    flex: 0 0 auto;
    gap: 20px;
    margin: 0;
    padding: 12px 20px 0;
}

.hcs-inbox-preview-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--color-primary-soft, #e6f7f6);
    color: var(--color-primary, #00B4A9);
    font-size: 11px;
    font-weight: 600;
    line-height: 18px;
}

.hcs-inbox-preview-pane {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.hcs-inbox-preview-pane[hidden] {
    display: none !important;
}

.hcs-inbox-preview-pane--history {
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 16px 20px 20px;
}

.hcs-catalog-modal__body--pdf.is-inbox .hcs-pdf-frame,
.hcs-catalog-modal__body--pdf.is-inbox .hcs-pdf-frame--fill {
    min-height: 0;
}

.hcs-catalog-modal__body--pdf .hcs-pdf-frame,
.hcs-catalog-modal__body--pdf .hcs-pdf-frame--fill {
    border: 0;
    border-radius: 0;
    display: flex;
    flex: 1 1 auto;
    height: 100%;
    min-height: min(70dvh, 36rem);
}

.hcs-catalog-modal__body--pdf .hcs-pdf-frame__viewport,
.hcs-catalog-modal__body--pdf .hcs-pdf-frame__embed {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
}

.hcs-office-preview {
    align-items: center;
    background: #f7fafc;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: .75rem;
    justify-content: center;
    min-height: 24rem;
    padding: 2rem 1.5rem;
    text-align: center;
}

.hcs-office-preview__icon {
    color: var(--hcs-color-primary, #00B4A9);
    font-size: 3.5rem;
}

.hcs-office-preview__name {
    font-size: 1.05rem;
    font-weight: 600;
    margin: 0;
    max-width: 36rem;
    overflow-wrap: anywhere;
}

.hcs-office-preview__meta,
.hcs-office-preview__hint {
    color: #6d8596;
    margin: 0;
    max-width: 36rem;
}

.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-grid-loading {
    overflow-x: auto;
    padding: 0 2rem 1.35rem;
}

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

.hcs-signing-grid-loading__row {
    align-items: center;
    border-bottom: 1px solid var(--catalog-line, #dde4ee);
    display: grid;
    gap: 1rem;
    grid-template-columns: 8rem minmax(14rem, 2.1fr) minmax(9rem, 1.2fr) minmax(10rem, 1.2fr) minmax(8rem, 1fr) minmax(9rem, 1.2fr) minmax(7rem, .9fr);
    min-height: 4.5rem;
}

.hcs-signing-grid-loading__row--head {
    min-height: 3rem;
}

.hcs-signing-grid-loading__row span {
    animation: hcs-motion-skeleton-pulse var(--hcs-motion-duration-skeleton, 1600ms) var(--hcs-motion-ease-ambient, cubic-bezier(.4, 0, .2, 1)) infinite;
    background: #edf2f1;
    border-radius: .35rem;
    display: block;
    height: .9rem;
    width: 82%;
}

.hcs-signing-grid-loading__row--head span {
    background: #dce8ea;
    height: .7rem;
    width: 68%;
}

.hcs-signing-grid-loading__row span:first-child {
    width: 64%;
}

@media (max-width: 767.98px) {
    .hcs-signing-grid-loading {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hcs-signing-grid-loading__row span {
        animation: none;
    }
}

.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,
.hcs-signing-tab--active:active {
    background: var(--hcs-primary, var(--color-primary, #00B4A9));
    border-color: var(--hcs-primary, var(--color-primary, #00B4A9));
    color: #fff;
}

.hcs-signing-tab:active:not(.hcs-signing-tab--active) {
    background: #fff;
    border-color: #d7e2e8;
    color: #315873;
}

.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, var(--color-primary, #00B4A9));
}

.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.5rem;
    grid-template-columns: 1fr;
}

@media (min-width: 992px) {
    .hcs-workflow-info {
        align-items: start;
        gap: 2rem;
        grid-template-columns: minmax(22rem, 1fr) minmax(22rem, 1.1fr);
    }
}

.hcs-workflow-info__heading {
    color: var(--color-primary, #00B4A9);
    font-size: .92rem;
    font-weight: 700;
    letter-spacing: .01em;
    margin: 0 0 1rem;
}

.hcs-timeline {
    list-style: none;
    margin: 0;
    padding: 0;
}

.hcs-timeline-step {
    align-items: flex-start;
    display: grid;
    gap: .75rem;
    grid-template-columns: 1.7rem minmax(0, 1fr);
    margin: 0;
    padding-bottom: .85rem;
    position: relative;
}

.hcs-timeline-step:last-child {
    padding-bottom: 0;
}

.hcs-timeline-step:not(:last-child)::before {
    background: var(--color-border, #e6eef0);
    bottom: 0;
    content: "";
    left: .8rem;
    position: absolute;
    top: 1.7rem;
    width: 2px;
}

.hcs-timeline-step__marker {
    align-items: center;
    border: 2px solid transparent;
    border-radius: 999px;
    display: inline-flex;
    flex: 0 0 auto;
    height: 1.7rem;
    justify-content: center;
    margin-top: .15rem;
    width: 1.7rem;
    z-index: 1;
}

.hcs-timeline-step__body {
    background: #fff;
    border: 1px solid var(--color-border, #e6eef0);
    border-radius: 12px;
    min-width: 0;
    padding: .7rem .85rem;
}

.hcs-timeline-step__title {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .4rem .65rem;
}

.hcs-timeline-step__title strong {
    color: var(--color-gray-800, #1e293b);
    font-size: .92rem;
    font-weight: 700;
}

.hcs-timeline-step__kind {
    color: var(--color-muted, #64748b);
    font-size: .72rem;
    font-weight: 650;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.hcs-timeline-step__meta,
.hcs-timeline-step__actor {
    color: var(--color-muted, #64748b);
    font-size: .78rem;
    line-height: 1.45;
    margin: .35rem 0 0;
}

.hcs-timeline-step__actor {
    align-items: center;
    display: flex;
    gap: .4rem;
}

.hcs-timeline-step__actor i {
    width: .9rem;
}

.hcs-timeline-step--active .hcs-timeline-step__marker {
    background: var(--color-primary, #00B4A9);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-primary, #00B4A9) 18%, transparent);
    color: #fff;
}

.hcs-timeline-step--active .hcs-timeline-step__body {
    background: color-mix(in srgb, var(--color-primary, #00B4A9) 7%, #fff);
    border-color: color-mix(in srgb, var(--color-primary, #00B4A9) 32%, #fff);
}

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

.hcs-timeline-step--signed .hcs-timeline-step__body {
    border-color: color-mix(in srgb, #1d9e75 28%, #fff);
}

.hcs-timeline-step--return .hcs-timeline-step__marker {
    background: #fde8ee;
    color: var(--hcs-color-danger, #E31E24);
}

.hcs-timeline-step--return .hcs-timeline-step__body {
    border-color: color-mix(in srgb, var(--hcs-color-danger, #E31E24) 28%, #fff);
}

.hcs-timeline-step--pending .hcs-timeline-step__marker {
    background: #fff;
    border-color: #cbd5e1;
    color: #94a3b8;
}

.hcs-timeline-step__pick {
    cursor: pointer;
    text-align: left;
    width: 100%;
}

.hcs-timeline-step__pick:hover,
.hcs-timeline-step__pick:focus-visible {
    border-color: color-mix(in srgb, var(--color-primary, #00B4A9) 48%, #fff);
}

.hcs-timeline-step.is-selected .hcs-timeline-step__body {
    border-color: var(--color-primary, #00B4A9);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-primary, #00B4A9) 16%, transparent);
}

/* === Workspace styles — layout kept; tokens match the restyled app === */
.hcs-workspace {
    --ws-text: var(--color-foreground, var(--color-gray-800, #1E293B));
    --ws-muted: var(--color-muted, var(--color-gray-500, #64748B));
    --ws-faint: var(--color-gray-400, #94A3B8);
    --ws-line: var(--color-border, #E6EEF0);
    --ws-accent: var(--color-primary, #007F7C);
    color: var(--ws-text);
    font-family: var(--font-sans, "Inter", "Segoe UI", system-ui, sans-serif);
    margin: 0 auto;
    max-width: 100%;
    min-height: calc(100dvh - var(--hcs-header-h, 7.25rem) - 3rem);
    padding: 0;
    width: 100%;
}

.hcs-workspace .hcs-ws-filter {
    align-items: center;
    background: var(--color-white, #fff);
    border: 1px solid var(--ws-line);
    border-radius: var(--card-radius, var(--radius-xl, 16px));
    box-shadow: var(--shadow-xs);
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4, 1rem);
    margin-bottom: 1rem;
    overflow: visible;
    padding: 8px 8px 8px 20px;
    position: relative;
    z-index: 1;
}

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

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

.hcs-workspace .hcs-ws-filter .btn {
    flex-shrink: 0;
}

.hcs-workspace .hcs-ws-filter-dates .form-control,
.hcs-workspace .hcs-ws-filter-dates .b-is-datepicker .form-control {
    border-radius: var(--input-radius, var(--radius-xl, 16px));
    height: 40px;
    max-height: 40px;
    min-height: 40px;
    padding-bottom: .35rem;
    padding-top: .35rem;
}

.hcs-workspace .hcs-ws-filter-dates .hcs-datepicker,
.hcs-workspace .hcs-ws-filter-dates .b-is-datepicker {
    height: auto;
    max-height: none;
    overflow: visible;
}

.hcs-workspace .hcs-ws-filter-dates .datepicker-calendar.dropdown-menu {
    background-color: #fff !important;
    border: 1px solid var(--hcs-color-border, #E6EEF0) !important;
    box-shadow: var(--hcs-shadow-md);
    z-index: var(--hcs-z-popover) !important;
}

.hcs-workspace .hcs-ws-filter-dates .datepicker-backdrop {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.hcs-workspace .hcs-ws-kpis {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, 1fr);
    margin-bottom: 1rem;
    position: relative;
    z-index: var(--hcs-z-base);
}

.hcs-workspace .hcs-ws-kpi {
    background: var(--color-white, #fff);
    border: 1px solid var(--ws-line);
    border-radius: var(--card-radius, var(--radius-xl, 16px));
    box-shadow: var(--shadow-xs);
    color: inherit;
    display: flex;
    flex-direction: column;
    min-height: 118px;
    padding: 16px 18px;
    text-decoration: none;
    transition: box-shadow var(--duration, 200ms) var(--ease), transform var(--duration, 200ms) var(--ease);
}

.hcs-workspace .hcs-ws-kpi--static {
    cursor: default;
}

.hcs-workspace a.hcs-ws-kpi:hover {
    box-shadow: var(--shadow-md);
    color: inherit;
    text-decoration: none;
    transform: translateY(-2px);
}

.hcs-workspace .hcs-ws-kpi-icon {
    align-items: center;
    border-radius: 10px;
    display: grid;
    height: 36px;
    justify-content: center;
    margin-bottom: 16px;
    place-items: center;
    width: 36px;
}

.hcs-workspace .hcs-ws-kpi-icon svg,
.hcs-workspace .hcs-ws-card-icon svg,
.hcs-workspace .hcs-ws-file-icon,
.hcs-workspace .hcs-ws-filter-label svg {
    display: block;
    flex-shrink: 0;
}

.hcs-workspace .hcs-ws-kpi-icon.pink,
.hcs-workspace .hcs-ws-card-icon.pink { background: #FDE8EF; color: #E11D48; }
.hcs-workspace .hcs-ws-kpi-icon.red,
.hcs-workspace .hcs-ws-card-icon.red { background: #FDECEC; color: #E11D48; }
.hcs-workspace .hcs-ws-kpi-icon.blue,
.hcs-workspace .hcs-ws-card-icon.blue { background: #E8F1FE; color: #2563EB; }
.hcs-workspace .hcs-ws-kpi-icon.green,
.hcs-workspace .hcs-ws-card-icon.green { background: #E7F8F1; color: #059669; }
.hcs-workspace .hcs-ws-card-icon.purple { background: #F3E8FF; color: #7C3AED; }
.hcs-workspace .hcs-ws-kpi-icon.teal,
.hcs-workspace .hcs-ws-card-icon.teal { background: var(--color-primary-soft, #E6F3F2); color: var(--color-primary, #007F7C); }

.hcs-workspace .hcs-ws-kpi-num {
    font-size: 28px;
    font-weight: 800;
    line-height: 1;
}

.hcs-workspace .hcs-ws-kpi-lbl {
    color: var(--ws-muted);
    font-size: var(--font-size-sm, 0.8125rem);
    font-weight: 400;
    margin-top: 6px;
}

.hcs-workspace .hcs-ws-grid-73,
.hcs-workspace .hcs-ws-grid-37 {
    display: grid;
    gap: 1rem;
    margin-bottom: 1rem;
    position: relative;
    z-index: var(--hcs-z-base);
}

.hcs-workspace .hcs-ws-grid-73 { grid-template-columns: 2fr 1fr; }
.hcs-workspace .hcs-ws-grid-37 { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }

.hcs-workspace .hcs-ws-card {
    background: var(--color-white, #fff);
    border: 1px solid var(--ws-line);
    border-radius: var(--card-radius, var(--radius-xl, 16px));
    box-shadow: var(--shadow-xs);
    display: flex;
    flex-direction: column;
    min-height: 16rem;
}

.hcs-workspace .hcs-ws-card-hd {
    align-items: center;
    border-bottom: 1px solid var(--color-gray-100, #F1F5F9);
    display: flex;
    gap: .7rem;
    justify-content: space-between;
    margin-bottom: 4px;
    padding: 16px 18px 12px;
}

.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: 8px;
    display: grid;
    flex-shrink: 0;
    height: 28px;
    justify-content: center;
    place-items: center;
    width: 28px;
}

.hcs-workspace .hcs-ws-card-title {
    color: var(--color-primary, #007F7C);
    font-size: 1rem;
    font-weight: 600;
}
.hcs-workspace .hcs-ws-card-sub {
    color: var(--ws-muted);
    display: block;
    font-size: var(--font-size-xs, 0.75rem);
    font-weight: 400;
    margin-top: 2px;
}

.hcs-workspace .hcs-ws-card-hd .btn-sm {
    border-radius: var(--button-radius, var(--radius-xl, 16px));
    min-height: 36px;
}

.hcs-workspace .hcs-ws-card-hd .hcs-ws-add {
    flex: 0 0 36px;
    height: 36px;
    max-width: 36px;
    min-height: 36px;
    min-width: 36px;
    padding: 0;
    width: 36px;
}

.hcs-workspace .hcs-ws-card-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-height: 0;
    padding: .35rem 1rem .75rem;
}

.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-accent);
}

.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: var(--radius-full, 9999px);
    box-shadow: none;
    color: var(--ws-text);
    font-size: var(--font-size-sm, 0.8125rem);
    font-weight: 600;
    height: 32px;
    min-height: 32px;
    min-width: 32px;
    padding: 0;
    width: 32px;
}

.hcs-workspace .hcs-ws-dn.is-today { background: var(--ws-accent); color: var(--color-white, #fff); }
.hcs-workspace .hcs-ws-dot { background: var(--ws-accent); 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(--color-gray-400, #94A3B8);
    display: grid;
    font-size: var(--font-size-sm, 0.8125rem);
    justify-content: center;
    min-height: 8rem;
    place-items: center;
    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(--color-gray-100, #F1F5F9);
    border-radius: var(--radius-lg, 12px);
    display: flex;
    gap: 10px;
    min-height: 44px;
    padding: 6px 10px;
}

.hcs-workspace .hcs-ws-ev-accent { align-self: stretch; background: var(--ws-accent); border-radius: 2px; width: 3px; }
.hcs-workspace .hcs-ws-ev-body { flex: 1; min-width: 0; }
.hcs-workspace .hcs-ws-ev-name { font-size: var(--font-size-sm, 0.8125rem); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hcs-workspace button.hcs-ws-ev-name,
.hcs-workspace button.hcs-ws-proj-name,
.hcs-workspace button.hcs-ws-task-name,
.hcs-workspace button.hcs-ws-doc-name {
    appearance: none;
    background: none;
    border: 0;
    color: inherit;
    cursor: pointer;
    font: inherit;
    height: auto;
    line-height: 1.25;
    max-width: 100%;
    min-height: 0;
    padding: 0;
    text-align: left;
}
.hcs-workspace button.hcs-ws-ev-name:hover,
.hcs-workspace button.hcs-ws-proj-name:hover,
.hcs-workspace button.hcs-ws-task-name:hover,
.hcs-workspace button.hcs-ws-doc-name:hover {
    color: var(--color-primary, #007F7C);
}
.hcs-workspace .hcs-ws-ev-meta { color: var(--ws-muted); font-size: 12px; }

.hcs-workspace .hcs-ws-ev-row .btn-sm,
.hcs-workspace .hcs-ws-doc-row .btn-sm {
    border-radius: var(--button-radius, var(--radius-xl, 16px));
    flex-shrink: 0;
    min-height: 36px;
}

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

.hcs-workspace .hcs-ws-notif-item {
    align-items: start;
    border-radius: 0;
    color: inherit;
    column-gap: 12px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    min-height: 44px;
    padding: 10px 0;
}

.hcs-workspace .hcs-ws-notif-item:hover .hcs-ws-notif-copy { color: var(--hcs-color-ink, #1E293B); }
.hcs-workspace .hcs-ws-notif-item.is-unread strong { color: var(--hcs-color-ink, #1E293B); }

.hcs-workspace .hcs-ws-notif-ico {
    align-items: center;
    background: var(--color-gray-100, #F1F5F9);
    border-radius: 10px;
    color: var(--color-gray-600, #475569);
    display: grid;
    flex-shrink: 0;
    height: 36px;
    min-width: 36px;
    place-items: center;
    width: 36px;
}

.hcs-workspace .hcs-ws-notif-ico.is-sign { background: #E8F1FE; color: #2563EB; }
.hcs-workspace .hcs-ws-notif-ico.is-chat { background: var(--hcs-color-primary-soft, #E6F3F2); color: var(--hcs-color-primary-strong, #006866); }
.hcs-workspace .hcs-ws-notif-ico.is-event { background: #F3E8FF; color: #7C3AED; }
.hcs-workspace .hcs-ws-notif-ico.is-social { background: #FEF3C7; color: #D97706; }
.hcs-workspace .hcs-ws-notif-ico.is-doc { background: var(--color-gray-100, #F1F5F9); color: var(--color-gray-700, #334155); }
.hcs-workspace .hcs-ws-notif-ico i { font-size: 0.85rem; }

.hcs-workspace .hcs-ws-notif-copy {
    align-items: baseline;
    column-gap: 8px;
    display: grid;
    grid-template-areas:
        "title time"
        "body body";
    grid-template-columns: minmax(0, 1fr) auto;
    min-width: 0;
    row-gap: 2px;
}

.hcs-workspace .hcs-ws-notif-copy strong {
    color: var(--color-gray-800, #1E293B);
    font-size: 0.875rem;
    font-weight: 600;
    grid-area: title;
    line-height: 1.4;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcs-workspace .hcs-ws-notif-copy p {
    color: var(--hcs-color-muted, #64748B);
    font-size: 12px;
    grid-area: body;
    line-height: 1.45;
    margin: 0;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcs-workspace .hcs-ws-notif-copy time {
    align-self: start;
    color: var(--color-gray-400, #94A3B8);
    float: none;
    font-size: 11px;
    grid-area: time;
    line-height: 1.4;
    margin: 0;
    padding-top: 2px;
    position: static;
    white-space: nowrap;
}

.hcs-workspace .hcs-ws-notif-mark-all {
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--hcs-color-primary-strong, #006866);
    cursor: pointer;
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 600;
    min-height: 32px;
    padding: 0 8px;
    white-space: nowrap;
}

.hcs-workspace .hcs-ws-notif-mark-all:hover:not(:disabled),
.hcs-workspace .hcs-ws-notif-mark-all:focus-visible {
    background: var(--hcs-color-primary-soft, #E6F3F2);
}

.hcs-workspace .hcs-ws-notif-mark-all:disabled {
    cursor: default;
    opacity: 0.45;
}

.hcs-workspace .hcs-ws-notif-all {
    align-items: center;
    border-top: 1px solid var(--color-gray-100, #F1F5F9);
    color: var(--hcs-color-primary-strong, #006866);
    display: flex;
    font-size: 0.875rem;
    font-weight: 600;
    min-height: 44px;
    padding: 0 4px;
    text-decoration: none;
}

.hcs-workspace .hcs-ws-notif-all:hover,
.hcs-workspace .hcs-ws-notif-all:focus-visible {
    color: var(--color-primary, #007F7C);
}

.hcs-workspace .hcs-ws-donut-chart,
.hcs-workspace .hcs-ws-workflow-chart {
    align-items: center;
    display: grid;
    gap: 1.25rem;
    grid-template-columns: 8.5rem minmax(0, 1fr);
    min-height: 10rem;
}

.hcs-workspace .hcs-ws-donut {
    flex-shrink: 0;
    height: 8.5rem;
    margin-inline: auto;
    position: relative;
    width: 8.5rem;
}

.hcs-workspace .hcs-ws-donut svg {
    display: block;
    height: 100%;
    overflow: visible;
    transform: rotate(-90deg);
    width: 100%;
}

.hcs-workspace .hcs-ws-donut-track {
    stroke: #eef3f7;
    stroke-width: 5.5;
}

.hcs-workspace .hcs-ws-donut svg circle:not(.hcs-ws-donut-track) {
    stroke-linecap: butt;
    stroke-width: 5.5;
}

.hcs-workspace .hcs-ws-donut-hole {
    align-items: center;
    display: flex;
    flex-direction: column;
    inset: 0;
    justify-content: center;
    pointer-events: none;
    position: absolute;
    text-align: center;
}

.hcs-workspace .hcs-ws-donut-total { font-size: 1.5rem; font-weight: 800; line-height: 1.1; }
.hcs-workspace .hcs-ws-donut-label { color: var(--ws-muted); font-size: .7rem; margin-top: .15rem; }
.hcs-workspace .hcs-ws-legend,
.hcs-workspace .hcs-ws-wf {
    display: flex;
    flex-direction: column;
    gap: 8px;
    list-style: none;
    margin: 0;
    min-width: 0;
    padding: 0;
}
.hcs-workspace .hcs-ws-legend li,
.hcs-workspace .hcs-ws-wf-row {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: 8px minmax(0, 1fr) auto 2.6em;
}
.hcs-workspace .hcs-ws-wf-left { align-items: center; display: flex; gap: .45rem; min-width: 0; }
.hcs-workspace .hcs-ws-wf-dot { border-radius: 50%; flex-shrink: 0; height: 8px; width: 8px; }
.hcs-workspace .hcs-ws-wf-val { font-weight: 700; }
.hcs-workspace .hcs-ws-legend li span:nth-child(2) {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcs-workspace .hcs-ws-doc-group + .hcs-ws-doc-group {
    border-top: 1px solid var(--color-gray-100, #F1F5F9);
    margin-top: .15rem;
    padding-top: .35rem;
}

.hcs-workspace .hcs-ws-signing-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    padding-bottom: .75rem;
    margin-bottom: .5rem;
    border-bottom: 1px solid var(--hcs-color-border);
}
.hcs-workspace .hcs-ws-signing-tab {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-height: 36px;
    padding: .25rem .65rem;
    border: 1px solid transparent;
    border-radius: 999px;
    background: transparent;
    color: var(--hcs-color-primary);
    font: inherit;
    font-size: .78rem;
    font-weight: 600;
    cursor: pointer;
}
.hcs-workspace .hcs-ws-signing-tab:hover {
    background: var(--hcs-color-primary-soft);
}
.hcs-workspace .hcs-ws-signing-tab.is-active,
.hcs-workspace .hcs-ws-signing-tab.is-active:active {
    background: var(--hcs-color-primary);
    color: #fff;
}
.hcs-workspace .hcs-ws-signing-tab:active:not(.is-active) {
    background: var(--hcs-color-primary-soft);
    color: var(--hcs-color-primary);
}
.hcs-workspace .hcs-ws-signing-tab span {
    min-width: 1.5rem;
    padding: .1rem .35rem;
    border-radius: 999px;
    background: var(--hcs-color-primary-soft);
    color: var(--hcs-color-primary-strong);
    text-align: center;
    font-size: .8em;
}
.hcs-workspace .hcs-ws-signing-tab:focus-visible {
    outline: 2px solid var(--hcs-color-primary);
    outline-offset: 2px;
}
.hcs-workspace .hcs-ws-signing-more {
    display: flex;
    justify-content: center;
    padding: .75rem 0;
}
.hcs-workspace .hcs-ws-signing-more .btn.btn-sm {
    min-height: 36px;
    padding: .25rem .75rem;
    font-size: .78rem;
}
.hcs-workspace .hcs-ws-file-icon.hcs-ws-signing-icon {
    color: var(--color-primary, #007F7C);
    height: 18px;
    width: 18px;
}

.hcs-workspace .hcs-ws-doc-groups {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    max-height: 18rem;
    overflow: auto;
    overscroll-behavior: contain;
}
.hcs-workspace .hcs-ws-doc-group-title {
    align-items: baseline;
    color: var(--ws-muted, #64748b);
    display: flex;
    font-size: .72rem;
    font-weight: 700;
    gap: .3rem;
    letter-spacing: .01em;
    margin-bottom: .1rem;
    text-transform: none;
}
.hcs-workspace .hcs-ws-doc-group-title span {
    color: var(--hcs-color-ink, #0f172a);
    font-weight: 800;
}
.hcs-workspace .hcs-ws-empty--compact {
    min-height: 1.8rem;
    padding: .2rem 0;
}
.hcs-workspace .hcs-ws-doc-groups .hcs-ws-doc {
    max-height: none;
    overflow: visible;
}

.hcs-workspace .hcs-ws-list-expandable.hcs-ws-proj,
.hcs-workspace .hcs-ws-list-expandable.hcs-ws-task {
    max-height: none;
    overflow: visible;
}

.hcs-workspace .hcs-ws-doc,
.hcs-workspace .hcs-ws-task,
.hcs-workspace .hcs-ws-proj {
    display: flex;
    flex-direction: column;
}

.hcs-workspace .hcs-ws-task,
.hcs-workspace .hcs-ws-proj {
    max-height: 18rem;
    overflow: auto;
    overscroll-behavior: contain;
}

.hcs-workspace .hcs-ws-doc-row,
.hcs-workspace .hcs-ws-task-row {
    align-items: center;
    border: 0;
    border-radius: 8px;
    display: flex;
    gap: .4rem;
    min-height: 34px;
    padding: .28rem .15rem;
}

.hcs-workspace .hcs-ws-doc-row + .hcs-ws-doc-row,
.hcs-workspace .hcs-ws-task-row + .hcs-ws-task-row {
    border-top: 1px solid var(--color-gray-100, #F1F5F9);
    border-radius: 0;
}

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

.hcs-workspace .hcs-ws-file-icon {
    color: var(--color-gray-400, #94A3B8);
    flex-shrink: 0;
    height: 16px;
    width: 16px;
}
.hcs-workspace .hcs-ws-people { align-items: center; display: inline-flex; gap: 5px; }
.hcs-workspace .hcs-ws-people svg { flex-shrink: 0; height: 13px; width: 13px; }

.hcs-workspace .hcs-ws-proj-row {
    border: 0;
    border-radius: 8px;
    padding: .38rem .15rem .32rem;
}
.hcs-workspace .hcs-ws-proj-row + .hcs-ws-proj-row {
    border-top: 1px solid var(--color-gray-100, #F1F5F9);
    border-radius: 0;
}
.hcs-workspace .hcs-ws-proj-top { align-items: center; display: flex; justify-content: space-between; gap: .4rem; min-width: 0; }
.hcs-workspace .hcs-ws-proj-name {
    color: inherit;
    flex: 1;
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.25;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.hcs-workspace .hcs-ws-pbar { background: var(--color-gray-100, #F1F5F9); border-radius: var(--radius-full, 9999px); height: 4px; margin: .22rem 0 .16rem; overflow: hidden; }
.hcs-workspace .hcs-ws-pbf { background: var(--ws-accent); height: 100%; }
.hcs-workspace .hcs-ws-proj-foot { color: var(--ws-muted); display: flex; font-size: .7rem; justify-content: space-between; line-height: 1.2; }

.hcs-workspace .hcs-ws-progress {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.hcs-workspace .hcs-ws-progress-row {
    align-items: center;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1fr) auto;
}

.hcs-workspace .hcs-ws-progress-row span:first-child {
    color: var(--color-gray-700, #334155);
    font-size: var(--font-size-sm, 0.8125rem);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcs-workspace .hcs-ws-progress-row .pct {
    color: var(--ws-muted);
    font-size: var(--font-size-sm, 0.8125rem);
    font-weight: 600;
}

.hcs-workspace .hcs-ws-bar {
    background: var(--color-gray-100, #F1F5F9);
    border-radius: var(--radius-full, 9999px);
    height: 8px;
    overflow: hidden;
}

.hcs-workspace .hcs-ws-bar > i {
    background: var(--ws-accent);
    border-radius: inherit;
    display: block;
    height: 100%;
}

@media (max-width: 1100px) {
    .hcs-workspace .hcs-ws-grid-73 { grid-template-columns: 1fr; }
    .hcs-workspace .hcs-ws-card--notifications { display: none; }
}

@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; }
    .hcs-workspace .hcs-ws-card { min-height: 0; }
    .hcs-workspace .hcs-ws-doc,
    .hcs-workspace .hcs-ws-proj,
    .hcs-workspace .hcs-ws-task,
    .hcs-workspace .hcs-ws-ev,
    .hcs-workspace .hcs-ws-notif { max-height: none; overflow: visible; }
    .hcs-workspace .hcs-ws-doc-groups { max-height: 18rem; overflow: auto; }
}

@media (max-width: 576px) {
    .hcs-workspace { margin: 0; min-height: 0; padding: 0 0 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-filter .btn { justify-content: center; width: 100%; }
}

/* === Kanban styles ===
   Moved to wwwroot/prototype/bridge.css (designsystem sync). */



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


.d-none {
    display: none !important;
}

/* Workspace quick actions and detail modals */
.hcs-workspace .hcs-ws-proj-actions,
.hcs-workspace .hcs-ws-task-row,
.hcs-workspace .hcs-ws-doc-row,
.hcs-workspace .hcs-workspace-detail-row {
    align-items: center;
    display: flex;
    gap: .35rem;
}

.hcs-workspace .hcs-ws-proj-actions { flex-shrink: 0; }
.hcs-workspace .hcs-ws-task-row,
.hcs-workspace .hcs-ws-doc-row { min-width: 0; }
.hcs-workspace .hcs-ws-task-row .hcs-ws-task-name,
.hcs-workspace .hcs-ws-doc-row .hcs-ws-doc-name { min-width: 0; }
.hcs-workspace .hcs-ws-task-row .hcs-ws-task-name { flex: 1; }
.hcs-workspace .hcs-ws-doc-row .hcs-ws-doc-name { flex: 1; }
.hcs-workspace .hcs-ws-doc-kind {
    background: var(--color-gray-100, #F1F5F9);
    border-radius: var(--radius-full, 9999px);
    color: var(--color-gray-600, #475569);
    flex: 0 0 auto;
    font-size: var(--font-size-xs, .75rem);
    font-weight: var(--font-weight-medium, 500);
    line-height: 1;
    padding: .35rem .55rem;
    white-space: nowrap;
}
.hcs-workspace .hcs-ws-doc-row:hover,
.hcs-workspace .hcs-ws-task-row:hover,
.hcs-workspace .hcs-ws-proj-row:hover {
    background: color-mix(in srgb, var(--color-primary, #007F7C) 6%, #fff);
}

.hcs-workspace .hcs-ws-doc-row .hcs-status-badge,
.hcs-workspace .hcs-ws-task-row .hcs-progress-badge,
.hcs-workspace .hcs-ws-proj-row .hcs-status-badge {
    font-size: 10px;
    height: 22px;
    max-height: 22px;
    min-height: 22px;
    padding: 0 7px;
}

.hcs-workspace .hcs-ws-doc-row .icon-btn,
.hcs-workspace .icon-btn.eye,
.hcs-workspace .eye {
    background: var(--color-primary-soft, #E6F3F2);
    border: 0;
    border-radius: var(--radius-full, 9999px);
    box-shadow: none;
    color: var(--color-primary, #007F7C);
    display: inline-grid;
    flex: 0 0 auto;
    height: 26px;
    min-height: 26px;
    min-width: 26px;
    padding: 0;
    place-items: center;
    width: 26px;
}

.hcs-workspace .hcs-ws-doc-row .icon-btn svg,
.hcs-workspace .hcs-ws-task-row .icon-btn svg,
.hcs-workspace .hcs-ws-proj-row .icon-btn svg,
.hcs-workspace .icon-btn.eye svg {
    height: 14px;
    width: 14px;
}

.hcs-workspace .hcs-ws-doc-row .icon-btn:hover,
.hcs-workspace .hcs-ws-doc-row .icon-btn:focus-visible,
.hcs-workspace .icon-btn.eye:hover,
.hcs-workspace .icon-btn.eye:focus-visible {
    background: #D4F3EF;
    color: var(--color-primary, #007F7C);
}

.hcs-ws-project-modal .hcs-ws-project {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.hcs-ws-project-modal .hcs-ws-project__summary {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem .75rem;
}

.hcs-ws-project-modal .hcs-ws-project__code {
    background: var(--color-teal-50, #EAF5F4);
    border-radius: var(--radius-full, 9999px);
    color: var(--color-teal-700, #004F4D);
    font-size: var(--font-size-sm, .8125rem);
    font-weight: var(--font-weight-semibold, 600);
    letter-spacing: .02em;
    line-height: 1;
    padding: .4rem .7rem;
}

.hcs-ws-project-modal .hcs-ws-project__dates {
    color: var(--color-gray-500, #64748B);
    font-size: var(--font-size-sm, .8125rem);
}

.hcs-ws-project-modal .hcs-ws-project__desc {
    color: var(--color-gray-700, #334155);
    font-size: var(--font-size-md, .875rem);
    line-height: var(--line-height-normal, 1.5);
    margin: 0;
    overflow-wrap: anywhere;
}

.hcs-ws-project-modal .hcs-ws-project__grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
}

.hcs-ws-project-modal .hcs-ws-project__panel {
    background: var(--color-gray-50, #F8FAFC);
    border: 1px solid var(--color-gray-200, #E2E8F0);
    border-radius: var(--radius-xl, 16px);
    min-width: 0;
    padding: 1rem 1.1rem;
}

.hcs-ws-project-modal .hcs-ws-project__panel-hd {
    align-items: center;
    display: flex;
    gap: .5rem;
    justify-content: space-between;
    margin-bottom: .85rem;
}

.hcs-ws-project-modal .hcs-ws-project__panel-hd h3 {
    color: var(--color-teal-700, #004F4D);
    font-size: var(--font-size-sm, .8125rem);
    font-weight: var(--font-weight-semibold, 600);
    letter-spacing: .04em;
    margin: 0;
    text-transform: uppercase;
}

.hcs-ws-project-modal .hcs-ws-project__count {
    background: var(--color-white, #fff);
    border: 1px solid var(--color-gray-200, #E2E8F0);
    border-radius: var(--radius-full, 9999px);
    color: var(--color-gray-600, #475569);
    font-size: var(--font-size-xs, .75rem);
    font-weight: var(--font-weight-semibold, 600);
    line-height: 1;
    min-width: 1.5rem;
    padding: .3rem .45rem;
    text-align: center;
}

.hcs-ws-project-modal .hcs-ws-project__empty {
    color: var(--color-gray-500, #64748B);
    font-size: var(--font-size-sm, .8125rem);
    margin: 0;
}

.hcs-ws-project-modal .hcs-ws-project__members,
.hcs-ws-project-modal .hcs-ws-project__tasks {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    list-style: none;
    margin: 0;
    max-height: 16rem;
    overflow: auto;
    padding: 0;
}

.hcs-ws-project-modal .hcs-ws-project__members li,
.hcs-ws-project-modal .hcs-ws-project__tasks li {
    align-items: center;
    background: var(--color-white, #fff);
    border: 1px solid var(--color-gray-200, #E2E8F0);
    border-radius: 12px;
    display: flex;
    gap: .65rem;
    min-width: 0;
    padding: .65rem .75rem;
}

.hcs-ws-project-modal .hcs-ws-project__avatar {
    align-items: center;
    background: var(--color-teal-100, #C5E6E5);
    border-radius: var(--radius-full, 9999px);
    color: var(--color-teal-800, #003B3A);
    display: inline-flex;
    flex: 0 0 auto;
    font-size: var(--font-size-xs, .75rem);
    font-weight: var(--font-weight-semibold, 600);
    height: 2rem;
    justify-content: center;
    letter-spacing: .02em;
    width: 2rem;
}

.hcs-ws-project-modal .hcs-ws-project__member {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    min-width: 0;
}

.hcs-ws-project-modal .hcs-ws-project__member strong {
    color: var(--color-gray-800, #1E293B);
    font-size: var(--font-size-sm, .8125rem);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcs-ws-project-modal .hcs-ws-project__member small {
    color: var(--color-gray-500, #64748B);
    font-size: var(--font-size-xs, .75rem);
}

.hcs-ws-project-modal .hcs-ws-project__task-name {
    background: none;
    border: 0;
    color: inherit;
    flex: 1;
    font-weight: var(--font-weight-medium, 500);
    min-width: 0;
    overflow: hidden;
    padding: 0;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcs-ws-project-modal .hcs-ws-project__task-name:hover,
.hcs-ws-project-modal .hcs-ws-project__task-name:focus-visible {
    color: var(--color-teal-700, #004F4D);
}

.hcs-ws-project-modal .icon-btn.eye {
    background: var(--color-primary-soft, #E6F3F2);
    border: 0;
    border-radius: var(--radius-full, 9999px);
    color: var(--color-primary, #007F7C);
    display: inline-grid;
    flex: 0 0 auto;
    height: 2rem;
    place-items: center;
    width: 2rem;
}

.hcs-ws-project-modal .icon-btn.eye:hover,
.hcs-ws-project-modal .icon-btn.eye:focus-visible {
    background: #D4F3EF;
    color: var(--color-primary, #007F7C);
}

.hcs-ws-project-modal .hcs-catalog-cancel,
.hcs-ws-project-modal .hcs-catalog-save {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    line-height: 1;
    min-height: 2.75rem !important;
}

.hcs-ws-project-modal .hcs-catalog-cancel {
    background: var(--hcs-color-surface, #fff);
    border: var(--hcs-button-border-width, 1px) solid var(--hcs-color-danger);
    color: var(--hcs-color-danger);
}

.hcs-ws-project-modal .hcs-catalog-save {
    background: var(--hcs-color-primary, #00b4a9);
    border: var(--hcs-button-border-width, 1px) solid var(--hcs-color-primary, #00b4a9);
    color: #fff;
}

.hcs-ws-project-modal .hcs-catalog-cancel:hover:not(:disabled) {
    background: color-mix(in srgb, var(--hcs-color-danger) 8%, var(--hcs-color-surface, #fff));
    border-color: var(--hcs-color-danger);
    box-shadow: none;
    color: var(--hcs-color-danger);
}

.hcs-ws-project-modal .hcs-catalog-cancel:focus-visible {
    background: color-mix(in srgb, var(--hcs-color-danger) 8%, var(--hcs-color-surface, #fff));
    border-color: var(--hcs-color-danger);
    box-shadow: var(--hcs-focus-ring, 0 0 0 .2rem rgba(220, 38, 38, .28));
    color: var(--hcs-color-danger);
}

.hcs-ws-project-modal .hcs-catalog-save:hover:not(:disabled) {
    background: var(--hcs-color-primary-strong, #007f7c);
    border-color: var(--hcs-color-primary-strong, #007f7c);
    box-shadow: none;
    color: #fff;
}

.hcs-ws-project-modal .hcs-catalog-save:focus-visible {
    background: var(--hcs-color-primary-strong, #007f7c);
    border-color: var(--hcs-color-primary-strong, #007f7c);
    box-shadow: var(--hcs-focus-ring, 0 0 0 .2rem rgba(0, 180, 169, .28));
    color: #fff;
}

.hcs-ws-project-modal .modal-title { min-width: 0; overflow-wrap: anywhere; }

.hcs-workspace-readonly__value,
.hcs-workspace-readonly__description {
    overflow-wrap: anywhere;
}

.hcs-workspace-readonly__description {
    color: var(--hcs-color-ink);
    margin: .25rem 0 0;
}

.hcs-workspace-member-list {
    padding: 1rem;
}

.hcs-workspace-detail-list { display: flex; flex-direction: column; gap: .45rem; max-height: 18rem; overflow: auto; }
.hcs-workspace-detail-row { border-bottom: 1px solid var(--hcs-color-border, #e2eaf0); justify-content: space-between; padding: .28rem 0; }
.hcs-workspace-detail-row > :first-child { flex: 1; min-width: 0; }

@media (max-width: 767.98px) {
    .hcs-workspace .hcs-ws-workflow-chart,
    .hcs-workspace .hcs-ws-donut-chart { grid-template-columns: 8.5rem minmax(0, 1fr); }
    .hcs-workspace .hcs-ws-donut { height: 8.5rem; width: 8.5rem; }
    .hcs-workspace .hcs-ws-doc-row { align-items: flex-start; flex-wrap: wrap; }
    .hcs-workspace .hcs-ws-doc-row .hcs-ws-doc-name { flex-basis: calc(100% - 2rem); }
    .hcs-ws-project-modal .hcs-ws-project__grid { grid-template-columns: 1fr; }
}

.hcs-workflow-summary {
    align-items: flex-start;
    background: linear-gradient(180deg, #f4faf9 0%, #f7fafc 100%);
    border: 1px solid var(--color-border, #e6eef0);
    border-radius: 14px;
    display: flex;
    gap: 1rem 1.5rem;
    justify-content: space-between;
    margin-bottom: 1.25rem;
    padding: 1rem 1.15rem;
}
.hcs-workflow-summary__main { min-width: 0; }
.hcs-workflow-summary__title {
    color: var(--color-gray-800, #1e293b);
    font-size: 1.05rem;
    font-weight: 750;
    line-height: 1.3;
    margin: 0;
}
.hcs-workflow-summary__code {
    color: var(--color-muted, #64748b);
    display: block;
    font-size: .82rem;
    font-variant-numeric: tabular-nums;
    margin-top: .2rem;
}
.hcs-workflow-summary__flow {
    color: var(--color-muted, #64748b);
    display: block;
    font-size: .78rem;
    margin-top: .35rem;
}
.hcs-workflow-summary__aside {
    align-items: flex-end;
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: .55rem;
    text-align: right;
}
.hcs-workflow-summary__step {
    display: grid;
    gap: .1rem;
}
.hcs-workflow-summary__step span {
    color: var(--color-muted, #64748b);
    font-size: .72rem;
    font-weight: 650;
    letter-spacing: .02em;
    text-transform: uppercase;
}
.hcs-workflow-summary__step strong {
    color: var(--color-primary, #00B4A9);
    font-size: .92rem;
    font-weight: 700;
}
.hcs-workflow-info-modal .process-side-tabs {
    margin-bottom: 1rem;
}
.hcs-workflow-info-modal .hcs-status-badge--running,
.signing-action-modal .hcs-status-badge--running {
    background: color-mix(in srgb, var(--color-primary, #00B4A9) 14%, #fff);
    border-color: color-mix(in srgb, var(--color-primary, #00B4A9) 28%, #fff);
    color: var(--color-primary, #007F7C);
}
.hcs-workflow-info-tabcount {
    align-items: center;
    background: var(--color-gray-100, #f1f5f9);
    border-radius: 999px;
    color: var(--color-gray-600, #475569);
    display: inline-flex;
    font-size: .7rem;
    font-weight: 700;
    height: 1.25rem;
    justify-content: center;
    min-width: 1.25rem;
    padding: 0 .35rem;
}
.hcs-workflow-info-modal .process-side-tab.is-active .hcs-workflow-info-tabcount,
.signing-action-modal .process-side-tab.is-active .hcs-workflow-info-tabcount {
    background: color-mix(in srgb, var(--color-primary, #00B4A9) 16%, #fff);
    color: var(--color-primary, #007F7C);
}
.hcs-workflow-info-modal .history-dot,
.signing-action-modal .history-dot {
    background: var(--color-primary, #00B4A9);
}
.hcs-workflow-step-comment { background: #fffaf0; border-left: 3px solid #f0b429; border-radius: .25rem; font-size: .76rem; margin-top: .4rem; padding: .35rem .5rem; }
.hcs-workflow-panel-heading { align-items: center; border-bottom: 1px solid var(--hcs-color-border, #e2eaf0); display: flex; justify-content: space-between; margin-bottom: .65rem; padding-bottom: .55rem; }
.hcs-workflow-history { display: flex; flex-direction: column; gap: .75rem; }
.hcs-workflow-history li { align-items: flex-start; display: flex; gap: .65rem; }
.hcs-workflow-history__dot { background: var(--color-primary, #00B4A9); border-radius: 999px; flex: 0 0 auto; height: .55rem; margin-top: .35rem; width: .55rem; }
.hcs-workflow-files { display: flex; flex-direction: column; gap: .45rem; }
.hcs-workflow-file { align-items: center; border: 1px solid var(--hcs-color-border, #e2eaf0); border-radius: .7rem; display: flex; gap: .75rem; justify-content: space-between; padding: .6rem .7rem; }
.hcs-workflow-file__icon {
    align-items: center;
    background: color-mix(in srgb, var(--color-primary, #00B4A9) 10%, #fff);
    border-radius: .5rem;
    color: var(--color-primary, #00B4A9);
    display: inline-flex;
    flex: 0 0 auto;
    height: 2rem;
    justify-content: center;
    width: 2rem;
}
.hcs-workflow-file > .min-w-0 { flex: 1; min-width: 0; }
.hcs-file-preview-card { align-items: center; background: #f7fafc; border: 1px solid #e2eaf0; border-radius: .55rem; display: flex; gap: .75rem; justify-content: center; margin: 1rem auto; max-width: 42rem; padding: 1rem; }
.hcs-file-preview-card > :nth-child(2) { flex: 1; min-width: 0; }

.signing-action-modal .hcs-signing-action-summary { background: #f7fafc; border: 1px solid #e2eaf0; border-radius: .5rem; padding: .7rem .8rem; }
.signing-action-modal .hcs-signing-action-summary > div { align-items: center; display: flex; flex-wrap: wrap; gap: .45rem; }
.signing-action-modal .hcs-signing-step { border: 1px solid #e2eaf0; border-radius: .45rem; margin-bottom: .45rem; padding: .55rem .65rem; }
.signing-action-modal .hcs-signing-step--current { border-color: var(--color-primary, #00B4A9); box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-primary, #00B4A9) 12%, transparent); }
.signing-action-modal .hcs-signing-context { border-top: 1px solid #e2eaf0; padding-top: .75rem; }
.signing-action-modal .hcs-signing-context__heading { align-items: center; display: flex; justify-content: space-between; margin-bottom: .35rem; }
.signing-action-modal .hcs-signing-context__row { align-items: center; border-bottom: 1px solid #f0f3f5; display: flex; gap: .5rem; min-width: 0; padding: .35rem 0; }
.signing-action-modal .hcs-signing-context__row > span { flex: 1; min-width: 0; }
.signing-action-modal .hcs-signing-context__row small { color: var(--hcs-color-muted, #6d8596); display: block; font-size: .7rem; }
.signing-action-modal .hcs-signing-side-pane,
.signing-action-modal .hcs-signing-side-pane .tab-content { min-height: 0; }
.signing-action-modal .hcs-workflow-file--active {
    border-color: var(--color-primary, #00B4A9);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-primary, #00B4A9) 12%, transparent);
}
.signing-action-modal .hcs-sign-stage__sheet .hcs-pdf-frame { height: 100%; min-height: 0; }
.signing-action-modal .hcs-workflow-summary { margin-bottom: 0; }
.signing-action-modal .process-split { margin-top: 0; }
.signing-action-modal .process-flow h3.hcs-workflow-info__heading {
    color: var(--color-primary, #00B4A9);
    margin-bottom: .85rem;
}
.signing-action-modal .hcs-signing-decision {
    background: #f8fafb;
    border: 1px solid var(--color-border, #e6eef0);
    border-radius: 12px;
    display: grid;
    flex: 0 0 auto;
    gap: .85rem;
    margin-top: .15rem;
    padding: .9rem 1rem;
}
.signing-action-modal .hcs-signing-decision__title {
    color: var(--color-gray-800, #1e293b);
    font-size: .82rem;
    font-weight: 700;
    margin: 0;
}
.signing-action-modal .hcs-signing-decision .field { margin: 0; }
.signing-action-modal .hcs-signing-decision textarea.input {
    height: auto !important;
    max-height: 5.5rem !important;
    min-height: 3.25rem !important;
    resize: vertical;
}
.signing-action-modal .hcs-signing-decision__report {
    color: var(--color-muted, #64748b);
    font-size: .78rem;
    margin: 0;
}

@media (max-width: 767.98px) {
    .hcs-workflow-summary { align-items: stretch; flex-direction: column; }
    .hcs-workflow-summary__aside { align-items: flex-start; text-align: left; }
}




.border-none{
    border: none !important;
}

.hcs-chat-dock {
    position: fixed;
    right: 3.25rem;
    bottom: .75rem;
    z-index: 1040;
    display: flex;
    align-items: flex-end;
    gap: .65rem;
    pointer-events: none;
}

.hcs-chat-dock.is-list {
    right: calc(min(22rem, 100vw - 3.5rem) + 3.25rem);
}

.hcs-chat-dock__window,
.hcs-chat-dock__panel,
.hcs-chat-dock__launcher {
    pointer-events: auto;
}

.hcs-chat-dock__rail {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .65rem;
    margin-bottom: 1.15rem;
    pointer-events: none;
}

.hcs-chat-dock__launcher {
    position: relative;
    width: 3.4rem;
    height: 3.4rem;
    border: 0;
    border-radius: 999px;
    background: var(--color-primary, #0f766e);
    color: #fff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .28);
    font-size: 1.3rem;
}

.hcs-chat-dock__launcher.is-open {
    background: #475569;
}

.hcs-chat-dock__launcher em,
.hcs-chat-dock__badge,
.hcs-chat-dock__item em {
    min-width: 1.15rem;
    padding: 0 .32rem;
    border-radius: 999px;
    background: #dc2626;
    color: #fff;
    font-size: .68rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.15rem;
    text-align: center;
}

.hcs-chat-dock__launcher em {
    position: absolute;
    top: -.15rem;
    right: -.15rem;
}

.hcs-chat-dock__window,
.hcs-chat-dock__panel {
    display: flex;
    flex-direction: column;
    width: min(21.5rem, calc(100vw - 1.5rem));
    overflow: hidden;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-bottom: 0;
    border-radius: .85rem .85rem 0 0;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .22);
}

.hcs-chat-dock__window {
    position: relative;
    height: min(30rem, calc(100vh - 6.5rem));
    border-bottom: 1px solid #e2e8f0;
    border-radius: .85rem;
}

.hcs-chat-dock__window.is-min {
    width: min(15rem, calc(100vw - 1.5rem));
    height: auto;
    border-radius: .6rem;
    box-shadow: 0 6px 16px rgba(15, 23, 42, .16);
}

.hcs-chat-dock__window.is-min .hcs-chat-dock__bar {
    min-height: 2.05rem;
    gap: .28rem;
    padding: .15rem .1rem .15rem .4rem;
}

.hcs-chat-dock__window.is-min .hcs-chat-dock__who strong {
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.2;
}

.hcs-chat-dock__window.is-min .hcs-chat-dock__avatar {
    width: 1.3rem;
    height: 1.3rem;
    font-size: .6rem;
}

.hcs-chat-dock__window.is-min .hcs-chat-dock__icon {
    width: 1.4rem;
    height: 1.4rem;
    font-size: .7rem;
}

.hcs-chat-dock__panel {
    height: min(30rem, calc(100vh - 7.5rem));
}

.hcs-chat-dock__bar {
    display: flex;
    align-items: center;
    gap: .45rem;
    min-height: 3.15rem;
    padding: .45rem .4rem .45rem .7rem;
    border: 0;
    border-bottom: 1px solid #eef2f6;
    background: #fff;
    cursor: pointer;
}

.hcs-chat-dock__window.is-min .hcs-chat-dock__bar {
    border-bottom: 0;
}

.hcs-chat-dock__who {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
}

.hcs-chat-dock__who strong,
.hcs-chat-dock__line strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .92rem;
}

.hcs-chat-dock__who small,
.hcs-chat-dock__item small {
    overflow: hidden;
    color: #64748b;
    font-size: .75rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcs-chat-dock__avatar {
    display: grid;
    flex: none;
    place-items: center;
    width: 2rem;
    height: 2rem;
    overflow: hidden;
    border-radius: 999px;
    background: #e2e8f0;
    color: #334155;
    font-size: .78rem;
    font-weight: 700;
}

.hcs-chat-dock__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hcs-chat-dock__avatar--sm {
    width: 1.6rem;
    height: 1.6rem;
    font-size: .68rem;
}

.hcs-chat-dock__icon,
.hcs-chat-dock__tool,
.hcs-chat-dock__send {
    display: grid;
    flex: none;
    place-items: center;
    width: 1.9rem;
    height: 1.9rem;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #64748b;
    cursor: pointer;
}

.hcs-chat-dock__icon:hover,
.hcs-chat-dock__tool:hover {
    background: #f1f5f9;
    color: #0f172a;
}

.hcs-chat-dock__search {
    display: flex;
    align-items: center;
    gap: .4rem;
    margin: .55rem .7rem .2rem;
    padding: 0 .7rem;
    border-radius: 999px;
    background: #f1f5f9;
    color: #64748b;
}

.hcs-chat-dock__search input {
    width: 100%;
    height: 2.1rem;
    border: 0;
    background: transparent;
    outline: none;
}

.hcs-chat-dock__list,
.hcs-chat-dock__messages,
.hcs-chat-dock__task {
    flex: 1;
    min-height: 0;
    overflow: auto;
}

.hcs-chat-dock__item {
    display: flex;
    align-items: center;
    gap: .6rem;
    width: 100%;
    padding: .65rem .75rem;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.hcs-chat-dock__item:hover,
.hcs-chat-dock__item.is-open {
    background: #f8fafc;
}

.hcs-chat-dock__meta {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
}

.hcs-chat-dock__line {
    display: flex;
    align-items: baseline;
    gap: .4rem;
}

.hcs-chat-dock__line time,
.hcs-chat-dock__message time {
    flex: none;
    color: #94a3b8;
    font-size: .68rem;
}

.hcs-chat-dock__empty {
    padding: 1.5rem .75rem;
    color: #64748b;
    text-align: center;
}

.hcs-chat-dock__messages {
    display: flex;
    flex-direction: column-reverse;
    gap: .35rem;
    padding: .75rem;
    background: #f8fafc;
}

.hcs-chat-dock__row {
    display: flex;
    align-items: flex-end;
    gap: .35rem;
    max-width: 88%;
}

.hcs-chat-dock__row.is-mine {
    align-self: flex-end;
    justify-content: flex-end;
}

.hcs-chat-dock__message {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    max-width: 100%;
    margin: 0;
    padding: .4rem .65rem .28rem;
    border-radius: 1rem 1rem 1rem .35rem;
    background: #fff;
    box-shadow: 0 1px 1px rgba(15, 23, 42, .06);
    overflow-wrap: anywhere;
}

.hcs-chat-dock__message.is-mine {
    border-radius: 1rem 1rem .35rem 1rem;
    background: #ccfbf1;
}

.hcs-chat-dock__message .is-deleted {
    color: #64748b;
    font-style: italic;
}

.hcs-chat-dock__message time {
    align-self: flex-end;
}

.hcs-chat-dock__task-card {
    display: flex;
    align-items: flex-start;
    gap: .4rem;
}

.hcs-chat-dock__task-card small,
.hcs-chat-dock__bubble-file {
    display: block;
    color: inherit;
    font-size: .78rem;
}

.hcs-chat-dock__bubble-file {
    margin-top: .15rem;
    text-decoration: underline;
}

button.hcs-chat-dock__bubble-file {
    border: 0;
    padding: 0;
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.hcs-chat-dock__preview {
    position: fixed;
    inset: 0;
    z-index: 1080;
    display: grid;
    place-items: center;
    padding: .75rem;
}

.hcs-chat-dock__preview-backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(15, 23, 42, .45);
}

.hcs-chat-dock__preview-card {
    position: relative;
    display: flex;
    flex-direction: column;
    width: min(96vw, 88rem);
    max-height: min(94vh, 68rem);
    overflow: hidden;
    border-radius: .9rem;
    background: #fff;
    box-shadow: 0 18px 48px rgba(15, 23, 42, .28);
}

.hcs-chat-dock__preview-card header {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .75rem 1rem;
    border-bottom: 1px solid #e2e8f0;
}

.hcs-chat-dock__preview-card header strong {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcs-chat-dock__preview-card header button {
    border: 0;
    background: transparent;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
}

.hcs-chat-dock__preview-card p {
    margin: 0;
    padding: 2rem 1.25rem;
    text-align: center;
    color: #334155;
}

.hcs-chat-dock__pdf {
    height: min(86vh, 60rem);
    min-height: 32rem;
    background: #f8fafc;
}

.hcs-chat-dock__pdf .hcs-pdf-frame--fill,
.hcs-chat-dock__pdf .hcs-pdf-frame__viewport,
.hcs-chat-dock__pdf .hcs-pdf-frame__sheet,
.hcs-chat-dock__pdf .hcs-pdf-frame__embed {
    height: 100%;
}

.hcs-chat-dock__files {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    padding: .4rem .7rem 0;
    background: #fff;
}

.hcs-chat-dock__chip {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    max-width: 100%;
    padding: .15rem .35rem .15rem .5rem;
    border-radius: 999px;
    background: #f1f5f9;
    font-size: .75rem;
}

.hcs-chat-dock__chip span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcs-chat-dock__error {
    margin: 0;
    padding: .35rem .7rem 0;
    background: #fff;
    color: #b91c1c;
    font-size: .78rem;
}

.hcs-chat-dock__composer {
    position: relative;
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: .4rem;
    padding: .55rem .6rem;
    border-top: 1px solid #eef2f6;
    background: #fff;
}

.hcs-chat-dock__field {
    flex: 1;
    min-width: 0;
    height: 2.15rem;
    padding: 0 .8rem;
    border: 0;
    border-radius: 999px;
    background: #f1f5f9;
    outline: none;
}

.hcs-chat-dock__send {
    flex: 0 0 2.25rem;
    width: 2.25rem !important;
    height: 2.25rem !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    line-height: 0;
    background: var(--color-primary, #0f766e) !important;
    color: #fff !important;
}

.hcs-chat-dock__send svg {
    display: block;
    width: 1.05rem;
    height: 1.05rem;
    fill: currentColor;
}

.hcs-chat-dock__send:disabled {
    background: #e2e8f0 !important;
    color: #94a3b8 !important;
    cursor: default;
}

.hcs-chat-side {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1046;
    display: flex;
    align-items: stretch;
    pointer-events: none;
}

.hcs-chat-side__backdrop {
    position: fixed;
    inset: 0;
    z-index: 1044;
    background: transparent;
}

.hcs-chat-side__tab {
    pointer-events: auto;
    align-self: center;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .45rem;
    width: 2.65rem;
    margin: 0;
    padding: .9rem .3rem;
    border: 0;
    border-radius: .8rem 0 0 .8rem;
    background: var(--color-primary, #0f766e);
    box-shadow: -8px 0 20px rgba(15, 23, 42, .16);
    color: #fff;
    cursor: pointer;
}

.hcs-chat-side__tab span {
    writing-mode: vertical-rl;
    font-size: .78rem;
    font-weight: 650;
}

.hcs-chat-side__tab em {
    position: absolute;
    top: -.4rem;
    left: -.45rem;
    min-width: 1.25rem;
    padding: 0 .32rem;
    border-radius: 999px;
    background: #dc2626;
    color: #fff;
    font-size: .68rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2rem;
    text-align: center;
}

.hcs-chat-side__panel {
    display: flex;
    flex-direction: column;
    width: 0;
    height: 100%;
    overflow: hidden;
    background: #fff;
    pointer-events: none;
}

.hcs-chat-side.is-open .hcs-chat-side__panel {
    width: min(22rem, calc(100vw - 3.5rem));
    border-left: 1px solid #e2e8f0;
    box-shadow: -12px 0 32px rgba(15, 23, 42, .12);
    pointer-events: auto;
}

.hcs-chat-side__head {
    display: flex;
    align-items: center;
    gap: .55rem;
    flex-shrink: 0;
    min-height: 3.15rem;
    padding: .7rem .9rem;
    background: var(--color-primary, #0f766e);
    color: #fff;
}

.hcs-chat-side__head i {
    font-size: 1rem;
}

.hcs-chat-side__head strong {
    overflow: hidden;
    font-size: .95rem;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hcs-chat-side__panel .hcs-chat-dock__search {
    flex-shrink: 0;
}

.hcs-chat-side__panel .hcs-chat-dock__list {
    flex: 1;
}

.hcs-chat-dock__menu {
    position: absolute;
    left: .45rem;
    bottom: 3.1rem;
    z-index: 2;
    display: flex;
    flex-direction: column;
    min-width: 12.5rem;
    padding: .3rem;
    border-radius: .75rem;
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .18);
}

.hcs-chat-dock__menu button,
.hcs-chat-dock__menu label {
    position: relative;
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 100%;
    padding: .5rem .6rem;
    border: 0;
    border-radius: .5rem;
    background: transparent;
    color: #0f172a;
    text-align: left;
    cursor: pointer;
}

.hcs-chat-dock__menu button:hover,
.hcs-chat-dock__menu label:hover {
    background: #f1f5f9;
}

.hcs-chat-dock__menu label input,
.hcs-chat-dock__tool input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.hcs-chat-dock__task {
    display: flex;
    flex-direction: column;
    gap: .4rem;
    padding: .75rem;
}

.hcs-chat-dock__task label {
    margin: .15rem 0 0;
    color: #64748b;
    font-size: .75rem;
}

.hcs-chat-dock__task .input,
.hcs-chat-dock__task .select {
    width: 100%;
}

.hcs-chat-dock__task-actions {
    display: flex;
    justify-content: flex-end;
    gap: .45rem;
    margin-top: .35rem;
}

@media (max-width: 767px) {
    .hcs-chat-dock,
    .hcs-chat-dock.is-list {
        right: .75rem;
        left: .75rem;
        bottom: 4.75rem;
        justify-content: flex-end;
    }

    .hcs-chat-dock__window:not(:last-of-type) {
        display: none;
    }

    .hcs-chat-side__tab {
        align-self: flex-end;
        margin-bottom: 5.5rem;
    }

}