:root {
    --thread-ink: #0b1b33;
    --thread-ink-soft: #152945;
    --thread-primary: #356fca;
    --thread-primary-hover: #285fae;
    --thread-primary-soft: #eaf2fd;
    --thread-cyan: #42bdd4;
    --thread-body: #f4f7fb;
    --thread-card: #ffffff;
    --thread-muted: #6f7f94;
    --thread-border: #dce4ee;
    --thread-border-strong: #c9d5e3;
    --thread-shadow: 0 12px 36px rgba(20, 42, 73, .08);
    --thread-shadow-lg: 0 22px 65px rgba(10, 31, 61, .14);
    --thread-radius: 16px;
    --bs-primary: #356fca;
    --bs-primary-rgb: 53, 111, 202;
    --bs-link-color: #356fca;
    --bs-link-hover-color: #285fae;
}

html,
body {
    color: var(--thread-ink);
    background: var(--thread-body);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body {
    font-size: 14px;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    color: var(--thread-ink);
    letter-spacing: -.025em;
}

a {
    color: var(--thread-primary);
}

.thread-modal-links-pending .show-modal-link {
    pointer-events: none !important;
    opacity: .55 !important;
    filter: grayscale(.35);
}

.text-primary {
    color: var(--thread-primary) !important;
}

.text-muted {
    color: var(--thread-muted) !important;
}

.bg-primary,
.btn-primary {
    background-color: var(--thread-primary) !important;
    border-color: var(--thread-primary) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: var(--thread-primary-hover) !important;
    border-color: var(--thread-primary-hover) !important;
}

.btn {
    border-radius: 10px;
    font-weight: 600;
    box-shadow: none;
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease;
}

.btn:hover {
    transform: translateY(-1px);
}

.btn-primary {
    box-shadow: 0 9px 22px rgba(53, 111, 202, .2);
}

.btn-secondary {
    color: var(--thread-ink) !important;
    background: #e7edf5 !important;
    border-color: #e7edf5 !important;
}

.btn-outline-primary {
    color: var(--thread-primary);
    border-color: #9db9de;
}

.btn-outline-primary:hover {
    color: #fff;
    background: var(--thread-primary);
    border-color: var(--thread-primary);
}

.form-check-input:checked,
.form-check-input[type="checkbox"]:indeterminate {
    background-color: var(--thread-primary) !important;
    border-color: var(--thread-primary) !important;
}

.page-item.active .page-link,
.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--thread-primary);
    border-color: var(--thread-primary);
}

.pagination .page-link {
    color: var(--thread-primary);
}

.card {
    border: 1px solid var(--thread-border);
    border-radius: var(--thread-radius);
    box-shadow: 0 3px 14px rgba(19, 43, 75, .04);
}

.card-header {
    border-color: var(--thread-border);
}

.form-control,
.form-select,
.input-group-text,
.select2-container--bootstrap-5 .select2-selection {
    border-color: var(--thread-border-strong) !important;
    border-radius: 10px;
}

textarea.form-control {
    min-height: 120px;
    resize: vertical;
}

.form-control:focus:not(.is-invalid),
.form-select:focus:not(.is-invalid),
.form-floating > .form-control:focus:not(.is-invalid),
.form-floating > .form-select:focus:not(.is-invalid),
.input-group .form-control:focus:not(.is-invalid),
.input-group .form-select:focus:not(.is-invalid),
.select2-container--bootstrap-5.select2-container--focus .select2-selection {
    border-color: var(--thread-border-strong) !important;
    border-width: 1px !important;
    outline: 0;
    box-shadow: none !important;
}

.form-control:focus:not(.is-invalid) {
    padding: calc(.5rem - 1px) calc(.875rem - 1px);
    background-color: #f6f8fa;
}

.form-control.form-control-sm:focus:not(.is-invalid) {
    padding: calc(.375rem - 1px) calc(.625rem - 1px);
}

.form-control.form-control-lg:focus:not(.is-invalid) {
    padding: calc(.61rem - 1px) calc(1.25rem - 1px);
}

.form-select:focus:not(.is-invalid) {
    background-color: #f6f8fa;
}

html:not([dir="rtl"]) .form-select:focus:not(.is-invalid),
html:not([dir="rtl"]) .form-select.is-valid,
html:not([dir="rtl"]) .was-validated .form-select:valid {
    padding: calc(.5rem - 1px) calc(1.96875rem - 1px) calc(.5rem - 1px) calc(.875rem - 1px) !important;
}

[dir="rtl"] .form-select:focus:not(.is-invalid),
[dir="rtl"] .form-select.is-valid,
[dir="rtl"] .was-validated .form-select:valid {
    padding: calc(.5rem - 1px) calc(.875rem - 1px) calc(.5rem - 1px) calc(1.96875rem - 1px) !important;
}

html:not([dir="rtl"]) .form-select.form-select-sm:focus:not(.is-invalid),
html:not([dir="rtl"]) .form-select.form-select-sm.is-valid,
html:not([dir="rtl"]) .was-validated .form-select.form-select-sm:valid {
    padding: calc(.375rem - 1px) calc(1.40625rem - 1px) calc(.375rem - 1px) calc(.625rem - 1px) !important;
}

[dir="rtl"] .form-select.form-select-sm:focus:not(.is-invalid),
[dir="rtl"] .form-select.form-select-sm.is-valid,
[dir="rtl"] .was-validated .form-select.form-select-sm:valid {
    padding: calc(.375rem - 1px) calc(.625rem - 1px) calc(.375rem - 1px) calc(1.40625rem - 1px) !important;
}

html:not([dir="rtl"]) .form-select.form-select-lg:focus:not(.is-invalid),
html:not([dir="rtl"]) .form-select.form-select-lg.is-valid,
html:not([dir="rtl"]) .was-validated .form-select.form-select-lg:valid {
    padding: calc(.61rem - 1px) calc(2.8125rem - 1px) calc(.61rem - 1px) calc(1.25rem - 1px) !important;
}

[dir="rtl"] .form-select.form-select-lg:focus:not(.is-invalid),
[dir="rtl"] .form-select.form-select-lg.is-valid,
[dir="rtl"] .was-validated .form-select.form-select-lg:valid {
    padding: calc(.61rem - 1px) calc(1.25rem - 1px) calc(.61rem - 1px) calc(2.8125rem - 1px) !important;
}

.form-control.is-valid,
.was-validated .form-control:valid {
    background-image: none !important;
    border-color: var(--thread-border-strong) !important;
    border-width: 1px !important;
}

.form-select.is-valid,
.was-validated .form-select:valid {
    border-color: var(--thread-border-strong) !important;
    border-width: 1px !important;
}

.form-floating > .form-control.is-valid ~ label,
.form-floating > .form-select.is-valid ~ label,
.form-floating > .form-control.is-valid:focus ~ label,
.form-floating > .form-select.is-valid:focus ~ label,
.was-validated .form-floating > .form-control:valid ~ label,
.was-validated .form-floating > .form-select:valid ~ label,
.was-validated .form-floating > .form-control:valid:focus ~ label,
.was-validated .form-floating > .form-select:valid:focus ~ label {
    color: var(--thread-muted) !important;
}

.input-group:has(.form-control.is-valid) .input-group-text,
.was-validated .input-group:has(.form-control:valid) .input-group-text {
    border-color: var(--thread-border-strong) !important;
    border-width: 1px !important;
}

.form-check-input.is-valid,
.was-validated .form-check-input:valid {
    border-color: var(--thread-border-strong) !important;
}

.form-check-input.is-valid ~ .form-check-label,
.was-validated .form-check-input:valid ~ .form-check-label {
    color: inherit !important;
}

.table {
    --bs-table-border-color: var(--thread-border);
    color: var(--thread-ink-soft);
}

.table > :not(caption) > * > * {
    padding-top: .85rem;
    padding-bottom: .85rem;
}

.table thead th {
    color: #52647a;
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .045em;
    text-transform: uppercase;
    background: #f7f9fc;
}

.badge {
    border-radius: 999px;
}

.nav-tabs {
    gap: 4px;
    border-bottom-color: var(--thread-border);
}

.nav-tabs .nav-link {
    border: 0;
    border-radius: 9px 9px 0 0;
    color: var(--thread-muted);
}

.nav-tabs .nav-link.active {
    color: var(--thread-primary);
    background: var(--thread-primary-soft);
}

.thread-survey-tabs {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
}

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

.thread-survey-tabs .nav-link {
    display: flex;
    gap: .45rem;
    align-items: center;
    white-space: nowrap;
}

/* Survey builder */
.survey-builder-create {
    max-width: 820px;
}

.thread-course-score-hint {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin: -.25rem 0 1.25rem;
    padding: 12px 14px;
    color: #526d82;
    font-size: .82rem;
    line-height: 1.5;
    background: #edf5f8;
    border: 1px solid #d7e7ed;
    border-radius: 12px;
}

.thread-course-score-hint > i {
    flex: 0 0 auto;
    margin-top: 1px;
    color: var(--thread-primary);
    font-size: 1.15rem;
}

.thread-course-score-hint strong,
.thread-course-score-hint span {
    display: block;
}

.thread-course-score-hint strong {
    margin-bottom: 2px;
    color: #36566c;
    font-size: .84rem;
}

.survey-builder-step-number {
    display: grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    color: var(--thread-primary);
    font-size: 1rem;
    font-weight: 800;
    place-items: center;
    background: var(--thread-primary-soft);
    border: 1px solid #c9daf2;
    border-radius: 12px;
}

.survey-builder-toolbar,
.survey-builder-tree,
.survey-builder-editor {
    overflow: hidden;
    border-color: var(--thread-border);
    box-shadow: 0 8px 24px rgba(20, 42, 73, .05);
}

.survey-builder-stat {
    display: flex;
    gap: .45rem;
    align-items: baseline;
}

.survey-builder-stat-value {
    color: var(--thread-ink);
    font-size: 1.25rem;
    font-weight: 800;
}

.survey-builder-readiness {
    display: inline-flex;
    gap: .45rem;
    align-items: center;
    padding: .4rem .7rem;
    font-size: .82rem;
    font-weight: 700;
    border-radius: 999px;
}

.survey-builder-readiness.is-complete {
    color: #19704a;
    background: #e6f6ee;
}

.survey-builder-readiness.is-incomplete {
    color: #9a6510;
    background: #fff5dd;
}

.survey-builder-tree {
    position: sticky;
    top: 80px;
    max-height: calc(100vh - 105px);
}

.survey-builder-tree > .card-body {
    overflow-y: auto;
}

.survey-tree-node-wrap {
    position: relative;
    display: flex;
    gap: .25rem;
    align-items: center;
}

.survey-tree-node {
    display: flex;
    flex: 1 1 auto;
    gap: .65rem;
    align-items: center;
    min-width: 0;
    padding: .65rem .7rem;
    color: var(--thread-ink);
    text-align: left;
    text-decoration: none;
    background: transparent;
    border: 0;
    border-radius: 10px;
    transition: background-color .16s ease, color .16s ease;
}

.survey-tree-node:hover,
.survey-tree-node.active {
    color: var(--thread-primary);
    background: var(--thread-primary-soft);
}

.survey-tree-node:disabled {
    color: var(--thread-ink);
    cursor: default;
    opacity: .75;
}

.survey-tree-icon {
    display: inline-grid;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    color: var(--thread-primary);
    font-size: 1rem;
    place-items: center;
    background: var(--thread-primary-soft);
    border-radius: 8px;
}

.survey-tree-label {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
}

.survey-tree-label strong {
    overflow: hidden;
    font-size: .86rem;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.survey-tree-label small {
    overflow: hidden;
    color: var(--thread-muted);
    font-size: .72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.survey-tree-actions {
    display: flex;
    flex: 0 0 auto;
    gap: .2rem;
    padding-right: .35rem;
    opacity: 0;
    transition: opacity .16s ease;
}

.survey-tree-node-wrap:hover > .survey-tree-actions,
.survey-tree-actions:focus-within {
    opacity: 1;
}

.survey-tree-branch {
    position: relative;
    margin-top: .2rem;
}

.survey-tree-children {
    position: relative;
    margin-left: 1.35rem;
    padding-left: .7rem;
    border-left: 1px solid var(--thread-border);
}

.survey-tree-question {
    padding-top: .5rem;
    padding-bottom: .5rem;
}

.survey-tree-question .survey-tree-icon {
    color: #59728f;
    background: #eef2f7;
}

.survey-question-drag-handle {
    color: #6a8298;
    cursor: grab;
}

.survey-question-drag-handle:active {
    cursor: grabbing;
}

.survey-tree-children.is-sorting .survey-tree-question-wrap {
    transition: transform .12s ease, opacity .12s ease;
}

.survey-tree-question-wrap.is-dragging {
    opacity: .45;
}

.survey-tree-children.is-saving {
    pointer-events: none;
    opacity: .7;
}

#survey-question-sort-status {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 1080;
    padding: .7rem 1rem;
    color: #176246;
    font-size: .82rem;
    font-weight: 700;
    background: #e7f7f0;
    border: 1px solid #bce8d5;
    border-radius: 10px;
    box-shadow: 0 10px 28px rgba(20, 42, 73, .14);
    opacity: 0;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity .16s ease, transform .16s ease;
}

#survey-question-sort-status.is-visible {
    opacity: 1;
    transform: translateY(0);
}

#survey-question-sort-status.is-error {
    color: #8b3434;
    background: #fff0f0;
    border-color: #f0c8c8;
}

.survey-tree-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: .75rem .4rem;
    padding: 1.5rem 1rem;
    color: var(--thread-muted);
    text-align: center;
    background: #f8fafc;
    border: 1px dashed var(--thread-border-strong);
    border-radius: 12px;
}

.survey-tree-empty > i {
    margin-bottom: .35rem;
    font-size: 1.65rem;
}

.survey-builder-editor > .card-header,
.survey-builder-tree > .card-header {
    min-height: 68px;
    background: #fbfcfe;
    border-bottom-color: var(--thread-border);
}

.survey-builder-editor-body {
    padding: 1.35rem;
}

.survey-builder-loading {
    display: flex;
    gap: .7rem;
    align-items: center;
    justify-content: center;
    min-height: 360px;
    color: var(--thread-muted);
}

.survey-builder-preview-panel {
    max-width: 900px;
}

.survey-builder-question-text {
    padding: 1rem 1.1rem;
    color: var(--thread-ink);
    font-size: 1rem;
    font-weight: 650;
    line-height: 1.6;
    background: #f7f9fc;
    border: 1px solid var(--thread-border);
    border-radius: 12px;
}

.survey-builder-preview-section {
    margin-bottom: 1.25rem;
}

.survey-builder-preview-label {
    margin-bottom: .35rem;
    color: var(--thread-muted);
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.survey-builder-preview-text {
    min-height: 44px;
    padding: .8rem .9rem;
    line-height: 1.55;
    background: #f7f9fc;
    border-radius: 10px;
}

.survey-builder-answer-list {
    padding-left: 1.5rem;
}

.survey-builder-answer-list li {
    margin-bottom: .5rem;
    padding-left: .2rem;
}

/* Internal application shell */
.thread-app .layout-wrapper,
.thread-app .layout-container {
    min-height: 100vh;
    width: 100%;
}

.thread-app .layout-container {
    display: block !important;
}

.thread-app .layout-page {
    width: 100%;
    min-height: calc(100vh - 60px);
    padding: 0 !important;
}

.thread-topbar {
    position: sticky;
    top: 0;
    z-index: 1030;
    width: 100%;
    min-height: 60px;
    padding: 0 10px;
    color: #e7eef8;
    background: rgba(10, 27, 51, .97) !important;
    border-bottom: 1px solid rgba(255, 255, 255, .09);
    box-shadow: 0 12px 30px rgba(7, 22, 43, .13);
    backdrop-filter: blur(16px);
}

.thread-topbar .container-xxl {
    min-height: 72px;
}

.thread-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff !important;
    font-size: 1.28rem;
    font-weight: 750;
    letter-spacing: -.035em;
    white-space: nowrap;
}

.thread-brand:hover {
    color: #fff;
}

.thread-brand img {
    width: 34px;
    height: 34px;
    object-fit: contain;
}

.thread-brand-badge {
    padding: 3px 7px;
    color: #a9c7f5;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    background: rgba(53, 111, 202, .2);
    border: 1px solid rgba(103, 154, 232, .25);
    border-radius: 6px;
}

.thread-topbar .navbar-toggler {
    padding: .45rem;
    color: #fff;
    border: 1px solid rgba(255,255,255,.18);
}

.thread-topbar .navbar-nav {
    gap: 3px;
}

.thread-topbar .nav-link {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: .6rem .72rem !important;
    color: #b9c5d5 !important;
    font-size: .88rem;
    font-weight: 500;
    border-radius: 9px;
}

.thread-topbar .nav-link:hover,
.thread-topbar .nav-link.active,
.thread-topbar .nav-item.show > .nav-link {
    color: #fff !important;
    background: rgba(255, 255, 255, .08);
}

.thread-topbar .nav-link i {
    color: #80a9e2;
    font-size: 1.1rem;
}

.thread-topbar .dropdown-menu {
    min-width: 230px;
    margin-top: 10px !important;
    padding: 7px;
    background: #fff;
    border: 1px solid var(--thread-border);
    border-radius: 13px;
    box-shadow: var(--thread-shadow-lg);
}

.thread-topbar .dropdown-item {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: .62rem .72rem;
    color: var(--thread-ink-soft);
    font-size: .87rem;
    border-radius: 8px;
}

.thread-topbar .dropdown-item:hover,
.thread-topbar .dropdown-item.active {
    color: var(--thread-primary);
    background: var(--thread-primary-soft);
}

.thread-topbar .dropdown-item i {
    color: #7c91aa;
    font-size: 1.05rem;
}

.thread-user-avatar {
    display: inline-flex;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    border: 2px solid rgba(255,255,255,.25);
    border-radius: 50%;
}

.thread-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    color: #245c65;
    font-size: .75rem;
    font-weight: 760;
    line-height: 1;
    letter-spacing: .025em;
    text-transform: uppercase;
    user-select: none;
    background: linear-gradient(145deg, #e7f3f3, #d6e7eb);
    border: 1px solid #c9dfe2;
    border-radius: 50%;
}

.thread-topbar .thread-user-avatar {
    color: #dff6f4;
    background: rgba(44, 151, 145, .24);
    border-color: rgba(119, 211, 201, .34);
}

.thread-avatar--fill {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.thread-company-link {
    max-width: 220px;
}

.thread-company-link span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-content {
    min-height: calc(100vh - 60px);
    background:
        radial-gradient(circle at 100% 0, rgba(75, 143, 222, .07), transparent 28rem),
        var(--thread-body);
}

.thread-content > .container-xxl,
.thread-content > .container-fluid {
    padding-top: 28px !important;
    padding-bottom: 36px !important;
}

.thread-page-title {
    margin-bottom: 22px;
    color: var(--thread-ink);
    font-size: 1.45rem;
    font-weight: 700;
}

.thread-page-title .text-muted {
    font-weight: 450 !important;
}

.thread-footer {
    color: #8290a2;
    background: var(--thread-body) !important;
    border-top: 1px solid var(--thread-border);
}

/* Modals and confirmations */
.modal-content,
.jconfirm .jconfirm-box {
    overflow: hidden;
    border: 1px solid var(--thread-border) !important;
    border-radius: 18px !important;
    box-shadow: var(--thread-shadow-lg) !important;
}

.modal-header {
    min-height: 64px;
    padding: 1.1rem 1.35rem;
    background: #f8fafc;
    border-bottom: 1px solid var(--thread-border);
}

.modal-content .modal-header .modal-title,
.jconfirm .jconfirm-title {
    color: var(--thread-ink);
    font-size: 1.05rem !important;
    font-weight: 700 !important;
}

.modal-body {
    padding: 1.35rem;
}

.modal-footer {
    padding: .9rem 1.35rem 1.2rem;
    border-top-color: var(--thread-border);
}

.modal-backdrop.show {
    opacity: .42;
}

.jconfirm .jconfirm-bg {
    background: #07172b !important;
    opacity: .46 !important;
}

.jconfirm .jconfirm-buttons button {
    border-radius: 9px !important;
    font-weight: 600 !important;
    text-transform: none !important;
}

.notification-message {
    border-radius: 12px;
    box-shadow: var(--thread-shadow-lg);
}

/* Auth and survey pages */
.thread-auth {
    position: relative;
    min-height: 100vh;
    overflow-x: hidden;
    background:
        radial-gradient(circle at 8% 18%, rgba(83, 145, 141, .3), transparent 30rem),
        radial-gradient(circle at 90% 10%, rgba(118, 96, 137, .2), transparent 26rem),
        radial-gradient(circle at 72% 92%, rgba(78, 135, 133, .22), transparent 30rem),
        linear-gradient(145deg, #17282b 0%, #203437 52%, #29353d 100%);
}

.thread-auth::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    opacity: .72;
    background-image: url("data:image/svg+xml,%3Csvg width='1440' height='720' viewBox='0 0 1440 720' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke-linecap='round'%3E%3Cpath d='M-80 540 C 170 350, 330 680, 590 480 S 1010 260, 1510 410' stroke='%2390c5c1' stroke-opacity='.16' stroke-width='2'/%3E%3Cpath d='M-120 590 C 210 380, 370 720, 650 500 S 1080 300, 1530 470' stroke='%23c0a6cd' stroke-opacity='.12' stroke-width='1.5'/%3E%3Cpath d='M160 -60 C 310 150, 120 260, 360 360 S 760 390, 820 760' stroke='%23ffffff' stroke-opacity='.07' stroke-width='1.5'/%3E%3C/g%3E%3C/svg%3E");
    background-position: center;
    background-size: cover;
    pointer-events: none;
}

.thread-auth::after {
    content: "";
    position: fixed;
    right: -12%;
    bottom: -55%;
    z-index: 0;
    width: 620px;
    height: 620px;
    background: rgba(91, 159, 156, .18);
    filter: blur(100px);
    border-radius: 50%;
    pointer-events: none;
}

.thread-survey {
    min-height: 100vh;
    background:
        linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px),
        radial-gradient(circle at 12% 18%, rgba(53, 111, 202, .35), transparent 26rem),
        var(--thread-ink);
    background-size: 56px 56px, 56px 56px, auto, auto;
}

.thread-auth .authentication-wrapper,
.thread-survey .authentication-wrapper {
    min-height: 100vh;
}

.thread-auth .authentication-wrapper {
    position: relative;
    z-index: 1;
}

.thread-auth .authentication-inner,
.thread-survey .authentication-inner {
    z-index: 1;
}

.thread-auth .authentication-inner {
    width: min(100%, 470px) !important;
    max-width: 470px;
}

.thread-survey .authentication-inner {
    width: min(100%, 720px) !important;
    max-width: 720px;
}

.thread-auth .card,
.thread-survey .card {
    padding: 10px !important;
    background: rgba(255,255,255,.985);
    border: 1px solid rgba(255,255,255,.35);
    border-radius: 22px;
    box-shadow: 0 28px 90px rgba(1, 12, 29, .32);
}

.thread-auth .app-brand {
    margin-top: 1.7rem !important;
}

.thread-auth .app-brand-logo {
    display: flex;
    align-items: center;
    gap: 10px;
}

.thread-auth .app-brand-logo img {
    width: 58px;
    height: 58px;
    object-fit: contain;
}

.thread-auth .app-brand-logo::after {
    content: "Thread";
    color: var(--thread-ink);
    font-size: 1.5rem;
    font-weight: 750;
    letter-spacing: -.04em;
}

.thread-auth .card-body,
.thread-survey .card-body {
    padding: 1.5rem 1.7rem 1.8rem;
}

.thread-auth h4,
.thread-survey h4,
.thread-survey h5 {
    font-weight: 700;
}

.thread-auth .authentication-image,
.thread-survey .authentication-image {
    display: none !important;
}

.thread-survey .authentication-inner::before {
    content: "Thread";
    display: block;
    margin: 0 0 14px 8px;
    color: #fff;
    font-size: 1.15rem;
    font-weight: 750;
    letter-spacing: -.03em;
}

.thread-survey .custom-option {
    border-color: var(--thread-border-strong);
    border-radius: 12px;
    transition: border-color .18s ease, background-color .18s ease, transform .18s ease;
}

.thread-survey .custom-option:hover {
    transform: translateY(-1px);
    background: var(--thread-primary-soft);
    border-color: #9bb8df;
}

.thread-survey .custom-option.checked {
    background: var(--thread-primary-soft);
    border-color: var(--thread-primary);
}

.thread-error {
    min-height: 100vh;
    color: #ecf7f6;
    background: #122d36;
}

.thread-error-canvas {
    position: fixed;
    inset: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 78% 35%, rgba(55, 154, 146, .2), transparent 28rem),
        radial-gradient(circle at 8% 85%, rgba(84, 121, 156, .16), transparent 24rem),
        linear-gradient(135deg, #102832, #173840 58%, #102b34);
    pointer-events: none;
}

.thread-error-canvas::before {
    position: absolute;
    inset: 0;
    content: '';
    opacity: .32;
    background-image:
        linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
    background-size: 52px 52px;
    mask-image: linear-gradient(120deg, transparent 5%, #000 55%, transparent 100%);
}

.thread-error-header,
.thread-error-main,
.thread-error-footer {
    position: relative;
    z-index: 1;
    width: min(1120px, calc(100% - 48px));
    margin-right: auto;
    margin-left: auto;
}

.thread-error-header {
    display: flex;
    min-height: 76px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(221, 244, 241, .1);
}

.thread-error-brand {
    display: inline-flex;
    gap: 9px;
    align-items: center;
    color: #fff;
}

.thread-error-brand:hover { color: #fff; }
.thread-error-brand img { width: 33px; height: 33px; object-fit: contain; }
.thread-error-brand strong { font-size: 1rem; font-weight: 800; letter-spacing: -.04em; }
.thread-error-header > span { display: inline-flex; gap: 7px; align-items: center; color: rgba(225, 242, 240, .58); font-size: .61rem; font-weight: 650; }
.thread-error-header > span i { color: #71c4bc; font-size: .9rem; }

.thread-error-main {
    display: grid;
    min-height: calc(100vh - 130px);
    place-items: center;
    padding: 50px 0 64px;
}

.thread-error-panel {
    display: grid;
    width: 100%;
    min-height: 520px;
    grid-template-columns: minmax(0, 1.1fr) minmax(330px, .9fr);
    overflow: hidden;
    background: #fdfdf9;
    border: 1px solid rgba(255,255,255,.3);
    border-radius: 30px;
    box-shadow: 0 35px 100px rgba(0, 12, 18, .35);
}

.thread-error-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 58px 62px;
}

.thread-error-code {
    margin-bottom: 24px;
    color: #258b84;
    font-size: 4.6rem;
    font-weight: 850;
    line-height: .82;
    letter-spacing: -.08em;
}

.thread-error-eyebrow {
    display: block;
    margin-bottom: 10px;
    color: #2b8e87;
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.thread-error-copy h1 {
    max-width: 520px;
    margin: 0 0 13px;
    color: #1a323c;
    font-size: 2rem;
    line-height: 1.14;
    letter-spacing: -.045em;
}

.thread-error-copy > p {
    max-width: 530px;
    margin: 0;
    color: #697c83;
    font-size: .72rem;
    line-height: 1.7;
}

.thread-error-actions { display: flex; gap: 10px; align-items: center; margin-top: 30px; }
.btn.thread-error-primary { display: inline-flex; min-height: 45px; gap: 22px; align-items: center; padding: 10px 11px 10px 18px; color: #fff; font-size: .68rem; font-weight: 750; line-height: 1; background: #237b76; border: 0; border-radius: 11px; box-shadow: 0 10px 24px rgba(35,123,118,.2); }
.btn.thread-error-primary > span { display: flex; height: 25px; align-items: center; }
.thread-error-primary i { display: grid; width: 25px; height: 25px; place-items: center; background: rgba(255,255,255,.13); border-radius: 7px; }
.thread-error-primary:hover { color: #fff; background: #1c6864; transform: translateY(-1px); }
.thread-error-secondary { display: inline-flex; min-height: 43px; gap: 6px; align-items: center; padding: 9px 12px; color: #61777e; font-size: .63rem; font-weight: 680; background: transparent; border: 0; border-radius: 9px; }
.thread-error-secondary:hover { color: #237b76; background: #edf5f3; }

.thread-error-details { max-width: 100%; margin-top: 20px; color: #6f8086; font-size: .58rem; }
.thread-error-details summary { color: #657b82; font-weight: 700; cursor: pointer; }
.thread-error-details div { max-height: 110px; margin-top: 8px; padding: 10px; overflow: auto; overflow-wrap: anywhere; background: #f1f4f3; border-radius: 8px; }

.thread-error-visual {
    position: relative;
    min-height: 520px;
    overflow: hidden;
    background: linear-gradient(145deg, #e7f3f1, #dcecea);
}

.thread-error-visual::before {
    position: absolute;
    inset: 0;
    content: '';
    opacity: .45;
    background-image: radial-gradient(#3a8c86 .8px, transparent .8px);
    background-size: 19px 19px;
    mask-image: radial-gradient(circle, #000, transparent 68%);
}

.thread-error-orbit { position: absolute; top: 50%; left: 50%; border: 1px solid rgba(38,125,119,.22); border-radius: 50%; transform: translate(-50%,-50%) rotate(-15deg); }
.thread-error-orbit.orbit-one { width: 330px; height: 170px; }
.thread-error-orbit.orbit-two { width: 245px; height: 245px; border-color: rgba(38,125,119,.15); }
.thread-error-orbit.orbit-three { width: 150px; height: 310px; border-color: rgba(38,125,119,.12); transform: translate(-50%,-50%) rotate(42deg); }
.thread-error-symbol { position: absolute; top: 50%; left: 50%; display: grid; width: 96px; height: 96px; place-items: center; color: #fff; font-size: 2.5rem; background: linear-gradient(145deg,#2b9189,#226e6a); border: 8px solid rgba(255,255,255,.7); border-radius: 30px; box-shadow: 0 20px 45px rgba(27,104,99,.28); transform: translate(-50%,-50%) rotate(3deg); }
.thread-error-node { position: absolute; width: 13px; height: 13px; background: #62b7af; border: 4px solid rgba(255,255,255,.85); border-radius: 50%; box-shadow: 0 5px 15px rgba(28,97,92,.2); }
.thread-error-node.node-one { top: 34%; left: 18%; }
.thread-error-node.node-two { top: 25%; right: 20%; width: 17px; height: 17px; }
.thread-error-node.node-three { right: 23%; bottom: 28%; }

.thread-error-footer { display: flex; min-height: 54px; align-items: center; justify-content: space-between; color: rgba(220,239,237,.42); font-size: .54rem; border-top: 1px solid rgba(221,244,241,.08); }

@media (max-width: 767.98px) {
    .thread-error-header,
    .thread-error-main,
    .thread-error-footer { width: min(100% - 28px, 560px); }
    .thread-error-header { min-height: 66px; }
    .thread-error-header > span span { display: none; }
    .thread-error-main { min-height: calc(100vh - 120px); padding: 24px 0 34px; }
    .thread-error-panel { min-height: 0; grid-template-columns: 1fr; border-radius: 23px; }
    .thread-error-copy { padding: 37px 25px 34px; }
    .thread-error-code { margin-bottom: 20px; font-size: 3.7rem; }
    .thread-error-copy h1 { font-size: 1.5rem; }
    .thread-error-visual { min-height: 220px; grid-row: 1; }
    .thread-error-orbit.orbit-one { width: 260px; height: 120px; }
    .thread-error-orbit.orbit-two { width: 180px; height: 180px; }
    .thread-error-orbit.orbit-three { width: 100px; height: 220px; }
    .thread-error-symbol { width: 76px; height: 76px; font-size: 2rem; border-radius: 23px; }
    .thread-error-actions { width: 100%; align-items: stretch; flex-direction: column; }
    .thread-error-primary { justify-content: space-between; }
    .thread-error-secondary { justify-content: center; }
    .thread-error-footer span:last-child { display: none; }
}

@media (max-width: 1199.98px) {
    .thread-topbar .navbar-collapse {
        margin: 12px 0 16px;
        padding: 12px;
        background: #102744;
        border: 1px solid rgba(255,255,255,.09);
        border-radius: 14px;
    }

    .thread-topbar .navbar-nav {
        gap: 2px;
    }

    .thread-topbar .dropdown-menu {
        margin-top: 2px !important;
        background: #fff;
        box-shadow: none;
    }

    .survey-builder-tree {
        position: static;
        max-height: none;
    }

    .survey-builder-tree > .card-body {
        max-height: 520px;
    }

    .survey-tree-actions {
        opacity: 1;
    }
}

@media (max-width: 575.98px) {
    .thread-topbar .container-xxl {
        min-height: 64px;
    }

    .thread-brand {
        font-size: 1.12rem;
    }

    .thread-brand img {
        width: 30px;
        height: 30px;
    }

    .thread-content > .container-xxl,
    .thread-content > .container-fluid {
        padding-top: 20px !important;
    }

    .thread-auth .authentication-wrapper,
    .thread-survey .authentication-wrapper {
        padding: 16px;
        overflow: hidden;
    }

    .thread-auth .card-body,
    .thread-survey .card-body {
        padding: 1.25rem 1rem 1.4rem;
    }
}

/* Thread cabinet dashboard */
.thread-dashboard {
    --dashboard-navy: #10253f;
    --dashboard-blue: #6099d9;
    --dashboard-teal: #55b7b2;
    --dashboard-surface: #fff;
    --dashboard-soft: #f7f9fc;
    padding-bottom: 12px;
}

.thread-dashboard-hero {
    position: relative;
    overflow: hidden;
    min-height: 270px;
    margin-bottom: 22px;
    padding: 34px 38px 24px;
    color: #fff;
    background:
        linear-gradient(118deg, rgba(13, 37, 64, .98) 0%, rgba(22, 58, 91, .98) 58%, rgba(30, 83, 108, .96) 100%);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 24px;
    box-shadow: 0 24px 70px rgba(14, 38, 66, .16);
}

.thread-dashboard-hero::after {
    position: absolute;
    right: -5%;
    bottom: -130px;
    width: 58%;
    height: 220px;
    content: "";
    border: 1px solid rgba(151, 220, 218, .2);
    border-radius: 50%;
    transform: rotate(-8deg);
}

.thread-dashboard-hero-glow {
    position: absolute;
    z-index: 0;
    border-radius: 50%;
    filter: blur(2px);
    pointer-events: none;
}

.thread-dashboard-hero-glow-one {
    top: -150px;
    right: 10%;
    width: 360px;
    height: 360px;
    background: radial-gradient(circle, rgba(87, 188, 181, .22), transparent 67%);
}

.thread-dashboard-hero-glow-two {
    bottom: -180px;
    left: 28%;
    width: 380px;
    height: 380px;
    background: radial-gradient(circle, rgba(103, 154, 217, .2), transparent 66%);
}

.thread-dashboard-hero-line {
    position: absolute;
    top: -90px;
    right: -50px;
    width: 500px;
    height: 250px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 50%;
    transform: rotate(18deg);
}

.thread-dashboard-hero-line::before,
.thread-dashboard-hero-line::after {
    position: absolute;
    inset: 22px;
    content: "";
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: inherit;
}

.thread-dashboard-hero-line::after {
    inset: 48px;
}

.thread-dashboard-hero-content,
.thread-dashboard-filter-row {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    gap: 28px;
}

.thread-dashboard-hero-content {
    align-items: flex-start;
}

.thread-dashboard-hero-copy {
    max-width: 760px;
}

.thread-dashboard-eyebrow,
.thread-dashboard-section-kicker {
    display: block;
    margin-bottom: 7px;
    color: #63809f;
    font-size: .69rem;
    font-weight: 750;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.thread-dashboard-eyebrow {
    color: #8ed5d0;
}

.thread-dashboard-hero h1 {
    margin: 0 0 10px;
    color: #fff;
    font-size: clamp(2rem, 3vw, 2.85rem);
    font-weight: 720;
    letter-spacing: -.045em;
}

.thread-dashboard-hero-copy p {
    max-width: 680px;
    margin: 0;
    color: rgba(232, 241, 249, .76);
    font-size: 1rem;
    line-height: 1.65;
}

.thread-dashboard-hero-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 10px;
}

.thread-dashboard-hero-actions .btn {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    gap: 8px;
    padding: 10px 16px;
    font-size: .84rem;
}

.thread-dashboard-primary-action {
    color: #12334b !important;
    background: #9bdcd5 !important;
    border-color: #9bdcd5 !important;
    box-shadow: 0 10px 26px rgba(4, 29, 48, .22);
}

.thread-dashboard-primary-action:hover {
    background: #b0e6e0 !important;
    border-color: #b0e6e0 !important;
}

.thread-dashboard-secondary-action {
    color: #fff !important;
    background: rgba(255, 255, 255, .08) !important;
    border-color: rgba(255, 255, 255, .18) !important;
}

.thread-dashboard-secondary-action:hover {
    background: rgba(255, 255, 255, .14) !important;
}

.thread-dashboard-filter-row {
    align-items: flex-end;
    margin-top: 34px;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, .1);
}

.thread-dashboard-filters {
    display: flex;
    gap: 10px;
}

.thread-dashboard-filters label {
    margin: 0;
}

.thread-dashboard-filters label > span {
    display: block;
    margin: 0 0 5px 2px;
    color: rgba(222, 235, 245, .58);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.thread-dashboard-filter {
    min-width: 150px;
    height: 40px;
    color: #f2f7fb;
    font-size: .8rem;
    background-color: rgba(255, 255, 255, .08) !important;
    border-color: rgba(255, 255, 255, .14) !important;
    --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23c8d8e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

.thread-dashboard-filter[name="category"] {
    min-width: 205px;
}

.thread-dashboard-filter option {
    color: var(--thread-ink);
    background: #fff;
}

.thread-dashboard-filter:focus {
    border-color: rgba(155, 220, 213, .65) !important;
    box-shadow: 0 0 0 .2rem rgba(155, 220, 213, .12) !important;
}

.thread-dashboard-data-state {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px 20px;
    padding-bottom: 8px;
    color: rgba(222, 235, 245, .62);
    font-size: .74rem;
}

.thread-dashboard-data-state span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.thread-dashboard-data-state i {
    color: #8ed5d0;
    font-size: .95rem;
}

.thread-dashboard-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.thread-dashboard-kpi,
.thread-dashboard-card {
    position: relative;
    background: var(--dashboard-surface);
    border: 1px solid #e0e7ef;
    border-radius: 18px;
    box-shadow: 0 7px 24px rgba(16, 40, 70, .045);
}

.thread-dashboard-kpi {
    min-height: 174px;
    overflow: hidden;
    padding: 19px 21px;
}

a.thread-dashboard-kpi {
    display: block;
    color: inherit;
}

.thread-dashboard-kpi-link {
    scroll-margin-top: 20px;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.thread-dashboard-kpi-link:hover {
    color: inherit;
    border-color: #e1bd91;
    box-shadow: 0 10px 28px rgba(126, 83, 32, .1);
    transform: translateY(-2px);
}

.thread-dashboard-kpi::after {
    position: absolute;
    right: -32px;
    bottom: -38px;
    width: 105px;
    height: 105px;
    content: "";
    border: 18px solid rgba(81, 125, 171, .04);
    border-radius: 50%;
}

.thread-dashboard-kpi-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.thread-dashboard-kpi-icon,
.thread-dashboard-action-icon,
.thread-dashboard-insight > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.thread-dashboard-kpi-icon {
    width: 39px;
    height: 39px;
    color: #4d79b0;
    font-size: 1.25rem;
    background: #edf3fa;
    border-radius: 12px;
}

.thread-dashboard-kpi-teal .thread-dashboard-kpi-icon { color: #2b8d89; background: #e8f6f4; }
.thread-dashboard-kpi-violet .thread-dashboard-kpi-icon { color: #6f65aa; background: #f0eef9; }
.thread-dashboard-kpi-orange .thread-dashboard-kpi-icon { color: #b87932; background: #fbf2e7; }
.thread-dashboard-kpi-green .thread-dashboard-kpi-icon { color: #398969; background: #eaf6f0; }

.thread-dashboard-delta,
.thread-dashboard-table-delta {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 4px 8px;
    font-size: .7rem;
    font-weight: 750;
    border-radius: 999px;
}

.thread-dashboard-delta.is-positive,
.thread-dashboard-table-delta.is-positive {
    color: #2d8260;
    background: #eaf7f0;
}

.thread-dashboard-delta.is-negative,
.thread-dashboard-table-delta.is-negative {
    color: #bf5c55;
    background: #fceeed;
}

.thread-dashboard-kpi-label {
    color: #6b7c90;
    font-size: .78rem;
    font-weight: 650;
}

.thread-dashboard-kpi-value {
    position: relative;
    z-index: 1;
    margin: 2px 0 3px;
    color: #122941;
    font-size: clamp(1.65rem, 2.5vw, 2.15rem);
    font-weight: 720;
    letter-spacing: -.045em;
}

.thread-dashboard-kpi-description {
    position: relative;
    z-index: 1;
    color: #8a98a9;
    font-size: .72rem;
}

.thread-dashboard-kpi-action {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #a56c2e;
    font-weight: 680;
}

.thread-dashboard-grid-row {
    margin-top: 4px;
    padding-top: 18px;
}

.thread-dashboard-card {
    padding: 22px;
}

.thread-dashboard-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.thread-dashboard-card-header h2 {
    margin: 0;
    color: #152b43;
    font-size: 1.12rem;
    font-weight: 720;
}

.thread-dashboard-attention {
    scroll-margin-top: 20px;
}

.thread-dashboard-attention-hint {
    max-width: 270px;
    margin: 5px 0 0;
    color: #8291a1;
    font-size: .66rem;
    line-height: 1.4;
}

.thread-dashboard-section-kicker {
    margin-bottom: 4px;
    font-size: .62rem;
}

.thread-dashboard-card-link,
.thread-dashboard-icon-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #5d7897;
    font-size: .75rem;
    font-weight: 650;
}

.thread-dashboard-card-link {
    gap: 5px;
    padding: 7px 10px;
    background: #f4f7fa;
    border-radius: 9px;
}

.thread-dashboard-card-link:hover,
.thread-dashboard-icon-link:hover {
    color: var(--thread-primary);
}

.thread-dashboard-icon-link {
    width: 36px;
    height: 36px;
    font-size: 1.15rem;
    background: #f3f6f9;
    border-radius: 10px;
}

.thread-dashboard-card-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 31px;
    height: 31px;
    color: #536b83;
    font-size: .75rem;
    font-weight: 750;
    background: #f0f4f8;
    border-radius: 10px;
}

.thread-dashboard-chart {
    min-height: 330px;
    margin: -4px -5px -8px;
}

.thread-dashboard-chart-legend {
    display: flex;
    gap: 14px;
    padding-top: 10px;
    color: #77889b;
    font-size: .69rem;
}

.thread-dashboard-chart-legend span {
    display: flex;
    align-items: center;
    gap: 6px;
}

.thread-dashboard-chart-legend i {
    width: 8px;
    height: 8px;
    background: #689bd6;
    border-radius: 50%;
}

.thread-dashboard-chart-legend i.is-score {
    background: #4bb4aa;
}

.thread-dashboard-action-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.thread-dashboard-action {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto 15px;
    align-items: center;
    gap: 10px;
    margin: 0 -6px;
    padding: 9px 7px;
    color: inherit;
    border-radius: 12px;
    transition: background .18s ease, transform .18s ease;
}

.thread-dashboard-action:hover {
    color: inherit;
    background: #f7f9fc;
    transform: translateX(2px);
}

.thread-dashboard-action-icon {
    width: 36px;
    height: 36px;
    color: #537ba4;
    font-size: 1.08rem;
    background: #edf3f8;
    border-radius: 11px;
}

.thread-dashboard-action-icon.is-red { color: #bc5a55; background: #fbeeed; }
.thread-dashboard-action-icon.is-orange { color: #af7435; background: #fbf2e7; }
.thread-dashboard-action-icon.is-blue { color: #537eaf; background: #edf3fa; }
.thread-dashboard-action-icon.is-slate { color: #68788b; background: #eff2f5; }

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

.thread-dashboard-action-copy strong {
    overflow: hidden;
    color: #24394f;
    font-size: .76rem;
    font-weight: 680;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-dashboard-action-copy small {
    overflow: hidden;
    color: #8a98a8;
    font-size: .65rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-dashboard-action-value {
    color: #24394f;
    font-size: .85rem;
    font-weight: 750;
}

.thread-dashboard-action-arrow {
    color: #a3afbb;
}

.thread-dashboard-positive-state,
.thread-dashboard-empty-card,
.thread-dashboard-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}

.thread-dashboard-positive-state {
    min-height: 280px;
    color: #718597;
}

.thread-dashboard-positive-state i {
    margin-bottom: 12px;
    color: #55a37e;
    font-size: 2.4rem;
}

.thread-dashboard-positive-state strong,
.thread-dashboard-empty-card strong {
    margin-bottom: 4px;
    color: #274057;
}

.thread-dashboard-positive-state span,
.thread-dashboard-empty-card span {
    max-width: 310px;
    color: #8998a8;
    font-size: .73rem;
}

.thread-dashboard-survey-list {
    display: flex;
    flex-direction: column;
}

.thread-dashboard-survey {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(150px, 210px) 16px;
    align-items: center;
    gap: 18px;
    margin: 0 -9px;
    padding: 14px 10px;
    color: inherit;
    border-bottom: 1px solid #edf1f5;
    border-radius: 12px;
    transition: background .18s ease;
}

.thread-dashboard-survey:last-child {
    border-bottom-color: transparent;
}

.thread-dashboard-survey:hover {
    color: inherit;
    background: #f8fafc;
}

.thread-dashboard-survey-heading {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 4px;
}

.thread-dashboard-survey-category,
.thread-dashboard-survey-stalled,
.thread-dashboard-survey-private {
    color: #6783a0;
    font-size: .61rem;
    font-weight: 700;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.thread-dashboard-survey-private {
    color: #5fa59f;
    font-size: .85rem;
}

.thread-dashboard-survey-stalled {
    padding: 3px 6px;
    color: #b5635d;
    background: #fbefee;
    border-radius: 999px;
}

.thread-dashboard-survey h3 {
    overflow: hidden;
    margin: 0 0 5px;
    color: #22384d;
    font-size: .86rem;
    font-weight: 680;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-dashboard-survey-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 12px;
    color: #8997a6;
    font-size: .64rem;
}

.thread-dashboard-survey-meta span {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

.thread-dashboard-survey-progress-label {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 7px;
}

.thread-dashboard-survey-progress-label strong {
    color: #254158;
    font-size: .83rem;
}

.thread-dashboard-survey-progress-label span {
    color: #4f968e;
    font-size: .69rem;
    font-weight: 700;
}

.thread-dashboard-progress {
    height: 7px;
    overflow: hidden;
    background: #edf2f6;
    border-radius: 999px;
}

.thread-dashboard-progress span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #6c9dd4, #56b8b0);
    border-radius: inherit;
}

.thread-dashboard-survey-arrow {
    color: #a0adba;
}

.thread-dashboard-empty-card {
    min-height: 300px;
}

.thread-dashboard-empty-card.is-compact {
    min-height: 220px;
}

.thread-dashboard-empty-card i {
    margin-bottom: 9px;
    color: #7d9aba;
    font-size: 2rem;
}

.thread-dashboard-lifecycle-main {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 16px;
    padding: 17px 18px;
    background: linear-gradient(135deg, #eff5fa, #eef8f6);
    border-radius: 14px;
}

.thread-dashboard-lifecycle-main span {
    max-width: 110px;
    color: #62778b;
    font-size: .72rem;
}

.thread-dashboard-lifecycle-main strong {
    color: #183249;
    font-size: 2rem;
    line-height: 1;
    letter-spacing: -.04em;
}

.thread-dashboard-lifecycle-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.thread-dashboard-lifecycle-grid > div {
    display: grid;
    grid-template-columns: 31px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 10px;
    background: #f8fafc;
    border-radius: 11px;
}

.thread-dashboard-lifecycle-grid span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    color: #4e80af;
    background: #eaf2fa;
    border-radius: 9px;
}

.thread-dashboard-lifecycle-grid span.is-green { color: #438c6b; background: #e8f5ee; }
.thread-dashboard-lifecycle-grid span.is-orange { color: #a97135; background: #faf0e4; }
.thread-dashboard-lifecycle-grid span.is-violet { color: #7468a7; background: #efedf8; }

.thread-dashboard-lifecycle-grid small {
    overflow: hidden;
    color: #7c8c9c;
    font-size: .62rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-dashboard-lifecycle-grid strong {
    color: #294056;
    font-size: .8rem;
}

.thread-dashboard-privacy-note {
    margin: 14px 0 0;
    color: #8997a6;
    font-size: .64rem;
}

.thread-dashboard-privacy-note i {
    margin-right: 4px;
}

.thread-dashboard-insights {
    overflow: hidden;
    background:
        radial-gradient(circle at 95% 10%, rgba(87, 184, 176, .09), transparent 28%),
        #fff;
}

.thread-dashboard-insight-caption,
.thread-dashboard-privacy {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #8090a1;
    font-size: .67rem;
}

.thread-dashboard-privacy {
    padding: 6px 9px;
    color: #577f82;
    background: #edf6f5;
    border-radius: 999px;
}

.thread-dashboard-insight-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 11px;
}

.thread-dashboard-insight {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    min-height: 100px;
    padding: 15px;
    background: #f7f9fc;
    border: 1px solid #edf1f5;
    border-radius: 13px;
}

.thread-dashboard-insight > span {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    color: #547fa9;
    font-size: 1.08rem;
    background: #e9f1f9;
    border-radius: 10px;
}

.thread-dashboard-insight.is-positive > span { color: #438767; background: #e8f5ee; }
.thread-dashboard-insight.is-warning > span { color: #ab6a36; background: #faeee6; }

.thread-dashboard-insight strong {
    display: block;
    margin-bottom: 4px;
    color: #2a4055;
    font-size: .76rem;
}

.thread-dashboard-insight p {
    margin: 0;
    color: #7d8c9c;
    font-size: .68rem;
    line-height: 1.5;
}

.thread-dashboard-department-table {
    width: 100%;
    border-collapse: collapse;
}

.thread-dashboard-department-table th {
    padding: 6px 9px 10px;
    color: #8a98a7;
    font-size: .61rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    border-bottom: 1px solid #e9eef3;
}

.thread-dashboard-department-table td {
    padding: 11px 9px;
    color: #516579;
    font-size: .71rem;
    border-bottom: 1px solid #edf1f5;
}

.thread-dashboard-department-table tbody tr:last-child td {
    border-bottom: 0;
}

.thread-dashboard-department-table td:first-child {
    min-width: 170px;
}

.thread-dashboard-department-table td strong {
    color: #30465a;
    font-size: .73rem;
}

.thread-dashboard-department-table td small {
    display: block;
    color: #98a5b2;
    font-size: .58rem;
}

.thread-dashboard-status-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 7px;
    background: #58a47f;
    border-radius: 50%;
}

.thread-dashboard-status-dot.is-risk { background: #cf6a62; box-shadow: 0 0 0 4px rgba(207, 106, 98, .1); }
.thread-dashboard-status-dot.is-watch { background: #d89b4c; box-shadow: 0 0 0 4px rgba(216, 155, 76, .1); }

.thread-dashboard-status-label {
    display: inline-flex;
    padding: 4px 7px;
    color: #46846a;
    font-size: .58rem;
    font-weight: 700;
    background: #eaf6f0;
    border-radius: 999px;
}

.thread-dashboard-status-label.is-risk { color: #b95b55; background: #faedec; }
.thread-dashboard-status-label.is-watch { color: #a77535; background: #fbf1e4; }

.thread-dashboard-hidden-score {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    color: #8a98a7;
}

.thread-dashboard-question-list {
    display: flex;
    flex-direction: column;
}

.thread-dashboard-question {
    display: grid;
    grid-template-columns: 27px minmax(0, 1fr) 44px;
    align-items: center;
    gap: 9px;
    padding: 11px 0;
    border-bottom: 1px solid #edf1f5;
}

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

.thread-dashboard-question-index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    color: #6f8295;
    font-size: .64rem;
    font-weight: 750;
    background: #f0f4f8;
    border-radius: 8px;
}

.thread-dashboard-question > div {
    min-width: 0;
}

.thread-dashboard-question strong {
    display: -webkit-box;
    overflow: hidden;
    color: #34495d;
    font-size: .71rem;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.thread-dashboard-question small {
    display: block;
    overflow: hidden;
    margin-top: 3px;
    color: #929eaa;
    font-size: .59rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-dashboard-question-score {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 31px;
    color: #936b39;
    font-size: .76rem;
    font-weight: 750;
    background: #faf1e6;
    border-radius: 9px;
}

.thread-dashboard-question-score.is-low {
    color: #b95852;
    background: #faeceb;
}

.thread-dashboard-feedback-summary {
    height: 100%;
    padding: 20px;
    background: linear-gradient(140deg, #edf4fa, #eef8f6);
    border-radius: 15px;
}

.thread-dashboard-feedback-summary > strong {
    display: block;
    color: #183249;
    font-size: 2.2rem;
    line-height: 1;
    letter-spacing: -.04em;
}

.thread-dashboard-feedback-summary > span {
    display: block;
    margin-top: 7px;
    color: #728598;
    font-size: .7rem;
}

.thread-dashboard-theme-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 18px;
}

.thread-dashboard-theme-cloud > span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 8px;
    color: #44697d;
    font-size: .66rem;
    font-weight: 650;
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(115, 157, 171, .16);
    border-radius: 999px;
}

.thread-dashboard-theme-cloud small {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 17px;
    height: 17px;
    color: #4a8a86;
    font-size: .55rem;
    background: #e6f4f2;
    border-radius: 50%;
}

.thread-dashboard-comment-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    height: 100%;
}

.thread-dashboard-comment-list blockquote {
    position: relative;
    min-height: 160px;
    margin: 0;
    padding: 17px;
    background: #f8fafc;
    border: 1px solid #edf1f5;
    border-radius: 14px;
}

.thread-dashboard-comment-list blockquote > i {
    color: #91aaa9;
    font-size: 1.25rem;
}

.thread-dashboard-comment-list p {
    display: -webkit-box;
    overflow: hidden;
    margin: 8px 0 14px;
    color: #536678;
    font-size: .69rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
}

.thread-dashboard-comment-list footer {
    position: absolute;
    right: 17px;
    bottom: 14px;
    left: 17px;
    color: #98a4b0;
    font-size: .58rem;
}

.thread-dashboard-empty {
    min-height: 460px;
    padding: 50px 24px;
    background: #fff;
    border: 1px solid var(--thread-border);
    border-radius: 22px;
}

.thread-dashboard-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    height: 68px;
    margin-bottom: 18px;
    color: #4f83b8;
    font-size: 2rem;
    background: #eaf2fa;
    border-radius: 20px;
}

.thread-dashboard-empty h1 {
    margin-bottom: 8px;
}

.thread-dashboard-empty p {
    max-width: 480px;
    margin-bottom: 20px;
    color: var(--thread-muted);
}

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

    .thread-dashboard-kpi {
        min-height: 158px;
    }

    .thread-dashboard-comment-list {
        grid-template-columns: repeat(3, minmax(220px, 1fr));
        overflow-x: auto;
    }
}

@media (max-width: 991.98px) {
    .thread-dashboard-hero {
        padding: 28px;
    }

    .thread-dashboard-hero-content,
    .thread-dashboard-filter-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .thread-dashboard-filter-row {
        margin-top: 26px;
    }

    .thread-dashboard-data-state {
        justify-content: flex-start;
        padding-bottom: 0;
    }

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

@media (max-width: 767.98px) {
    .thread-dashboard-hero-actions,
    .thread-dashboard-filters {
        width: 100%;
    }

    .thread-dashboard-filters label {
        flex: 1 1 50%;
    }

    .thread-dashboard-filter,
    .thread-dashboard-filter[name="category"] {
        width: 100%;
        min-width: 0;
    }

    .thread-dashboard-survey {
        grid-template-columns: minmax(0, 1fr) 16px;
    }

    .thread-dashboard-survey-progress-block {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .thread-dashboard-survey-arrow {
        grid-column: 2;
        grid-row: 1;
    }

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

@media (max-width: 575.98px) {
    .thread-dashboard,
    .thread-dashboard-hero,
    .thread-dashboard-hero-content,
    .thread-dashboard-filter-row {
        min-width: 0;
    }

    .thread-dashboard-hero {
        min-height: 0;
        padding: 23px 19px;
        border-radius: 18px;
    }

    .thread-dashboard-hero-copy p {
        font-size: .86rem;
    }

    .thread-dashboard-hero-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .thread-dashboard-hero-actions .btn {
        justify-content: center;
        width: 100%;
        min-width: 0;
        padding-right: 10px;
        padding-left: 10px;
        overflow: hidden;
    }

    .thread-dashboard-hero-actions .btn span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .thread-dashboard-filter-row {
        gap: 18px;
    }

    .thread-dashboard-data-state span {
        max-width: 100%;
        white-space: normal;
    }

    .thread-dashboard-filters {
        flex-direction: column;
    }

    .thread-dashboard-kpis {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .thread-dashboard-kpi {
        min-height: 150px;
        padding: 15px;
    }

    .thread-dashboard-kpi-value {
        font-size: 1.55rem;
    }

    .thread-dashboard-kpi-description {
        font-size: .63rem;
    }

    .thread-dashboard-card {
        padding: 17px;
        border-radius: 15px;
    }

    .thread-dashboard-chart-legend {
        display: none;
    }

    .thread-dashboard-chart {
        min-height: 290px;
    }

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

    .thread-dashboard-insight-caption,
    .thread-dashboard-privacy {
        display: none;
    }

    .thread-dashboard-department-table-wrap {
        margin-right: -17px;
        margin-left: -17px;
    }

    .thread-dashboard-comment-list {
        grid-template-columns: minmax(240px, 1fr);
    }
}

/* Employees GridView */
.thread-employee-toolbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 16px;
    padding: 14px;
    background: #fff;
    border: 1px solid var(--thread-border);
    border-radius: 15px;
    box-shadow: 0 4px 18px rgba(19, 43, 75, .04);
}

.thread-employee-toolbar-group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.thread-employee-toolbar-group-right {
    justify-content: flex-end;
}

.thread-employee-toolbar .btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
}

.thread-employee-import-form {
    position: relative;
    margin: 0;
}

.thread-employee-import-form .error-list {
    position: absolute;
    top: calc(100% + 5px);
    right: 0;
    z-index: 2;
    min-width: 240px;
    font-size: .7rem;
    text-align: right;
}

.thread-department-menu {
    width: min(390px, calc(100vw - 32px));
    max-height: 410px;
    overflow-y: auto;
    padding: 8px;
    border: 1px solid var(--thread-border);
    border-radius: 13px;
    box-shadow: 0 18px 50px rgba(17, 42, 72, .16);
}

.thread-department-menu-title {
    padding: 7px 8px 10px;
    color: #7c8b9b;
    font-size: .65rem;
    font-weight: 750;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.thread-department-menu-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px;
    border-radius: 9px;
}

.thread-department-menu-item:hover {
    background: #f6f8fb;
}

.thread-department-menu-item > span:first-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.thread-department-menu-item strong {
    overflow: hidden;
    color: #30465c;
    font-size: .75rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-department-menu-item small {
    color: #8c99a7;
    font-size: .62rem;
}

.thread-department-menu-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 4px;
}

.thread-employee-empty-hint {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #47657c;
    background: #edf5fa;
    border-color: #d7e7f1;
    border-radius: 12px;
}

.thread-employee-grid-row-dismissed td {
    background: #fff8f7;
}

.thread-employee-grid-row-dismissed:hover td {
    background: #fff4f2 !important;
}

@media (max-width: 1199.98px) {
    .thread-employee-toolbar {
        flex-direction: column;
    }

    .thread-employee-toolbar-group-right {
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    .thread-employee-toolbar {
        padding: 11px;
    }

    .thread-employee-toolbar-group,
    .thread-employee-toolbar-group-right {
        display: grid;
        width: 100%;
        grid-template-columns: 1fr;
    }

    .thread-employee-toolbar .btn,
    .thread-employee-toolbar .dropdown,
    .thread-employee-toolbar .dropdown > .btn,
    .thread-employee-import-form,
    .thread-employee-import-form label {
        width: 100%;
        justify-content: center;
    }

}

/* Subscription plans */
.thread-subscription-usage {
    display: flex;
    gap: 18px;
    align-items: center;
    padding: 14px 16px;
    background: #fff;
    border: 1px solid #dce7e6;
    border-radius: 13px;
}

.thread-subscription-usage > div:first-child {
    display: flex;
    min-width: 220px;
    gap: 11px;
    align-items: center;
}

.thread-subscription-usage-icon {
    display: grid;
    width: 39px;
    height: 39px;
    flex: 0 0 39px;
    place-items: center;
    color: #347f7a;
    font-size: 1.15rem;
    background: #e8f3f2;
    border-radius: 11px;
}

.thread-subscription-usage small,
.thread-subscription-usage strong { display: block; }
.thread-subscription-usage small { color: #829298; font-size: .62rem; }
.thread-subscription-usage strong { color: #304b53; }
.thread-subscription-usage-count { flex: 1; color: #75878d; }
.thread-subscription-usage-count strong { display: inline; margin-right: 3px; font-size: 1.15rem; }

.thread-subscription-page { max-width: 1500px; }
.thread-subscription-head {
    display: flex;
    gap: 32px;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 25px;
    padding: 26px 28px;
    color: #fff;
    background: linear-gradient(135deg, #203438, #2d494c);
    border-radius: 18px;
}
.thread-subscription-head .thread-kicker { color: #9ccfca; }
.thread-subscription-head h1 { margin: 8px 0; color: #fff; font-size: 1.8rem; }
.thread-subscription-head p { max-width: 720px; margin: 0; color: rgba(255,255,255,.65); }
.thread-subscription-current { min-width: 170px; text-align: right; }
.thread-subscription-current small,
.thread-subscription-current span { display: block; color: rgba(255,255,255,.6); font-size: .68rem; }
.thread-subscription-current strong { display: block; color: #8ed0ca; font-size: 2.2rem; line-height: 1; }

.thread-plan-grid { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 13px; }
.thread-plan-card {
    position: relative;
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 22px 19px;
    background: #fff;
    border: 1px solid #dce5e8;
    border-radius: 16px;
}
.thread-plan-card.is-current { border-color: #59a59e; box-shadow: 0 12px 30px rgba(43,123,116,.11); }
.thread-plan-current-badge { position: absolute; top: 13px; right: 13px; color: #267c75; font-size: .6rem; font-weight: 700; }
.thread-plan-range { align-self: flex-start; padding: 5px 9px; color: #377b77; font-size: .62rem; font-weight: 700; background: #e9f4f3; border-radius: 999px; }
.thread-plan-card h2 { min-height: 44px; margin: 15px 0; color: #2c474f; font-size: 1.05rem; }
.thread-plan-price { display: flex; gap: 7px; align-items: center; }
.thread-plan-price strong { color: #294b4e; font-size: 1.35rem; white-space: nowrap; }
.thread-plan-price span { color: #7a8b91; font-size: .58rem; line-height: 1.35; }
.thread-plan-total { min-height: 60px; margin: 18px 0; padding-top: 15px; color: #71838a; font-size: .65rem; border-top: 1px solid #e5ebed; }
.thread-plan-total strong { display: block; margin-top: 3px; color: #405a61; font-size: .74rem; }
.thread-plan-card form { margin-top: auto; }
.thread-subscription-note { margin: 18px 0 0; color: #839197; font-size: .65rem; text-align: center; }

.thread-subscription-banner {
    position: relative;
    z-index: 4;
    display: flex;
    gap: 14px;
    align-items: center;
    margin: 0 0 18px;
    padding: 14px 16px;
    color: #68471c;
    background: #fff8e8;
    border: 1px solid #efd69e;
    border-left: 4px solid #d8a13c;
    border-radius: 13px;
    box-shadow: 0 8px 24px rgba(77, 61, 27, .06);
}

.thread-subscription-banner.is-danger {
    color: #74413f;
    background: #fff2f1;
    border-color: #ecc3c0;
    border-left-color: #c86b65;
}

.thread-subscription-banner-icon {
    display: grid;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    place-items: center;
    color: #95651f;
    font-size: 1.2rem;
    background: rgba(224, 171, 70, .14);
    border-radius: 11px;
}

.thread-subscription-banner.is-danger .thread-subscription-banner-icon {
    color: #a34f4a;
    background: rgba(196, 91, 84, .11);
}

.thread-subscription-banner-copy { min-width: 0; flex: 1; }
.thread-subscription-banner-copy strong,
.thread-subscription-banner-copy span { display: block; }
.thread-subscription-banner-copy strong { margin-bottom: 2px; color: inherit; font-size: .78rem; }
.thread-subscription-banner-copy span { color: inherit; font-size: .68rem; line-height: 1.45; opacity: .86; }
.thread-subscription-banner .btn { flex: 0 0 auto; color: #39545b; background: rgba(255,255,255,.82); border-color: rgba(79,103,106,.18); }

.thread-subscription-date { margin: 5px 0; font-size: 1.35rem !important; }
.thread-billing-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 13px;
    margin: 0 0 18px;
}
.thread-billing-summary article {
    min-width: 0;
    padding: 17px 18px;
    background: #fff;
    border: 1px solid #dce6e8;
    border-radius: 14px;
}
.thread-billing-summary span,
.thread-billing-summary strong,
.thread-billing-summary small { display: block; }
.thread-billing-summary span { margin-bottom: 6px; color: #839298; font-size: .61rem; }
.thread-billing-summary strong { overflow: hidden; color: #314e55; font-size: 1rem; text-overflow: ellipsis; white-space: nowrap; }
.thread-billing-summary small { margin-top: 4px; color: #8a989d; font-size: .58rem; }
.thread-billing-history { padding: 20px; background: #fff; border: 1px solid #dce6e8; border-radius: 16px; }

.thread-seat-calculator {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, .75fr);
    gap: 26px;
    align-items: center;
    padding: 24px;
    background: #fff;
    border: 1px solid #d8e5e6;
    border-radius: 16px;
}
.thread-seat-calculator h2 { margin: 7px 0 5px; color: #294950; font-size: 1.2rem; }
.thread-seat-calculator p { margin: 0 0 16px; color: #75878d; font-size: .7rem; }
.thread-seat-calculator label { display: block; margin-bottom: 5px; color: #536d73; font-size: .66rem; font-weight: 700; }
.thread-subscription-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: min(100%, 480px);
    gap: 12px;
}
.thread-seat-calculator input.form-control {
    width: 100%;
    height: 38px;
    min-height: 38px;
    padding: calc(.5rem - 1px) calc(.875rem - 1px) !important;
    border-width: 1px !important;
}
.thread-seat-calculator .form-select {
    width: 100%;
    height: 38px;
    min-height: 38px;
}
.thread-seat-calculator-result { padding: 18px 20px; background: #eef6f5; border-radius: 13px; }
.thread-seat-calculator-result > small,
.thread-seat-calculator-result > strong,
.thread-seat-calculator-result > span { display: block; }
.thread-seat-calculator-result > small { color: #73888a; font-size: .62rem; }
.thread-seat-calculator-result > strong { margin: 3px 0; color: #287b75; font-size: 1.7rem; }
.thread-seat-calculator-result > span { color: #60787b; font-size: .66rem; }
.thread-seat-calculator-result [hidden] { display: none; }
.thread-seat-calculator-result .thread-seat-calculator-base {
    margin-top: 5px;
    color: #8a999b;
    font-size: .76rem;
    text-decoration: line-through;
}
.thread-seat-calculator-result .thread-seat-calculator-saving {
    margin-top: 7px;
    color: #247c70;
    font-weight: 700;
}
.thread-seat-calculator-result [data-price-breakdown] { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.thread-seat-calculator-result [data-price-breakdown] span { padding: 4px 7px; color: #567477; font-size: .58rem; background: #fff; border-radius: 7px; }
.thread-subscription-pay-button {
    display: inline-flex;
    width: 100%;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-top: 16px;
}
.thread-seat-calculator-result .thread-subscription-payment-note {
    margin-top: 8px;
    color: #788d90;
    text-align: center;
}

.thread-payment-result {
    display: flex;
    width: min(100%, 620px);
    min-height: 460px;
    margin: 36px auto;
    padding: 46px;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    background: #fff;
    border: 1px solid #d8e5e6;
    border-radius: 16px;
    box-shadow: 0 18px 50px rgba(31, 62, 72, .08);
}
.thread-payment-result-icon {
    display: grid;
    width: 68px;
    height: 68px;
    margin-bottom: 20px;
    place-items: center;
    color: #277d75;
    font-size: 2rem;
    background: #e3f3f0;
    border: 1px solid #c8e5e1;
    border-radius: 50%;
}
.thread-payment-result-icon.is-failure { color: #a64f4b; background: #faeceb; border-color: #efcecb; }
.thread-payment-result-icon.is-pending { color: #52748c; background: #eaf1f5; border-color: #d4e1e8; }
.thread-payment-result h1 { margin: 8px 0 10px; color: #294950; font-size: 1.65rem; }
.thread-payment-result > p { max-width: 470px; margin: 0; color: #71858b; line-height: 1.6; }
.thread-payment-result-summary {
    display: flex;
    min-width: 250px;
    margin: 24px 0;
    padding: 14px 16px;
    align-items: center;
    justify-content: space-between;
    color: #73868b;
    background: #f3f7f7;
    border: 1px solid #e0e9ea;
    border-radius: 10px;
}
.thread-payment-result-summary strong { color: #287b75; font-size: 1rem; }
.thread-payment-result-loader {
    width: 28px;
    height: 28px;
    margin-top: 20px;
    border: 3px solid #d7e5e7;
    border-top-color: #38948c;
    border-radius: 50%;
    animation: thread-payment-spin .8s linear infinite;
}
@keyframes thread-payment-spin { to { transform: rotate(360deg); } }

.thread-subscription-promotion {
    display: flex;
    max-width: 520px;
    gap: 10px;
    align-items: center;
    margin: 0 0 16px;
    padding: 10px 12px;
    color: #326963;
    background: #edf8f5;
    border: 1px solid #cce8e1;
    border-radius: 11px;
}
.thread-subscription-promotion > span {
    display: grid;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    place-items: center;
    color: #247c70;
    background: #d9efea;
    border-radius: 9px;
}
.thread-subscription-promotion strong,
.thread-subscription-promotion small { display: block; }
.thread-subscription-promotion strong { font-size: .7rem; }
.thread-subscription-promotion small { margin-top: 2px; color: #66837f; font-size: .59rem; }
.thread-subscription-promotion.is-upcoming {
    color: #65552e;
    background: #fff8e9;
    border-color: #ebdcae;
}
.thread-subscription-promotion.is-upcoming > span { color: #90752c; background: #f5e9c6; }

@media (max-width: 1199.98px) { .thread-plan-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 767.98px) {
    .thread-subscription-usage,
    .thread-subscription-head { align-items: stretch; flex-direction: column; }
    .thread-subscription-current { text-align: left; }
    .thread-plan-grid { grid-template-columns: minmax(0,1fr); }
    .thread-plan-card h2 { min-height: 0; }
    .thread-subscription-banner { align-items: stretch; flex-direction: column; }
    .thread-subscription-banner .btn { width: 100%; }
    .thread-billing-summary { grid-template-columns: minmax(0,1fr); }
    .thread-seat-calculator { grid-template-columns: minmax(0,1fr); }
    .thread-payment-result { min-height: 390px; margin: 16px auto; padding: 28px 20px; }
    .thread-payment-result-summary { width: 100%; min-width: 0; }
}

/* Survey and course decision analytics. */
.thread-analytics,
.thread-learning-analytics {
    --analytics-ink: #173042;
    --analytics-muted: #718496;
    --analytics-teal: #2b918c;
    --analytics-teal-dark: #207772;
    --analytics-soft: #f3f7f9;
    --analytics-border: #dce7ec;
    color: var(--analytics-ink);
    scroll-behavior: smooth;
}

.thread-analytics-anchor {
    position: relative;
    top: -88px;
}

.thread-analytics-toolbar,
.thread-analytics-participant-toolbar,
.thread-analytics-section-heading,
.thread-analytics-hero,
.thread-analytics-hero-meta,
.thread-analytics-hero-actions {
    display: flex;
    align-items: center;
	gap: 5px
}

.thread-analytics-toolbar {
    position: sticky;
    top: 72px;
    z-index: 100;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 22px;
    padding: 9px 10px;
    background: #f8fbfc;
    border: 1px solid rgba(220, 231, 236, .9);
    border-radius: 14px;
    box-shadow: 0 8px 30px rgba(29, 57, 78, .07);
    backdrop-filter: blur(12px);
}

.thread-analytics--report .thread-analytics-toolbar {
    top: 12px;
}

.thread-analytics--report .thread-analytics-anchor {
    top: -28px;
}

.thread-analytics-nav {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

.thread-analytics-nav a {
    display: inline-flex;
    gap: 7px;
    align-items: center;
    padding: 8px 12px;
    color: #64798b;
    font-size: .75rem;
    font-weight: 700;
    border-radius: 9px;
}

.thread-analytics-nav a:hover,
.thread-analytics-nav a.active {
    color: var(--analytics-teal-dark);
    background: #e8f4f3;
}

.thread-analytics-nav i {
    font-size: 1rem;
}

.thread-analytics-nav-standalone {
    margin: 20px 0 24px;
    padding: 7px;
    background: #fff;
    border: 1px solid var(--analytics-border);
    border-radius: 13px;
    box-shadow: 0 5px 18px rgba(29, 57, 78, .04);
}

.thread-analytics-actions {
    display: flex;
    gap: 7px;
}

.thread-analytics-actions .btn {
    border-color: #dce6eb;
}

.thread-analytics-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 16px;
}

.thread-analytics-kpi {
    display: flex;
    min-width: 0;
    gap: 13px;
    align-items: flex-start;
    padding: 18px;
    background: #fff;
    border: 1px solid var(--analytics-border);
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(28, 59, 81, .045);
}

.thread-analytics-kpi.is-primary {
    color: #f5fffe;
    background: linear-gradient(140deg, #203c4a 0%, #245665 56%, #247d79 135%);
    border-color: transparent;
    box-shadow: 0 12px 30px rgba(28, 73, 84, .18);
}

.thread-analytics-kpi-icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    color: var(--analytics-teal-dark);
    font-size: 1.25rem;
    background: #e9f5f4;
    border-radius: 11px;
}

.thread-analytics-kpi.is-primary .thread-analytics-kpi-icon {
    color: #9ee5df;
    background: rgba(255, 255, 255, .1);
}

.thread-analytics-kpi > div:last-child {
    min-width: 0;
}

.thread-analytics-kpi span,
.thread-analytics-kpi small {
    display: block;
}

.thread-analytics-kpi span {
    margin-bottom: 3px;
    color: var(--analytics-muted);
    font-size: .67rem;
    font-weight: 700;
    letter-spacing: .025em;
}

.thread-analytics-kpi strong {
    display: block;
    margin-bottom: 3px;
    color: var(--analytics-ink);
    font-size: 1.72rem;
    line-height: 1.05;
    letter-spacing: -.035em;
}

.thread-analytics-kpi strong em,
.thread-analytics-block-card strong em,
.thread-analytics-question-result strong em {
    margin-left: 2px;
    font-size: .65em;
    font-style: normal;
    font-weight: 650;
    opacity: .56;
}

.thread-analytics-kpi small {
    color: #8192a0;
    font-size: .64rem;
}

.thread-analytics-kpi.is-primary span,
.thread-analytics-kpi.is-primary small {
    color: rgba(235, 255, 252, .68);
}

.thread-analytics-kpi.is-primary strong {
    color: #fff;
}

.thread-analytics-insight {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 22px;
    padding: 18px 20px;
    background: linear-gradient(110deg, #eef7f6, #f8fbfc 68%);
    border: 1px solid #d5eae7;
    border-radius: 16px;
}

.thread-analytics-insight > span {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    place-items: center;
    color: var(--analytics-teal-dark);
    font-size: 1.35rem;
    background: #dcefeb;
    border-radius: 12px;
}

.thread-analytics-insight.is-attention {
    background: linear-gradient(110deg, #fff7ed, #fbfcfc 72%);
    border-color: #f0dfc8;
}

.thread-analytics-insight.is-attention > span { color: #aa6a26; background: #f7e8d4; }
.thread-analytics-insight.is-protected > span { color: #657691; background: #e7ebf2; }

.thread-analytics-insight small,
.thread-analytics-kicker {
    display: block;
    margin-bottom: 4px;
    color: var(--analytics-teal-dark);
    font-size: .62rem;
    font-weight: 780;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.thread-analytics-insight h2 {
    margin: 0 0 4px;
    color: var(--analytics-ink);
    font-size: .98rem;
}

.thread-analytics-insight p,
.thread-analytics-section-heading p,
.thread-analytics-protected p {
    margin: 0;
    color: #677c8d;
    font-size: .72rem;
    line-height: 1.55;
}

.thread-analytics-section {
    margin-bottom: 22px;
    padding: 22px;
    background: #fff;
    border: 1px solid var(--analytics-border);
    border-radius: 18px;
    box-shadow: 0 8px 28px rgba(28, 59, 81, .045);
}

.thread-analytics-section-heading {
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.thread-analytics-section-heading h2,
.thread-analytics-protected h2 {
    margin: 0 0 4px;
    color: var(--analytics-ink);
    font-size: 1.12rem;
    letter-spacing: -.015em;
}

.thread-analytics-block-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.thread-analytics-block-card {
    min-width: 0;
    padding: 16px;
    color: inherit;
    background: #f8fafb;
    border: 1px solid #e2eaee;
    border-radius: 14px;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.thread-analytics-block-card:hover {
    color: inherit;
    border-color: #a8d3cf;
    box-shadow: 0 10px 22px rgba(32, 83, 92, .09);
    transform: translateY(-2px);
}

.thread-analytics-block-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.thread-analytics-block-top > span {
    color: #8a9aa7;
    font-size: .65rem;
    font-weight: 800;
}

.thread-analytics-block-top strong {
    color: var(--analytics-teal-dark);
    font-size: 1.15rem;
}

.thread-analytics-block-card h3 {
    min-height: 36px;
    margin: 0 0 12px;
    color: var(--analytics-ink);
    font-size: .78rem;
    line-height: 1.45;
}

.thread-analytics-meter,
.thread-analytics-answer-bar,
.thread-course-module-progress {
    height: 5px;
    overflow: hidden;
    background: #e4ecef;
    border-radius: 999px;
}

.thread-analytics-meter i,
.thread-analytics-answer-bar i,
.thread-course-module-progress i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #52aaa5, #258680);
    border-radius: inherit;
}

.thread-analytics-block-card.is-warning .thread-analytics-meter i { background: #d8a357; }
.thread-analytics-block-card.is-danger .thread-analytics-meter i { background: #c97670; }

.thread-analytics-block-card > small {
    display: block;
    margin-top: 9px;
    color: #7d8f9d;
    font-size: .62rem;
}

.thread-analytics-search {
    position: relative;
    min-width: 220px;
}

.thread-analytics-search i {
    position: absolute;
    top: 50%;
    left: 12px;
    color: #8495a3;
    transform: translateY(-50%);
}

.thread-analytics-search input {
    width: 100%;
    height: 38px;
    padding: 8px 12px 8px 35px;
    color: var(--analytics-ink);
    font-size: .7rem;
    background: #f7f9fa;
    border: 1px solid #dce5e9;
    border-radius: 10px;
    outline: none;
}

.thread-analytics-search input:focus {
    background: #fff;
    border-color: #7dbcb7;
    box-shadow: 0 0 0 3px rgba(61, 146, 140, .1);
}

.thread-analytics-question-list {
    display: grid;
    gap: 9px;
}

.thread-analytics-question-group {
    display: flex;
    gap: 9px;
    align-items: baseline;
    padding: 14px 3px 3px;
}

.thread-analytics-question-group:first-child { padding-top: 0; }

.thread-analytics-question-group span {
    color: var(--analytics-teal-dark);
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.thread-analytics-question-group strong {
    color: #40586a;
    font-size: .73rem;
}

.thread-analytics-question {
    overflow: hidden;
    background: #fff;
    border: 1px solid #e0e8ec;
    border-left: 3px solid #b8cbc9;
    border-radius: 12px;
}

.thread-analytics-question.is-positive { border-left-color: #5aa687; }
.thread-analytics-question.is-warning { border-left-color: #d2a052; }
.thread-analytics-question.is-danger { border-left-color: #c86e69; }

.thread-analytics-question-summary {
    display: grid;
    width: 100%;
    grid-template-columns: 32px minmax(0, 1fr) minmax(105px, auto) 20px;
    gap: 12px;
    align-items: center;
    padding: 14px 15px;
    text-align: left;
    background: transparent;
    border: 0;
}

.thread-analytics-question-summary:hover { background: #fafcfc; }

.thread-analytics-question-number {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    color: #607889;
    font-size: .65rem;
    font-weight: 800;
    background: #edf3f5;
    border-radius: 9px;
}

.thread-analytics-question-copy {
    min-width: 0;
}

.thread-analytics-question-copy small,
.thread-analytics-question-copy strong,
.thread-analytics-question-result small,
.thread-analytics-question-result strong {
    display: block;
}

.thread-analytics-question-copy small {
    margin-bottom: 3px;
    color: #8797a4;
    font-size: .58rem;
}

.thread-analytics-question-copy strong {
    color: #263f51;
    font-size: .74rem;
    font-weight: 690;
    line-height: 1.45;
}

.thread-analytics-question-result {
    text-align: right;
}

.thread-analytics-question-result strong {
    color: #2a7f7a;
    font-size: .94rem;
}

.thread-analytics-question.is-danger .thread-analytics-question-result strong { color: #b65d57; }
.thread-analytics-question.is-warning .thread-analytics-question-result strong { color: #ae792d; }

.thread-analytics-question-result small {
    color: #8999a5;
    font-size: .55rem;
}

.thread-analytics-question-chevron {
    color: #8798a5;
    font-size: 1.05rem;
    transition: transform .18s ease;
}

.thread-analytics-question.is-open .thread-analytics-question-chevron { transform: rotate(180deg); }

.thread-analytics-question-details {
    padding: 5px 15px 16px 59px;
    border-top: 1px solid #edf1f3;
}

.thread-analytics-distribution {
    display: grid;
    gap: 13px;
    padding-top: 12px;
}

.thread-analytics-answer > div:first-child {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 5px;
    color: #405869;
    font-size: .68rem;
}

.thread-analytics-answer > div:first-child span i { margin-right: 5px; color: #328d74; }
.thread-analytics-answer.is-leading > div:first-child,
.thread-analytics-answer.is-correct > div:first-child { color: #226f6a; font-weight: 700; }
.thread-analytics-answer.is-correct .thread-analytics-answer-bar i { background: #489c7e; }

.thread-analytics-answer > small {
    display: block;
    margin-top: 4px;
    color: #8a99a5;
    font-size: .56rem;
}

.thread-analytics-verbatims {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding-top: 12px;
}

.thread-analytics-verbatims blockquote {
    position: relative;
    min-width: 0;
    margin: 0;
    padding: 13px 14px 12px 35px;
    background: #f7fafb;
    border: 1px solid #e5ecef;
    border-radius: 11px;
}

.thread-analytics-verbatims blockquote > i {
    position: absolute;
    top: 11px;
    left: 11px;
    color: #70aaa6;
}

.thread-analytics-verbatims p {
    margin: 0;
    color: #405869;
    font-size: .67rem;
    line-height: 1.5;
}

.thread-analytics-verbatims small { color: #8394a1; font-size: .56rem; }

.thread-analytics-participant-toolbar {
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 13px;
}

.thread-analytics-filter-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.thread-analytics-filter-pills button {
    padding: 7px 10px;
    color: #62798a;
    font-size: .64rem;
    font-weight: 700;
    background: #f4f7f8;
    border: 1px solid #e0e8ec;
    border-radius: 9px;
}

.thread-analytics-filter-pills button span {
    margin-left: 4px;
    padding: 1px 5px;
    background: #e6edef;
    border-radius: 999px;
}

.thread-analytics-filter-pills button.active {
    color: #fff;
    background: #315e6b;
    border-color: #315e6b;
}

.thread-analytics-filter-pills button.active span { background: rgba(255,255,255,.15); }

.thread-analytics-participant-list {
    display: grid;
    gap: 7px;
}

.thread-analytics-participant {
    display: grid;
    grid-template-columns: 34px minmax(150px, 1fr) minmax(190px, 240px) 110px 90px 34px;
    gap: 12px;
    align-items: center;
    padding: 10px 12px;
    background: #fbfcfc;
    border: 1px solid #e4ebee;
    border-radius: 11px;
}

.thread-analytics-participant-avatar {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    color: #256e6a;
    font-size: .7rem;
    font-weight: 800;
    background: #dfeeed;
    border-radius: 10px;
}

.thread-analytics-participant-person { min-width: 0; }
.thread-analytics-participant-person strong,
.thread-analytics-participant-person small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.thread-analytics-participant-person strong { color: #2a4354; font-size: .7rem; }
.thread-analytics-participant-person small { color: #81929e; font-size: .57rem; }

.thread-analytics-participant-contacts {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.thread-analytics-participant-contacts span {
    display: flex;
    min-width: 0;
    gap: 5px;
    align-items: center;
    overflow: hidden;
    color: #718694;
    font-size: .58rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-analytics-participant-contacts i {
    flex: 0 0 auto;
    color: #60918e;
    font-size: .76rem;
}

.thread-analytics-status {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    width: max-content;
    color: #708493;
    font-size: .6rem;
    font-weight: 700;
}

.thread-analytics-status i {
    width: 7px;
    height: 7px;
    background: #a2afb8;
    border-radius: 50%;
}

.thread-analytics-status.is-started i { background: #d39a43; box-shadow: 0 0 0 3px #faefd9; }
.thread-analytics-status.is-finished i { background: #41967d; box-shadow: 0 0 0 3px #dff1e9; }

.thread-analytics-participant-score { text-align: right; }
.thread-analytics-participant-score strong,
.thread-analytics-participant-score small { display: block; }
.thread-analytics-participant-score strong { color: #294757; font-size: .72rem; }
.thread-analytics-participant-score small { color: #8998a3; font-size: .53rem; }

.thread-analytics-empty-inline {
    padding: 24px;
    color: #7a8e9d;
    font-size: .7rem;
    text-align: center;
    background: #f7fafb;
    border: 1px dashed #cfdee4;
    border-radius: 12px;
}

.thread-analytics-protected {
    display: flex;
    gap: 24px;
    align-items: center;
    margin-bottom: 22px;
    padding: 28px;
    background: linear-gradient(120deg, #f1f5f8, #fff);
    border: 1px solid #dce5ea;
    border-radius: 18px;
}

.thread-analytics-protected-ring {
    display: grid;
    width: 110px;
    height: 110px;
    flex: 0 0 110px;
    place-content: center;
    text-align: center;
    background: #fff;
    border: 9px solid #dce8eb;
    border-top-color: #5ba59f;
    border-radius: 50%;
}

.thread-analytics-protected-ring strong { color: #315869; font-size: 1.35rem; }
.thread-analytics-protected-ring span { color: #7c8e9a; font-size: .59rem; }

.thread-analytics-hero {
    position: relative;
    justify-content: space-between;
    gap: 30px;
    min-height: 190px;
    padding: 28px 32px;
    overflow: hidden;
    color: #fff;
    background: linear-gradient(120deg, #203743 0%, #254f5b 62%, #257d78 145%);
    border-radius: 20px;
    box-shadow: 0 16px 40px rgba(26, 57, 69, .2);
}

.thread-analytics-hero::after {
    position: absolute;
    right: -55px;
    bottom: -100px;
    width: 300px;
    height: 300px;
    content: '';
    border: 1px solid rgba(146, 229, 219, .18);
    border-radius: 50%;
    box-shadow: 0 0 0 45px rgba(112, 207, 196, .04), 0 0 0 90px rgba(112, 207, 196, .025);
}

.thread-analytics-hero-copy,
.thread-analytics-hero-actions { position: relative; z-index: 1; }
.thread-analytics-hero-copy { max-width: 760px; }

.thread-analytics-back {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    margin-bottom: 18px;
    color: rgba(226, 248, 245, .68);
    font-size: .65rem;
    font-weight: 700;
}

.thread-analytics-back:hover { color: #fff; }
.thread-analytics-hero-meta { gap: 12px; margin-bottom: 8px; color: rgba(231, 250, 247, .67); font-size: .62rem; }
.thread-analytics-live { display: inline-flex; gap: 6px; align-items: center; }
.thread-analytics-live i { width: 7px; height: 7px; background: #9caeb3; border-radius: 50%; }
.thread-analytics-live.is-active i { background: #72d2b2; box-shadow: 0 0 0 4px rgba(114,210,178,.13); }
.thread-analytics-hero h1 { max-width: 780px; margin: 0 0 8px; color: #fff; font-size: 1.7rem; line-height: 1.18; letter-spacing: -.03em; }
.thread-analytics-hero p { margin: 0; color: rgba(231, 250, 247, .68); font-size: .72rem; }
.thread-analytics-danger-action { color: #ffe8e6; background: rgba(158, 67, 63, .24); border: 1px solid rgba(255, 198, 193, .28); }
.thread-analytics-danger-action:hover { color: #fff; background: rgba(177, 71, 66, .42); }
.thread-analytics-hero-button { color: #eafffc; background: rgba(255,255,255,.09); border: 1px solid rgba(220,249,245,.22); }
.thread-analytics-hero-button:hover { color: #fff; background: rgba(255,255,255,.16); }

.thread-survey-control {
    margin: 18px 0 22px;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--analytics-border, #dce7ec);
    border-radius: 16px;
    box-shadow: 0 7px 24px rgba(28, 59, 81, .045);
}

.thread-survey-control > summary {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 20px;
    gap: 12px;
    align-items: center;
    padding: 14px 17px;
    list-style: none;
    cursor: pointer;
}

.thread-survey-control > summary::-webkit-details-marker { display: none; }
.thread-survey-control > summary > span { display: grid; width: 38px; height: 38px; place-items: center; color: #257b77; font-size: 1.1rem; background: #e7f3f2; border-radius: 11px; }
.thread-survey-control > summary strong,
.thread-survey-control > summary small { display: block; }
.thread-survey-control > summary strong { color: #294454; font-size: .76rem; }
.thread-survey-control > summary small { color: #82939e; font-size: .6rem; }
.thread-survey-control > summary > i { color: #81939f; transition: transform .18s ease; }
.thread-survey-control[open] > summary > i { transform: rotate(180deg); }
.thread-survey-control-body { padding: 18px; border-top: 1px solid #e8eef1; }
.thread-survey-launch-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.thread-survey-notification-choice { margin: 4px 0 14px; padding: 12px 14px; background: #f7fafb; border-radius: 11px; }
.thread-survey-notification-choice .form-group { margin-bottom: 3px; }
.thread-survey-notification-choice p { margin: 5px 0 0; color: #718592; font-size: .62rem; }
.thread-survey-public-link { display: flex; gap: 20px; align-items: center; }
.thread-survey-public-link img { width: 128px; height: 128px; padding: 7px; background: #fff; border: 1px solid #dce6ea; border-radius: 11px; }
.thread-survey-public-link > div { min-width: 0; }
.thread-survey-public-link span,
.thread-survey-public-link strong { display: block; }
.thread-survey-public-link span { margin-bottom: 3px; color: #7b8e9b; font-size: .6rem; }
.thread-survey-public-link strong { max-width: 580px; margin-bottom: 12px; overflow: hidden; color: #294657; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }

.thread-course-module-flow {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.thread-course-module-step {
    display: flex;
    min-width: 0;
    gap: 12px;
    padding: 15px;
    background: #f8fafb;
    border: 1px solid #e1eaed;
    border-radius: 13px;
}

.thread-course-module-index { color: #4b918d; font-size: .68rem; font-weight: 850; }
.thread-course-module-content { min-width: 0; flex: 1; }
.thread-course-module-content > div:first-child { display: flex; gap: 10px; align-items: flex-start; justify-content: space-between; margin-bottom: 10px; }
.thread-course-module-content h3 { margin: 0; color: #294353; font-size: .72rem; line-height: 1.4; }
.thread-course-module-content span { color: #82939f; font-size: .55rem; white-space: nowrap; }
.thread-course-module-content > small { display: block; margin-top: 7px; color: #81929e; font-size: .56rem; }
.thread-course-module-content > small strong { color: #327d78; }

@media (max-width: 1199.98px) {
    .thread-analytics-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .thread-analytics-block-grid,
    .thread-course-module-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
    .thread-analytics-toolbar { position: static; align-items: stretch; flex-direction: column; }
    .thread-analytics-nav { width: 100%; overflow-x: auto; }
    .thread-analytics-nav a { flex: 0 0 auto; }
    .thread-analytics-actions .btn { flex: 1; justify-content: center; }
    .thread-analytics-kpis,
    .thread-analytics-block-grid,
    .thread-course-module-flow { grid-template-columns: 1fr; }
    .thread-analytics-section { padding: 17px; }
    .thread-analytics-section-heading,
    .thread-analytics-participant-toolbar { align-items: stretch; flex-direction: column; }
    .thread-analytics-search { width: 100%; min-width: 0; }
    .thread-analytics-question-summary { grid-template-columns: 30px minmax(0, 1fr) 18px; gap: 9px; padding: 12px; }
    .thread-analytics-question-result { grid-column: 2; text-align: left; }
    .thread-analytics-question-chevron { grid-column: 3; grid-row: 1 / span 2; }
    .thread-analytics-question-details { padding: 5px 12px 14px; }
    .thread-analytics-verbatims { grid-template-columns: 1fr; }
    .thread-analytics-participant { grid-template-columns: 34px minmax(0, 1fr) 34px; }
    .thread-analytics-participant-contacts { grid-column: 2; }
    .thread-analytics-status { grid-column: 2; }
    .thread-analytics-participant-score { grid-column: 2; text-align: left; }
    .thread-analytics-participant > .btn { grid-column: 3; grid-row: 1; }
    .thread-analytics-protected { align-items: flex-start; flex-direction: column; }
    .thread-analytics-hero { align-items: flex-start; flex-direction: column; min-height: auto; padding: 24px 20px; }
    .thread-analytics-hero h1 { font-size: 1.35rem; }
    .thread-analytics-hero-actions { width: 100%; }
    .thread-analytics-hero-actions .btn { width: 100%; }
    .thread-survey-launch-grid { grid-template-columns: 1fr; }
    .thread-survey-public-link { align-items: flex-start; flex-direction: column; }
}

/* Курсы: самостоятельная структура модулей и контрольных вопросов. */
.thread-page-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.course-builder-module {
    overflow: hidden;
    border: 1px solid var(--thread-border);
    border-radius: 16px;
    box-shadow: 0 5px 18px rgba(25, 51, 78, .05);
}

.course-builder-module > .card-header {
    padding: 18px 20px;
    background: #f5f8fb;
    border-bottom-color: var(--thread-border);
}

.course-builder-question {
    padding: 14px 0;
    border-bottom: 1px solid #e8edf2;
}

.course-builder-question:first-child {
    padding-top: 0;
}

.course-builder-question:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.course-answer-options .input-group-text {
    background: #edf4f6;
    border-color: #d8e3e9;
}

.course-answer-list > div {
    display: grid;
    gap: 10px;
}

.course-answer-list label {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 14px 16px;
    color: #344d61;
    background: #f6f9fb;
    border: 1px solid #dbe5eb;
    border-radius: 11px;
    cursor: pointer;
}

.course-answer-list label:hover {
    border-color: #76b9b4;
    background: #f0f8f7;
}

.survey-public-shell {
    width: min(760px, 100%);
    margin: 0 auto;
}

.survey-public-card {
    border: 1px solid #dce6ec;
    border-radius: 18px;
    box-shadow: 0 16px 44px rgba(16, 39, 59, .12);
}

.survey-public-kicker {
    margin-bottom: 10px;
    color: #318f89;
    font-size: .72rem;
    font-weight: 750;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.survey-public-message {
    color: #52697c;
    line-height: 1.65;
}

/* Public completion flow: surveys and courses. */
.thread-flow {
    --flow-ink: #182d38;
    --flow-muted: #6f8088;
    --flow-accent: #248a83;
    --flow-accent-deep: #176d68;
    --flow-accent-soft: #e6f4f1;
    --flow-paper: #fffefa;
    --flow-line: #dce5e5;
    min-height: 100vh;
    color: var(--flow-ink);
    background: #edf2f2;
}

.thread-flow--public {
    --flow-accent: #4b7ca8;
    --flow-accent-deep: #345f86;
    --flow-accent-soft: #e8f0f7;
    background: #eef3f7;
}

.thread-flow--course {
    --flow-accent: #b56e43;
    --flow-accent-deep: #8d512f;
    --flow-accent-soft: #f7ece4;
    background: #f3f0eb;
}

.thread-flow--employee {
    --flow-accent: #3a928b;
    --flow-accent-deep: #246f6a;
    --flow-accent-soft: #e7f3f1;
}

.thread-flow-canvas {
    position: fixed;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.thread-flow-canvas::before {
    position: absolute;
    inset: 0;
    content: '';
    opacity: .42;
    background-image: radial-gradient(rgba(33, 72, 77, .16) .7px, transparent .7px);
    background-size: 18px 18px;
    mask-image: linear-gradient(to bottom, #000, transparent 55%);
}

.thread-flow-canvas i {
    position: absolute;
    border: 1px solid rgba(48, 125, 119, .11);
    border-radius: 50%;
}

.thread-flow-canvas i:nth-child(1) { top: -260px; right: -140px; width: 620px; height: 620px; }
.thread-flow-canvas i:nth-child(2) { top: -180px; right: -60px; width: 420px; height: 420px; }
.thread-flow-canvas i:nth-child(3) { bottom: -310px; left: -230px; width: 560px; height: 560px; }

.thread-flow-header,
.thread-flow-main,
.thread-flow-footer {
    position: relative;
    z-index: 1;
    width: min(1180px, calc(100% - 48px));
    margin-right: auto;
    margin-left: auto;
}

.thread-flow-header {
    display: grid;
    min-height: 78px;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    border-bottom: 1px solid rgba(77, 103, 108, .13);
}

.thread-flow-brand {
    display: inline-flex;
    width: max-content;
    gap: 9px;
    align-items: center;
    color: var(--flow-ink);
}

.thread-flow-brand:hover { color: var(--flow-ink); }
.thread-flow-brand img { width: 32px; height: 32px; object-fit: contain; }
.thread-flow-brand strong { font-size: 1rem; font-weight: 800; letter-spacing: -.045em; }

.thread-flow-context,
.thread-flow-safe {
    display: inline-flex;
    gap: 7px;
    align-items: center;
    color: #687b83;
    font-size: .65rem;
    font-weight: 680;
}

.thread-flow-context {
    padding: 6px 10px;
    background: rgba(255,255,255,.55);
    border: 1px solid rgba(100, 124, 128, .14);
    border-radius: 999px;
}

.thread-flow-context span { width: 6px; height: 6px; background: var(--flow-accent); border-radius: 50%; box-shadow: 0 0 0 3px color-mix(in srgb, var(--flow-accent) 14%, transparent); }
.thread-flow-safe { justify-self: end; }
.thread-flow-safe i { color: var(--flow-accent); font-size: .95rem; }

.thread-flow-main { min-height: calc(100vh - 132px); padding: 34px 0 46px; }

.thread-flow-layout {
    display: grid;
    grid-template-columns: 310px minmax(0, 1fr);
    gap: 22px;
    align-items: stretch;
}

.thread-flow-rail {
    position: relative;
    min-width: 0;
    color: #f3f8f7;
    background: #1c3740;
    border-radius: 27px 8px 8px 27px;
    box-shadow: 0 20px 55px rgba(25, 49, 56, .15);
}

.thread-flow--public .thread-flow-rail { background: #253f57; }
.thread-flow--course .thread-flow-rail { background: #3d352f; }

.thread-flow-rail::after {
    position: absolute;
    right: -1px;
    bottom: 0;
    width: 150px;
    height: 150px;
    content: '';
    opacity: .7;
    background: radial-gradient(circle at 100% 100%, color-mix(in srgb, var(--flow-accent) 30%, transparent), transparent 70%);
    border-radius: 100% 0 0;
    pointer-events: none;
}

.thread-flow-rail-sticky { position: sticky; top: 24px; padding: 34px 29px 38px; }

.thread-flow-eyebrow {
    display: block;
    margin-bottom: 9px;
    color: var(--flow-accent);
    font-size: .61rem;
    font-weight: 820;
    letter-spacing: .115em;
    text-transform: uppercase;
}

.thread-flow-rail .thread-flow-eyebrow { color: color-mix(in srgb, var(--flow-accent) 62%, #fff); }
.thread-flow-rail h1 { margin: 0 0 8px; color: #fff; font-size: 1.32rem; line-height: 1.24; letter-spacing: -.035em; }
.thread-flow-rail > div > p { margin: 0 0 27px; color: rgba(232, 244, 243, .58); font-size: .66rem; }

.thread-flow-progress-label { display: flex; align-items: center; justify-content: space-between; margin-bottom: 7px; color: rgba(237,247,246,.6); font-size: .58rem; }
.thread-flow-progress-label strong { color: #fff; font-size: .68rem; }
.thread-flow-progress { height: 4px; overflow: hidden; background: rgba(255,255,255,.12); border-radius: 999px; }
.thread-flow-progress i { display: block; height: 100%; background: color-mix(in srgb, var(--flow-accent) 70%, #fff); border-radius: inherit; transition: width .4s ease; }

.thread-flow-steps { display: grid; gap: 3px; margin: 27px 0 0; padding: 0; list-style: none; }
.thread-flow-steps li { position: relative; display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 10px; align-items: center; min-height: 50px; padding: 7px; border-radius: 11px; }
.thread-flow-steps li:not(:last-child)::after { position: absolute; bottom: -6px; left: 20px; width: 1px; height: 12px; content: ''; background: rgba(255,255,255,.13); }
.thread-flow-steps li > span { display: grid; width: 27px; height: 27px; place-items: center; color: rgba(239,248,247,.5); font-size: .58rem; font-weight: 800; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; }
.thread-flow-steps li strong,
.thread-flow-steps li small { display: block; }
.thread-flow-steps li strong { color: rgba(245,250,250,.63); font-size: .65rem; line-height: 1.3; }
.thread-flow-steps li small { margin-top: 2px; color: rgba(229,240,240,.4); font-size: .54rem; }
.thread-flow-steps li.is-active { background: rgba(255,255,255,.08); }
.thread-flow-steps li.is-active > span { color: #fff; background: var(--flow-accent); border-color: var(--flow-accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--flow-accent) 20%, transparent); }
.thread-flow-steps li.is-active strong { color: #fff; }
.thread-flow-steps li.is-complete > span { color: #bfe8db; background: rgba(73,167,138,.2); border-color: rgba(127,211,185,.3); }

.thread-flow-workspace {
    min-width: 0;
    padding: 34px 38px 36px;
    background: var(--flow-paper);
    border: 1px solid rgba(107, 128, 129, .18);
    border-radius: 8px 27px 27px 8px;
    box-shadow: 0 20px 55px rgba(39, 63, 67, .1);
}

.thread-flow-workspace.is-question { display: flex; min-height: 620px; flex-direction: column; }
.thread-flow-workspace-head { display: flex; gap: 14px; align-items: center; justify-content: space-between; margin-bottom: 34px; }
.thread-flow-badge,
.thread-flow-time { display: inline-flex; gap: 7px; align-items: center; color: #64777e; font-size: .6rem; font-weight: 700; }
.thread-flow-badge { padding: 7px 10px; color: var(--flow-accent-deep); background: var(--flow-accent-soft); border-radius: 999px; }
.thread-flow-badge i { font-size: .9rem; }
.thread-flow-time { text-align: right; }

.thread-flow-intro { max-width: 680px; margin-bottom: 28px; }
.thread-flow-intro h2,
.thread-flow-question-head h2 { margin: 0; color: var(--flow-ink); font-weight: 720; letter-spacing: -.03em; }
.thread-flow-intro h2 { margin-bottom: 13px; font-size: 1.55rem; }
.thread-flow-message { color: #4f656e; font-size: .74rem; line-height: 1.72; overflow-wrap: anywhere; }
.thread-flow-message a { color: var(--flow-accent-deep); font-weight: 650; text-decoration: underline; text-underline-offset: 2px; }

.thread-flow-section-title { display: flex; gap: 11px; align-items: center; margin-bottom: 12px; }
.thread-flow-section-title > span { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; color: var(--flow-accent-deep); background: var(--flow-accent-soft); border-radius: 10px; }
.thread-flow-section-title strong,
.thread-flow-section-title small { display: block; }
.thread-flow-section-title strong { color: #2b414a; font-size: .69rem; }
.thread-flow-section-title small { color: #839197; font-size: .55rem; }

.thread-flow-materials { margin: 28px 0; }
.thread-flow-material-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.thread-flow-media { position: relative; display: block; min-width: 0; overflow: hidden; background: #e9eeee; border: 1px solid #d9e3e3; border-radius: 13px; }
.thread-flow-media img,
.thread-flow-media video { display: block; width: 100%; max-height: 330px; object-fit: cover; }
.thread-flow-media.is-image > span { position: absolute; right: 8px; bottom: 8px; display: inline-flex; gap: 5px; align-items: center; padding: 6px 8px; color: #fff; font-size: .55rem; background: rgba(19,39,45,.72); border-radius: 7px; backdrop-filter: blur(6px); }
.thread-flow-document { display: grid; grid-column: 1 / -1; grid-template-columns: 38px minmax(0,1fr) 20px; gap: 10px; align-items: center; padding: 11px 13px; color: #314a53; background: #f7f9f8; border: 1px solid #e0e7e5; border-radius: 11px; }
.thread-flow-document:hover { color: var(--flow-accent-deep); background: var(--flow-accent-soft); border-color: color-mix(in srgb, var(--flow-accent) 35%, #fff); }
.thread-flow-document > span { display: grid; width: 36px; height: 36px; place-items: center; color: var(--flow-accent-deep); background: var(--flow-accent-soft); border-radius: 9px; }
.thread-flow-document strong,
.thread-flow-document small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.thread-flow-document strong { font-size: .65rem; }
.thread-flow-document small { color: #849298; font-size: .54rem; }

.thread-flow-trust-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin: 25px 0; }
.thread-flow-trust-grid > div { display: grid; grid-template-columns: 30px 1fr; gap: 0 9px; align-items: center; padding: 12px; background: #f6f8f7; border: 1px solid #e4e9e7; border-radius: 11px; }
.thread-flow-trust-grid i { grid-row: 1 / span 2; color: var(--flow-accent); font-size: 1.2rem; }
.thread-flow-trust-grid strong,
.thread-flow-trust-grid span { display: block; }
.thread-flow-trust-grid strong { color: #324851; font-size: .63rem; }
.thread-flow-trust-grid span { color: #7c8c92; font-size: .53rem; }

.thread-flow-action { display: flex; gap: 14px; align-items: center; margin-top: 24px; }
.thread-flow-action > small { max-width: 170px; color: #839096; font-size: .55rem; line-height: 1.45; }
.thread-flow-primary {
    display: inline-flex;
    min-height: 45px;
    gap: 22px;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px 10px 18px;
    color: #fff;
    font-size: .7rem;
    font-weight: 750;
    background: var(--flow-accent-deep);
    border: 0;
    border-radius: 11px;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--flow-accent) 22%, transparent);
}
.thread-flow-primary > i { display: grid; width: 25px; height: 25px; place-items: center; background: rgba(255,255,255,.13); border-radius: 7px; }
.thread-flow-primary:hover,
.thread-flow-primary:focus { color: #fff; background: color-mix(in srgb, var(--flow-accent-deep) 86%, #000); transform: translateY(-1px); }
.thread-flow-primary.loading { pointer-events: none; opacity: .7; }
.thread-flow-legal { margin: 19px 0 0; color: #87949a; font-size: .53rem; line-height: 1.5; }
.thread-flow-legal a { color: #647c86; text-decoration: underline; }

.thread-flow-course-callout { display: flex; gap: 12px; align-items: flex-start; margin: 24px 0; padding: 14px; background: #faf5f0; border: 1px solid #eee0d5; border-radius: 12px; }
.thread-flow-course-callout > span { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; color: #9b5a35; background: #f3e3d7; border-radius: 10px; }
.thread-flow-course-callout strong { color: #55443a; font-size: .66rem; }
.thread-flow-course-callout p { margin: 2px 0 0; color: #85756b; font-size: .57rem; line-height: 1.5; }

.thread-flow-question-head { max-width: 690px; margin-bottom: 26px; }
.thread-flow-question-head > span { display: block; margin-bottom: 10px; color: var(--flow-accent-deep); font-size: .6rem; font-weight: 780; }
.thread-flow-question-head h2 { font-size: 1.35rem; line-height: 1.38; }
.thread-flow-question-head p { margin: 9px 0 0; color: #7b898f; font-size: .62rem; }

.thread-flow-choices { display: grid; gap: 9px; }
.thread-flow-choice { position: relative; display: grid; min-height: 53px; grid-template-columns: 30px minmax(0,1fr) 24px; gap: 11px; align-items: center; margin: 0; padding: 10px 13px; color: #314851; background: #f8faf9; border: 1px solid #dfe7e5; border-radius: 12px; cursor: pointer; transition: border-color .16s ease, background .16s ease, transform .16s ease; }
.thread-flow-choice:hover { background: color-mix(in srgb, var(--flow-accent-soft) 45%, #fff); border-color: color-mix(in srgb, var(--flow-accent) 38%, #ddd); transform: translateX(2px); }
.thread-flow-choice input { position: absolute; opacity: 0; pointer-events: none; }
.thread-flow-choice-marker { display: grid; width: 29px; height: 29px; place-items: center; color: #73858b; font-size: .63rem; font-weight: 800; background: #ebefee; border-radius: 8px; }
.thread-flow-choice-marker i { width: 9px; height: 9px; border: 1.5px solid #839297; border-radius: 50%; }
.thread-flow-choice strong { font-size: .69rem; font-weight: 650; line-height: 1.4; }
.thread-flow-choice-check { color: transparent; font-size: 1rem; }
.thread-flow-choice:has(input:checked),
.thread-flow-choice.is-selected { color: var(--flow-accent-deep); background: var(--flow-accent-soft); border-color: color-mix(in srgb, var(--flow-accent) 55%, #fff); box-shadow: 0 7px 18px color-mix(in srgb, var(--flow-accent) 10%, transparent); }
.thread-flow-choice:has(input:checked) .thread-flow-choice-marker,
.thread-flow-choice.is-selected .thread-flow-choice-marker { color: #fff; background: var(--flow-accent); }
.thread-flow-choice:has(input:checked) .thread-flow-choice-marker i,
.thread-flow-choice.is-selected .thread-flow-choice-marker i { background: #fff; border-color: #fff; box-shadow: inset 0 0 0 2px var(--flow-accent); }
.thread-flow-choice:has(input:checked) .thread-flow-choice-check,
.thread-flow-choice.is-selected .thread-flow-choice-check { color: var(--flow-accent); }

.thread-flow-text-answer { position: relative; }
.thread-flow-text-answer textarea { min-height: 180px; padding: 16px 17px 32px; color: #304850; font-size: .72rem; line-height: 1.6; resize: vertical; background: #f9faf9; border: 1px solid #dce5e3; border-radius: 13px; }
.thread-flow-text-answer textarea:focus { background: #fff; border-color: var(--flow-accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--flow-accent) 11%, transparent); }
.thread-flow-text-answer > small { position: absolute; right: 12px; bottom: 9px; z-index: 2; color: #8a979b; font-size: .52rem; }
.thread-flow-text-answer .form-group { margin: 0; }

.thread-flow-question-actions { display: flex; gap: 16px; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 29px; }
.thread-flow-question-actions.is-end { justify-content: flex-end; }
.thread-flow-secondary { display: inline-flex; gap: 6px; align-items: center; color: #71838a; font-size: .62rem; font-weight: 680; }
.thread-flow-secondary:hover { color: var(--flow-accent-deep); }
.thread-flow-save-note { margin: 14px 0 0; color: #89969b; font-size: .53rem; text-align: right; }
.thread-flow-save-note i { margin-right: 5px; color: var(--flow-accent); }
.thread-flow-workspace .invalid-feedback { margin-top: 7px; color: #b8524e; font-size: .58rem; }

.thread-flow-finish { width: min(820px, 100%); margin: 12px auto 0; }
.thread-flow-finish-hero { padding: 45px 42px 38px; text-align: center; background: var(--flow-paper); border: 1px solid rgba(107,128,129,.18); border-radius: 28px 28px 10px 10px; box-shadow: 0 20px 55px rgba(39,63,67,.1); }
.thread-flow-finish-mark { display: grid; width: 58px; height: 58px; margin: 0 auto 18px; place-items: center; color: #fff; font-size: 1.55rem; background: var(--flow-accent); border-radius: 18px; box-shadow: 0 12px 25px color-mix(in srgb, var(--flow-accent) 24%, transparent); transform: rotate(-4deg); }
.thread-flow-finish-hero h1 { margin: 0 0 9px; color: var(--flow-ink); font-size: 1.75rem; letter-spacing: -.04em; }
.thread-flow-finish-hero > p { max-width: 540px; margin: 0 auto; color: #6f8087; font-size: .7rem; line-height: 1.6; }
.thread-flow-finish-message { max-width: 620px; margin: 21px auto 0; padding: 13px 15px; color: #536970; font-size: .65rem; line-height: 1.55; background: #f5f8f7; border-radius: 11px; }
.thread-flow-finish-hero > .thread-flow-primary { margin-top: 24px; }
.thread-flow-finish-meta { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; margin-top: 1px; overflow: hidden; background: #dfe6e4; border: 1px solid #dfe6e4; border-radius: 10px 10px 24px 24px; box-shadow: 0 14px 35px rgba(39,63,67,.07); }
.thread-flow-finish-meta > div { padding: 17px; text-align: center; background: rgba(255,254,250,.94); }
.thread-flow-finish-meta span,
.thread-flow-finish-meta small { display: block; }
.thread-flow-finish-meta span { color: var(--flow-accent-deep); font-size: 1.2rem; font-weight: 800; }
.thread-flow-finish-meta small { color: #7e8e93; font-size: .56rem; }

.thread-flow-review { margin-top: 21px; padding: 24px; background: rgba(255,254,250,.86); border: 1px solid #dce5e3; border-radius: 18px; }
.thread-flow-review-list { display: grid; gap: 7px; }
.thread-flow-review-list article { display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 10px; padding: 11px 12px; background: #f7f9f8; border-radius: 10px; }
.thread-flow-review-list article > span { display: grid; width: 26px; height: 26px; place-items: center; color: #74868c; font-size: .56rem; font-weight: 800; background: #e8eeec; border-radius: 7px; }
.thread-flow-review-list strong { display: block; color: #334b53; font-size: .64rem; line-height: 1.45; }
.thread-flow-review-list p { margin: 4px 0 0; color: var(--flow-accent-deep); font-size: .59rem; }
.thread-flow-review-list p i { margin-right: 5px; }
.thread-flow-review-list p.is-muted { color: #8c989c; }
.thread-flow-restart { display: flex; gap: 12px; align-items: center; justify-content: center; margin: 18px 0 0; color: #7c8c91; font-size: .57rem; }
.thread-flow-restart a { display: inline-flex; gap: 5px; align-items: center; color: var(--flow-accent-deep); font-weight: 700; }

.thread-flow-score { position: relative; display: grid; width: 138px; height: 138px; margin: 27px auto 17px; place-items: center; background: conic-gradient(var(--flow-accent) var(--score), #e5e8e5 0); border-radius: 50%; }
.thread-flow-score::before { position: absolute; width: 112px; height: 112px; content: ''; background: var(--flow-paper); border-radius: 50%; }
.thread-flow-score > div { position: relative; z-index: 1; }
.thread-flow-score strong,
.thread-flow-score span { display: block; }
.thread-flow-score strong { color: var(--flow-accent-deep); font-size: 1.65rem; letter-spacing: -.04em; }
.thread-flow-score span { color: #879398; font-size: .53rem; }
.thread-flow-score.is-low { --flow-accent: #b96059; --flow-accent-deep: #984b46; }
.thread-flow-score-threshold { display: inline-flex; gap: 9px; align-items: center; padding: 7px 10px; color: #7a898e; font-size: .57rem; background: #f2f5f3; border-radius: 8px; }
.thread-flow-score-threshold strong { color: #3b5159; }

.thread-employee-workspace { min-height: 590px; }
.thread-employee-register-form { max-width: 690px; }
.thread-employee-register-form .form-label { margin-bottom: 6px; color: #4f656d; font-size: .61rem; font-weight: 720; }
.thread-employee-register-form .form-control,
.thread-employee-register-form .form-select { min-height: 45px; padding: 10px 13px; color: #2d464f; font-size: .7rem; background-color: #f8faf9; border-color: #dce5e3; border-radius: 10px; }
.thread-employee-register-form .form-control:focus,
.thread-employee-register-form .form-select:focus { background-color: #fff; border-color: var(--flow-accent); box-shadow: 0 0 0 4px rgba(58,146,139,.1); }
.thread-employee-field-main { margin-bottom: 7px; }
.thread-employee-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.thread-employee-consent { margin-top: 8px; padding: 14px 15px; background: #f4f7f6; border: 1px solid #e1e8e6; border-radius: 11px; }
.thread-employee-consent .form-check { display: flex; gap: 9px; align-items: flex-start; min-height: 0; margin: 0; padding: 0; }
.thread-employee-consent .form-check-input { position: static; width: 17px; height: 17px; flex: 0 0 17px; margin: 1px 0 0; }
.thread-employee-consent .form-check-label { color: #435a62; font-size: .64rem; line-height: 1.45; }
.thread-employee-consent .form-check-label a { color: var(--flow-accent-deep); text-decoration: underline; text-underline-offset: 2px; }
.thread-employee-consent p { margin: 7px 0 0 26px; color: #859298; font-size: .53rem; }
.thread-employee-form-actions { display: flex; gap: 18px; align-items: center; justify-content: flex-end; margin-top: 24px; }
.thread-employee-form-actions > span { display: inline-flex; gap: 5px; align-items: center; color: #829096; font-size: .54rem; }
.thread-employee-form-actions > span i { color: var(--flow-accent); }
.thread-employee-form-actions .thread-flow-primary { width: auto; min-width: 205px; }

.thread-employee-confirmed-head { display: flex; max-width: 690px; gap: 15px; align-items: flex-start; margin-bottom: 30px; }
.thread-employee-confirmed-head > span { display: grid; width: 46px; height: 46px; flex: 0 0 46px; place-items: center; color: #fff; font-size: 1.2rem; background: var(--flow-accent); border-radius: 14px; box-shadow: 0 10px 22px rgba(39,130,123,.2); }
.thread-employee-confirmed-head h2 { margin: 0 0 6px; color: var(--flow-ink); font-size: 1.35rem; letter-spacing: -.03em; }
.thread-employee-confirmed-head p { margin: 0; color: #71838a; font-size: .66rem; line-height: 1.55; }
.thread-employee-channel-layout { display: grid; max-width: 720px; grid-template-columns: 190px minmax(0,1fr); gap: 17px; align-items: stretch; }
.thread-employee-channel-layout.is-without-qr { max-width: 440px; grid-template-columns: minmax(0,1fr); }
.thread-employee-channel-qr { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 15px; text-align: center; background: #f5f8f7; border: 1px solid #e0e8e6; border-radius: 14px; }
.thread-employee-channel-qr img { width: 132px; height: 132px; margin-bottom: 10px; padding: 5px; background: #fff; border-radius: 9px; }
.thread-employee-channel-qr strong,
.thread-employee-channel-qr small { display: block; }
.thread-employee-channel-qr strong { color: #3a535b; font-size: .62rem; }
.thread-employee-channel-qr small { color: #849298; font-size: .52rem; }
.thread-employee-channel-list { display: grid; gap: 9px; align-content: center; }
.thread-employee-channel { display: grid; min-height: 78px; grid-template-columns: 42px minmax(0,1fr) 20px; gap: 12px; align-items: center; padding: 13px 15px; color: #314a53; background: #f8faf9; border: 1px solid #dfe7e5; border-radius: 13px; transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.thread-employee-channel:hover { color: var(--flow-accent-deep); border-color: #9ccac6; box-shadow: 0 9px 22px rgba(39,99,96,.09); transform: translateY(-1px); }
.thread-employee-channel > span { display: grid; width: 42px; height: 42px; place-items: center; color: #fff; font-size: 1.15rem; background: #438eac; border-radius: 12px; }
.thread-employee-channel.is-max > span { background: #7b68a7; }
.thread-employee-channel strong,
.thread-employee-channel small { display: block; }
.thread-employee-channel strong { font-size: .7rem; }
.thread-employee-channel small { margin-top: 2px; color: #849299; font-size: .54rem; }
.thread-employee-channel > i { color: #7d9097; }
.thread-employee-optional-note { margin: 20px 0 0; color: #7d8d93; font-size: .56rem; }
.thread-employee-optional-note i { margin-right: 5px; color: var(--flow-accent); }

.thread-flow-footer { display: flex; min-height: 54px; align-items: center; justify-content: space-between; color: #819095; font-size: .55rem; border-top: 1px solid rgba(77,103,108,.12); }
.thread-flow-footer a { color: inherit; }

@media (max-width: 899.98px) {
    .thread-flow-layout { grid-template-columns: 230px minmax(0,1fr); gap: 14px; }
    .thread-flow-rail-sticky { padding: 27px 21px; }
    .thread-flow-workspace { padding: 28px 27px; }
}

@media (max-width: 699.98px) {
    .thread-flow-header,
    .thread-flow-main,
    .thread-flow-footer { width: min(100% - 28px, 600px); }
    .thread-flow-header { min-height: 66px; grid-template-columns: 1fr auto; }
    .thread-flow-context { display: none; }
    .thread-flow-safe span { display: none; }
    .thread-flow-main { padding: 18px 0 30px; }
    .thread-flow-layout { grid-template-columns: 1fr; gap: 9px; }
    .thread-flow-rail { border-radius: 20px 20px 7px 7px; }
    .thread-flow-rail-sticky { position: static; padding: 22px 20px; }
    .thread-flow-rail h1 { font-size: 1.05rem; }
    .thread-flow-rail > div > p { margin-bottom: 17px; }
    .thread-flow-steps { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; margin-top: 18px; }
    .thread-flow-steps li { min-height: 42px; grid-template-columns: 24px minmax(0,1fr); gap: 6px; padding: 5px; }
    .thread-flow-steps li:not(:last-child)::after { display: none; }
    .thread-flow-steps li > span { width: 23px; height: 23px; }
    .thread-flow-steps li small { display: none; }
    .thread-flow-steps li strong { font-size: .55rem; }
    .thread-flow-workspace { min-height: auto !important; padding: 23px 19px 25px; border-radius: 7px 7px 20px 20px; }
    .thread-flow-workspace-head { margin-bottom: 25px; }
    .thread-flow-time { font-size: .53rem; }
    .thread-flow-intro h2 { font-size: 1.3rem; }
    .thread-flow-question-head h2 { font-size: 1.12rem; }
    .thread-flow-material-grid,
    .thread-flow-trust-grid { grid-template-columns: 1fr; }
    .thread-flow-media,
    .thread-flow-document { grid-column: 1; }
    .thread-flow-question-actions { align-items: stretch; flex-direction: column-reverse; }
    .thread-flow-question-actions .thread-flow-primary,
    .thread-flow-action .thread-flow-primary { width: 100%; }
    .thread-flow-question-actions.is-end { align-items: stretch; }
    .thread-flow-action { align-items: stretch; flex-direction: column; }
    .thread-flow-action > small { max-width: none; }
    .thread-flow-secondary { justify-content: center; }
    .thread-flow-save-note { text-align: center; }
    .thread-flow-finish { margin-top: 0; }
    .thread-flow-finish-hero { padding: 36px 20px 30px; border-radius: 22px 22px 8px 8px; }
    .thread-flow-finish-hero h1 { font-size: 1.35rem; }
    .thread-flow-review { padding: 18px 14px; }
    .thread-flow-restart { align-items: flex-start; flex-direction: column; }
    .thread-employee-field-grid,
    .thread-employee-channel-layout { grid-template-columns: 1fr; }
    .thread-employee-form-actions { align-items: stretch; flex-direction: column-reverse; }
    .thread-employee-form-actions .thread-flow-primary { width: 100%; }
    .thread-employee-channel-qr { display: none; }
}

@media (max-width: 720px) {
    .thread-page-heading,
    .course-builder-module > .card-header {
        flex-direction: column;
    }

    .thread-page-heading > .d-flex,
    .course-builder-module > .card-header > .d-flex {
        width: 100%;
        flex-wrap: wrap;
    }
}

/* Чаты кабинета: поддержка и обращения сотрудников. */
.thread-support-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 20px;
    min-height: 610px;
    height: calc(100vh - 205px);
}

.thread-support-chat,
.thread-support-aside,
.thread-chat {
    min-width: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid #dce6ed;
    border-radius: 18px;
    box-shadow: 0 12px 36px rgba(24, 54, 78, .07);
}

.thread-support-chat .thread-chat,
.thread-support-chat .app-chat-history,
.thread-support-chat .chat-history-wrapper {
    height: 100% !important;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.thread-support-aside {
    display: flex;
    padding: 26px;
    flex-direction: column;
    background:
        radial-gradient(circle at 100% 0, rgba(50, 185, 172, .11), transparent 34%),
        linear-gradient(155deg, #f8fbfc 0%, #f1f6f8 100%);
}

.thread-support-intro {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.thread-support-intro__icon,
.thread-chat-empty__icon {
    display: inline-flex;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    align-items: center;
    justify-content: center;
    color: #177e78;
    font-size: 1.35rem;
    background: #e4f5f2;
    border: 1px solid #cce9e5;
    border-radius: 14px;
}

.thread-support-kicker,
.thread-chat-kicker {
    display: block;
    margin-bottom: 5px;
    color: #74899b;
    font-size: .66rem;
    font-weight: 750;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.thread-support-intro h2 {
    margin: 0 0 8px;
    color: #233a4e;
    font-size: 1.22rem;
    font-weight: 740;
}

.thread-support-intro p {
    margin: 0;
    color: #61778a;
    font-size: .79rem;
    line-height: 1.65;
}

.thread-support-status {
    display: flex;
    gap: 11px;
    align-items: center;
    margin: 26px 0 18px;
    padding: 14px 15px;
    background: rgba(255, 255, 255, .8);
    border: 1px solid #dce8ed;
    border-radius: 13px;
}

.thread-support-status__dot {
    width: 10px;
    height: 10px;
    flex: 0 0 10px;
    background: #30ae91;
    border: 2px solid #d9f4ed;
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgba(48, 174, 145, .14);
}

.thread-support-status strong,
.thread-support-status span {
    display: block;
}

.thread-support-status strong {
    color: #2c4559;
    font-size: .76rem;
}

.thread-support-status span {
    margin-top: 2px;
    color: #8293a2;
    font-size: .68rem;
}

.thread-support-contacts {
    display: grid;
    gap: 9px;
}

.thread-support-contact {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 18px;
    gap: 11px;
    align-items: center;
    padding: 11px;
    color: inherit;
    background: rgba(255, 255, 255, .72);
    border: 1px solid transparent;
    border-radius: 12px;
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

.thread-support-contact:hover {
    color: inherit;
    background: #fff;
    border-color: #d4e3e9;
    transform: translateY(-1px);
}

.thread-support-contact__icon {
    display: inline-flex;
    width: 38px;
    height: 38px;
    align-items: center;
    justify-content: center;
    color: #357a87;
    font-size: 1rem;
    background: #eaf2f5;
    border-radius: 10px;
}

.thread-support-contact small,
.thread-support-contact strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-support-contact small {
    margin-bottom: 2px;
    color: #8395a4;
    font-size: .63rem;
}

.thread-support-contact strong {
    color: #334d61;
    font-size: .72rem;
    font-weight: 680;
}

.thread-support-contact__arrow {
    color: #9aabb8;
    font-size: .85rem;
}

.thread-support-note {
    display: flex;
    gap: 7px;
    align-items: flex-start;
    margin: auto 0 0;
    padding-top: 22px;
    color: #8496a4;
    font-size: .66rem;
    line-height: 1.45;
}

.thread-support-note i {
    color: #4e948f;
    font-size: .92rem;
}

.thread-chat {
    position: relative;
    height: calc(100vh - 205px);
    min-height: 610px;
}

.thread-chat > .row,
.thread-chat .app-chat-history,
.thread-chat .chat-history-wrapper,
.thread-chat .chat-inner-block {
    min-height: 0;
    height: 100% !important;
}

.thread-chat .app-chat-history {
    background: #f5f8fa;
}

.thread-chat .chat-history-wrapper,
.thread-chat .chat-inner-block {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    background: transparent !important;
}

.thread-chat .chat-inner-block > .thread-chat-empty {
    grid-row: 1 / -1;
}

.thread-chat-header {
    display: flex;
    min-height: 76px;
    padding: 14px 20px !important;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid #e0e8ee;
}

.thread-chat-profile {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 12px;
}

.thread-chat-profile__mark,
.thread-chat-profile__avatar {
    position: relative;
    display: inline-flex;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    color: #167c76;
    font-size: 1.22rem;
    background: linear-gradient(145deg, #e8f6f4, #d8efec);
    border: 1px solid #cce6e3;
    border-radius: 13px;
}

.thread-chat-profile__mark > span {
    position: absolute;
    right: 3px;
    bottom: 3px;
    width: 9px;
    height: 9px;
    background: #35b294;
    border: 2px solid #fff;
    border-radius: 50%;
}

.thread-chat-profile__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.thread-chat-profile__copy {
    min-width: 0;
}

.thread-chat-profile__copy h2 {
    overflow: hidden;
    margin: 0 0 3px;
    color: #243d51;
    font-size: .9rem;
    font-weight: 740;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-chat-profile__copy > span {
    display: block;
    overflow: hidden;
    color: #8193a2;
    font-size: .68rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-chat-channel {
    display: inline-flex;
    padding: 7px 10px;
    align-items: center;
    gap: 5px;
    color: #61798b;
    font-size: .65rem;
    font-weight: 650;
    white-space: nowrap;
    background: #f2f6f8;
    border: 1px solid #e0e8ed;
    border-radius: 999px;
}

.thread-chat .chat-history-body {
    position: relative;
    height: auto !important;
    min-height: 0;
    padding: 26px 24px !important;
    overflow: hidden;
    background:
        radial-gradient(circle at 10% 8%, rgba(65, 164, 170, .055), transparent 23%),
        linear-gradient(#f6f9fa, #f3f7f9);
}

.thread-chat .chat-history {
    display: flex;
    min-height: 100%;
    margin: 0;
    flex-direction: column;
    justify-content: flex-end;
}

.thread-chat .chat-message {
    display: flex;
    width: 100%;
    margin: 0 0 18px !important;
    justify-content: flex-start;
}

.thread-chat .chat-message:last-child {
    margin-bottom: 0 !important;
}

.thread-chat .chat-message-right {
    justify-content: flex-end !important;
}

.thread-chat .chat-message-wrapper {
    width: auto;
    max-width: min(72%, 720px);
}

.thread-chat-message-meta {
    display: flex;
    margin: 0 4px 6px;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    color: #8a9aa7;
    font-size: .61rem;
}

.thread-chat-message-meta span {
    color: #667d8f;
    font-weight: 700;
}

.thread-chat .chat-message-right .thread-chat-message-meta {
    justify-content: flex-end;
}

.thread-chat .chat-message-text {
    padding: 11px 14px !important;
    color: #344e62;
    background: #fff;
    border: 1px solid #dce6ec;
    border-radius: 4px 14px 14px 14px !important;
    box-shadow: 0 5px 16px rgba(34, 65, 87, .045);
}

.thread-chat .chat-message-right .chat-message-text {
    color: #174c4d;
    background: #dff2ef;
    border-color: #c5e5e0;
    border-radius: 14px 4px 14px 14px !important;
}

.thread-chat .chat-message-text p {
    margin: 0;
    font-size: .76rem;
    line-height: 1.62;
    overflow-wrap: anywhere;
}

/* Vendor app-chat загружается после темы: фиксируем палитру Thread более точным селектором. */
.light-style .app-chat.thread-chat .app-chat-history {
    background: #f5f8fa;
}

.light-style .app-chat.thread-chat .app-chat-history .chat-history-wrapper {
    background: transparent;
}

.light-style .app-chat.thread-chat .app-chat-history .chat-history-footer {
    background: #fff;
    box-shadow: none;
}

.light-style .app-chat.thread-chat .app-chat-history .chat-history-body .chat-history .chat-message .chat-message-text {
    color: #344e62;
    background: #fff;
    border-color: #dce6ec;
    box-shadow: 0 5px 16px rgba(34, 65, 87, .045);
}

.light-style .app-chat.thread-chat .app-chat-history .chat-history-body .chat-history .chat-message.chat-message-right .chat-message-text {
    color: #174c4d !important;
    background: #dff2ef !important;
    border-color: #c5e5e0;
}

.thread-chat-composer {
    position: relative;
    z-index: 2;
    margin: 0 !important;
    padding: 13px 16px 15px !important;
    background: #fff !important;
    border-top: 1px solid #dfe8ed;
    border-radius: 0 !important;
}

.thread-chat-composer form {
    padding: 8px 8px 8px 14px;
    background: #f6f9fa;
    border: 1px solid #d7e2e8;
    border-radius: 13px;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.thread-chat-composer form:focus-within {
    border-color: #7bbab7;
    box-shadow: 0 0 0 3px rgba(46, 153, 147, .1);
}

.thread-chat-composer form.has-error {
    border-color: #d77171;
    animation: thread-chat-shake .25s linear 2;
}

.thread-chat-composer .message-input {
    width: 100%;
    min-height: 30px;
    max-height: 144px;
    padding: 4px 2px;
    resize: none;
    overflow-y: auto;
    color: #344c5f;
    font-size: .76rem;
    line-height: 1.45;
    background: transparent;
    border: 0 !important;
}

.thread-chat-composer .message-input::placeholder {
    color: #94a3af;
}

.thread-chat-composer__actions {
    display: flex;
    min-height: 36px;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
}

.thread-chat-composer__actions > span {
    padding: 0 0 5px 2px;
    color: #94a3ae;
    font-size: .59rem;
}

.thread-chat-send {
    display: inline-flex;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: .94rem;
    background: #248f88;
    border: 0;
    border-radius: 10px;
    box-shadow: 0 6px 14px rgba(35, 143, 136, .2);
    transition: background .18s ease, transform .18s ease, opacity .18s ease;
}

.thread-chat-send:hover {
    background: #197b75;
    transform: translateY(-1px);
}

.thread-chat-send:disabled {
    cursor: wait;
    opacity: .6;
}

.thread-chat--employees .app-chat-contacts {
    position: static;
    display: flex;
    width: 350px;
    height: 100% !important;
    flex-basis: 350px;
    flex-direction: column;
    background: #fff;
    border-right: 1px solid #dfe7ed;
    box-shadow: none;
}

.thread-chat-sidebar-header {
    display: flex;
    min-height: 81px;
    padding: 17px 18px 12px;
    align-items: center;
    justify-content: space-between;
}

.thread-chat-sidebar-header h2 {
    margin: 0;
    color: #263f53;
    font-size: 1rem;
    font-weight: 740;
}

.thread-chat-sidebar-header h2 span {
    display: inline-flex;
    min-width: 24px;
    height: 24px;
    margin-left: 4px;
    padding: 0 7px;
    align-items: center;
    justify-content: center;
    color: #537083;
    font-size: .65rem;
    background: #edf3f5;
    border-radius: 999px;
}

.thread-chat-icon-button {
    display: inline-flex;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    color: #587083;
    background: #f1f5f7;
    border: 1px solid #dce5ea;
    border-radius: 10px;
}

.thread-chat-search {
    position: relative;
    margin: 0 14px 12px;
}

.thread-chat-search > i {
    position: absolute;
    top: 50%;
    left: 12px;
    color: #8295a3;
    font-size: 1rem;
    transform: translateY(-50%);
}

.thread-chat-search input {
    width: 100%;
    height: 40px;
    padding: 0 38px 0 36px;
    color: #3c5669;
    font-size: .72rem;
    background: #f3f7f8;
    border: 1px solid #e0e8ec;
    border-radius: 11px;
    outline: none;
}

.thread-chat-search input:focus {
    background: #fff;
    border-color: #8bc1be;
    box-shadow: 0 0 0 3px rgba(46, 153, 147, .08);
}

.thread-chat-search button {
    position: absolute;
    top: 50%;
    right: 8px;
    display: none;
    width: 25px;
    height: 25px;
    padding: 0;
    color: #7c909f;
    background: transparent;
    border: 0;
    transform: translateY(-50%);
}

.thread-chat-search button.is-visible {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.thread-chat--employees .app-chat-contacts .sidebar-body {
    position: relative;
    height: auto !important;
    min-height: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.thread-chat--employees .chat-contact-list,
.thread-chat--employees .list-view {
    margin: 0;
}

.thread-chat--employees .chat-contact-list-item {
    display: block !important;
    margin: 2px 8px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 12px !important;
}

.thread-chat-contact {
    display: grid;
    width: 100%;
    grid-template-columns: 43px minmax(0, 1fr) 18px;
    gap: 11px;
    align-items: center;
    padding: 11px 10px;
    text-align: left;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 12px;
    transition: background .16s ease, border-color .16s ease;
}

.thread-chat-contact:hover {
    background: #f4f8f9;
}

.chat-contact-list-item.active .thread-chat-contact {
    background: #e7f3f2;
    border-color: #d0e8e5;
}

.thread-chat-contact__avatar {
    position: relative;
    display: inline-flex;
    width: 43px;
    height: 43px;
    align-items: center;
    justify-content: center;
    overflow: visible;
}

.thread-chat-contact__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}

.thread-chat-contact__unread {
    position: absolute;
    right: -2px;
    bottom: -2px;
    width: 11px;
    height: 11px;
    background: #e18b5e;
    border: 2px solid #fff;
    border-radius: 50%;
}

.thread-chat-contact .chat-contact-info {
    display: block;
    min-width: 0;
}

.thread-chat-contact .chat-contact-name,
.thread-chat-contact .chat-contact-status {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-chat-contact .chat-contact-name {
    margin-bottom: 3px;
    color: #354e61;
    font-size: .75rem;
    font-weight: 680;
}

.chat-contact-list-item.is-unread .chat-contact-name {
    color: #243f52;
    font-weight: 770;
}

.thread-chat-contact .chat-contact-status {
    color: #8294a2;
    font-size: .65rem;
}

.thread-chat-contact__arrow {
    color: #a3b0ba;
    font-size: 1rem;
}

.chat-contact-list-item.active .thread-chat-contact__arrow {
    color: #318c87;
}

.chat-contact-list-item.is-loading .thread-chat-contact__arrow {
    animation: thread-chat-pulse .7s ease infinite alternate;
}

.thread-chat-empty {
    display: flex;
    padding: 30px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}

.thread-chat-empty strong {
    margin: 15px 0 6px;
    color: #3a5366;
    font-size: .83rem;
}

.thread-chat-empty p {
    max-width: 390px;
    margin: 0;
    color: #8193a1;
    font-size: .7rem;
    line-height: 1.55;
}

.thread-chat-empty--list {
    min-height: 300px;
}

.thread-chat-empty--list .thread-chat-empty__icon,
.thread-chat-empty--workspace .thread-chat-empty__icon {
    width: 58px;
    height: 58px;
    flex-basis: 58px;
    font-size: 1.55rem;
    background: #edf5f5;
    border-color: #ddebea;
}

.thread-chat-empty--conversation {
    min-height: 100%;
}

.thread-chat-search-empty {
    padding: 30px 16px;
    color: #8697a4;
    font-size: .7rem;
    text-align: center;
}

.thread-chat-search-empty i {
    display: block;
    margin-bottom: 7px;
    color: #6b8c9b;
    font-size: 1.5rem;
}

.thread-chat-mobile-list {
    position: absolute;
    top: 14px;
    left: 14px;
    display: inline-flex;
    padding: 8px 11px;
    align-items: center;
    gap: 6px;
    color: #456377;
    font-size: .68rem;
    background: #fff;
    border: 1px solid #dbe5ea;
    border-radius: 10px;
}

.thread-chat .app-overlay {
    background: rgba(27, 47, 61, .35);
    backdrop-filter: blur(2px);
}

@keyframes thread-chat-pulse {
    to { opacity: .35; }
}

@keyframes thread-chat-shake {
    25% { transform: translateX(-2px); }
    75% { transform: translateX(2px); }
}

@media (max-width: 1199.98px) {
    .thread-support-layout {
        grid-template-columns: minmax(0, 1fr) 300px;
    }

    .thread-support-aside {
        padding: 22px;
    }

    .thread-chat--employees .app-chat-contacts {
        width: 315px;
        flex-basis: 315px;
    }
}

@media (max-width: 991.98px) {
    .thread-support-layout {
        height: auto;
        grid-template-columns: 1fr;
    }

    .thread-support-chat {
        height: min(680px, calc(100vh - 170px));
        min-height: 520px;
    }

    .thread-support-aside {
        min-height: 0;
    }

    .thread-support-note {
        margin-top: 22px;
    }

    .thread-chat {
        height: calc(100vh - 170px);
        min-height: 520px;
    }

    .thread-chat--employees .app-chat-contacts {
        position: absolute;
        left: -330px;
        z-index: 5;
        width: 315px;
        height: 100% !important;
        flex-basis: 315px;
        transition: left .22s ease;
    }

    .thread-chat--employees .app-chat-contacts.show {
        left: 0;
    }
}

@media (max-width: 575.98px) {
    .thread-chat,
    .thread-support-chat {
        height: calc(100vh - 145px);
        min-height: 500px;
        border-radius: 14px;
    }

    .thread-support-aside {
        padding: 18px;
        border-radius: 14px;
    }

    .thread-chat--employees .app-chat-contacts,
    .thread-chat--employees .app-chat-contacts.show {
        width: 100%;
    }

    .thread-chat-header {
        min-height: 68px;
        padding: 11px 13px !important;
    }

    .thread-chat-profile__mark,
    .thread-chat-profile__avatar {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
        border-radius: 11px;
    }

    .thread-chat-channel {
        display: none;
    }

    .thread-chat .chat-history-body {
        padding: 20px 13px !important;
    }

    .thread-chat .chat-message-wrapper {
        max-width: 88%;
    }

    .thread-chat-composer {
        padding: 10px !important;
    }

    .thread-chat-composer__actions > span {
        display: none;
    }

    .thread-chat-composer__actions {
        min-height: 34px;
        justify-content: flex-end;
    }
}

/* Survey templates and launches */
.thread-template-toolbar,
.thread-runs-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 16px 18px;
    background: #fff;
    border: 1px solid var(--thread-border);
    border-radius: 15px;
    box-shadow: 0 4px 18px rgba(19, 43, 75, .04);
}

.thread-template-toolbar .btn,
.thread-runs-toolbar .btn,
.thread-template-card-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.thread-template-summary {
    margin: 0 0 10px;
    color: #8190a0;
    font-size: .72rem;
    text-align: right;
}

.thread-template-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.thread-category-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.thread-category-card {
    display: flex;
    min-width: 0;
    min-height: 248px;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--thread-border);
    border-radius: 16px;
    box-shadow: 0 7px 24px rgba(19, 43, 75, .055);
    transition: opacity .18s ease, transform .18s ease, box-shadow .18s ease;
}

.thread-category-card:hover {
    box-shadow: 0 14px 34px rgba(19, 43, 75, .09);
}

.thread-category-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 17px 0;
}

.thread-category-card-body {
    padding: 14px 17px 16px;
    flex: 1 1 auto;
}

.thread-category-card-body h2 {
    margin: 0 0 10px;
    color: #263e55;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
}

.thread-category-card-body p {
    margin: 0;
    color: #718496;
    font-size: .75rem;
    line-height: 1.55;
}

.thread-category-card-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 13px 17px 16px;
    background: #fbfcfd;
    border-top: 1px solid #e7edf2;
}

.thread-category-card-actions .btn {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.thread-template-list-item {
    min-width: 0;
}

.thread-template-card {
    display: flex;
    height: 100%;
    min-height: 286px;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--thread-border);
    border-radius: 16px;
    box-shadow: 0 7px 24px rgba(19, 43, 75, .055);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.thread-template-card:hover {
    border-color: #c8dbe7;
    box-shadow: 0 14px 34px rgba(19, 43, 75, .09);
}

.thread-is-archived {
    opacity: .58;
}

.thread-is-archived:hover {
    opacity: .72;
}

.thread-archive-filter {
    display: flex;
    min-height: 38px;
    align-items: center;
    padding: 7px 12px;
    color: #536b7f;
    font-size: .82rem;
    white-space: nowrap;
    background: #f4f8fa;
    border: 1px solid #dce7ed;
    border-radius: 10px;
}

.thread-archive-filter .form-check-input {
    margin-top: .12rem;
}

.thread-template-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 18px 0;
}

.thread-template-icon {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: #466f89;
    font-size: 1.25rem;
    background: #e9f2f7;
    border: 1px solid #d7e7ef;
    border-radius: 12px;
}

.thread-template-card-body {
    padding: 14px 18px 17px;
    flex: 1 1 auto;
}

.thread-template-category {
    margin-bottom: 5px;
    color: #8291a0;
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.thread-template-card h3 {
    display: -webkit-box;
    min-height: 48px;
    margin: 0 0 16px;
    overflow: hidden;
    color: #263e55;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.thread-template-readiness {
    display: flex;
    align-items: center;
    gap: 5px;
    min-height: 20px;
    margin-bottom: 10px;
    font-size: .68rem;
    line-height: 1.35;
}

.thread-template-readiness.is-ready {
    color: #287657;
}

.thread-template-readiness.is-incomplete {
    color: #9a6c28;
}

.thread-template-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.thread-template-stats span {
    display: flex;
    min-width: 0;
    flex-direction: column;
    padding: 8px;
    color: #7f8e9d;
    font-size: .61rem;
    background: #f5f8fa;
    border-radius: 9px;
}

.thread-template-stats strong {
    color: #38566e;
    font-size: .86rem;
}

.thread-run-progress {
    margin-top: 13px;
}

.thread-run-progress > div {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 6px;
    color: #718596;
    font-size: .65rem;
}

.thread-run-progress > div strong {
    color: #2f6f73;
    font-weight: 750;
}

.thread-run-progress__track {
    display: block;
    height: 6px;
    overflow: hidden;
    background: #e6eef1;
    border-radius: 999px;
}

.thread-run-progress__track i {
    display: block;
    height: 100%;
    background: #4a9a95;
    border-radius: inherit;
}

.thread-run-progress small {
    display: block;
    margin-top: 7px;
    overflow: hidden;
    color: #81919e;
    font-size: .58rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-template-note {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 12px;
    color: #688096;
    font-size: .68rem;
}

.thread-template-card-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 13px 18px 16px;
    background: #fbfcfd;
    border-top: 1px solid #e7edf2;
}

.thread-template-card-actions--wide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.thread-message-settings {
    display: grid;
    gap: 16px;
}

.thread-message-settings__intro,
.thread-message-settings__section,
.thread-message-settings__hint {
    padding: 18px;
    background: #fff;
    border: 1px solid var(--thread-border);
    border-radius: 16px;
    box-shadow: 0 7px 24px rgba(19, 43, 75, .04);
}

.thread-message-settings__intro,
.thread-message-settings__heading {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.thread-message-settings__heading {
    margin-bottom: 16px;
}

.thread-message-settings__heading > span {
    display: inline-flex;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    color: #347c81;
    background: #e5f4f3;
    border-radius: 9px;
}

.thread-message-settings__heading h2 {
    margin: 0 0 3px;
    color: #263e55;
    font-size: .95rem;
    font-weight: 700;
}

.thread-message-settings__heading p {
    margin: 0;
    color: #718496;
    font-size: .78rem;
}

.thread-message-settings__hint {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #587186;
    font-size: .8rem;
    background: #f4f9fa;
}

.thread-message-settings__hint i {
    color: #27878b;
    font-size: 1.1rem;
}

.thread-template-archive-action {
    grid-column: 1 / -1;
}

.thread-template-list > .pagination {
    margin-top: 18px;
}

.thread-template-empty {
    display: flex;
    min-height: 230px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    grid-column: 1 / -1;
    color: #7e8e9e;
    background: #fff;
    border: 1px dashed #cfdae4;
    border-radius: 15px;
}

.thread-run-create {
    max-width: 880px;
    margin: 0 auto;
    border: 1px solid var(--thread-border);
    border-radius: 16px;
    box-shadow: 0 10px 36px rgba(19, 43, 75, .07);
}

.thread-run-create--onboarding {
    margin-right: 0;
    margin-left: 0;
}

.thread-run-create-intro {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 22px;
}

.thread-run-empty {
    display: flex;
    min-height: 310px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 36px 20px 24px;
    text-align: center;
    border-top: 1px solid var(--thread-border);
}

.thread-run-empty__icon {
    display: inline-flex;
    width: 62px;
    height: 62px;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    color: var(--thread-primary);
    font-size: 1.8rem;
    background: var(--thread-primary-soft);
    border-radius: 18px;
}

.thread-run-empty h3 {
    margin-bottom: 8px;
    color: var(--thread-ink);
    font-size: 1.08rem;
}

.thread-run-empty p {
    max-width: 560px;
    margin-bottom: 20px;
    color: var(--thread-muted);
    font-size: .78rem;
    line-height: 1.6;
}

.thread-run-create--onboarding .thread-run-empty {
    align-items: flex-start;
    justify-content: flex-start;
    text-align: left;
}

.thread-run-create--onboarding .thread-first-survey-steps {
    margin-right: 0;
    margin-left: 0;
}

.thread-first-survey-steps {
    display: grid;
    width: 100%;
    max-width: 720px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin: 0 auto 28px;
    padding: 0;
    list-style: none;
}

.survey-builder .thread-first-survey-steps {
    margin-right: 0;
    margin-left: 0;
}

.thread-first-survey-steps li {
    display: flex;
    min-width: 0;
    gap: 9px;
    align-items: center;
    padding: 10px;
    color: #8a98a8;
    background: #f7f9fb;
    border: 1px solid #e3e9ef;
    border-radius: 12px;
}

.thread-first-survey-step-number {
    display: inline-flex;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    align-items: center;
    justify-content: center;
    font-size: .68rem;
    font-weight: 800;
    background: #e9eef3;
    border-radius: 50%;
}

.thread-first-survey-steps strong,
.thread-first-survey-steps small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-first-survey-steps strong { color: #607286; font-size: .7rem; }
.thread-first-survey-steps small { margin-top: 1px; font-size: .56rem; }
.thread-first-survey-steps li.is-active { color: #356fca; background: #eef4fc; border-color: #c5d8f2; }
.thread-first-survey-steps li.is-active strong { color: #245ea9; }
.thread-first-survey-steps li.is-active .thread-first-survey-step-number { color: #fff; background: var(--thread-primary); }
.thread-first-survey-steps li.is-complete .thread-first-survey-step-number { color: #287657; background: #e1f2e9; }

.thread-first-survey-guide {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
    padding: 14px 16px;
    color: #77571d;
    background: #fff8e8;
    border: 1px solid #efdfba;
    border-radius: 14px;
}

.thread-first-survey-guide.is-ready {
    color: #28694e;
    background: #edf8f2;
    border-color: #cce8d9;
}

.thread-first-survey-guide strong,
.thread-first-survey-guide span { display: block; }
.thread-first-survey-guide strong { margin-bottom: 2px; font-size: .82rem; }
.thread-first-survey-guide span { font-size: .7rem; line-height: 1.45; }

.thread-mailing-message {
    padding: 16px;
    color: #40566b;
    line-height: 1.65;
    overflow-wrap: anywhere;
    background: #f6f9fb;
    border: 1px solid #e1e9ef;
    border-radius: 12px;
}

.thread-mailing-files .form-control {
    min-height: 38px;
}

.thread-company-bot-card {
    border-color: #d8e5ec;
    box-shadow: 0 8px 28px rgba(24, 54, 78, .06);
}

.thread-company-bot-heading {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.thread-company-bot-heading > div {
    min-width: 0;
}

.thread-company-bot-card .form-text {
    color: #7b8d9e;
    font-size: .72rem;
}

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

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

@media (max-width: 991.98px) {
    .thread-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .thread-first-survey-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .thread-first-survey-guide {
        align-items: stretch;
        flex-direction: column;
    }

    .thread-template-toolbar,
    .thread-runs-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .thread-template-toolbar > .d-flex,
    .thread-template-toolbar .btn,
    .thread-runs-toolbar .btn {
        width: 100%;
    }

    .thread-template-grid {
        grid-template-columns: 1fr;
    }

    .thread-category-grid {
        grid-template-columns: 1fr;
    }
}

/* Единый внешний вид и прокрутка для всех app\widgets\GridView. */
.thread-grid-view {
    display: flex;
    min-width: 0;
    max-height: var(--thread-grid-max-height, calc(100vh - 220px));
    flex-direction: column;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--thread-border);
    border-radius: 15px;
    box-shadow: 0 4px 18px rgba(19, 43, 75, .04);
}

.thread-grid-view > .summary {
    flex: 0 0 auto;
    min-height: 40px;
    margin: 0;
    padding: 12px 14px 8px;
    color: #7b8b9c;
    font-size: .72rem;
}

.thread-grid-scroll {
    position: relative;
    min-width: 0;
    min-height: 0;
    max-width: 100%;
    flex: 0 1 auto;
    overflow: auto !important;
    border-top: 1px solid var(--thread-border);
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.thread-grid-scroll:focus-visible {
    outline: 2px solid rgba(99, 154, 184, .35);
    outline-offset: -2px;
}

.thread-grid-table {
    width: 100%;
    min-width: 100%;
    margin: 0;
    border-color: #e3e9f0;
}

.thread-grid-table thead {
    position: sticky;
    top: 0;
    z-index: 5;
}

.thread-grid-table thead th {
    padding: 10px 8px;
    color: #51677d;
    font-size: .66rem;
    font-weight: 720;
    letter-spacing: .035em;
    text-transform: none;
    white-space: normal;
    background: #f4f7fa !important;
    border-color: #dfe6ed;
}

.thread-grid-table thead th a {
    color: inherit;
}

.thread-grid-table thead th a::after {
    color: #7791ab;
}

.thread-grid-table .filters td {
    padding: 6px;
    vertical-align: top;
    background: #fbfcfd;
    border-color: #e1e7ed;
}

.thread-grid-table .filters .form-control,
.thread-grid-table .filters .form-select,
.thread-grid-table .filters input,
.thread-grid-table .filters select {
    min-height: 31px;
    padding: 5px 7px;
    font-size: .68rem;
    background-color: #fff;
    border-color: #d7e0e9 !important;
    border-radius: 7px;
}

.thread-grid-table .filters .range-value {
    height: 31px;
    min-height: 31px;
    padding: 6px 19px 3px 6px;
    font-size: .62rem;
    line-height: .8rem;
    border-radius: 7px;
}

.thread-grid-table tbody td {
    padding: 9px 8px;
    color: #40556a;
    font-size: .75rem;
    vertical-align: middle;
    white-space: normal;
    border-color: #e6ebf0;
}

.thread-grid-table tbody tr:hover td {
    background: #f8fafc;
}

.thread-grid-table .action-column {
    right: 0;
    z-index: 3;
    background: #fff;
}

.thread-grid-overflow-x .thread-grid-table .action-column {
    position: sticky;
    box-shadow: -9px 0 14px -12px rgba(25, 51, 78, .75);
}

.thread-grid-table thead .action-column {
    z-index: 7;
    background: #f4f7fa !important;
}

.thread-grid-table .filters .action-column {
    background: #fbfcfd !important;
}

.thread-grid-table tbody td.action-column {
    padding: 6px !important;
    white-space: nowrap;
}

.thread-grid-table tbody tr:hover td.action-column {
    background: #f8fafc;
}

.thread-grid-table .thread-employee-grid-row-dismissed td.action-column {
    background: #fff8f7;
}

.thread-grid-table .thread-employee-grid-row-dismissed:hover td.action-column {
    background: #fff4f2;
}

.thread-grid-view > .pagination {
    flex: 0 0 auto;
    margin: 12px 14px 14px;
}

@media (max-width: 720px) {
    .thread-grid-view {
        max-height: var(--thread-grid-max-height, calc(100vh - 170px));
        border-radius: 12px;
    }

    .thread-grid-table .action-column,
    .thread-grid-overflow-x .thread-grid-table .action-column {
        position: static;
        box-shadow: none;
    }

    .thread-grid-table tbody tr:hover td.action-column {
        background: transparent;
    }
}