﻿.ticket-heartbeat ul {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.9rem;
    margin: 0 0 1.5rem;
    padding: 0;
    list-style: none;
}

.ticket-heartbeat__avatars {
    margin: 0;
    cursor: pointer;
}

.ticket-heartbeat img.editing,
.ticket-heartbeat-avatar.editing {
    box-shadow: 0 0 0 2px var(--red-status);
}

.ticket-heartbeat .ticket-presence-popover li + li {
    padding-top: 0.8rem;
    border-top: 1px solid rgba(7, 53, 79, 0.08);
}

.ticket-heartbeat .ticket-presence-popover .ticket-presence-avatar,
.ticket-heartbeat .ticket-presence-popover .ticket-presence-meta,
.ticket-heartbeat .ticket-presence-popover .ticket-presence-name,
.ticket-heartbeat .ticket-presence-popover .ticket-presence-mode {
    display: block;
}

.ticket-heartbeat .ticket-presence-popover .ticket-presence-avatar {
    display: inline-flex;
}

@keyframes lw-loading-spin {
    to {
        transform: rotate(360deg);
    }
}

body:not(.session-expiry-open) #sessionExpiryModal {
    display: none !important;
}

#modal.session-modal-suppressed {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

@-webkit-keyframes urgent-alert {
    0%, 100% {
        border-color: transparent;
        box-shadow: none;
    }

    40% {
        border-color: var(--red-status);
        box-shadow: 0 0 12px 2px var(--red-status);
    }

    60% {
        border-color: var(--red-status);
        box-shadow: 0 0 24px 4px var(--red-status);
    }
}

@keyframes urgent-alert {
    0%, 100% {
        border-color: transparent;
        box-shadow: none;
    }

    40% {
        border-color: var(--red-status);
        box-shadow: 0 0 12px 2px var(--red-status);
    }

    60% {
        border-color: var(--red-status);
        box-shadow: 0 0 24px 4px var(--red-status);
    }
}

@-webkit-keyframes high-alert {
    0%, 100% {
        border-color: transparent;
        box-shadow: none;
    }

    40% {
        border-color: var(--amber-status);
        box-shadow: 0 0 12px 2px var(--amber-status);
    }

    60% {
        border-color: var(--amber-status);
        box-shadow: 0 0 24px 4px var(--amber-status);
    }
}

@keyframes high-alert {
    0%, 100% {
        border-color: transparent;
        box-shadow: none;
    }

    40% {
        border-color: var(--amber-status);
        box-shadow: 0 0 12px 2px var(--amber-status);
    }

    60% {
        border-color: var(--amber-status);
        box-shadow: 0 0 24px 4px var(--amber-status);
    }
}

.ticket-updated-col {
    vertical-align: middle !important;
}

.ticket-updated-cell {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 18px;
    min-width: 0;
    white-space: nowrap;
}

.ticket-updated-text {
    display: block;
    flex: 1 1 auto;
    line-height: 1;
    min-width: 0;
    white-space: nowrap;
}

.ticket-date-text {
    display: block;
    line-height: 1.2;
    max-width: 100%;
    white-space: nowrap;
}

.ticket-updated-indicator {
    width: 18px;
    height: 18px;
    margin-right: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 18px;
    line-height: 1;
}

.ticket-updated-indicator img,
.ticket-updated-indicator svg {
    width: 18px;
    height: 18px;
    display: block;
    margin-left: 0;
}

.ticket-updated-indicator--agent {
    color: var(--green-status);
}

.ticket-updated-indicator--requester {
    color: var(--amber-status);
}

.ticket-updated-indicator--waiting {
    color: var(--light-grey);
    opacity: 1;
}

.ticket-updated-indicator--waiting svg {
    width: 14px;
    height: 14px;
}

.sla-stage {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    line-height: 1.25;
}

.sla-stage-mark {
    font-weight: 900;
    min-width: 12px;
    text-align: center;
}

.sla-stage--met {
    color: var(--green-status);
}

.sla-stage--breached {
    color: var(--red-status);
}

.sla-stage--pending {
    color: var(--amber-status);
}

.sla-stage--paused {
    color: var(--tertiary-color-text);
    opacity: 0.75;
}

.sla-stage--na {
    color: var(--tertiary-color-text);
    opacity: 0.75;
}

.sla-pill--na {
    color: var(--text-grey);
    background-color: var(--grey-status);
}

.ticket-comment-meta-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
    max-width: 100%;
}

.ticket-comment-meta-row--customer {
    margin-right: 0;
}

.ticket-comment-meta-row--agent {
    margin-left: 0;
}

.ticket-comment-meta {
    margin: 0 0 1.4rem 0;
    flex: 1;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.ticket-comment-actions {
    display: inline-flex;
    gap: 4px;
    margin-left: auto;
    padding-left: 10px;
}

.ticket-comment-action-btn {
    width: 30px;
    height: 30px;
    border: 1px solid var(--input-border);
    border-radius: 999px;
    background-color: var(--input-bg);
    color: var(--tertiary-color-text);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all .15s ease-in-out;
}

.ticket-comment-action-btn:disabled {
    cursor: wait;
    opacity: 0.65;
}

.ticket-comment-action-btn svg {
    width: 15px;
    height: 15px;
}

.ticket-comment-action-btn:hover,
.ticket-comment-action-btn:focus {
    background-color: var(--tint-background);
    color: var(--primary-color);
    border-color: var(--light-grey);
}

.ticket-comment-timestamp--customer {
    margin-right: 0;
}

.ticket-comment-timestamp--agent {
    margin-left: 0;
}

.ticket-comment-email-link--customer {
    margin-right: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.ticket-comment-email-link--agent {
    margin-left: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.ticket-reply-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.6rem;
}

.ticket-reply-header legend {
    display: flex;
    align-items: center;
    margin-bottom: 0;
    padding: 0;
    line-height: 1.2;
}

.ticket-reply-selector {
    gap: 1.2rem;
    min-width: 0;
    width: 100%;
}

.ticket-reply-selector__scroller {
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    position: relative;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    padding-bottom: 0;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.ticket-reply-selector__scroller::-webkit-scrollbar {
    display: none;
}

.ticket-reply-selector__scroller::before,
.ticket-reply-selector__scroller::after {
    content: "";
    inset: 0 auto 0 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition: opacity 0.16s ease;
    width: 1.8rem;
    z-index: 1;
}

.ticket-reply-selector__scroller::before {
    background: linear-gradient(to right, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0));
    left: 0;
}

.ticket-reply-selector__scroller::after {
    background: linear-gradient(to left, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0));
    left: auto;
    right: 0;
}

.ticket-reply-selector__scroller.has-left-overflow::before,
.ticket-reply-selector__scroller.has-right-overflow::after {
    opacity: 1;
}

.ticket-reply-partner {
    display: flex;
    align-items: center;
    align-self: center;
    flex: 0 0 auto;
    margin-left: auto;
}

.ticket-reply-selector .ticket-reply-actions {
    width: max-content;
    min-width: max-content;
    max-width: none;
    display: flex;
    flex-wrap: nowrap;
    gap: 0;
}

.ticket-reply-selector .ticket-reply-actions > .btn {
    flex: 0 0 auto;
    min-width: max-content;
    line-height: 1.2;
    white-space: nowrap;
}

.partner-name-tag--reply {
    display: flex;
    align-items: center;
    font-size: 1.6rem;
    font-weight: 900;
    line-height: 1.2;
    margin: 0;
}

@media (min-width: 761px) {
    .ticket-workspace-pane .ticket-reply-selector {
        gap: 0.8rem;
    }

    .ticket-workspace-pane .ticket-reply-selector .ticket-reply-actions > .btn {
        letter-spacing: 0;
    }

    .ticket-workspace-pane .partner-name-tag--reply {
        font-size: 1.5rem;
        max-width: 13rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

.ticket-comment--bubble {
    position: relative;
    border-radius: 10px;
    max-width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* Search simple paginator (used for full-text search results with simplePaginate). */
.search-simple-paginator .search-simple-paginator__summary {
    font-size: 1.4rem;
    color: var(--text-grey);
    margin: 0 1.2rem;
    white-space: nowrap;
}

.table-filter-summary--task th {
    background-color: #dceeff;
    border-top: 1px solid color-mix(in srgb, #dceeff 70%, var(--input-border) 30%);
}

.ticket-comment--customer {
    margin-right: 0;
}

.ticket-comment--agent {
    margin-left: 0;
}

.ticket-comment ul,
.ticket-comment ol {
    margin: 0 0 1.6rem 0;
    padding-left: 2.2rem;
    list-style-position: outside;
}

.ticket-comment ul:last-child,
.ticket-comment ol:last-child {
    margin-bottom: 0;
}

.ticket-comment li {
    margin-bottom: 0.8rem;
}

.ticket-presence-count {
    position: absolute;
    right: -6px;
    top: -6px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--amber-status);
    color: var(--white-text);
    font-size: 1rem;
    line-height: 16px;
    font-weight: 900;
    text-align: center;
}

.ticket-presence-tabs {
    position: absolute;
    left: 50%;
    bottom: -7px;
    transform: translateX(-50%);
    min-width: 18px;
    height: 14px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--primary-color);
    color: var(--white-text);
    font-size: .9rem;
    line-height: 14px;
    font-weight: 900;
    text-align: center;
}

.ticket-presence-separator {
    display: inline-block;
    margin: 0 4px;
    color: var(--text-muted);
}

.ticket-presence-popover {
    position: absolute;
    z-index: 40;
    display: none;
    width: max-content;
    min-width: max-content;
    max-width: none;
    border: 1px solid var(--input-border);
    box-shadow: 1px 1px 30px rgba(0,0,0,.06);
  background-color: var(--white-background);
    padding: 8px 10px;

}

.ticket-presence-avatar {
    font-weight: 900;
}

.ticket-presence-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: max-content;
}

.ticket-presence-name,
.ticket-presence-mode {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ticket-presence-name {
    font-size: 1.2rem;
    line-height: 1.2;
    font-weight: 600;
    color: var(--text-grey);
}

.ticket-presence-mode {
    font-size: 1rem;
    line-height: 1.2;
    color: var(--tertiary-color-text);
    text-align: left;
}

.ticket-link-preview {
    position: relative;
    display: inline-flex;
    max-width: 100%;
}

.ticket-link-preview-popover {
    position: absolute;
    display: none;
        border: 1px solid var(--input-border);
    box-shadow: 1px 1px 30px rgba(0,0,0,.05);
    background-color: var(--white-background);
    border-radius: 10px;
    padding: 9px 11px;
}

.ticket-link-preview-popover h2,
.ticket-link-preview-popover h3,
.ticket-link-preview-popover p,
.ticket-link-preview-popover .ticket-link-preview-title,
.ticket-link-preview-popover .ticket-link-preview-label,
.ticket-link-preview-popover .ticket-link-preview-meta,
.ticket-link-preview-popover .ticket-link-preview-text,
.ticket-link-preview-popover .ticket-link-preview-empty {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.sla-pill-wrap.is-open .sla-popover,
.ticket-link-preview.is-open .ticket-link-preview-popover {
    display: block;
}

.ticket-link-preview-title {
    font-size: 1.05rem;
    color: var(--tertiary-color-text);
    text-transform: uppercase;
    letter-spacing: .03em;
    margin-bottom: 6px;
}

.ticket-link-preview-section {
    margin-top: 7px;
}

.ticket-link-preview-section:first-of-type {
    margin-top: 0;
}

.ticket-link-preview-label {
    font-size: 1.1rem;
    font-weight: 900;
    color: var(--text-grey);
    margin-bottom: 2px;
}

.ticket-link-preview-meta {
    font-size: 1rem;
    color: var(--tertiary-color-text);
    margin-bottom: 2px;
    line-height: 1.25;
}

.ticket-link-preview-text {
    font-size: 1.15rem;
    color: var(--text-grey);
    line-height: 1.35;
}

.ticket-link-preview-empty {
    font-size: 1.1rem;
    color: var(--tertiary-color-text);
}

.sla-summary-label {
    display: block;
    font-size: 1.05rem;
    line-height: 1.25;
}

.sla-summary-value {
    display: block;
    font-size: 1.8rem;
    line-height: 1.05;
    font-weight: 600;
    margin-top: 4px;
    color: var(--text-grey);
}

.sla-summary-meta {
    display: block;
    font-size: .95rem;
    line-height: 1.25;
    margin-top: 4px;
}

@media screen and (max-width: 1400px) {
    .sla-summary-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media screen and (max-width: 1100px) {
    .sla-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 700px) {
    .sla-summary-grid {
        grid-template-columns: 1fr;
    }
}

.ticket-table .ticket-select-col {
    width: 34px;
    min-width: 34px;
    text-align: center;
    vertical-align: middle !important;
    padding-left: 10px !important;
    padding-right: 6px !important;
    line-height: 1;
}

.ticket-bulk-actions {
   /* display: flex;
    align-items: center;
    justify-content: space-between;*/
    gap: 10px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--input-border);
    h2 {
        margin-bottom: 0;
    }
}

.ticket-bulk-actions-count {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--text-grey);
}

.ticket-bulk-actions-buttons {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.ticket-row-actions-inline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.suspended-more-actions {
    position: relative;
    display: inline-flex;
    z-index: 5;
}

.suspended-more-actions.is-open {
    z-index: 300;
}

.suspended-more-trigger {
    min-width: 44px;
    text-align: center;
    letter-spacing: .06em;
}

.suspended-more-menu {
    position: fixed;
    left: -9999px;
    top: -9999px;
    z-index: 301;
    min-width: 260px;
    padding: 8px;
    border: 1px solid var(--input-border);
    border-radius: var(--radius-sm);
    background: var(--white-text);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .16);
    display: none;
    flex-direction: column;
    gap: 6px;
}

.suspended-more-actions.is-open .suspended-more-menu {
    display: flex;
}

.suspended-actions-cell {
    position: relative;
    overflow: visible;
}

.ticket-table-wrap--suspended .ticket-table td,
.ticket-table-wrap--suspended .ticket-table th {
    vertical-align: middle;
}

.ticket-table-wrap--suspended .ticket-table--suspended .suspended-received-col,
.ticket-table-wrap--suspended .ticket-table--suspended .suspended-received-cell {
    width: 140px;
    min-width: 140px;
    padding-left: 4px !important;
}

.ticket-table-wrap--suspended .ticket-table--suspended .suspended-received-cell {
    white-space: nowrap;
}

.ticket-table-wrap--suspended .ticket-table--suspended .suspended-reason-col,
.ticket-table-wrap--suspended .ticket-table--suspended .suspended-reason-cell {
    width: 200px;
    min-width: 200px;
}

.ticket-table-wrap--suspended .ticket-table--suspended .suspended-actions-col,
.ticket-table-wrap--suspended .ticket-table--suspended .suspended-actions-cell {
  /*  width: 272px;
    min-width: 272px;
    padding-right: 16px !important;*/
}

.ticket-table-wrap--suspended .ticket-table--suspended .suspended-subject-cell {
    width: 29%;
    max-width: 420px;
}

.ticket-table-wrap .ticket-subject-cell {
    width: 32%;

}

.ticket-table-wrap .ticket-problem-col,
.ticket-table-wrap .ticket-problem-cell {
    width: 84px;
    max-width: 84px;
}

.ticket-table-wrap .ticket-priority-col,
.ticket-table-wrap .ticket-priority-cell {
    width: 92px;
    min-width: 92px;
    max-width: 92px;
}

.ticket-table-wrap .ticket-filter-select-col--priority {
    min-width: 116px;
    padding-right: 24px;
}

.ticket-table-wrap .ticket-filter-select-col--partner {
    min-width: 148px;
    padding-left: 16px;
}

.ticket-table-wrap .ticket-filter-select-col {
    padding-left: 10px;
    padding-right: 10px;
}

.ticket-table-wrap .table-filter-row .ticket-filter-select-col {
    min-width: 138px;
}

.ticket-table-wrap .table-filter-row .ticket-filter-select-col--priority {
    min-width: 112px;
    padding-right: 18px;
}

.ticket-table-wrap .table-filter-row .ticket-filter-select-col--partner {
    min-width: 140px;
}

.ticket-table-wrap .ticket-actions-col,
.ticket-table-wrap .ticket-action-cell {
    width: 5.8rem;
    min-width: 5.8rem;
}

.ticket-table-wrap .ticket-actions-col {
    padding-right: 2rem;
}

.ticket-table-wrap .ticket-action-cell {
    text-align: right;
    padding-right: 2rem !important;
}

.ticket-table-wrap .table-filter-row .ticket-filter-select-col .vscomp-ele-wrapper,
.ticket-table-wrap .table-filter-row .ticket-filter-select-col .vscomp-wrapper,
.ticket-table-wrap .table-filter-row .ticket-filter-select-col .vs-field-wrap {
    width: 100%;
}

.ticket-table-wrap--suspended .ticket-table--suspended .ticket-filter-select-col--suspended-reason {
    min-width: 200px;
}

.service-new .ticket-table-wrap .ticket-actions-col--new,
.service-new .ticket-table-wrap .ticket-row-actions--new {
    width: 310px;
    min-width: 310px;
}

.service-new .ticket-table-wrap .ticket-subject-cell {
    width: 28%;
    max-width: 420px;
}

.service-new .ticket-table-wrap .ticket-truncate-cell {
    max-width: 150px;
}

.service-new .ticket-table-wrap .ticket-filter-select-col--partner,
.service-new .ticket-table-wrap .ticket-filter-select-col--team,
.service-new .ticket-table-wrap .ticket-filter-select-col--requester {
    min-width: 140px;
}

.service-new .ticket-table-wrap .table-filter-row .ticket-filter-select-col--partner,
.service-new .ticket-table-wrap .table-filter-row .ticket-filter-select-col--team,
.service-new .ticket-table-wrap .table-filter-row .ticket-filter-select-col--requester {
    min-width: 132px;
}

@media screen and (max-width: 1699px) {
    .ticket-table-wrap .ticket-table {
        min-width: 156rem;
    }
}

@media screen and (min-width: 1380px) and (max-width: 1699px) {
    .service-index .ticket-table-wrap .ticket-table,
    .service-assignees-assignee .ticket-table-wrap .ticket-table,
    .service-partners-partner .ticket-table-wrap .ticket-table {
        min-width: 145.2rem;
        table-layout: fixed;
        width: 100%;
        max-width: 100%;
    }

    .service-index .ticket-table-wrap .ticket-table.ticket-table--with-next-update,
    .service-assignees-assignee .ticket-table-wrap .ticket-table.ticket-table--with-next-update,
    .service-partners-partner .ticket-table-wrap .ticket-table.ticket-table--with-next-update {
        min-width: 152.2rem;
    }

    .service-index .ticket-table-wrap .ticket-table.ticket-table--with-assignee,
    .service-assignees-assignee .ticket-table-wrap .ticket-table.ticket-table--with-assignee,
    .service-partners-partner .ticket-table-wrap .ticket-table.ticket-table--with-assignee {
        min-width: 149.2rem;
    }

    .service-index .ticket-table-wrap .ticket-table.ticket-table--with-next-update.ticket-table--with-assignee,
    .service-assignees-assignee .ticket-table-wrap .ticket-table.ticket-table--with-next-update.ticket-table--with-assignee,
    .service-partners-partner .ticket-table-wrap .ticket-table.ticket-table--with-next-update.ticket-table--with-assignee {
        min-width: 156.2rem;
    }

    .ticket-table-wrap .ticket-date-col {
        width: 13.2rem;
        min-width: 13.2rem;
        max-width: 13.2rem;
    }

    .ticket-table-wrap .ticket-next-update-col {
        width: 12.4rem;
        min-width: 12.4rem;
        max-width: 12.4rem;
    }

    .ticket-table-wrap .ticket-updated-col {
        width: 21.2rem;
        min-width:  21.2rem;
        max-width: 21.2rem;
    }

    .service-index .ticket-table-wrap .ticket-id-col,
    .service-assignees-assignee .ticket-table-wrap .ticket-id-col,
    .service-partners-partner .ticket-table-wrap .ticket-id-col {
        width: 10.6rem;
        min-width: 10.6rem;
        max-width: 10.6rem;
    }

    .service-index .ticket-table-wrap .ticket-sla-col,
    .service-assignees-assignee .ticket-table-wrap .ticket-sla-col,
    .service-partners-partner .ticket-table-wrap .ticket-sla-col {
        width: 8.4rem;
        min-width: 8.4rem;
        max-width: 8.4rem;
    }

    .service-index .ticket-table-wrap .ticket-filter-select-col--partner,
    .service-index .ticket-table-wrap .ticket-col--partner,
    .service-assignees-assignee .ticket-table-wrap .ticket-filter-select-col--partner,
    .service-assignees-assignee .ticket-table-wrap .ticket-col--partner,
    .service-partners-partner .ticket-table-wrap .ticket-filter-select-col--partner,
    .service-partners-partner .ticket-table-wrap .ticket-col--partner {
        width: 13.6rem;
        min-width: 13.6rem;
        max-width: 13.6rem;
    }

    .service-index .ticket-table-wrap .ticket-filter-select-col--team,
    .service-index .ticket-table-wrap .ticket-col--team,
    .service-index .ticket-table-wrap .ticket-filter-select-col--requester,
    .service-index .ticket-table-wrap .ticket-col--requester,
    .service-assignees-assignee .ticket-table-wrap .ticket-filter-select-col--team,
    .service-assignees-assignee .ticket-table-wrap .ticket-col--team,
    .service-assignees-assignee .ticket-table-wrap .ticket-filter-select-col--requester,
    .service-assignees-assignee .ticket-table-wrap .ticket-col--requester,
    .service-partners-partner .ticket-table-wrap .ticket-filter-select-col--team,
    .service-partners-partner .ticket-table-wrap .ticket-col--team,
    .service-partners-partner .ticket-table-wrap .ticket-filter-select-col--requester,
    .service-partners-partner .ticket-table-wrap .ticket-col--requester {
        width: 13.6rem;
        min-width: 13.6rem;
        max-width: 13.6rem;
    }

    .service-index .ticket-table-wrap .ticket-filter-select-col--assignee,
    .service-index .ticket-table-wrap .ticket-assignee-col,
    .service-index .ticket-table-wrap .ticket-col--assignee,
    .service-assignees-assignee .ticket-table-wrap .ticket-filter-select-col--assignee,
    .service-assignees-assignee .ticket-table-wrap .ticket-assignee-col,
    .service-assignees-assignee .ticket-table-wrap .ticket-col--assignee,
    .service-partners-partner .ticket-table-wrap .ticket-filter-select-col--assignee,
    .service-partners-partner .ticket-table-wrap .ticket-assignee-col,
    .service-partners-partner .ticket-table-wrap .ticket-col--assignee {
        width: 11.2rem;
        min-width: 11.2rem;
        max-width: 11.2rem;
    }

    .service-index .ticket-table-wrap .ticket-subject-col,
    .service-index .ticket-table-wrap .ticket-subject-cell,
    .service-assignees-assignee .ticket-table-wrap .ticket-subject-col,
    .service-assignees-assignee .ticket-table-wrap .ticket-subject-cell,
    .service-partners-partner .ticket-table-wrap .ticket-subject-col,
    .service-partners-partner .ticket-table-wrap .ticket-subject-cell {
        width: auto;
        min-width: 14rem;
        max-width: none;
    }

    .service-index .ticket-table-wrap .ticket-truncate-cell,
    .service-assignees-assignee .ticket-table-wrap .ticket-truncate-cell,
    .service-partners-partner .ticket-table-wrap .ticket-truncate-cell {
        max-width: 13.6rem;
    }

    .service-index .ticket-table-wrap .ticket-problem-col,
    .service-index .ticket-table-wrap .ticket-problem-cell,
    .service-assignees-assignee .ticket-table-wrap .ticket-problem-col,
    .service-assignees-assignee .ticket-table-wrap .ticket-problem-cell,
    .service-partners-partner .ticket-table-wrap .ticket-problem-col,
    .service-partners-partner .ticket-table-wrap .ticket-problem-cell {
        width: 7.8rem;
        max-width: 7.8rem;
    }

    .service-index .ticket-table-wrap .ticket-priority-col,
    .service-index .ticket-table-wrap .ticket-priority-cell,
    .service-assignees-assignee .ticket-table-wrap .ticket-priority-col,
    .service-assignees-assignee .ticket-table-wrap .ticket-priority-cell,
    .service-partners-partner .ticket-table-wrap .ticket-priority-col,
    .service-partners-partner .ticket-table-wrap .ticket-priority-cell {
        width: 8.2rem;
        min-width: 8.2rem;
        max-width: 8.2rem;
    }

    .service-index .ticket-table-wrap .ticket-filter-select-col,
    .service-assignees-assignee .ticket-table-wrap .ticket-filter-select-col,
    .service-partners-partner .ticket-table-wrap .ticket-filter-select-col {
        padding-left: 0.8rem;
        padding-right: 0.8rem;
    }

    .service-index .ticket-table-wrap .ticket-filter-select-col--priority,
    .service-assignees-assignee .ticket-table-wrap .ticket-filter-select-col--priority,
    .service-partners-partner .ticket-table-wrap .ticket-filter-select-col--priority {
        min-width: 10rem;
        padding-right: 1.6rem;
    }

    .service-index .ticket-table-wrap .ticket-filter-select-col--partner,
    .service-assignees-assignee .ticket-table-wrap .ticket-filter-select-col--partner,
    .service-partners-partner .ticket-table-wrap .ticket-filter-select-col--partner {
        min-width: 13.6rem;
        padding-left: 1.2rem;
    }

    .service-index .ticket-table-wrap .ticket-filter-select-col--team,
    .service-index .ticket-table-wrap .ticket-filter-select-col--requester,
    .service-index .ticket-table-wrap .ticket-filter-select-col--assignee,
    .service-assignees-assignee .ticket-table-wrap .ticket-filter-select-col--team,
    .service-assignees-assignee .ticket-table-wrap .ticket-filter-select-col--requester,
    .service-assignees-assignee .ticket-table-wrap .ticket-filter-select-col--assignee,
    .service-partners-partner .ticket-table-wrap .ticket-filter-select-col--team,
    .service-partners-partner .ticket-table-wrap .ticket-filter-select-col--requester,
    .service-partners-partner .ticket-table-wrap .ticket-filter-select-col--assignee {
        min-width: 13.6rem;
    }

    .service-index .ticket-table-wrap .table-filter-row .ticket-filter-select-col,
    .service-assignees-assignee .ticket-table-wrap .table-filter-row .ticket-filter-select-col,
    .service-partners-partner .ticket-table-wrap .table-filter-row .ticket-filter-select-col {
        min-width: 11.8rem;
    }

    .service-index .ticket-table-wrap .table-filter-row .ticket-filter-select-col--priority,
    .service-assignees-assignee .ticket-table-wrap .table-filter-row .ticket-filter-select-col--priority,
    .service-partners-partner .ticket-table-wrap .table-filter-row .ticket-filter-select-col--priority {
        min-width: 9.8rem;
        padding-right: 1.6rem;
    }

    .service-index .ticket-table-wrap .table-filter-row .ticket-filter-select-col--partner,
    .service-assignees-assignee .ticket-table-wrap .table-filter-row .ticket-filter-select-col--partner,
    .service-partners-partner .ticket-table-wrap .table-filter-row .ticket-filter-select-col--partner {
        min-width: 13.6rem;
    }

    .service-index .ticket-table-wrap .table-filter-row .ticket-filter-select-col--team,
    .service-index .ticket-table-wrap .table-filter-row .ticket-filter-select-col--requester,
    .service-index .ticket-table-wrap .table-filter-row .ticket-filter-select-col--assignee,
    .service-assignees-assignee .ticket-table-wrap .table-filter-row .ticket-filter-select-col--team,
    .service-assignees-assignee .ticket-table-wrap .table-filter-row .ticket-filter-select-col--requester,
    .service-assignees-assignee .ticket-table-wrap .table-filter-row .ticket-filter-select-col--assignee,
    .service-partners-partner .ticket-table-wrap .table-filter-row .ticket-filter-select-col--team,
    .service-partners-partner .ticket-table-wrap .table-filter-row .ticket-filter-select-col--requester,
    .service-partners-partner .ticket-table-wrap .table-filter-row .ticket-filter-select-col--assignee {
        min-width: 13.6rem;
    }

    .service-index .ticket-table-wrap .ticket-filter-select-col--assignee,
    .service-assignees-assignee .ticket-table-wrap .ticket-filter-select-col--assignee,
    .service-partners-partner .ticket-table-wrap .ticket-filter-select-col--assignee {
        min-width: 11.2rem;
    }

    .service-index .ticket-table-wrap .table-filter-row .ticket-filter-select-col--assignee,
    .service-assignees-assignee .ticket-table-wrap .table-filter-row .ticket-filter-select-col--assignee,
    .service-partners-partner .ticket-table-wrap .table-filter-row .ticket-filter-select-col--assignee {
        min-width: 11.2rem;
    }

    .service-index .ticket-table-wrap .ticket-actions-col,
    .service-index .ticket-table-wrap .ticket-action-cell,
    .service-assignees-assignee .ticket-table-wrap .ticket-actions-col,
    .service-assignees-assignee .ticket-table-wrap .ticket-action-cell,
    .service-partners-partner .ticket-table-wrap .ticket-actions-col,
    .service-partners-partner .ticket-table-wrap .ticket-action-cell {
        width: 6.4rem;
        min-width: 6.4rem;
    }

    .service-index .ticket-table-wrap .ticket-actions-col,
    .service-assignees-assignee .ticket-table-wrap .ticket-actions-col,
    .service-partners-partner .ticket-table-wrap .ticket-actions-col {
        padding-right: 2.4rem;
    }

    .service-index .ticket-table-wrap .ticket-action-cell,
    .service-assignees-assignee .ticket-table-wrap .ticket-action-cell,
    .service-partners-partner .ticket-table-wrap .ticket-action-cell {
        padding-right: 2.4rem !important;
    }
}
@media screen and (min-width: 1700px) {
    .ticket-table-wrap {
        overflow-x: auto;
    }

    .ticket-table-wrap .ticket-table {
        table-layout: fixed;
        width: 100%;
        max-width: 100%;
    }

    .service-index .ticket-table-wrap .ticket-table,
    .service-assignees-assignee .ticket-table-wrap .ticket-table,
    .service-partners-partner .ticket-table-wrap .ticket-table {
        min-width: 147.2rem;
    }

    .ticket-table-wrap .ticket-table.ticket-table--with-next-update {
        min-width: 154.2rem;
    }

    .ticket-table-wrap .ticket-table.ticket-table--with-assignee {
        min-width: 151.2rem;
    }

    .ticket-table-wrap .ticket-table.ticket-table--with-next-update.ticket-table--with-assignee {
        min-width: 158.2rem;
    }

    .ticket-table-wrap--suspended .suspended-subject-cell {
        width: 44%;
        max-width: 700px;
    }

    .ticket-table-wrap .ticket-subject-col,
    .ticket-table-wrap .ticket-subject-cell {
        width: auto;
        min-width: 14rem;
        max-width: none;
    }

    .ticket-table-wrap .ticket-date-col {
        width: 12.8rem;
        min-width: 12.8rem;
        max-width: 12.8rem;
    }

    .ticket-table-wrap .ticket-next-update-col {
        width: 12.2rem;
        min-width: 12.2rem;
        max-width: 12.2rem;
    }

    .ticket-table-wrap .ticket-updated-col {
        width: 21.2rem;
        min-width: 21.2rem;
        max-width: 21.2rem;
    }

    .ticket-table-wrap .ticket-id-col {
        width: 10.2rem;
        min-width: 10.2rem;
        max-width: 10.2rem;
    }

    .ticket-table-wrap .ticket-sla-col {
        width: 9rem;
        min-width: 9rem;
        max-width: 9rem;
    }

    .ticket-table-wrap .ticket-filter-select-col--partner,
    .ticket-table-wrap .ticket-col--partner {
        width: 12.8rem;
        min-width: 12.8rem;
        max-width: 12.8rem;
    }

    .ticket-table-wrap .ticket-filter-select-col--team,
    .ticket-table-wrap .ticket-col--team,
    .ticket-table-wrap .ticket-filter-select-col--requester,
    .ticket-table-wrap .ticket-col--requester {
        width: 12.8rem;
        min-width: 12.8rem;
        max-width: 12.8rem;
    }

    .ticket-table-wrap .ticket-filter-select-col--assignee,
    .ticket-table-wrap .ticket-assignee-col,
    .ticket-table-wrap .ticket-col--assignee {
        width: 11rem;
        min-width: 11rem;
        max-width: 11rem;
    }

    .ticket-table-wrap .ticket-table .ticket-truncate-cell {
        max-width: 12.8rem;
    }

    .ticket-table-wrap .ticket-problem-col,
    .ticket-table-wrap .ticket-problem-cell {
        width: 76px;
        max-width: 76px;
    }

    .ticket-table-wrap .ticket-priority-col,
    .ticket-table-wrap .ticket-priority-cell {
        width: 82px;
        min-width: 82px;
        max-width: 82px;
    }

    .ticket-table-wrap .ticket-filter-select-col--priority {
        min-width: 98px;
    }

    .ticket-table-wrap .ticket-filter-select-col--partner {
        min-width: 12.8rem;
    }

    .ticket-table-wrap .ticket-filter-select-col--team,
    .ticket-table-wrap .ticket-filter-select-col--requester,
    .ticket-table-wrap .ticket-filter-select-col--assignee {
        min-width: 12.8rem;
    }

    .ticket-table-wrap .table-filter-row .ticket-filter-select-col {
        min-width: 112px;
    }

    .ticket-table-wrap .table-filter-row .ticket-filter-select-col--priority {
        min-width: 98px;
        padding-right: 12px;
    }

    .ticket-table-wrap .table-filter-row .ticket-filter-select-col--partner {
        min-width: 12.8rem;
    }

    .ticket-table-wrap .table-filter-row .ticket-filter-select-col--team,
    .ticket-table-wrap .table-filter-row .ticket-filter-select-col--requester,
    .ticket-table-wrap .table-filter-row .ticket-filter-select-col--assignee {
        min-width: 12.8rem;
    }

    .ticket-table-wrap .ticket-filter-select-col--assignee {
        min-width: 11rem;
    }

    .ticket-table-wrap .table-filter-row .ticket-filter-select-col--assignee {
        min-width: 11rem;
    }

    .ticket-table-wrap .ticket-filter-select-col {
        padding-left: 0.7rem;
        padding-right: 0.7rem;
    }

    .ticket-table-wrap .ticket-filter-select-col--priority {
        padding-right: 1.2rem;
    }

    .ticket-table-wrap .ticket-filter-select-col--partner {
        padding-left: 1rem;
    }

    .ticket-table-wrap .ticket-actions-col,
    .ticket-table-wrap .ticket-action-cell {
        width: 6.6rem;
        min-width: 6.6rem;
    }

    .ticket-table-wrap .ticket-actions-col {
        padding-right: 2.6rem;
    }

    .ticket-table-wrap .ticket-action-cell {
        padding-right: 2.6rem !important;
    }
}

.ticket-table-wrap .ticket-nowrap-cell {
    white-space: nowrap;
}

.ticket-table-wrap .ticket-truncate-cell {
    max-width: 180px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ticket-table-wrap .ticket-truncate-cell a,
.ticket-table-wrap .ticket-truncate-cell span {
    display: inline-block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.ticket-table-wrap .ticket-subject-cell .ticket-link-preview--subject {
    display: block;
    max-width: 100%;
}

.ticket-table-wrap .ticket-subject-cell .ticket-link-preview--subject > a {
    display: inline-block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.ticket-table-wrap--suspended .suspended-subject-cell a {
    display: inline-block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ticket-table-wrap--suspended .suspended-ticket-select-col,
.ticket-table-wrap--suspended .ticket-select-col {
    vertical-align: middle !important;
}

.ticket-table-wrap--suspended .suspended-ticket-select-col input[type=checkbox],
.ticket-table-wrap--suspended .ticket-select-col input[type=checkbox] {
    vertical-align: middle;
}

.ticket-table-wrap--suspended .ticket-bulk-actions-buttons {
    flex-wrap: nowrap;
    white-space: nowrap;
}

.ticket-table-wrap--suspended .ticket-table--suspended .suspended-actions-cell .ticket-bulk-actions-buttons {
    width: 100%;
    justify-content: flex-end;
}

.ticket-greylist-btn {
    border: 1px solid var(--text-grey);
    color: var(--text-grey);
}

.ticket-greylist-btn:hover {
    background-color: var(--text-grey);
    color: var(--white-text);
}

.ticket-table .ticket-select-col input[type=checkbox] {
    margin: 0;
    width: 16px;
    height: 16px;
}

.ticket-table .ticket-presence-col {
    width: 34px;
    min-width: 34px;
    text-align: center;
    vertical-align: middle !important;
    padding-left: 0 !important;
    padding-right: 4px !important;
    line-height: 1;
}

.ticket-table .ticket-presence-col .ticket-presence,
.ticket-table .ticket-presence-col .eye-inactive {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin: 0 auto;
}

.ticket-table .ticket-presence-col svg {
    display: block;
    width: 16px;
    height: 16px;
}

.ticket-table td:nth-child(3),
.ticket-table th:nth-child(3) {
    padding-left: 10px !important;
}

.activity-log-table td,
.activity-log-table th {
    vertical-align: top;
}

.activity-log-table th:first-child,
.activity-log-table td:first-child {
    width: 1%;
    white-space: nowrap;
}

.activity-source-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1.4;
}

.activity-source-badge-user {
    background: var(--primary-color-tint);
    color: var(--primary-color);
}

.activity-source-badge-device {
    background: var(--tint-background);
    color: var(--green-status);
}

.activity-detail-list {
    margin: 0;
    padding: 0 0 0 16px;
}

.activity-detail-list li {
    margin: 0 0 3px 0;
    line-height: 1.3;
}

.activity-log-filter-row th {
    vertical-align: top;
}

.activity-date-filter {
    display: flex;
    flex-direction: row;
    gap: 10px;
    width: fit-content;
    max-width: 100%;
}

.activity-date-filter .search-filter-input {
    width: 150px;
    min-width: 150px;
}

.activity-details-filter {
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: center;
}

.activity-details-filter .search-filter-input {
    flex: 1 1 auto;
    min-width: 0;
}

.activity-details-filter__actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    flex: 0 0 auto;
}

.ticket-list-title-actions {
    margin-bottom: 12px;
}

.tabs-container .ticket-list-title-actions.ticket-list-title-actions--no-tabs {
    margin-bottom: 20px;
}

.ticket-export-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.ticket-export-btn__label,
.ticket-export-btn__loading {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
    line-height: 1;
}

.ticket-export-btn--disabled,
.ticket-export-btn[disabled] {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

/* Agent activity cards: fixed card widths + tabular elapsed counters to prevent jitter. */
.agent-activity .agent-activity-elapsed {
    display: block;
    min-height: 1.25em;
    font-size: 1.05rem;
    line-height: 1.2;
    color: var(--tertiary-color-text);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
@media screen and (max-width: 600px) {
    .ticket-comment-meta-row {
        flex-direction: column;
        gap: 6px;
    }

    .ticket-comment-actions {
        width: 100%;
        justify-content: flex-end;
        padding-left: 0;
        margin-bottom: 1rem;
    }

    .ticket-comment-meta {
        margin-bottom: .4rem;
    }
}

.team-switcher-placeholder {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 12px;
}

.profile-button__health--placeholder {
    position: absolute;
    top: 0;
    left: 28px;
    width: 18px;
    height: 18px;
    background: var(--light-grey);
    z-index: 1;
}

.profile-button__health--placeholder::before {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    border: 2px solid var(--white-background);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}

.system-health--placeholder .system-health__section {
    gap: 0;
}

.system-health-placeholder__issues {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 8px;
}

.system-health-placeholder__issue {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 7px 0;
    border-top: 1px solid var(--input-border);
}

.system-health-placeholder__issue:first-child {
    border-top: 0;
    padding-top: 0;
}

.system-health-placeholder__stats {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--input-border);
}

.system-health-placeholder__links {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid var(--input-border);
}

.ticket-comment-avatar {
    width: 3.8rem;
    height: 3.8rem;
    border-radius: 999px;
    object-fit: cover;
    flex-shrink: 0;
    background: var(--primary-color-tint);
    box-shadow: 0 0 0 1px rgba(7, 53, 79, 0.12);
}

.ticket-comment-avatar--fallback {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--primary-color);
}

.ticket-comment-stack {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    flex: 1 1 auto;
    max-width: none;
    min-width: 0;
}

.ticket-comment-stack--actionable {
    isolation: isolate;
}

.ticket-comment-stack--busy {
    pointer-events: none;
}

.ticket-comment-loading-overlay {
    inset: -0.8rem;
    z-index: 6;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.78);
}

.ticket-comment-header,
.ticket-comment-meta-row,
.ticket-comment-email-link,
.ticket-comment-timestamp {
    width: 100%;
}

.ticket-comment-row--agent .ticket-comment-meta-row,
.ticket-comment-row--agent .ticket-comment-email-link {
    text-align: right;
}

.ticket-comment-row--customer .ticket-comment-meta-row,
.ticket-comment-row--customer .ticket-comment-email-link {
    text-align: left;
}

.ticket-comment-row--customer .ticket-comment-actions-row {
    justify-content: space-between;
    width: min(72rem, 100%);
    margin-right: auto;
}

.ticket-comment-row--agent .ticket-comment-actions-row {
    display: none;
}

.ticket-comment-actions-row .ticket-comment-email-link {
    width: auto;
    margin: 0;
}

.ticket-comment-actions-row .ticket-comment-actions {
    margin-left: auto;
}

.ticket-comment-header {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.ticket-comment-row--agent .ticket-comment-header {
    text-align: right;
    align-items: flex-end;
}

.ticket-comment-row--customer .ticket-comment-header {
    text-align: left;
    align-items: flex-start;
}

.ticket-comment {
    width: min(72rem, 100%);
    max-width: 100%;
}

.ticket-comment.ticket-comment-email {
    overflow-x: auto;
}

.ticket-comment.ticket-comment-email img {
    width: auto;
    max-width: 100%;
    height: auto;
    display: inline-block;
}

.ticket-email-rendered table,
.ticket-email-rendered-original table {
    width: 100% !important;
}

.ticket-email-rendered a,
.ticket-email-rendered img,
.ticket-email-rendered-original img {
    height: auto !important;
    max-width: 100% !important;
}

.ticket-email-signature {
    color: #5d6670;
}

.ticket-email-view__meta-label {
    color: #5d6670;
}
/*
.aiison-chat-shell {
    position: fixed;
    left: 1.5rem;
    right: auto;
    bottom: 1.5rem;
    z-index: 1100;
}
/*
body:has(.ticket-workspace-shell .ticket-workspace-bar) .aiison-chat-shell {
    bottom: 1.5rem;
    left: 2rem;
    right: auto;
}

body:not(:has(.ticket-workspace-shell .ticket-workspace-bar)) .aiison-chat-shell {
    bottom: 1.5rem;
    left: 2rem;
    right: auto;
}

body:has(.ticket-workspace-shell .ticket-workspace-bar) .aiison-chat-panel,
body:not(:has(.ticket-workspace-shell .ticket-workspace-bar)) .aiison-chat-panel {
    left: 0;
    right: auto;
}*/
.aiison-chat-panel {
    p {
   color:var(--text-grey);
    }
}
.aiison-chat-message--user {
       p {
   color:var(--white-text);
    }
}
.aiison-chat-header {
    background:var(--primary-color);
}

.aiison-chat-header h3 {
    font-weight: 900;
}

.aiison-chat-actions button {
    border: 1px solid rgba(255,255,255,0.22);
}

.aiison-chat-messages {
    background:
        radial-gradient(circle at top right, rgba(23, 55, 85, 0.06), transparent 34%),
        linear-gradient(180deg, #fbfdff 0%, #f4f8fb 100%);
}

.aiison-chat-messages p,
.aiison-chat-messages li,
.aiison-chat-messages ul {
    font-size: 1.5rem;
    line-height: 1.5;
}

.aiison-chat-empty {
    color: #4b6477;
    font-size: 1.5rem;
}

.aiison-chat-message {
    font-size: 1.5rem;
    line-height: 1.5;
}

.aiison-chat-compose textarea {
    min-height: 7.5rem;
    border-radius: 0.8rem;
    font-size: 1.5rem;
    line-height: 1.5;
}

.aiison-chat-compose-row button {
    border: 1px solid var(--primary-color, #173755);
    border-radius: 999px;
    padding: 0.8rem 1.8rem;
    background: var(--primary-color, #173755);
    color: var(--white-text);
    font-weight: 500;
    min-width: 8.4rem;
    min-height: 4rem;
    font-size: 1.4rem;
    line-height: 1;
    transition: opacity 0.15s ease;
}

.aiison-chat-compose-row button:hover,
.btn-outline-danger-lite {
    border: 1px solid var(--red-status);
}

.ticket-workspace-pane .dropup .dropdown-menu > li > .dropdown-item {
    padding: 0.45rem 1rem 0.45rem 0.9rem;
}

.dropdown-menu .dropdown-item .ticket-submit-option {
    align-items: center;
    column-gap: 0.9rem;
    display: grid;
    grid-template-columns: 1.6rem minmax(0, 1fr);
    min-height: 0;
    width: 100%;
}

.dropdown-menu .dropdown-item .ticket-submit-option__dot {
    flex: 0 0 1.6rem;
    height: 1.6rem;
    width: 1.6rem;
}

.dropdown-menu .dropdown-item .ticket-submit-option__dot--new,
.dropdown-menu .dropdown-item .ticket-submit-option__dot--open,
.dropdown-menu .dropdown-item .ticket-submit-option__dot--pending,
.dropdown-menu .dropdown-item .ticket-submit-option__dot--on-hold,
.dropdown-menu .dropdown-item .ticket-submit-option__dot--solved {
    border-radius: 50%;
}

.dropdown-menu .dropdown-item .ticket-submit-option__dot--new {
    background-color: var(--green-status);
}

.dropdown-menu .dropdown-item .ticket-submit-option__dot--open {
    background-color: var(--red-status);
}

.dropdown-menu .dropdown-item .ticket-submit-option__dot--pending {
    background-color: #04afda;
}

.dropdown-menu .dropdown-item .ticket-submit-option__dot--on-hold {
    background-color: var(--text-grey);
}

.dropdown-menu .dropdown-item .ticket-submit-option__dot--solved {
    background-color: var(--grey-status);
}

.dropdown-menu .dropdown-item .ticket-submit-option__label {
    display: block;
    line-height: 1.05;
    white-space: nowrap;
}

.dropdown-menu .dropdown-item .ticket-submit-option__label strong {
    font-weight: 400;
    margin-left: 0;
}

.ticket-workspace-pane .dropup .dropdown-menu {
    border: 1px solid var(--input-border);
    border-radius: 0;
    box-shadow: 0 0.6rem 1.6rem rgba(0, 0, 0, 0.06);
}

.dropdown-menu .dropdown-divider {
    margin: 0.65rem 1rem 0.65rem 0.9rem;
}

.settings-inline-min-width-22 {
    min-width: 22rem;
}

.settings-inline-max-width-340 {
    max-width: 340px;
}

.settings-inline-note-small {
    font-size: 0.8em;
}

.sla-table-col-priority {
    width: 16%;
}

.sla-table-col-triage {
    width: 12%;
}

.sla-table-col-response,
.sla-table-col-update,
.sla-table-col-resolution {
    width: 15%;
}

.sla-table-col-active {
    width: 9%;
}

.sla-table-col-external {
    width: 10%;
}

@media (max-width: 640px) {
    .ticket-comment-row {
        gap: 0.8rem;
    }

    .ticket-comment-avatar {
        width: 3.2rem;
        height: 3.2rem;
    }

    .ticket-comment-stack {
        width: 100%;
    }

    .aiison-chat-shell {
        right: 0.75rem;
        bottom: 0.75rem;
    }

    .aiison-chat-panel {
        width: calc(100vw - 1.5rem);
        height: min(40rem, calc(100vh - 5.5rem));
        right: 0;
        min-height: 34rem;
        font-size: 1.5rem;
    }

    .aiison-chat-message {
        gap: 0.75rem;
    }

    .aiison-chat-bubble {
        max-width: 96%;
    }
}

@media (min-width: 1600px) {
    .aiison-chat-panel {
        width: 52rem;
        height: min(60rem, calc(100vh - 3.5rem));
    }
}

.navigator-wrap .trigger > span:first-child {
    min-width: 0;
}

.navigator-wrap .trigger > span:last-child {
    display: inline-flex;
    align-items: center;
}

.navigator-wrap.is-open .trigger {
   /* border-radius: 0.7rem 0.7rem 0 0;*/
}

.navigator-popover {
    top: calc(100% - 1px);
    box-shadow: 0 20px 36px rgba(0, 0, 0, .18);
    border: 1px solid var(--input-border);
    /*overflow: hidden;*/
}

.navigator-popover input {
    width: calc(100% - 2rem);
    margin: 0 auto 0.2rem auto;
    display: block;
}

.navigator-wrap ul.navigator-list li > a,
.navigator-wrap ul.navigator-list li > span,
.navigator-wrap ul.navigator-list li.no-link {
    width: 100%;
    display: flex;
    align-items: center;
}

.navigator-wrap ul.navigator-list li.forward > button {
    appearance: none;
    border: none;
    background: transparent;
    width: 100%;
    padding: 0;
    margin: 0;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

.navigator-wrap ul.navigator-list .back-link button {
    appearance: none;
    border: none;
    background: transparent;
    width: 100%;
    padding: 0;
    margin: 0;
    text-align: left;
    font: inherit;
    color: inherit;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.8rem;
    cursor: pointer;
    font-size: 1.4rem;
    font-weight: 300;
    line-height: 1.2;
}

.navigator-wrap ul.navigator-list li.navigator-tabs {
   /* display: flex;
    align-items: stretch;*/
}

.navigator-wrap ul.navigator-list li.navigator-tabs button {
   /* appearance: none;
    border: none;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 1.4rem;
    margin: 0;
    padding: 0.9rem 1.6rem;
    cursor: pointer;
    position: relative;*/
}

.navigator-wrap ul.navigator-list li.navigator-tabs button.disabled {
  /*  cursor: default;*/
}

.navigator-wrap ul.navigator-list li.navigator-tabs button.active {
   /* background-color: var(--primary-color);
    color: var(--white-text);*/
}

.navigator-wrap ul.navigator-list li.navigator-tabs button.active::after {
  /*  content: "";
    position: absolute;
    bottom: -1.4rem;
    left: calc(50% - 0.7rem);
    border-top: 0.7rem solid var(--primary-color);
    border-bottom: 0.7rem solid transparent;
    border-left: 0.7rem solid transparent;
    border-right: 0.7rem solid transparent;*/
}

.navigator-wrap ul.navigator-list li a span,
.navigator-wrap ul.navigator-list li > span span,
.navigator-wrap ul.navigator-list li.no-link span {
    margin-bottom: 0;
   /* white-space: nowrap;*/
}

.navigator-wrap ul.navigator-list li.selected > a span,
.navigator-wrap ul.navigator-list li.selected > span,
.navigator-wrap ul.navigator-list li.selected > button span,
.navigator-wrap ul.navigator-list li.parent.selected > a span,
.navigator-wrap ul.navigator-list li.parent.selected > span {
    color: var(--red-status);
    font-weight: 600;
}

.navigator-wrap ul.navigator-list li.selected svg path,
.navigator-wrap ul.navigator-list li.parent.selected svg path {
    fill: var(--red-status) !important;
}

.ticket-workspace-shell {
    --ticket-workspace-width: min(100vw, 75rem);
    --ticket-workspace-top: -1px;
    --ticket-workspace-bar-height: 6.4rem;
    overflow-x: hidden;
    pointer-events: none;
    position: fixed;
    inset: 0;
    z-index: 1060;
}

body:has(.ticket-workspace-shell .ticket-workspace-bar) {
    overflow-x: hidden;
    padding-bottom: var(--ticket-workspace-bar-height, 6.4rem);
}

@media screen and (min-width: 700px) {
    body:has(.ticket-workspace-shell .ticket-workspace-bar) > .d-flex {
        min-height: calc(100vh + var(--ticket-workspace-bar-height, 6.4rem));
        align-items: stretch;
    }

    body:has(.ticket-workspace-shell .ticket-workspace-bar) .sidebar {
        min-height: 100%;
    }
}

.ticket-workspace-backdrop--loading {
    opacity: 0.52;
}

.ticket-workspace-panel {
    background: #fff;
    border-left: none;
    box-shadow: -10px 0 30px 0 rgba(7, 53, 79, 0.25);
    bottom: 0;
    overflow: auto;
    overflow-x: hidden;
    scrollbar-gutter: stable;
    pointer-events: auto;
    position: fixed;
    right: 0;
    top: var(--ticket-workspace-top);
    width: var(--ticket-workspace-width);
}

.ticket-workspace-panel--loading {
    overflow: hidden;
}

.ticket-workspace-pane {
    display: none;
    min-height: 100%;
}

.ticket-workspace-pane.is-active {
    display: flex;
    flex-direction: column;
}

.ticket-workspace-loading {
    padding: 2rem;
}

.ticket-workspace-loading__group {
    display: flex;
    flex-direction: column;
    gap: 1.8rem;
    min-height: calc(100vh - 5.8rem - var(--ticket-workspace-bar-height));
}

.ticket-workspace-loading__field {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.ticket-workspace-loading__timeline {
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
    padding-top: 1rem;
}

.ticket-workspace-loading__spacer {
    flex: 1 1 auto;
    min-height: 10rem;
}

.ticket-workspace-pane__title,
.ticket-workspace-pane__title div {
    color: var(--primary-color);
}

.ticket-workspace-pane__title-meta {
    align-items: flex-end;
    display: inline-flex;
    gap: 0;
}


.ticket-workspace-pane__actions {
    align-items: center;
    display: inline-flex;
    gap: 1rem;
}

.ticket-workspace-pane__header .btn-close {
    background: transparent;
    border: 1px solid var(--primary-color);
    border-radius: 50%;
    color: var(--primary-color);
    flex: 0 0 auto;
    height: 3.4rem;
    line-height: 1;
    padding: 0;
    width: 3.4rem;
}

.ticket-workspace-pane__action-btn {
    align-items: center;
    display: inline-flex;
    font-size: 1.8rem;
    justify-content: center;
}

.ticket-workspace-pane__action-btn:hover,
.ticket-workspace-pane__action-btn:focus {
    background-color: var(--primary-color-tint);
}

.ticket-workspace-pane .form-content {
    min-height: auto;
    overflow-x: clip;
    padding: 1.8rem 2rem calc(1.2rem + var(--ticket-workspace-bar-height));
}

.ticket-workspace-pane form {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: calc(100vh - 5.8rem);
    height: 100%;
}

.ticket-workspace-pane .form-content-view,
.ticket-workspace-pane .form-content-edit,
.ticket-workspace-pane .form-content-create {
    background: #fff;
    flex: 1 1 auto;
    padding-bottom: 4.8rem;
}

.ticket-workspace-pane .form-group {
    /*margin-bottom: 1.8rem;*/
}

.ticket-workspace-pane .button-wrap {
   /* background: #fff;
    box-sizing: border-box;
    border-top: none;
    box-shadow: 0 10px 30px 0 rgba(7, 53, 79, 0.55);
    align-items: center;
    gap: 2rem;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    margin-top: auto;
    min-height: var(--ticket-workspace-bar-height);
    padding: 1rem 2rem;
    width: 100%;*/
}

.ticket-workspace-bar {
    overflow-x: hidden;
   /* right: var(--ticket-workspace-width);*/
    z-index: 6;
}

.ticket-workspace-bar--full {
    right: 0;
}

.ticket-workspace-tabs-wrap {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    position: relative;
}

.ticket-workspace-tabs-wrap::before,
.ticket-workspace-tabs-wrap::after {
    content: "";
    inset: 0 auto 0 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition: opacity 0.16s ease;
    width: 2.4rem;
    z-index: 1;
}

.ticket-workspace-tabs-wrap::before {
    background: linear-gradient(to right, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0));
    left: 0;
}

.ticket-workspace-tabs-wrap::after {
    background: linear-gradient(to left, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0));
    left: auto;
    right: 0;
}

.ticket-workspace-tabs-wrap.has-left-overflow::before,
.ticket-workspace-tabs-wrap.has-right-overflow::after {
    opacity: 1;
}

.ticket-workspace-tabs {
    align-items: center;
    display: flex;
    gap: 0.8rem;
    height: 100%;
    overflow-x: auto;
    padding-bottom: 0;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.ticket-workspace-tabs::-webkit-scrollbar {
    display: none;
}

.ticket-workspace-tab {
    align-items: center;
    background: #f3f4f5;
    border: 1px solid #d9d9d9;
    border-radius: 999px;
    color: var(--text-grey);
    display: inline-flex;
    gap: 0.8rem;
    justify-content: center;
    line-height: 1;
    max-width: 24rem;
    height: 3.5rem;
    min-height: 3.5rem;
    padding: 0 1.4rem;
}

.ticket-workspace-tab.is-active {
    background: #fff;
    border-color: var(--secondary-color, #004855);
}

.ticket-workspace-tab--loading {
    cursor: default;
    opacity: 0.9;
}

.ticket-workspace-tab__label {
    align-items: center;
    display: inline-flex;
    font-size: 1.5rem;
    line-height: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ticket-workspace-tab__dirty {
    background: #d01317;
    border-radius: 50%;
    display: inline-block;
    flex: 0 0 auto;
    height: 0.9rem;
    width: 0.9rem;
}

.ticket-workspace-tab__close {
    color: var(--text-grey);
    cursor: pointer;
    flex: 0 0 auto;
    font-size: 1.5rem;
    line-height: 1;
    width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}


.ticket-workspace-panel .management-details {
    width: 100%;
}

.ticket-workspace-pane .button-row {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: 1.2rem;
    min-width: 0;
    width: 100%;
    flex-wrap: nowrap;
}

.ticket-workspace-pane .button-row .btn-group,
.ticket-workspace-pane .button-row > .btn {
    margin: 0;
}

.ticket-workspace-pane .fixed-div-select {
    align-self: center;
    flex: 1 1 auto;
    margin-left: 0;
    max-width: none;
    min-width: 18rem;
    padding-left: 0;
    width: 100%;
}

.ticket-save-preference-menu-item {
    padding: 0;
}

.ticket-save-preference-inline {
    align-items: center;
    color: var(--text-grey);
    cursor: pointer;
    display: flex;
    font-size: 1.5rem;
    font-weight: 400;
    margin: 0;
    padding: 0.45rem 1rem 0.45rem 0.9rem;
    position: relative;
    white-space: nowrap;
    width: 100%;
}

.ticket-save-preference-inline input[type=checkbox] {
    height: 1px;
    margin: 0;
    left: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    top: 0;
    width: 1px;
}

.ticket-save-preference-inline .ticket-submit-option--checkbox {
    gap: 0.9rem;
}

.ticket-save-preference-inline .ticket-submit-option {
    align-items: center;
    column-gap: 0.9rem;
    display: grid;
    grid-template-columns: 1.6rem minmax(0, 1fr);
    width: 100%;
}

.ticket-save-preference-inline .ticket-submit-option__dot--checkbox {
    background: transparent;
    border: 0.1rem solid var(--text-grey);
    border-radius: 0.3rem;
    position: relative;
}

.ticket-save-preference-inline .ticket-submit-option__dot--checkbox:after {
    border-bottom: 0.2rem solid var(--white-text);
    border-right: 0.2rem solid var(--white-text);
    content: "";
    height: 0.9rem;
    left: 0.45rem;
    opacity: 0;
    position: absolute;
    top: 0.15rem;
    transform: rotate(45deg);
    width: 0.45rem;
}

.ticket-save-preference-inline input[type=checkbox]:checked + .ticket-submit-option .ticket-submit-option__dot--checkbox {
    background: #58b8c8;
    border-color: #58b8c8;
}

.ticket-save-preference-inline input[type=checkbox]:checked + .ticket-submit-option .ticket-submit-option__dot--checkbox:after {
    opacity: 1;
}

.ticket-workspace-pane .fixed-div-select .form-group,
.ticket-workspace-pane .fixed-div-select .vscomp-ele,
.ticket-workspace-pane .fixed-div-select .vscomp-wrapper,
.ticket-workspace-pane .fixed-div-select .vscomp-toggle-button {
    max-width: 100%;
    margin-bottom: 0;
    min-width: 0;
    width: 100%;
}

.ticket-workspace-pane .fixed-div-select .vscomp-toggle-button,
.ticket-workspace-pane .button-row .btn,
.ticket-workspace-pane .button-row .btn-group > .btn {
    min-height: 4.2rem;
}

.ticket-workspace-pane .fixed-div-select .vscomp-toggle-button {
    align-items: center;
    display: flex;
}

.ticket-device-header {
    align-items: center;
    display: flex;
    gap: 1.2rem;
    justify-content: space-between;
}

.ticket-device-actions {
    align-items: center;
    display: inline-flex;
    gap: 1rem;
    flex: 0 0 auto;
}

.ticket-device-actions .btn {
    margin: 0;
    min-height: auto;
    white-space: nowrap;
}

.ticket-device-actions .btn-success:hover,
.ticket-device-actions .btn-success:focus,
.ticket-device-actions .btn-success:active {
    background-color: #689f37;
    border-color: #689f37;
    filter: none;
}

@media (max-width: 760px) {
    .ticket-reply-selector {
        align-items: stretch;
        flex-direction: column;
    }

    .ticket-reply-selector__scroller,
    .ticket-reply-partner {
        width: 100%;
    }

    .ticket-reply-selector__scroller {
        display: block;
        flex: none;
        flex-basis: auto;
        min-width: 100%;
    }

    .ticket-reply-selector .ticket-reply-actions {
        display: inline-flex;
    }

    .ticket-reply-partner {
        justify-content: flex-end;
    }

    .ticket-reply-partner {
        margin-left: 0;
    }

    .ticket-workspace-pane .button-row {
        flex-wrap: nowrap;
    }

    .ticket-device-header {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 991.98px) {
    .ticket-reply-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .ticket-reply-selector {
        gap: 0.8rem;
    }

    .ticket-reply-partner {
        margin-left: auto;
    }

    .ticket-reply-selector__scroller {
        flex-basis: 0;
    }

    .ticket-workspace-pane .button-wrap {
        align-items: center;
        gap: 0.8rem;
        grid-template-columns: auto minmax(15rem, 1fr);
        margin-bottom: var(--ticket-workspace-bar-height);
        margin-right: -1.6rem;
        padding-right: 4rem;
    }

    .ticket-workspace-pane .button-row {
        flex: 1 1 auto;
        min-width: 0;
        width: 100%;
    }

    .ticket-workspace-pane .fixed-div-select {
        flex: 1 1 15rem;
        min-width: 15rem;
        width: 100%;
    }

    .ticket-workspace-pane .button-row {
        flex-wrap: nowrap;
        gap: 0.8rem;
    }

    .ticket-workspace-shell {
        --ticket-workspace-top: -1px;
        --ticket-workspace-width: 100%;
        --ticket-workspace-bar-height: 6.4rem;
    }

    .ticket-workspace-panel {
        width: var(--ticket-workspace-width);
    }

    .ticket-workspace-pane__header {
        padding-left: 2.4rem;
        padding-right: 2.4rem;
    }

    .ticket-workspace-pane .form-content {
        padding-left: 2.4rem;
        padding-right: 2.4rem;
    }

    .ticket-workspace-pane .button-wrap {
        padding-left: 2.4rem;
        padding-right: 2.4rem;
    }

    .ticket-workspace-bar {
        align-items: center;
        left: 0;
        right: 0;
        flex-direction: row;
        height: var(--ticket-workspace-bar-height);
        min-height: 0;
        padding: 0.8rem 1.2rem;
    }

    .ticket-workspace-tabs-wrap {
        flex: 1 1 auto;
        box-sizing: border-box;
        width: auto;
        max-width: 100%;
        padding-left: 5.8rem;
    }

    .ticket-workspace-tabs {
        min-height: 4.6rem;
    }

    body:has(.ticket-workspace-shell .ticket-workspace-bar) .aiison-chat-shell {
        bottom: 0.8rem;
    }
}

@media (max-width: 820px) {
    .ticket-workspace-pane .button-wrap {
        gap: 0.8rem;
    }

    .ticket-workspace-pane .button-row {
        gap: 0.6rem;
    }

    .ticket-workspace-pane .button-row .btn,
    .ticket-workspace-pane .button-row .btn-group > .btn {
        padding-left: 1.1rem;
        padding-right: 1.1rem;
    }

    .ticket-workspace-pane .partner-name-tag--reply {
        font-size: 1.4rem;
        max-width: 10rem;
    }
}

.form-group-note {
    align-items: flex-start;
    gap: 1.5rem;
}

.form-group > .form-group-note,
.form-group > .requester-contact-card {
    margin-top: 1rem;
    margin-bottom: 0;
}

.form-group > .form-group-note + .form-group-note,
.form-group > .requester-contact-card + .form-group-note {
    margin-top: 1rem;
}

.form-group-note__label {
    color: var(--text-grey);
    flex: 0 0 auto;
    font-size: 1.5rem;
    font-weight: 900;
    line-height: 1.4;
}

.form-group-note p {
    font-size: 1.5rem;
    line-height: 1.4;
    margin: 0;
}

.form-group-note__subtle {
    color: var(--text-grey);
    font-style: normal;
    font-weight: 400;
}

.ticket-form-inline-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}

.ticket-form-inline-heading label {
    margin-bottom: 0;
}

.ticket-form-inline-link {
    margin-left: auto;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--text-grey-light);
    font-size: 1.2rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2;
    text-decoration: underline;
}

.ticket-form-inline-link:hover {
    color: var(--primary-color);
}

.ticket-form-inline-option-label {
    font-size: 1.4rem;
    font-style: normal;
    font-weight: 400;
}

.requester-contact-card {
    background: #f7f8f9;
    border: 1px solid #e2e5e8;
    border-radius: 1.4rem;
    display: grid;
    gap: 1.2rem;
    margin-top: 1rem;
    padding: 1.4rem 1.6rem;
}

.requester-contact-card__grid {
    display: grid;
    gap: 1.2rem 1.6rem;
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
}

.requester-contact-card__columns {
    align-items: start;
    display: grid;
    gap: 1.6rem;
    grid-template-columns: minmax(0, 1.4fr) minmax(18rem, 1fr);
}

.requester-contact-card__column {
    min-width: 0;
}

.requester-contact-card__column--requester .requester-contact-card__grid {
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}

.requester-contact-card__column--manager {
    border-left: 1px solid #e2e5e8;
    padding-left: 1.6rem;
}

.requester-contact-card__item {
    min-width: 0;
}

.requester-contact-card__item--wide {
    grid-column: 1 / -1;
}

.requester-contact-card__item--manager {
    height: 100%;
}

.requester-contact-card__label {
    color: #5d6670;
    font-size: 1.2rem;
    font-weight: 900;
    letter-spacing: 0.02em;
    line-height: 1.4;
    margin-bottom: 0.4rem;
    text-transform: uppercase;
}

.requester-contact-card__value,
.requester-contact-card__stack {
    color: var(--text-grey);
    font-size: 1.5rem;
    line-height: 1.5;
}

.requester-contact-card__stack {
    display: grid;
    gap: 0.2rem;
}

.requester-contact-card__stack a {
    word-break: break-word;
}

.requester-contact-card__key {
    color: #5d6670;
    display: inline-block;
    font-weight: 900;
    min-width: 1.6rem;
}

@media (max-width: 767.98px) {
    .requester-contact-card__columns {
        grid-template-columns: 1fr;
    }

    .requester-contact-card__column--manager {
        border-left: 0;
        border-top: 1px solid #e2e5e8;
        padding-left: 0;
        padding-top: 1.6rem;
    }
}

.ticket-dirty-summary {
    align-items: flex-start;
    border: 1px solid;
    border-radius: 1.2rem;
    display: grid;
    gap: 0.8rem;
    margin-bottom: 1.6rem;
    padding: 1.2rem 1.4rem;
}

.ticket-dirty-summary__label {
    color: var(--text-grey);
    font-size: 1.4rem;
    font-weight: 900;
    line-height: 1.4;
}

.ticket-dirty-summary__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.ticket-dirty-summary__chip {
    background: #fff;
    border: 1px solid #e8c4c8;
    border-radius: 999px;
    color: var(--text-grey);
    display: inline-flex;
    font-size: 1.3rem;
    line-height: 1.2;
    padding: 0.5rem 1rem;
}

.ticket-dirty-summary--error {
    background: #fff3f4;
    border-color: #e8c4c8;
}

.ticket-dirty-summary--error .ticket-dirty-summary__label {
    color: var(--text-grey);
    font-size: 1.5rem;
    font-weight: 600;
}

.ticket-error-summary__list {
    color: var(--text-grey);
    display: grid;
    gap: 0.45rem;
    margin: 0;
    padding-left: 1.8rem;
}

.ticket-error-summary__item {
    font-size: 1.35rem;
    line-height: 1.45;
}

.form-group-note--card {
    margin: 0;
}

.form-group-note--card p {
    margin-bottom: 0;
}

.form-group-note--note {
    background-color: #f3e4b3;
}

.form-group-note--warning {
    background-color: #e9d6e3;
}

.form-group-note--compact {
    gap: 0.8rem;
    margin-left: 0.8rem;
    margin-top: 0.8rem;
    padding: 0;
}

.form-group-note--compact .form-group-note__label {
    font-size: 1.2rem;
    color:  var(--text-grey);
    display: inline;
    font-weight: 600;
    letter-spacing: 0;
    margin-right: 0.2rem;
    text-transform: none;
}

.form-group-note--compact p {
    color: var(--text-grey);
    font-size: 1.2rem;
    line-height: 1.45;
    margin-bottom: 0;
}

.inbound-routing-rules-page {
    position: relative;
}

.inbound-routing-rules-table-wrap {
    margin-top: 1.4rem;
}

.inbound-routing-rules-table .table-filter-row th {
    vertical-align: top;
}

.inbound-routing-rules-table .table-filter-row input,
.inbound-routing-rules-table .table-filter-row select {
    width: 100%;
}

.inbound-routing-rules-table__clear-btn {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.inbound-routing-rules-table td {
    vertical-align: top;
}

.inbound-routing-rules-table .ticket-nowrap-cell {
    white-space: nowrap;
}

.inbound-routing-rules-table__rule-link {
    padding: 0;
    border: none;
    background: transparent;
    color: var(--text-grey);
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1.4;
    text-align: left;
}

.inbound-routing-rules-table__rule-link:hover {
    color: var(--primary-color);
}

.inbound-routing-rules-table__rule-link:focus-visible {
    color: var(--primary-color);
    outline: none;
    text-decoration: underline;
}

.inbound-routing-rules-table__meta {
    margin-top: 0.4rem;
    color: var(--text-grey-light);
    font-size: 1.2rem;
    line-height: 1.4;
}

.inbound-routing-rules-table__stack {
    display: grid;
    gap: 0.6rem;
}

.inbound-routing-rules-table__item {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    line-height: 1.5;
}

.inbound-routing-rules-table__label {
   /* color: var(--text-grey-light);
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;*/
}

.inbound-routing-rules-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 8.8rem;
    padding: 0.45rem 0.9rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.2;
}

.inbound-routing-rules-status--enabled {
    border-color: #cde7da;
    background: #edf8f1;
    color: #1e6b4c;
}

.inbound-routing-rules-status--disabled {
    border-color: #d9dee3;
    background: #f6f8f9;
    color: #65717d;
}

.inbound-routing-rules-table__updated {
    color: var(--text-grey-light);
    font-size: 1.3rem;
}

@media (max-width: 991px) {
    .inbound-routing-rules-table .table-filter-row th {
        min-width: 12rem;
    }

    .inbound-routing-rules-table .table-filter-row th:first-child,
    .inbound-routing-rules-table .table-filter-row th:nth-last-child(1) {
        min-width: 7rem;
    }
}

.readonly-select {
    align-items: center;
    border-radius: 8px;
    gap: 10px;
    justify-content: space-between;
    min-height: 4.2rem;
    padding: 0.7rem 3rem 0.7rem 1rem;
}

.readonly-select__value--placeholder {
    color: #7a8897;
}

.readonly-select--multi {
    min-height: 4.2rem;
}

.readonly-select__tags {
    gap: 0.4rem;
}

.readonly-select__tag {
    border: 1px solid #d5dde6;
    border-radius: 999px;
    color: #23313f;
    gap: 0.4rem;
    font-size: 1.2rem;
    margin: 0 0 0.4rem;
    padding: 0.35rem 0.5rem 0.35rem 1rem;
}

.readonly-select__tag-remove {
    color: #66798d;
    font-size: 1.3rem;
}

.readonly-select__placeholder {
    color: #7a8897;
}

.readonly-select__indicator {
    color: #7a8897;
}

@media (max-width: 760px) {
    .ticket-reply-selector {
        display: block;
    }

    .ticket-reply-selector__scroller {
        box-sizing: border-box;
        display: block;
        flex: 0 0 auto;
        min-width: 100%;
        width: 100%;
        max-width: 100%;
        padding-right: 2.4rem;
    }

    .ticket-reply-selector .ticket-reply-actions {
        display: inline-flex;
        min-width: max-content;
    }

    .ticket-reply-partner {
        display: flex;
        justify-content: flex-end;
        margin-left: 0;
        margin-top: 0.8rem;
        width: 100%;
    }

    .comments-wrap > h2 {
        font-size: 2rem;
        line-height: 1.2;
        margin-bottom: 1.6rem;
    }
}

.agent-activity {
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 8px;
    margin: 0 0 14px;
    min-height: 66px;
    overflow-y: hidden;
    padding: 0 0 6px;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    scrollbar-color: var(--secondary-color) transparent;
}

.agent-activity .agent-activity-card {
    flex: 0 0 150px;
    margin-right: 0;
    min-height: 64px;
    min-width: 150px;
    padding-left: 0.8rem;
    padding-right: 0.8rem;
    scroll-snap-align: start;
}

@media (min-width: 2200px) {
    .agent-activity .agent-activity-card {
        flex-basis: 175px;
        min-width: 175px;
    }
}

@media (max-width: 1500px) {
    .agent-activity {
        padding-bottom: 4px;
    }

    .agent-activity .agent-activity-card {
        flex-basis: 142px;
        min-width: 142px;
    }
}

.agent-activity-card--placeholder {
    display: flex;
    flex-direction: column;
    gap: 7px;
    justify-content: center;
}

.team-delete-confirm {
    display: grid;
    gap: 12px;
}

.team-delete-confirm__summary {
    background: #f7f9fb;
    border: 1px solid #d6dee8;
    border-radius: 18px;
    display: grid;
    gap: 12px;
    padding: 16px;
}

.team-delete-confirm__section {
    display: grid;
    gap: 4px;
}

.team-delete-confirm__tree {
    display: grid;
    gap: 4px;
}

.recycle-bin-audit {
    background: #f7f9fb;
    border: 1px solid #d6dee8;
    border-radius: 20px;
    display: grid;
    gap: 10px;
    margin-bottom: 16px;
    padding: 16px 18px;
}

.recycle-bin-audit__header {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: space-between;
}

.recycle-bin-audit__stats,
.recycle-bin-page__type-breakdown {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.recycle-bin-audit__badge,
.recycle-bin-page__type-breakdown span {
    background: #edf3f8;
    border-radius: 999px;
    color: #1f3b56;
    font-size: 0.86rem;
    padding: 4px 10px;
}

.recycle-bin-page__tree {
    display: grid;
    gap: 5px;
}

.recycle-bin-page__tree-node small,
.recycle-bin-page__type-breakdown small {
    color: #5f7085;
    font-size: 0.78rem;
}

.recycle-bin-page__type-breakdown--warning span {
    background: #fff1f0;
    color: #9f2d2d;
}

.breadcrumb-wrap .breadcrumb-list {
    min-height: 2.1rem;
    flex-wrap: wrap;
}

.breadcrumb-wrap .breadcrumb-list li {
    display: inline-flex;
    align-items: center;
}

.breadcrumb-wrap .breadcrumb-list a,
.breadcrumb-wrap .breadcrumb-list span {
    display: inline-flex;
    align-items: center;
    line-height: 1.2;
    margin-bottom: 0;
}

.breadcrumb-wrap .breadcrumb-list li::before {
    line-height: 1;
}

.home-team-browser {
    display: grid;
    gap: 16px;
    --home-team-browser-card-width: 236px;
}

.home-team-browser__controls {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
    align-items: flex-end;
}

.home-team-browser__section-nav {
    flex: 1 1 420px;
    min-width: 0;
}

.home-team-browser__tabs {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0;
    list-style: none;
    margin: 0;
    min-height: 4.6rem;
    padding: 0;
}

.home-team-browser__tabs li {
    margin-right: 2.6rem;
}

.home-team-browser__tabs a,
.home-team-browser__tab {
    color: var(--primary-color);
    display: inline-flex;
    align-items: flex-end;
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.2;
    margin: 0;
    min-height: 4.6rem;
    padding: 0 0 0.8rem;
    text-decoration: none;
}

.home-team-browser__tabs a[aria-selected="true"],
.home-team-browser__tab--single {
    color: var(--secondary-color-link);
    text-decoration: underline;
    text-decoration-thickness: 0.25em;
    text-underline-offset: 0.5em;
}

.home-team-browser__tabs--single {
    display: flex;
}

.home-team-browser__search-wrap {
    flex: 0 1 360px;
    width: min(100%, 360px);
    margin-left: auto;
}

.home-team-browser__search {
    width: 100%;
    min-height: 48px;
    border: 1px solid #d6dee8;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(7, 53, 79, 0.08);
    padding: 0 16px;
}

.home-team-browser__summary {
    color: #5f7085;
}

.home-team-browser__grid {
    grid-template-columns: repeat(auto-fill, minmax(var(--home-team-browser-card-width), var(--home-team-browser-card-width)));
}

.home-team-card {
    display: grid;
    gap: 14px;
    min-height: 170px;
    min-width: 0;
    padding: 18px;
    border: 2px solid #d6dee8;
    border-radius: 22px;
    background: linear-gradient(180deg, #ffffff 0%, #f6fafc 100%);
    box-shadow: 0 16px 36px rgba(7, 53, 79, 0.08);
    color: var(--text-grey);
    cursor: pointer;
    text-decoration: none;
    position: relative;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.home-team-card:hover,
.home-team-card:focus,
.home-team-card:focus-within {
    transform: translateY(-2px);
    box-shadow: 0 20px 40px rgba(7, 53, 79, 0.14);
}

.home-team-card--ok {
    border-color: rgba(var(--green-status-rgb), 0.75);
}

.home-team-card--warning {
    border-color: rgba(var(--amber-status-rgb), 0.85);
}

.home-team-card--alert {
    border-color: rgba(var(--red-status-rgb), 0.8);
}

.home-team-card--unknown {
    border-color: #d6dee8;
}

.home-team-card__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.home-team-card__actions {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.home-team-card__type {
    color: #5f7085;
    font-size: 1.15rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.home-team-card__rag {
    margin-right: 0;
    flex-shrink: 0;
}

.home-team-card__edit {
    align-items: center;
    appearance: none;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(7, 53, 79, 0.14);
    border-radius: 999px;
    color: var(--primary-color);
    cursor: pointer;
    display: inline-flex;
    height: 3rem;
    justify-content: center;
    padding: 0;
    width: 3rem;
}

.home-team-card__edit:hover,
.home-team-card__edit:focus-visible {
    background: rgba(7, 53, 79, 0.06);
    border-color: rgba(7, 53, 79, 0.28);
}

.home-team-card__edit svg {
    height: 1.4rem;
    width: 1.4rem;
}

.home-team-card__badge {
    align-items: center;
    display: inline-flex;
    flex-shrink: 0;
    height: 2.8rem;
    justify-content: center;
    width: 2.8rem;
}

.home-team-card__name {
    margin: 0;
    color: var(--primary-color);
    font-size: 2rem;
    line-height: 1.15;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.home-team-card__meta {
    margin: 0;
    color: #5f7085;
    font-size: 1.4rem;
    line-height: 1.45;
}

.home-team-card__cta {
    margin-top: auto;
    color: var(--secondary-color-link);
    font-size: 1.4rem;
    font-weight: 600;
}

.home-team-card--add {
    appearance: none;
    align-content: start;
    justify-items: stretch;
    border-color: rgba(7, 53, 79, 0.22);
    background:
        radial-gradient(circle at top right, rgba(146, 196, 79, 0.12), transparent 32%),
        linear-gradient(180deg, #ffffff 0%, #f4f8fb 100%);
    cursor: pointer;
    opacity: 0.76;
    text-align: left;
}

.home-team-card--add:hover,
.home-team-card--add:focus,
.home-team-card--add:focus-within {
    border-color: rgba(7, 53, 79, 0.42);
    opacity: 1;
}

.home-team-card__name--add {
    font-weight: 500;
}

.home-team-card__meta--add {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-team-card__badge--add {
    border-radius: 999px;
    background: rgba(7, 53, 79, 0.08);
    color: var(--primary-color);
    font-size: 2.3rem;
    font-weight: 400;
    line-height: 1;
}

.home-team-browser__empty {
    margin-top: 12px;
    padding: 20px;
    border: 1px dashed #d6dee8;
    border-radius: 18px;
    background: #fff;
    color: #5f7085;
}

@media screen and (max-width: 1599px) {
    .home-team-browser {
        --home-team-browser-card-width: 224px;
    }
}

@media screen and (max-width: 1199px) {
    .home-team-browser {
        --home-team-browser-card-width: 212px;
    }
}

@media screen and (max-width: 699px) {
    .home-team-browser__controls {
        align-items: stretch;
    }

    .home-team-browser__section-nav,
    .home-team-browser__tabs {
        width: 100%;
    }

    .home-team-browser__search-wrap {
        flex-basis: 100%;
        margin-left: 0;
        width: 100%;
    }

    .home-team-browser__grid {
        grid-template-columns: 1fr;
    }
}

.organisation-health-board {
    display: grid;
    gap: 28px;
    padding-bottom: 12px;
}

.organisation-health-board__intro,
.organisation-health-board__footnote {
    margin: 0;
    color: #5f7085;
    max-width: 70ch;
}

.organisation-health-board__footnote {
    font-size: 1.3rem;
}

.organisation-health-board__section {
    display: grid;
    gap: 16px;
}

.organisation-health-board__section-header h2 {
    margin: 6px 0 0;
    color: var(--primary-color);
    font-size: 2.2rem;
    font-weight: 400;
    line-height: 1.3;
}

.organisation-health-board__eyebrow {
    margin: 0;
    color: #5f7085;
    font-size: 1.15rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.organisation-health-board__grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    align-items: stretch;
}

.organisation-health-card {
    display: grid;
    gap: 18px;
    min-height: 220px;
    padding: 20px;
    border: 2px solid #d6dee8;
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(146, 196, 79, 0.12), transparent 28%),
        linear-gradient(180deg, #ffffff 0%, #f6fafc 100%);
    box-shadow: 0 18px 38px rgba(7, 53, 79, 0.08);
    color: var(--text-grey);
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.organisation-health-card:hover,
.organisation-health-card:focus {
    transform: translateY(-2px);
    box-shadow: 0 22px 44px rgba(7, 53, 79, 0.14);
}

.organisation-health-card--ok {
    border-color: rgba(var(--green-status-rgb), 0.75);
}

.organisation-health-card--warning {
    border-color: rgba(var(--amber-status-rgb), 0.9);
}

.organisation-health-card--alert {
    border-color: rgba(var(--red-status-rgb), 0.82);
}

.organisation-health-card--unknown {
    border-color: #d6dee8;
}

.organisation-health-card__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.organisation-health-card__tag {
    color: #5f7085;
    font-size: 1.15rem;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.organisation-health-card__count {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 600;
}

.organisation-health-card__body {
    display: grid;
    gap: 10px;
}

.organisation-health-card__body h3 {
    margin: 0;
    color: var(--primary-color);
    font-size: 2.2rem;
    font-weight: 400;
    line-height: 1.15;
}

.organisation-health-card__summary {
    margin: 0;
    color: #5f7085;
    font-size: 1.45rem;
    line-height: 1.5;
}

.organisation-health-card__signals {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.organisation-health-card__signal {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 10px;
    border-radius: 999px;
    background: #edf2f7;
    color: #44566c;
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.3;
}

.organisation-health-card__signal--alert {
    background: rgba(var(--red-status-rgb), 0.12);
    color: #9f2d2d;
}

.organisation-health-card__signal--warning {
    background: rgba(var(--amber-status-rgb), 0.16);
    color: #8d5d00;
}

.organisation-health-card__signal--neutral,
.organisation-health-card__signal--ok {
    background: rgba(7, 53, 79, 0.08);
    color: #44566c;
}

.organisation-health-card__cta {
    margin-top: auto;
    color: var(--secondary-color-link);
    font-size: 1.45rem;
    font-weight: 900;
}

.checklist-editor {
    display: grid;
    gap: 1.2rem;
    margin-bottom: 1.8rem;
    padding: 1.6rem;
    border: 1px solid #d8e2eb;
    border-radius: 1.2rem;
    background: #f7fafc;
}

.checklist-editor__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
}

.checklist-editor__meta {
    color: #5f7085;
    font-size: 1.3rem;
    font-weight: 600;
}

.checklist-editor__list {
    display: grid;
    gap: 0.9rem;
}

.checklist-editor__row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.9rem;
}

.checklist-editor__marker {
    width: 1.8rem;
    height: 1.8rem;
    border: 1px solid #c3d0dc;
    border-radius: 0.45rem;
    background: #fff;
}

.checklist-editor__checkbox {
    width: 1.8rem;
    height: 1.8rem;
    margin: 0;
}

.checklist-editor__input,
.checklist-editor__display {
    min-width: 0;
}

.checklist-editor__display {
    display: grid;
    gap: 0.2rem;
}

.checklist-editor__label {
    color: #1f3142;
    font-size: 1.45rem;
    line-height: 1.45;
}

.checklist-editor__label--completed {
    color: #6b7b8c;
    text-decoration: line-through;
}

.checklist-editor__note {
    color: #708193;
    font-size: 1.2rem;
    line-height: 1.4;
}

.checklist-editor__empty {
    margin: 0;
}

@media (max-width: 640px) {
    .checklist-editor__row {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .checklist-editor__row .btn {
        grid-column: 2;
        justify-self: start;
    }
}

/* Every other .ticket-export-menu holds one short phrase per row ("1 week",
   "Export PDF"), which is why default.css gives its items `white-space: nowrap`.
   The EDR suppression menu puts three lines in each row — the scope, what it
   means, and the criteria the rule would be built from — and those criteria can
   carry a captured command line. Unwrapped, the row ran off the side of the
   ticket drawer and the popup read as empty (#309502). */
.ticket-export-menu--stacked {
    width: 42rem;
    max-width: 80vw;
}

.ticket-export-menu--stacked .ticket-export-menu__item {
    white-space: normal;
    overflow-wrap: anywhere;
}

/* Undoes default.css's `right: 0`, which assumes the trigger sits at the right
   of its row — true of the Export PDF button in the tab header, false of both
   suppression buttons, which sit at the LEFT edge of the Alerts tab body. A
   right-anchored menu there opens leftwards, and since it is wider than its
   button and nothing on the way up clips it, it lands off the side of the
   ticket drawer: the rows are off-screen and all that shows is a blank white
   slab. That was #309502 on the EDR menu, and it returned on the SaaS menu when
   the alert actions moved out of the header row and into the tab. */
.ticket-export-menu--left {
    right: auto;
    left: 0;
}

/* The ticket-number "Copied" pill (workspace pane header + offcanvas header).
   Alpine's x-transition helpers write an inline `transform: scale(...)` for the
   whole transition — even with the .opacity modifier — and that inline value
   replaced default.css's positioning translate, so the pill first painted
   un-translated (low and to the right) and then snapped into place when the
   inline styles came off. The entrance is now a keyframe animation that keeps
   the translate in every frame, with a slight overshoot for a pop; the blades
   keep only a class-based leave (opacity, never transform) for the fade-out.
   It also now sits BELOW the number: the pane header hugs the top of the
   viewport, so the above-the-number position clipped (#309506 screenshot).
   Doubled-up class beats default.css's single-class rule. */
.ticket-workspace-ticket-copy .ticket-workspace-ticket-copy__toast {
    top: calc(100% + 0.5rem);
    transform: translate(-50%, 0);
    z-index: 10;
    animation: ticket-copy-toast-pop 0.18s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.ticket-workspace-ticket-copy .ticket-workspace-ticket-copy__toast.ticket-copy-toast-leave {
    transition: opacity 0.2s ease;
}

.ticket-workspace-ticket-copy .ticket-workspace-ticket-copy__toast.ticket-copy-toast-leave-end {
    opacity: 0;
}

@keyframes ticket-copy-toast-pop {
    from {
        opacity: 0;
        transform: translate(-50%, 0) scale(0.7);
    }

    to {
        opacity: 1;
        transform: translate(-50%, 0) scale(1);
    }
}

/* Ticket tab status spot ------------------------------------------------------
   The tab bar is the only place a MINIMISED ticket is visible, so a status move
   made anywhere else -- a customer reply flipping Pending back to Open while the
   agent is waiting on them -- had no way of reaching the agent at all. The spot
   carries the status colour and pulses until the tab is opened, which is what
   clears it.

   Colour is deliberately NOT declared here: the spot wears an existing tone
   utility (alert-bg / info-bg / success-bg / black-bg / unknown-bg), picked in
   the markup from TicketWorkspace::STATUS_TONE_CLASSES so it matches the dots
   in the Submit-as menu one for one. Shape and the pulse are all this needs. */
.ticket-workspace-tab__state {
    border-radius: 50%;
    flex: 0 0 auto;
    height: 1.1rem;
    width: 1.1rem;
}

.ticket-workspace-tab--attention .ticket-workspace-tab__state {
    animation: ticket-workspace-tab-attention 1.5s ease-in-out infinite;
}

@keyframes ticket-workspace-tab-attention {
    0%,
    100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.25;
        transform: scale(1);
    }
}

/* Motion IS the signal here, so an agent who has turned motion off must not be
   left with nothing -- they get a static ring on the tab instead. */
@media (prefers-reduced-motion: reduce) {
    .ticket-workspace-tab--attention .ticket-workspace-tab__state {
        animation: none;
    }

    .ticket-workspace-tab--attention {
        box-shadow: 0 0 0 2px var(--amber-status);
    }
}


/* Ticket status is now the same lettered .badge in all three places it shows:
   the ticket list's ID column, the workspace tab bar and the Submit-as menu.
   The bar and the menu used to show a bare coloured spot, which read as a RAG
   severity rather than a state (Adrian, 2026-08-12: "letter and red if you
   must, but defo not just red dot"). Colour and shape come from .badge and
   .badge-* in default.css; these rules only fit that badge into two layouts
   built around a 1.6rem dot. */
.ticket-workspace-tab__state {
    border: 0;
    /* .badge carries margin-left: auto for its table use, which in a flex tab
       shoves the badge to the far end. */
    margin-left: 0;
    height: auto;
    width: auto;
    /* The class name is inherited from the coloured dot this replaced, and
       that dot's rule (earlier in this file) is still styling it: without
       this the badge keeps `border-radius: 50%` over a 23x20 box and renders
       as an OVAL. Square it back to the .badge radius. */
    border-radius: .25rem;
    /* Match the ticket list exactly: `.id-td-wrap .badge` (default.css) drops
       the base 23px min-width to 20px, which against the padding+line-height
       height makes the badge square. Without this the tab and menu badges are
       three pixels wider than the same badge in the list. */
    min-width: 20px;
}

.dropdown-menu .dropdown-item .ticket-submit-option__badge {
    margin-left: 0;
    min-width: 20px;
}

/* The menu's first column was sized for the dot it no longer holds. */
.dropdown-menu .dropdown-item .ticket-submit-option {
    grid-template-columns: auto minmax(0, 1fr);
}

/* Unsaved work reads on the ticket number itself rather than as a second dot
   beside the status badge — two markers on one tab read as two statuses. */
.ticket-workspace-tab--dirty .ticket-workspace-tab__label {
    color: var(--amber-status);
    font-weight: 700;
}

/* Ticket list: Status icon column, split out of the ID cell so the badge, the
   machine-finding marker and the reply-ready pencil read as one signal cluster
   at the head of the row. Everything from the bulk checkbox to the presence eye
   is laid out on a single 8px rhythm, which means left-aligning the three cells
   rather than centring each one inside its own box — centred content in
   fixed-width cells puts a different gap either side of every mark.

   Widths below are that rhythm made explicit: 20px badge + 8 + 18px icon + 8 +
   18px icon = 72px, with the gap to the eye carried by the presence cell. */
.ticket-table--status-column .ticket-select-col {
    text-align: left !important;
    padding-right: 0 !important;
}

.ticket-table .ticket-status-col {
    width: 7.2rem;
    min-width: 7.2rem;
    max-width: 7.2rem;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: left !important;
    vertical-align: middle !important;
}

/* The badge carries `margin-left: auto` from default.css — harmless in a block
   cell, but in a flex row it shunts the whole cluster to the right-hand edge.
   `.id-td-wrap .badge` exists for exactly this reason; this mirrors it so the
   badge renders as it did when it lived in the ID cell. Never wraps: the badge
   is always present, so a second line would push row heights around as findings
   come and go. */
.ticket-status-icons {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    white-space: nowrap;
    gap: 8px;
}

.ticket-status-icons .badge {
    margin-left: 0;
    margin-right: 0;
    min-width: 20px;
}

/* `.ticket-table td:nth-child(3)` gave the ID column its 10px indent back when
   ID was third. Status made presence third and ID fourth, so the indent landed
   on the wrong cell — this moves it back and hands presence the 8px that keeps
   the eye in step with the icons before it. */
.ticket-table--status-column td:nth-child(3),
.ticket-table--status-column th:nth-child(3) {
    padding-left: 8px !important;
}

.ticket-table--status-column td:nth-child(4),
.ticket-table--status-column th:nth-child(4) {
    padding-left: 10px !important;
}

.ticket-table--status-column .ticket-presence-col {
    text-align: left !important;
}

.ticket-table--status-column .ticket-presence-col .ticket-presence,
.ticket-table--status-column .ticket-presence-col .eye-inactive {
    margin: 0;
}

/* vscomp renders its placeholder in the value slot, so "Status" would paint as
   selected text. Match what a browser paints for a real ::placeholder — 54% of
   the field's own colour — so it reads at the same weight as the search box. */
.ticket-table-wrap .table-filter-row .ticket-filter-select-col--status .vscomp-wrapper:not(.has-value) .vscomp-value {
    color: color-mix(in srgb, var(--text-grey) 54%, transparent);
}

/* Requested/Updated From-To range: one popover per column, not two fields wedged
   into half a column each. The bounds only behave as pickers at a sensible width,
   and the trigger reads back what is applied instead of clipping an ISO value.
   The trigger borrows .readonly-select for its field look; only the parts that
   differ from a real field are below. */
.ticket-table-wrap .table-filter-row .ticket-date-range-col {
    padding-left: 4px;
    padding-right: 4px;
}

.ticket-date-range {
    display: block;
    width: 100%;
}

/* Matches .vscomp-toggle-button exactly — 7px/10px padding around a 20px line,
   36px overall — so the trigger is the same height and inset as the selects
   either side of it rather than merely similar. */
.ticket-date-range-trigger {
    align-items: center;
    cursor: pointer;
    min-height: 3.6rem;
    padding: 7px 10px;
    text-align: left;
    width: 100%;
}

/* Unset, the trigger is a placeholder, so it carries the placeholder's weight —
   54% of the field colour, the same as the Status filter and the search box. */
.ticket-date-range-trigger:not(.is-set) .readonly-select__value {
    color: color-mix(in srgb, var(--text-grey) 54%, transparent);
}

/* Never set `display` on the base rule: `.popover` is display:none until the
   wrapper opens, and an unconditional `display: flex` here beat it on load
   order — leaving both panels permanently visible, and in normal flow until
   floating-ui first repositioned them, which is what made the filter row change
   height as you clicked between them. */
.ticket-date-range-menu {
    flex-direction: column;
    gap: 8px;
    min-width: 22rem;
    padding: 12px;
}

.popover-wrap.is-open .popover.ticket-date-range-menu {
    display: flex;
}

.ticket-date-range-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ticket-date-range-field__label {
    font-size: 1.3rem;
    color: var(--text-grey-mid);
}

.ticket-date-range-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

/* Updated was sized at 21.2rem when it also carried the draft and finding
   markers. Those moved to the Status column, so the column was left holding a
   blank band the width of two icons; the room goes back to Subject. */

@media screen and (min-width: 1380px) {
    .ticket-table-wrap .ticket-table--status-column .ticket-updated-col {
        width: 15rem;
        min-width: 15rem;
        max-width: 15rem;
    }
}

/* The SLA filter shares the row's select styling but not its 138px floor — the
   column is fixed-width, and a min-width on a spanning-free cell would fight it.
   The column itself gains a little room so "Breached" reads in full; it comes
   out of what the Updated column gave back. */
.ticket-table-wrap .table-filter-row .ticket-filter-select-col--sla {
    min-width: 0;
    padding-left: 4px;
    padding-right: 4px;
}


@media screen and (min-width: 1380px) {
    .ticket-table-wrap .ticket-table--status-column .ticket-sla-col {
        width: 9.6rem;
        min-width: 9.6rem;
        max-width: 9.6rem;
    }
}

/* "SLA" needs the room the toggle button spends on padding — 40px of it, against
   a column sized for a pill. The arrow wants ~20px on the right; the rest is
   free. */
.ticket-table-wrap .table-filter-row .ticket-filter-select-col--sla .vscomp-toggle-button {
    padding-left: 6px;
    padding-right: 22px;
}

/* The whole field opens the picker, the calendar icon included. Chrome opens the
   picker itself when the icon is hit, which raced the explicit showPicker() on
   the same click and left the icon looking dead; making the indicator
   transparent to hit-testing sends that click to the input like any other, so
   there is one path in and it behaves the same wherever you click. Firefox has
   no such pseudo-element and ignores this. */
.ticket-date-range-field input[type="datetime-local"] {
    cursor: pointer;
}

.ticket-date-range-field input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    pointer-events: none;
}

/* Room between the row's icon cluster and the ticket ID (Shaun, 2026-08-26). */
.ticket-table .ticket-presence-col {
    width: 55px;
    min-width: 55px;
}

/* The third identity banner tone. custom2.css already stacks the label above the
   text for the full-width --note and --warning banners; --alert is the same
   family and has to match, or the red banner is the only one whose label sits
   inline. Colour comes from .alert-bg-tint / .alert-border, so this is layout
   only. */
.form-group-note--alert:not(.form-group-note--card):not(.form-group-note--compact) {
    border: 1px solid transparent;
    border-radius: 1.2rem;
    padding: 1.2rem 1.4rem;
}

.form-group-note--alert:not(.form-group-note--card):not(.form-group-note--compact).d-flex {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.6rem;
}

.form-group-note--alert:not(.form-group-note--card):not(.form-group-note--compact) p {
    flex: 1 1 auto;
    min-width: 0;
}
