.tcs-portal {
	margin-inline: auto;
	max-width: 960px;
	--tcs-brand-accent: #2271b1;
}

.tcs-brand-header {
	align-items: center;
	border-block-end: 4px solid var(--tcs-brand-accent);
	display: flex;
	flex-wrap: wrap;
	gap: clamp(14px, 3vw, 24px);
	margin-block-end: 20px;
	padding-block-end: 18px;
}

.tcs-brand-header h2,
.tcs-brand-header p {
	margin-block: 0;
}

.tcs-brand-welcome {
	margin-block-start: 6px !important;
}

.tcs-brand-logo {
	block-size: auto;
	max-block-size: 96px;
	max-inline-size: min(240px, 100%);
	object-fit: contain;
}

.tcs-brand-footer {
	border-block-start: 1px solid #dcdcde;
	margin-block-start: 28px;
	padding-block-start: 18px;
}

.tcs-brand-footer-text {
	margin-block: 0 8px;
}

.tcs-brand-footer nav {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.tcs-brand-powered-by {
	font-size: .9rem;
	margin: 18px 0 0;
	padding-block-end: 24px;
	text-align: center;
}

.tcs-brand-powered-by a {
	color: #31455d;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.tcs-standalone-customer-credit {
	margin-inline: auto;
	max-width: 960px;
}

.tcs-agent-entry {
	display: flex;
	justify-content: flex-end;
	margin-block: 0 20px;
}

.tcs-agent-entry a {
	background: #fff;
	border: 1px solid #2271b1;
	border-inline-start: 4px solid var(--tcs-brand-accent);
	border-radius: 6px;
	color: #135e96;
	font-weight: 700;
	min-height: 44px;
	padding: 10px 16px;
	text-decoration: none;
}

.tcs-staff-view-switcher {
	display: flex;
	justify-content: flex-end;
	margin: 0 auto 18px;
	max-width: 1180px;
}

.tcs-staff-view-switcher a {
	border: 1px solid #2271b1;
	border-radius: 6px;
	font-weight: 700;
	min-height: 44px;
	padding: 10px 14px;
	text-decoration: none;
}

.tcs-staff-view-switcher a:focus-visible {
	outline: 3px solid #1d4ed8;
	outline-offset: 3px;
}

.tcs-portal,
.tcs-portal *,
.tcs-agent-workspace,
.tcs-agent-workspace *,
.single-tcs_kb_article .entry-content,
.single-tcs_kb_article .entry-content * {
	box-sizing: border-box;
}

.tcs-portal :where(a, button, input, select, textarea):focus-visible,
.tcs-agent-workspace :where(a, button, input, select, textarea, [tabindex]):focus-visible,
.tcs-link-dialog :where(button, input):focus-visible {
	outline: 3px solid #1d4ed8;
	outline-offset: 3px;
}

.single-tcs_kb_article .entry-content :where(a, button):focus-visible {
	outline: 3px solid #1d4ed8;
	outline-offset: 3px;
}

.tcs-portal :where(input, select, textarea),
.tcs-agent-workspace :where(input, select, textarea) {
	max-width: 100%;
}

.tcs-direction-arrow::before {
	display: inline-block;
}

.tcs-direction-arrow--back::before {
	content: "\2190";
}

.tcs-direction-arrow--forward::before {
	content: "\2192";
}

[dir="rtl"] .tcs-direction-arrow--back::before {
	content: "\2192";
}

[dir="rtl"] .tcs-direction-arrow--forward::before {
	content: "\2190";
}

.tcs-portal :where(button, input[type="button"], input[type="submit"]),
.tcs-agent-workspace :where(button, input[type="button"], input[type="submit"]) {
	min-height: 44px;
}

.tcs-new-ticket,
.tcs-ticket-list,
.tcs-ticket-detail,
.tcs-login-required,
.tcs-guest-session {
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 6px;
	margin-block: 20px;
	padding: clamp(18px, 4vw, 30px);
}

.tcs-new-ticket label,
.tcs-new-ticket input,
.tcs-new-ticket select,
.tcs-new-ticket textarea,
.tcs-reply-form label,
.tcs-reply-form textarea {
	display: block;
	width: 100%;
}

.tcs-new-ticket form {
	display: grid;
	gap: clamp(16px, 2vw, 22px);
}

.tcs-new-ticket form > p {
	margin: 0;
}

.tcs-new-ticket :where(input, select, textarea) {
	box-sizing: border-box;
}

.tcs-guest-login label,
.tcs-guest-login input {
	display: block;
	width: 100%;
}

.tcs-guest-login label {
	font-weight: 600;
	margin-bottom: 6px;
}

.tcs-guest-session {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.tcs-guest-session p {
	margin: 0;
}

.tcs-honeypot {
	position: absolute !important;
	inset-inline-start: -10000px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
}

.tcs-new-ticket input[type="file"],
.tcs-reply-form input[type="file"] {
	padding-block: 8px;
}

.tcs-new-ticket small,
.tcs-reply-form small {
	display: block;
	margin-top: 5px;
}

.tcs-attachments {
	margin: 12px 0 0;
}

.tcs-attachment-dropzone {
	border: 2px dashed #a7aaad;
	border-radius: .4rem;
	padding: .75rem;
	transition: border-color .15s ease, background-color .15s ease;
}

.tcs-attachment-dropzone.is-dragging {
	border-color: currentColor;
	background: rgba(0, 0, 0, .04);
}

.tcs-attachment-drop-hint,
.tcs-attachment-selection {
	display: block;
	margin-top: .4rem;
}

.tcs-attachment-progress {
	display: block;
	inline-size: min(100%, 28rem);
	margin-top: .6rem;
}

.tcs-inline-image {
	margin: 1rem 0;
	max-inline-size: 100%;
}

.tcs-inline-image img {
	display: block;
	block-size: auto;
	max-block-size: 42rem;
	max-inline-size: 100%;
	object-fit: contain;
}

.tcs-inline-image figcaption,
.tcs-inline-image-status {
	display: block;
	font-size: .875em;
	margin-top: .35rem;
}

.tcs-inline-image-status {
	border-inline-start: 3px solid currentColor;
	padding: .5rem .75rem;
}

.tcs-new-ticket label {
	font-weight: 600;
	margin-bottom: 6px;
}

.tcs-reply-form label {
	display: block;
	font-weight: 600;
	margin-bottom: 6px;
}

.tcs-new-ticket button {
	min-height: 44px;
}

.tcs-new-ticket .tcs-attachment-dropzone {
	margin: 0;
}

.tcs-new-ticket .tcs-rich-editor .description {
	margin: 6px 0 0;
}

.tcs-new-ticket-actions {
	display: flex;
	justify-content: flex-end;
}

.tcs-ticket-list ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.tcs-customer-ticket-filters {
	align-items: end;
	display: grid;
	gap: 12px;
	grid-template-columns: minmax(180px, 1fr) minmax(150px, .5fr) auto;
	margin: 16px 0 20px;
}

.tcs-customer-ticket-filters p {
	margin: 0;
}

.tcs-customer-ticket-filters label,
.tcs-customer-ticket-filters input,
.tcs-customer-ticket-filters select {
	display: block;
	width: 100%;
}

.tcs-customer-ticket-filters label {
	font-weight: 600;
	margin-bottom: 6px;
}

.tcs-customer-ticket-pagination {
	display: flex;
	gap: 18px;
	justify-content: flex-end;
	margin-top: 18px;
}

.tcs-conversation {
	list-style: none;
	margin: 24px 0;
	padding: 0;
}

.tcs-message {
	background: #f6f7f7;
	border-radius: 6px;
	margin: 14px 0;
	padding: 16px;
}

.tcs-message--agent {
	border-inline-start: 4px solid var(--tcs-brand-accent);
}

.tcs-message time {
	color: #646970;
	font-size: .875em;
}

.tcs-ticket-list li {
	display: grid;
	gap: 8px;
	grid-template-columns: minmax(100px, auto) 1fr auto;
	padding: 12px 0;
}

.tcs-ticket-list li + li {
	border-top: 1px solid #dcdcde;
}

.tcs-status {
	border-radius: 999px;
	background: #e8f2fb;
	padding: 2px 10px;
}

.tcs-ticket-context {
	background: #f0f6fc;
	border-inline-start: 4px solid var(--tcs-brand-accent);
	padding: 10px 14px;
}

.tcs-success,
.tcs-error,
.tcs-notice {
	border-inline-start: 4px solid var(--tcs-brand-accent);
	margin: 16px 0;
	padding: 12px 16px;
}

.tcs-success {
	border-inline-start-color: #00a32a;
}

.tcs-error {
	border-inline-start-color: #d63638;
}

.tcs-knowledge,
.tcs-kb-search {
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 8px;
	margin-block: 20px;
	padding: clamp(18px, 4vw, 30px);
}

.tcs-knowledge > header h2,
.tcs-knowledge > header p,
.tcs-kb-search > h2 {
	margin-block: 4px;
}

.tcs-kb-search form {
	align-items: end;
	display: grid;
	gap: 12px;
	grid-template-columns: minmax(220px, 1fr) minmax(150px, .4fr) auto;
	margin-top: 16px;
}

.tcs-kb-search form p {
	margin: 0;
}

.tcs-kb-search label,
.tcs-kb-search input,
.tcs-kb-search select {
	display: block;
	width: 100%;
}

.tcs-kb-search label {
	font-weight: 600;
	margin-bottom: 5px;
}

.tcs-kb-categories {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 20px 0;
}

.tcs-kb-categories a {
	border: 1px solid #2271b1;
	border-radius: 999px;
	padding: 6px 12px;
	text-decoration: none;
}

.tcs-kb-categories a[aria-current="page"] {
	background: #2271b1;
	color: #fff;
}

.tcs-kb-grid {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-top: 18px;
}

.tcs-kb-card,
.tcs-kb-empty {
	background: #f6f7f7;
	border: 1px solid #dcdcde;
	border-radius: 8px;
	padding: 18px;
}

.tcs-kb-card.is-featured {
	border-color: #2271b1;
	box-shadow: inset 0 3px 0 #2271b1;
}

.tcs-kb-card h3,
.tcs-kb-card p {
	margin-block: 6px;
}

.tcs-kb-card time {
	color: #646970;
	font-size: .85rem;
}

.tcs-kb-deflection {
	background: #f0f6fc;
	border: 1px solid #72aee6;
	border-radius: 8px;
	margin: 16px 0 20px;
	padding: 16px 18px;
}

.tcs-kb-deflection[hidden] {
	display: none;
}

.tcs-kb-deflection h4,
.tcs-kb-deflection p {
	margin-block: 4px 10px;
}

.tcs-kb-deflection ul {
	display: grid;
	gap: 10px;
	list-style: none;
	margin: 12px 0;
	padding: 0;
}

.tcs-kb-deflection li {
	background: #fff;
	border-radius: 6px;
	padding: 10px 12px;
}

.tcs-kb-deflection li a,
.tcs-kb-deflection li span {
	display: block;
}

.tcs-kb-deflection li a {
	font-weight: 600;
}

.tcs-kb-deflection li span {
	color: #50575e;
	font-size: .9rem;
	margin-top: 3px;
}

.tcs-kb-related {
	border-top: 1px solid #dcdcde;
	margin-top: 32px;
	padding-top: 20px;
}

.tcs-kb-article-layout {
	display: grid;
	gap: clamp(28px, 5vw, 64px);
	grid-template-areas: "article toc";
	grid-template-columns: minmax(0, 1fr) minmax(220px, 290px);
}

.tcs-kb-article-layout.has-no-toc {
	display: block;
}

.tcs-kb-article-main {
	grid-area: article;
	min-width: 0;
}

.tcs-kb-article-main :where(h2, h3) {
	scroll-margin-block-start: 120px;
}

.tcs-kb-toc {
	align-self: start;
	border-inline-start: 2px solid #dcdcde;
	grid-area: toc;
	padding-inline-start: 18px;
	position: sticky;
	top: clamp(24px, 9vh, 96px);
}

.tcs-kb-toc h2 {
	font-size: clamp(1.25rem, 2vw, 1.55rem);
	margin: 0 0 16px;
}

.tcs-kb-toc ol {
	display: grid;
	gap: 4px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.tcs-kb-toc a {
	border-radius: 6px;
	color: #2c3338;
	display: block;
	padding: 9px 11px;
	text-decoration: none;
}

.tcs-kb-toc a:hover {
	text-decoration: underline;
}

.tcs-kb-toc a[aria-current="location"] {
	background: #1d2327;
	color: #fff;
	font-weight: 700;
}

.tcs-kb-toc-level-3 a {
	padding-inline-start: 24px;
}

.tcs-kb-feedback {
	border-block-start: 1px solid #dcdcde;
	margin-block-start: clamp(32px, 6vw, 56px);
	padding: clamp(28px, 5vw, 46px) 18px;
	text-align: center;
}

.tcs-kb-feedback h2,
.tcs-kb-feedback p {
	margin-block: 0 14px;
}

.tcs-kb-feedback-actions {
	display: flex;
	gap: 14px;
	justify-content: center;
	margin-block-end: 18px;
}

.tcs-kb-feedback button {
	background: #fff;
	border: 1px solid #2c3338;
	border-radius: 6px;
	color: #2c3338;
	font-weight: 700;
	min-height: 44px;
	min-width: 90px;
	padding: 10px 20px;
}

.tcs-kb-feedback button:not(:disabled) {
	cursor: pointer;
}

.tcs-kb-feedback button.is-selected {
	background: #1d2327;
	color: #fff;
}

.tcs-kb-feedback-count {
	font-size: .875rem;
}

.tcs-kb-feedback-status:empty {
	display: none;
}

.tcs-kb-support-cta {
	border-block: 1px solid #dcdcde;
	padding: clamp(34px, 6vw, 54px) 18px;
	text-align: center;
}

.tcs-kb-support-cta h2 {
	font-size: clamp(1.55rem, 3vw, 2rem);
	margin: 0 0 10px;
}

.tcs-kb-support-cta p {
	margin: 0 0 20px;
}

.tcs-kb-support-button {
	background: #006f78;
	border-radius: 6px;
	color: #fff;
	display: inline-flex;
	font-weight: 700;
	min-height: 48px;
	padding: 12px 20px;
	text-decoration: none;
}

.tcs-kb-support-button:hover {
	background: #005a62;
	color: #fff;
	text-decoration: underline;
}

.tcs-kb-featured {
	color: #135e96;
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.tcs-kb-pagination {
	display: flex;
	gap: 18px;
	justify-content: flex-end;
	margin-top: 20px;
}

.single-tcs_kb_article .entry-content,
.single-tcs_kb_article .wp-block-post-content {
	max-width: 1180px;
	width: 100%;
}

/* Override themes that cap every direct article-content child to a prose width. */
.single-tcs_kb_article .entry-content > :where(.tcs-kb-article-layout, .tcs-kb-feedback, .tcs-kb-support-cta, .tcs-brand-powered-by),
.single-tcs_kb_article .wp-block-post-content > :where(.tcs-kb-article-layout, .tcs-kb-feedback, .tcs-kb-support-cta, .tcs-brand-powered-by) {
	max-width: none;
	width: 100%;
}

.tcs-agent-workspace {
	margin-inline: auto;
	max-width: 1180px;
	overflow-wrap: anywhere;
}

.tcs-agent-header {
	align-items: start;
	display: flex;
	gap: 24px;
	justify-content: space-between;
	margin-bottom: 20px;
}

.tcs-agent-header h2,
.tcs-agent-header p {
	margin-block: 0;
}

.tcs-eyebrow {
	color: #50575e;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.tcs-agent-filters,
.tcs-front-saved-views,
.tcs-front-workflow,
.tcs-front-agent-reply,
.tcs-agent-empty,
.tcs-agent-messages > li {
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 8px;
}

.tcs-front-saved-views {
	align-items: start;
	display: grid;
	gap: 20px;
	grid-template-columns: minmax(0, 1fr) minmax(260px, 420px);
	margin-bottom: 20px;
	padding: 18px;
}

.tcs-front-saved-views h3,
.tcs-front-saved-views h4,
.tcs-front-saved-views p {
	margin: 0 0 8px;
}

.tcs-front-saved-views ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 12px;
	list-style: none;
	margin: 0 0 14px;
	padding: 0;
}

.tcs-front-saved-views li {
	align-items: center;
	display: flex;
	gap: 6px;
}

.tcs-front-saved-views li form {
	margin: 0;
}

.tcs-front-saved-views a[aria-current="page"] {
	font-weight: 700;
	text-decoration-thickness: 3px;
}

.tcs-front-save-view {
	display: grid;
	gap: 7px;
}

.tcs-front-save-view label {
	font-weight: 600;
}

.tcs-agent-filters {
	display: grid;
	gap: 14px;
	grid-template-columns: minmax(190px, 1.5fr) repeat(3, minmax(140px, 1fr));
	margin-bottom: 20px;
	padding: 18px;
}

.tcs-agent-filters p,
.tcs-front-workflow p,
.tcs-front-agent-reply > p {
	margin: 0;
}

.tcs-agent-filters label,
.tcs-agent-filters input,
.tcs-agent-filters select,
.tcs-front-workflow label,
.tcs-front-workflow select,
.tcs-front-agent-reply label,
.tcs-front-agent-reply select,
.tcs-front-agent-reply textarea,
.tcs-front-agent-reply input[type="file"] {
	display: block;
	width: 100%;
}

.tcs-agent-filters label,
.tcs-front-workflow label,
.tcs-front-agent-reply label {
	font-weight: 600;
	margin-bottom: 5px;
}

.tcs-agent-filter-actions {
	align-items: center;
	display: flex;
	gap: 14px;
	grid-column: 1 / -1;
}

.tcs-agent-ticket-list {
	display: grid;
	gap: 12px;
}

.tcs-agent-ticket {
	align-items: center;
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 8px;
	display: grid;
	gap: 20px;
	grid-template-columns: minmax(220px, 1fr) minmax(360px, .8fr);
	padding: 18px 20px;
}

.tcs-agent-ticket.is-unread {
	border-inline-start: 5px solid #2271b1;
}

.tcs-agent-ticket h3,
.tcs-agent-ticket p {
	margin-block: 4px 0;
}

.tcs-agent-ticket dl {
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(4, 1fr);
	margin: 0;
}

.tcs-agent-ticket dt {
	color: #646970;
	font-size: .78rem;
	font-weight: 600;
	text-transform: uppercase;
}

.tcs-agent-ticket dd {
	margin: 3px 0 0;
}

.tcs-unread-badge,
.tcs-ticket-meta span {
	background: #e8f2fb;
	border-radius: 999px;
	display: inline-block;
	font-size: .78rem;
	margin-inline-start: 8px;
	padding: 3px 9px;
}

.tcs-sla-badge { background: #e2e4e7; border-radius: 999px; color: #2c3338; display: inline-block; font-size: .78rem; font-weight: 700; padding: 3px 9px; white-space: nowrap; }
.tcs-sla-badge--breached { background: #fce8e6; color: #8a1c13; }
.tcs-sla-badge--missed { background: #f5e6e4; color: #6f261f; }
.tcs-sla-badge--approaching { background: #fcf0c4; color: #5c4700; }
.tcs-sla-badge--remaining,
.tcs-sla-badge--met { background: #dff3e4; color: #075d24; }
.tcs-sla-badge--paused { background: #e8f0fe; color: #174ea6; }
.tcs-sla-panel { border: 1px solid #dcdcde; border-inline-start: 5px solid #2271b1; border-radius: 8px; margin: 18px 0; padding: 18px; }
.tcs-sla-panel--breached { border-inline-start-color: #d63638; }
.tcs-sla-panel--missed { border-inline-start-color: #8a1c13; }
.tcs-sla-panel--approaching { border-inline-start-color: #dba617; }
.tcs-sla-panel--met,
.tcs-sla-panel--remaining { border-inline-start-color: #00a32a; }
.tcs-sla-panel h3 { margin-top: 0; }
.tcs-sla-panel li { margin: 8px 0; }

.tcs-agent-pagination {
	display: flex;
	gap: 18px;
	justify-content: flex-end;
	margin-top: 20px;
}

.tcs-agent-conversation {
	background: #f6f7f7;
	border-radius: 10px;
	padding: clamp(16px, 3vw, 28px);
}

.tcs-ticket-meta {
	margin-bottom: 16px;
}

.tcs-agent-presence,
.tcs-customer-context {
	background: #fff;
	border-inline-start: 4px solid #2271b1;
	margin: 16px 0;
	padding: 12px 16px;
}

.tcs-front-workflow {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(4, minmax(130px, 1fr));
	margin: 20px 0;
	padding: 18px;
}

.tcs-front-workflow-action {
	align-self: end;
}

.tcs-agent-messages {
	list-style: none;
	margin: 24px 0;
	padding: 0;
}

.tcs-agent-messages > li {
	margin: 14px 0;
	padding: 18px;
}

.tcs-agent-messages > li.is-private {
	background: #fff8e5;
	border-color: #dba617;
}

.tcs-agent-messages header {
	display: flex;
	gap: 16px;
	justify-content: space-between;
	margin-bottom: 10px;
}

.tcs-agent-messages time {
	color: #646970;
	font-size: .85rem;
}

.tcs-message-mentions {
	color: #646970;
	font-size: .85rem;
	margin: 10px 0 0;
}

.tcs-mention-picker {
	border: 1px solid #dcdcde;
	padding: 12px;
}

.tcs-mention-picker label,
.tcs-mention-picker select,
.tcs-mention-picker small {
	display: block;
}

.tcs-mention-picker select {
	margin: 6px 0;
	max-width: 100%;
	min-width: min(100%, 320px);
}

.tcs-front-agent-reply {
	display: grid;
	gap: 16px;
	padding: 20px;
}

.tcs-format-toolbar,
.tcs-draft-controls,
.tcs-canned-insert {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.tcs-format-toolbar {
	margin-bottom: 8px;
}

.tcs-rich-editor .tcs-format-toolbar {
	display: none;
}

.tcs-rich-editor.is-enhanced .tcs-format-toolbar {
	display: flex;
}

.tcs-rich-editor > label {
	display: block;
	font-weight: 700;
	margin-bottom: 6px;
}

.tcs-rich-editor textarea,
.tcs-message-preview {
	box-sizing: border-box;
	max-width: 100%;
	width: 100%;
}

.tcs-message-preview {
	background: #fff;
	border: 1px solid #8c8f94;
	border-radius: 6px;
	min-height: 150px;
	overflow-wrap: anywhere;
	padding: 12px;
}

.tcs-message-preview pre {
	max-width: 100%;
	overflow-x: auto;
	white-space: pre-wrap;
}

.tcs-editor-status {
	display: block;
	min-height: 1.5em;
}

.tcs-link-dialog {
	border: 0;
	border-radius: 8px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, .3);
	box-sizing: border-box;
	max-width: min(480px, calc(100vw - 32px));
	padding: 22px;
	width: 100%;
}

.tcs-link-dialog::backdrop {
	background: rgba(0, 0, 0, .45);
}

.tcs-link-dialog label,
.tcs-link-dialog input {
	display: block;
	width: 100%;
}

.tcs-link-dialog-error {
	color: #b32d2e;
	min-height: 1.5em;
}

.tcs-link-dialog-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.tcs-draft-controls {
	justify-content: space-between;
}

.tcs-front-agent-reply small {
	display: block;
	margin-top: 5px;
}

.tcs-tag-picker { border: 0; display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0; padding: 0; }
.tcs-tag-picker legend { font-weight: 700; margin-bottom: 6px; width: 100%; }
.tcs-ticket-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tcs-ticket-tags span { background: #e8f0fe; border-radius: 999px; color: #174ea6; display: inline-block; font-size: .8rem; font-weight: 700; padding: 3px 9px; }
.tcs-custom-fields { border: 1px solid #dcdcde; border-radius: 8px; display: grid; gap: 14px; margin: 18px 0; padding: 18px; }
.tcs-custom-fields > legend { font-weight: 700; padding: 0 6px; }
.tcs-custom-field > label:first-child,
.tcs-custom-field > fieldset > legend { display: block; font-weight: 700; margin-bottom: 5px; }
.tcs-custom-field > input:not([type="checkbox"]),
.tcs-custom-field > select,
.tcs-custom-field > textarea { box-sizing: border-box; width: 100%; }
.tcs-custom-field > fieldset { border: 0; margin: 0; padding: 0; }
.tcs-custom-field > fieldset label { display: block; margin: 5px 0; }
.tcs-custom-field small { color: #646970; display: block; margin-top: 4px; }
.tcs-custom-field-values { margin: 18px 0; }
.tcs-custom-field-values dl { display: grid; gap: 8px; margin: 0; }
.tcs-custom-field-values dl > div { border-bottom: 1px solid #e2e4e7; padding: 7px 0; }
.tcs-custom-field-values dt { font-weight: 700; }
.tcs-custom-field-values dd { margin: 3px 0 0; overflow-wrap: anywhere; }
.tcs-collaboration-panel { border: 1px solid #dcdcde; border-radius: 8px; margin: 18px 0; padding: 18px; }
.tcs-collaboration-panel h3 { margin-top: 0; }
.tcs-collaboration-panel fieldset { border: 0; margin: 14px 0; padding: 0; }
.tcs-collaboration-panel legend { font-weight: 700; margin-bottom: 6px; }
.tcs-collaboration-panel fieldset > div { align-items: center; display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 4px 0; }
.tcs-collaboration-panel form > label { display: inline-block; margin: 4px 14px 8px 0; }
.tcs-collaboration-panel textarea { box-sizing: border-box; display: block; margin-top: 5px; width: 100%; }
.tcs-related-tickets { margin: 12px 0; padding-inline-start: 20px; }
.tcs-related-tickets li { margin: 8px 0; overflow-wrap: anywhere; }
.tcs-related-tickets form { display: inline; margin-inline-start: 8px; }
.tcs-ticket-participants { overflow-wrap: anywhere; }
.tcs-customer-profile { border: 1px solid #dcdcde; border-radius: 8px; margin: 18px 0; padding: 18px; }
.tcs-customer-profile h3 { margin-top: 0; }
.tcs-customer-profile dl { display: grid; gap: 10px 24px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
.tcs-customer-profile dl > div { border-bottom: 1px solid #e2e4e7; padding-bottom: 8px; }
.tcs-customer-profile dt { font-weight: 700; }
.tcs-customer-profile dd { margin: 3px 0 0; overflow-wrap: anywhere; }
.tcs-customer-profile ul { padding-inline-start: 20px; }
.tcs-customer-profile li { margin: 8px 0; }
.tcs-customer-profile li span,
.tcs-customer-profile .description { color: #646970; }
.tcs-customer-profile__orders small { display: block; margin-top: 3px; }
.tcs-csat { background: #f6f7f7; border: 1px solid #dcdcde; border-radius: 8px; margin: 22px 0; padding: 18px; }
.tcs-customer-workflow { border: 1px solid #dcdcde; border-radius: 8px; margin: 22px 0; padding: 18px; }
.tcs-customer-workflow h4 { margin-block-start: 0; }
.tcs-csat h4 { margin-top: 0; }
.tcs-csat fieldset { border: 0; margin: 14px 0; padding: 0; }
.tcs-csat legend { font-weight: 700; margin-bottom: 8px; }
.tcs-csat fieldset label { display: inline-block; margin: 4px 18px 4px 0; }
.tcs-csat textarea { box-sizing: border-box; display: block; margin-top: 5px; width: 100%; }

/* The optional Hub is the same full site workspace with an authorization-scoped unified queue. */
.tcs-hub-workspace-switcher { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 auto 18px; max-width: 1180px; }
.tcs-hub-workspace-switcher a { border: 1px solid #2271b1; border-radius: 6px; padding: 10px 14px; text-decoration: none; }
.tcs-hub-workspace-switcher a[aria-current="page"] { background: #2271b1; color: #fff; font-weight: 700; }
.tcs-hub-workspace-switcher a:focus-visible { outline: 3px solid #1d4ed8; outline-offset: 3px; }
.tcs-hub-front-workspace { max-width: 1180px; }
.tcs-hub-front-workspace :where(a, button, input, select, textarea, [tabindex]):focus { outline: 3px solid #1d4ed8; outline-offset: 3px; }
.tcs-hub-front-workspace > h1 { margin-top: 0; }
.tcs-hub-front-workspace .tcs-admin-card,
.tcs-hub-front-workspace .tcs-filter-form,
.tcs-hub-front-workspace > table { background: #fff; border: 1px solid #dcdcde; border-radius: 8px; box-sizing: border-box; margin: 18px 0; padding: 18px; }
.tcs-hub-front-workspace .tcs-filter-form { display: grid; gap: 14px; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.tcs-hub-front-workspace .tcs-filter-form p { margin: 0; }
.tcs-hub-front-workspace .tcs-filter-form p:last-child { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; grid-column: 1 / -1; }
.tcs-hub-front-workspace label { font-weight: 700; }
.tcs-hub-front-workspace input:not([type="checkbox"]):not([type="radio"]),
.tcs-hub-front-workspace select,
.tcs-hub-front-workspace textarea { box-sizing: border-box; max-width: 100%; width: 100%; }
.tcs-hub-front-workspace table { border-collapse: collapse; display: table; overflow-wrap: anywhere; padding: 0; width: 100%; }
.tcs-hub-front-workspace th,
.tcs-hub-front-workspace td { border-bottom: 1px solid #dcdcde; padding: 10px; text-align: start; vertical-align: top; }
.tcs-hub-front-workspace .description { color: #646970; }
.tcs-hub-front-workspace .notice { border-inline-start: 4px solid #2271b1; margin: 14px 0; padding: 10px 14px; }
.tcs-hub-front-workspace .notice-success { border-inline-start-color: #00a32a; }
.tcs-hub-front-workspace .notice-warning { border-inline-start-color: #dba617; }
.tcs-hub-front-workspace .notice-error { border-inline-start-color: #d63638; }
.tcs-hub-front-workspace .tcs-inline-form { display: inline; }
.tcs-hub-front-workspace .tcs-save-view-form { display: grid; gap: 8px; grid-template-columns: minmax(0, 1fr) auto; }
.tcs-hub-front-workspace .tcs-save-view-form label,
.tcs-hub-front-workspace .tcs-save-view-form small { grid-column: 1 / -1; }
.tcs-hub-front-workspace .tcs-live-controls { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; }

/* Public help-center landing page. */
.tcs-portal {
	color: #1f2d3d;
	margin-block-start: clamp(20px, 3vw, 32px);
	max-width: 1180px;
}

.tcs-screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.tcs-brand-header {
	align-items: flex-start;
	background: #f7f7fa;
	border: 0;
	border-radius: 12px 12px 0 0;
	display: flex;
	margin: 0;
	padding: clamp(24px, 4vw, 40px) clamp(24px, 6vw, 60px) 12px;
}

.tcs-brand-header h2 {
	color: #17283a;
	font-size: clamp(2.15rem, 5vw, 3.6rem);
	letter-spacing: -.035em;
	line-height: 1.05;
}

.tcs-brand-welcome {
	color: #445266;
	font-size: clamp(1rem, 2vw, 1.2rem);
	margin-block-start: 14px !important;
}

.tcs-kb-search {
	background: #f7f7fa;
	border: 0;
	border-radius: 0 0 12px 12px;
	margin: 0 0 clamp(38px, 6vw, 70px);
	padding: 10px clamp(24px, 6vw, 60px) clamp(24px, 4vw, 36px);
}

.tcs-kb-search form {
	align-items: stretch;
	display: grid;
	filter: drop-shadow(0 6px 10px rgba(23, 40, 58, .12));
	grid-template-columns: minmax(0, 1fr) 72px;
	margin: 0;
	max-width: 680px;
}

.tcs-kb-search input[type="search"] {
	background: #fff;
	border: 1px solid #e4e7eb;
	border-inline-end: 0;
	border-radius: 8px 0 0 8px;
	font-size: 1.05rem;
	min-height: 66px;
	padding: 14px 20px;
	width: 100%;
}

.tcs-kb-search button[type="submit"] {
	align-items: center;
	background: #2f3133;
	border: 1px solid #2f3133;
	border-radius: 0 8px 8px 0;
	color: #fff;
	display: flex;
	justify-content: center;
	min-height: 66px;
	padding: 0;
	width: 72px;
}

.tcs-kb-search button svg {
	fill: none;
	height: 26px;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-width: 1.7;
	width: 26px;
}

.tcs-kb-common-topics {
	align-items: baseline;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 28px;
}

.tcs-kb-common-topics ul {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.tcs-kb-common-topics li:not(:last-child)::after {
	content: ",";
}

.tcs-kb-common-topics a {
	color: #31455d;
	text-underline-offset: 3px;
}

.tcs-kb-search-results {
	background: #fff;
	border-radius: 8px;
	margin-top: 30px;
	padding: clamp(18px, 4vw, 28px);
}

.tcs-knowledge--topics {
	background: transparent;
	border: 0;
	border-radius: 0;
	margin: 0;
	padding: 0;
}

.tcs-knowledge-heading {
	margin-bottom: clamp(24px, 4vw, 38px);
}

.tcs-knowledge-heading h2 {
	color: #17283a;
	font-size: clamp(1.8rem, 3vw, 2.5rem);
	margin: 4px 0 0;
}

.tcs-kb-topic-grid {
	display: grid;
	gap: clamp(42px, 6vw, 72px) clamp(34px, 5vw, 70px);
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tcs-kb-topic {
	min-width: 0;
}

.tcs-kb-topic h3 {
	align-items: center;
	border-bottom: 1px solid #cfd4da;
	display: flex;
	font-size: clamp(1.1rem, 2vw, 1.35rem);
	gap: 11px;
	margin: 0;
	padding-bottom: 18px;
}

.tcs-kb-topic h3 a {
	color: #17283a;
	text-decoration: none;
}

.tcs-kb-topic-icon {
	color: #006f73;
	font-size: 1.35em;
	line-height: 1;
}

.tcs-kb-topic ul {
	list-style: none;
	margin: 14px 0 12px;
	padding: 0;
}

.tcs-kb-topic li a {
	align-items: center;
	color: #25394f;
	display: flex;
	gap: 14px;
	justify-content: space-between;
	min-height: 48px;
	padding: 8px 0;
	text-decoration: none;
}

.tcs-kb-topic li a span:first-child {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.tcs-kb-topic li a:hover span:first-child,
.tcs-kb-topic li a:focus-visible span:first-child,
.tcs-kb-topic h3 a:hover,
.tcs-kb-topic h3 a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.tcs-kb-topic-arrow {
	font-size: 1.5rem;
	line-height: 1;
}

.tcs-kb-see-all {
	color: #006f73;
	font-weight: 700;
	text-decoration: none;
}

.tcs-kb-see-all span {
	font-size: 1.25em;
	margin-inline-start: 8px;
}

.tcs-help-actions {
	align-items: center;
	background: #f7f7fa;
	border-radius: 10px;
	display: flex;
	gap: 28px;
	justify-content: space-between;
	margin-top: clamp(50px, 7vw, 86px);
	padding: clamp(24px, 5vw, 42px);
}

.tcs-help-actions h2,
.tcs-help-actions p {
	margin-block: 4px;
}

.tcs-help-actions h2 {
	font-size: clamp(1.35rem, 2.5vw, 1.8rem);
}

.tcs-help-action-links {
	display: flex;
	flex: 0 0 auto;
	flex-wrap: wrap;
	gap: 10px;
}

.tcs-help-action-links a {
	align-items: center;
	border: 2px solid #006f73;
	border-radius: 6px;
	display: inline-flex;
	font-weight: 700;
	justify-content: center;
	min-height: 48px;
	padding: 10px 18px;
	text-decoration: none;
}

.tcs-help-action-primary {
	background: #006f73;
	color: #fff;
}

.tcs-help-action-secondary {
	background: #fff;
	color: #17283a;
}

.tcs-ticket-access {
	scroll-margin-top: 120px;
}

.tcs-ticket-access > h2 {
	margin-top: clamp(42px, 6vw, 70px);
}

@media (max-width: 900px) {
	.tcs-kb-topic-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tcs-kb-article-layout {
		grid-template-areas: "toc" "article";
		grid-template-columns: minmax(0, 1fr);
	}

	.tcs-kb-toc {
		border-block-end: 1px solid #dcdcde;
		border-inline-start: 0;
		padding-block-end: 20px;
		padding-inline-start: 0;
		position: static;
	}
}

@media (max-width: 600px) {
	.tcs-portal,
	.tcs-agent-workspace {
		max-width: 100%;
	}

	.tcs-new-ticket,
	.tcs-ticket-list,
	.tcs-ticket-detail,
	.tcs-login-required,
	.tcs-guest-session,
	.tcs-agent-filters,
	.tcs-front-saved-views,
	.tcs-agent-ticket,
	.tcs-agent-conversation {
		min-width: 0;
	}

	.tcs-ticket-list li {
		grid-template-columns: 1fr;
	}

	.tcs-customer-ticket-filters {
		grid-template-columns: 1fr;
	}

	.tcs-agent-header,
	.tcs-agent-messages header {
		display: block;
	}

	.tcs-agent-filters,
	.tcs-front-saved-views,
	.tcs-agent-ticket,
	.tcs-agent-ticket dl,
	.tcs-front-workflow {
		grid-template-columns: 1fr;
	}

	.tcs-agent-filter-actions {
		grid-column: auto;
	}

	.tcs-kb-grid,
	.tcs-customer-profile dl {
		grid-template-columns: 1fr;
	}

	.tcs-brand-header {
		padding-bottom: 12px;
	}

	.tcs-kb-search form {
		grid-template-columns: minmax(0, 1fr) 60px;
	}

	.tcs-kb-search button[type="submit"] {
		width: 60px;
	}

	.tcs-kb-topic-grid {
		grid-template-columns: 1fr;
	}

	.tcs-help-actions {
		align-items: stretch;
		flex-direction: column;
	}

	.tcs-help-action-links,
	.tcs-help-action-links a {
		width: 100%;
	}

	.tcs-hub-front-workspace .tcs-filter-form,
	.tcs-hub-front-workspace .tcs-save-view-form {
		grid-template-columns: 1fr;
	}

	.tcs-hub-front-workspace > table,
	.tcs-hub-front-workspace .tcs-admin-card table {
		display: block;
		overflow-x: auto;
	}

	.tcs-guest-session,
	.tcs-agent-filter-actions,
	.tcs-draft-controls {
		align-items: stretch;
		flex-direction: column;
	}
}

@media (min-width: 601px) and (max-width: 900px) {
	.tcs-agent-filters,
	.tcs-front-workflow {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tcs-agent-ticket {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tcs-portal *,
	.tcs-agent-workspace * {
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
	}
}

@media (forced-colors: active) {
	.tcs-portal :where(a, button, input, select, textarea):focus-visible,
	.tcs-agent-workspace :where(a, button, input, select, textarea, [tabindex]):focus-visible,
	.tcs-link-dialog :where(button, input):focus-visible {
		outline-color: Highlight;
	}
}
