/* Help Desk (HelpDesk.Web): ticket threads, the dashboard's queue tiles and desk labels. */

.ticket-thread { display: flex; flex-direction: column; gap: .75rem; }

.ticket-entry {
    border: 1px solid var(--bs-border-color);
    border-left-width: 4px;
    border-radius: .5rem;
    padding: .75rem;
    background: var(--bs-body-bg);
}

.ticket-entry header { display: flex; gap: .5rem; align-items: baseline; margin-bottom: .4rem; flex-wrap: wrap; }
.ticket-entry footer { margin-top: .5rem; }
.ticket-entry .msg-body { white-space: pre-wrap; word-break: break-word; }
.ticket-entry.response { border-left-color: var(--bs-primary); }
.ticket-entry.note { border-left-color: var(--bs-warning); background: var(--bs-warning-bg-subtle); }
.ticket-entry.message { border-left-color: var(--bs-secondary); }

.hd-desk { font-size: .72rem; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; border-radius: 1rem; padding: .1rem .55rem; white-space: nowrap; }
.hd-desk.platform { background: #fde2e2; color: #a61e1e; }
.hd-desk.agency { background: var(--bs-primary-bg-subtle); color: var(--bs-primary-text-emphasis); }

.hd-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .75rem; }

.hd-tile {
    display: block;
    border: 1px solid var(--bs-border-color);
    border-radius: .6rem;
    padding: .75rem .9rem;
    background: var(--bs-body-bg);
    color: inherit;
    text-decoration: none;
    transition: border-color .15s, box-shadow .15s;
}

.hd-tile:hover { border-color: var(--bs-primary); box-shadow: 0 .15rem .5rem rgba(0, 0, 0, .06); }
.hd-tile .hd-count { font-size: 1.6rem; font-weight: 700; line-height: 1.1; }
.hd-tile .hd-label { font-size: .85rem; color: var(--bs-secondary-color); }
.hd-tile.warn .hd-count { color: var(--bs-danger); }

.hd-section-title { font-size: 1rem; font-weight: 600; margin: 1.25rem 0 .6rem; display: flex; align-items: center; gap: .5rem; }