/*!
 * PAT Help Desk frontend styles
 * Universal Style Guide compliant — system prefix: pat-hd-
 */
.pat-hd { --primary: #24478f; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; color: #1e293b; max-width: 1100px; margin: 0 auto; }
.pat-hd * { box-sizing: border-box; }

/* ── Sticky gradient header ───────────────────────────────── */
.pat-hd-header {
	background: white;
	border: 1px solid #e2e8f0;
	border-radius: 5px;
	position: sticky;
	top: 0;
	z-index: 90;
	margin-bottom: 16px;
}
.pat-hd-header-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 24px 14px;
	gap: 16px;
	flex-wrap: wrap;
	background: linear-gradient(230deg, rgba(31,38,74,1) 0%, rgba(11,23,62,1) 17%, rgba(24,41,94,1) 38%, rgba(50,71,120,1) 73%, rgba(6,20,59,1) 100%);
	border-bottom: 3px solid #d4af35;
	border-radius: 5px 5px 0 0;
}
.pat-hd-title {
	font-size: 22px;
	font-weight: 600;
	color: white;
	line-height: 1.3;
	margin: 0;
}
.pat-hd-subtitle {
	font-size: 13px;
	color: rgba(255,255,255,0.7);
	margin: 2px 0 0 0;
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
}
.pat-hd-header-actions {
	display: flex;
	gap: 8px;
}
.pat-hd-header-actions .pat-hd-btn {
	background: rgba(255,255,255,0.15);
	color: white;
	border: 1px solid rgba(255,255,255,0.25);
}
.pat-hd-header-actions .pat-hd-btn:hover {
	background: rgba(255,255,255,0.22);
}
.pat-hd-toolbar {
	display: flex;
	gap: 8px;
	align-items: center;
	padding: 12px 24px;
	flex-wrap: wrap;
}
.pat-hd-toolbar input[type="search"], .pat-hd-toolbar select { font-size: 13px; }

/* ── Cards ───────────────────────────────────────────────── */
.pat-hd-card {
	background: white;
	border: 1px solid #e2e8f0;
	border-radius: 5px;
	padding: 20px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.04);
	margin-bottom: 16px;
	transition: box-shadow 0.2s ease;
}
.pat-hd-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.06); }
.pat-hd-section-heading {
	font-size: 18px;
	font-weight: 600;
	margin: 0 0 12px 0;
	color: #1e293b;
}

/* ── Forms ───────────────────────────────────────────────── */
.pat-hd-form-group { display: block; margin-bottom: 16px; }
.pat-hd-form-row { display: grid; grid-template-columns: 1fr; gap: 12px; }
.pat-hd-form-row-2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 768px) { .pat-hd-form-row-2 { grid-template-columns: 1fr; } }
.pat-hd-label {
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: #374151;
	margin-bottom: 6px;
}
.pat-hd .required { color: #ef4444; }
.pat-hd input[type="text"], .pat-hd input[type="email"], .pat-hd input[type="search"],
.pat-hd input[type="url"], .pat-hd input[type="number"], .pat-hd input[type="password"],
.pat-hd select, .pat-hd textarea {
	width: 100%;
	padding: 6px 12px;
	height: 34px;
	border: 1px solid #d1d5db;
	border-radius: 5px;
	font-size: 13px;
	font-family: inherit;
	background: white;
	color: #1e293b;
	transition: border-color 0.15s, box-shadow 0.15s;
}
.pat-hd select {
	line-height: 1em;
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 10px center;
	padding-right: 32px;
}
.pat-hd textarea { height: auto; padding: 8px 12px; min-height: 80px; line-height: 1.5; }
.pat-hd input:focus, .pat-hd select:focus, .pat-hd textarea:focus {
	border-color: var(--primary, #24478f);
	box-shadow: 0 0 0 3px rgba(36,71,143,0.1);
	outline: none;
}
.pat-hd-form-hint { font-size: 12px; color: #64748b; display: block; margin-top: 4px; }
.pat-hd-form-actions { display: flex; gap: 8px; margin-top: 16px; flex-wrap: wrap; }
.pat-hd-honeypot { position: absolute !important; left: -9999px !important; opacity: 0 !important; height: 0 !important; width: 0 !important; }
.pat-hd-checkbox {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: #374151;
}

/* ── Buttons ─────────────────────────────────────────────── */
.pat-hd-btn {
	padding: 7px 14px;
	border-radius: 5px;
	font-size: 13px;
	font-weight: 500;
	transition: all 0.15s ease;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border: 1px solid transparent;
	text-decoration: none;
	font-family: inherit;
	line-height: 1;
}
.pat-hd-btn-primary { background: var(--primary, #24478f); color: white; border-color: var(--primary, #24478f); }
.pat-hd-btn-primary:hover { background: #1d3973; }
.pat-hd-btn-secondary { background: white; border-color: #d1d5db; color: #374151; }
.pat-hd-btn-secondary:hover { background: #f8fafc; }
.pat-hd-btn-danger { background: #dc2626; color: white; }
.pat-hd-btn-success { background: #059669; color: white; }
.pat-hd-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.pat-hd-link-btn {
	background: none;
	border: none;
	color: var(--primary, #24478f);
	cursor: pointer;
	font-size: 13px;
	padding: 4px 8px;
	font-family: inherit;
}
.pat-hd-link-btn:hover { text-decoration: underline; }

/* ── Badges ──────────────────────────────────────────────── */
.pat-hd-badge {
	display: inline-flex;
	align-items: center;
	padding: 2px 8px;
	border-radius: 5px;
	font-size: 11px;
	font-weight: 500;
}
.pat-hd-badge-info    { background: #eff6ff; color: var(--primary, #24478f); }
.pat-hd-badge-success { background: #ecfdf5; color: #059669; }
.pat-hd-badge-warning { background: #fef3c7; color: #b45309; }
.pat-hd-badge-error   { background: #fef2f2; color: #dc2626; }
.pat-hd-badge-muted   { background: #f1f5f9; color: #64748b; }

/* ── Alerts ──────────────────────────────────────────────── */
.pat-hd-alert {
	padding: 12px 16px;
	border-radius: 8px;
	font-size: 13px;
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 12px;
	border: 1px solid;
}
.pat-hd-alert-info    { background: #eff6ff; color: var(--primary, #24478f); border-color: #bfdbfe; }
.pat-hd-alert-warning { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.pat-hd-alert-error   { background: #fef2f2; color: #991b1b; border-color: #fca5a5; }
.pat-hd-alert-success { background: #ecfdf5; color: #065f46; border-color: #6ee7b7; }
.pat-hd-alert-muted   { background: #f8fafc; color: #475569; border-color: #e2e8f0; }

/* ── Stepped contact form: progress indicator ───────────── */
.pat-hd-progress {
	position: relative;
	margin: 4px 0 28px;
	padding: 0 8px;
}
.pat-hd-progress-track {
	position: absolute;
	top: 15px;
	left: calc(16.66% + 8px);
	right: calc(16.66% + 8px);
	height: 3px;
	background: #e8edf5;
	border-radius: 3px;
	overflow: hidden;
}
.pat-hd-progress-fill {
	display: block;
	width: 0;
	height: 100%;
	background: linear-gradient(90deg, #d4af35 0%, #e3c45c 100%);
	border-radius: 3px;
	transition: width 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.pat-hd-progress-nodes {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	z-index: 1;
}
.pat-hd-progress-node {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	text-align: center;
}
.pat-hd-progress-dot {
	position: relative;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: white;
	border: 2px solid #d6deeb;
	color: #8a97ad;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	font-weight: 600;
	transition: all 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.pat-hd-progress-check {
	position: absolute;
	width: 14px;
	height: 14px;
	opacity: 0;
	transform: scale(0.4);
	transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.pat-hd-progress-num { transition: all 0.2s ease; }
.pat-hd-progress-node.is-active .pat-hd-progress-dot {
	border-color: #0b173e;
	background: linear-gradient(135deg, #1f264a 0%, #0b173e 100%);
	color: #fff;
	box-shadow: 0 0 0 5px rgba(36, 71, 143, 0.12);
	transform: scale(1.08);
}
.pat-hd-progress-node.is-done .pat-hd-progress-dot {
	border-color: #d4af35;
	background: #d4af35;
	color: #1a1a2e;
}
.pat-hd-progress-node.is-done .pat-hd-progress-num { opacity: 0; transform: scale(0.4); }
.pat-hd-progress-node.is-done .pat-hd-progress-check { opacity: 1; transform: scale(1); }
.pat-hd-progress-label {
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #9aa5b8;
	transition: color 0.25s ease;
}
.pat-hd-progress-node.is-active .pat-hd-progress-label { color: #0b173e; }
.pat-hd-progress-node.is-done .pat-hd-progress-label { color: #b0891c; }

/* Step panels + transitions */
.pat-hd-step[hidden] { display: none !important; }
.pat-hd-step-enter { animation: pat-hd-step-in 0.4s cubic-bezier(0.22, 1, 0.36, 1); }
@keyframes pat-hd-step-in {
	from { opacity: 0; transform: translateX(18px); }
	to   { opacity: 1; transform: translateX(0); }
}
.pat-hd-fade-up { animation: pat-hd-rise 0.45s cubic-bezier(0.22, 1, 0.36, 1); }
@keyframes pat-hd-rise {
	from { opacity: 0; transform: translateY(10px); }
	to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
	.pat-hd-step-enter, .pat-hd-fade-up { animation: none; }
	.pat-hd-progress-fill, .pat-hd-progress-dot { transition: none; }
}
.pat-hd-step-back {
	margin-top: 12px;
	background: none;
	border: 0;
	padding: 0;
	font-size: 13px;
	font-weight: 500;
	color: var(--primary, #24478f);
	cursor: pointer;
	font-family: inherit;
}
.pat-hd-step-back:hover { text-decoration: underline; }

/* ── KB suggestions ──────────────────────────────────────── */
.pat-hd-kb-suggest, .pat-hd-kb-standalone, .pat-hd-kb-ai {
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 10px;
	padding: 16px 18px;
	margin-bottom: 16px;
}
.pat-hd-kb-ai {
	background: linear-gradient(180deg, #fffdf4 0%, #fffef9 100%);
	border: 1px solid #ecdfb0;
	border-top: 3px solid #d4af35;
	box-shadow: 0 6px 20px rgba(11, 23, 62, 0.05);
}
.pat-hd-kb-ai-body {
	font-size: 14px;
	color: #1e293b;
	line-height: 1.65;
	/* No max-height: the full answer always flows — nothing gets cut off. */
	overflow-wrap: break-word;
}
.pat-hd-kb-ai-body p { margin: 0 0 10px; }
.pat-hd-kb-ai-body p:last-child { margin-bottom: 0; }
.pat-hd-kb-ai-body ul, .pat-hd-kb-ai-body ol { margin: 0 0 10px; padding-left: 20px; }
.pat-hd-kb-heading {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #b0891c;
	margin-bottom: 10px;
	padding-bottom: 8px;
	border-bottom: 1px solid rgba(212, 175, 53, 0.28);
}
.pat-hd-kb-suggest .pat-hd-kb-heading {
	color: #46567a;
	border-bottom-color: #e2e8f0;
}

/* AI answer loading skeleton */
.pat-hd-kb-skeleton {
	border: 1px solid #e8edf5;
	border-radius: 10px;
	padding: 16px 18px;
	margin-bottom: 16px;
	background: white;
}
.pat-hd-kb-skeleton[hidden] { display: none; }
.pat-hd-kb-skeleton-badge,
.pat-hd-kb-skeleton-line {
	height: 12px;
	border-radius: 6px;
	margin-bottom: 10px;
	background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
	background-size: 200% 100%;
	animation: pat-hd-shimmer 1.4s ease-in-out infinite;
}
.pat-hd-kb-skeleton-badge { width: 130px; height: 14px; margin-bottom: 14px; background: linear-gradient(90deg, #f7f0d8 25%, #efe3ba 50%, #f7f0d8 75%); background-size: 200% 100%; }
.pat-hd-kb-skeleton-line:last-child { margin-bottom: 0; }
@keyframes pat-hd-shimmer {
	0% { background-position: 200% 0; }
	100% { background-position: -200% 0; }
}
@media (prefers-reduced-motion: reduce) {
	.pat-hd-kb-skeleton-badge, .pat-hd-kb-skeleton-line { animation: none; }
}
.pat-hd-kb-list { list-style: none; padding: 0; margin: 0; }
.pat-hd-kb-list li {
	border-bottom: 1px solid #e2e8f0;
	padding: 8px 0;
}
.pat-hd-kb-list li:last-child { border-bottom: 0; }
.pat-hd-kb-q {
	background: none;
	border: 0;
	padding: 0;
	font-size: 14px;
	font-weight: 500;
	color: var(--primary, #24478f);
	cursor: pointer;
	font-family: inherit;
	text-align: left;
	display: flex;
	gap: 8px;
	align-items: center;
}
.pat-hd-kb-q:hover { text-decoration: underline; }
.pat-hd-kb-a { display: none; padding: 8px 0 4px; font-size: 13px; color: #1e293b; line-height: 1.6; }
.pat-hd-kb-a.open {
	display: block;
	/* Full answers flow — no clipping. */
	overflow-wrap: break-word;
}
.pat-hd-kb-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 8px;
	margin-bottom: 4px;
	position: sticky;
	bottom: 0;
	z-index: 2;
	padding: 12px 0 4px;
	background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #fff 28%, #fff 100%);
}
.pat-hd-kb-empty-step {
	background: #f8fafc;
	border: 1px dashed #e2e8f0;
	border-radius: 5px;
	padding: 16px;
	margin-bottom: 16px;
	font-size: 13px;
	color: #64748b;
}
.pat-hd-kb-empty-step p { margin: 0; }
.pat-hd-kb-empty { background: white; border: 1px dashed #e2e8f0; border-radius: 5px; padding: 24px; text-align: center; }
.pat-hd-turnstile-wrap { min-height: 65px; }

@media (max-width: 480px) {
	.pat-hd-progress-label { font-size: 9.5px; letter-spacing: 0.02em; }
	.pat-hd-progress-dot { width: 28px; height: 28px; font-size: 12px; }
	.pat-hd-progress-track { top: 13px; }
	.pat-hd-kb-actions { flex-direction: column; }
	.pat-hd-kb-actions .pat-hd-btn { width: 100%; justify-content: center; }
}

/* ── Tables ──────────────────────────────────────────────── */
.pat-hd-table {
	border: 1px solid #e2e8f0;
	border-radius: 5px;
	overflow: hidden;
	background: white;
	margin-bottom: 16px;
}
.pat-hd-table-header,
.pat-hd-table-row {
	display: grid;
	grid-template-columns: 110px 1fr 110px 130px;
	padding: 10px 16px;
	font-size: 13px;
	color: #1e293b;
	gap: 8px;
	align-items: center;
}
.pat-hd-table-header-3 { grid-template-columns: 1fr 100px 110px; }
.pat-hd-table-header-4, .pat-hd-table-row-4 { grid-template-columns: 110px 1fr 110px 130px; }
.pat-hd-table-header-7, .pat-hd-table-row-7 { grid-template-columns: 110px 1fr 200px 110px 90px 160px 130px; }
.pat-hd-table-row-3 { grid-template-columns: 1fr 100px 110px; }
.pat-hd-table-header {
	background: #fafbfc;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #64748b;
	font-weight: 600;
	border-bottom: 1px solid #e2e8f0;
}
.pat-hd-table-row {
	border-bottom: 1px solid #f1f5f9;
	text-decoration: none;
	color: inherit;
	cursor: pointer;
}
.pat-hd-table-row:focus-visible {
	outline: 2px solid var(--primary, #24478f);
	outline-offset: -2px;
}
.pat-hd-table-row:last-child { border-bottom: 0; }
.pat-hd-table-row:hover { background: #f8fafc; }
.pat-hd-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; color: #475569; }

@media (max-width: 768px) {
	.pat-hd-table-header { display: none; }
	.pat-hd-table-row { display: block; padding: 12px 16px; }
	.pat-hd-table-row > div { padding: 6px 0; }
	.pat-hd-table-row > div[data-label]::before {
		content: attr(data-label);
		display: block;
		font-size: 11px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.04em;
		color: #64748b;
		margin-bottom: 2px;
	}
}

/* ── Empty / loading ─────────────────────────────────────── */
.pat-hd-empty {
	padding: 48px 20px;
	text-align: center;
	background: white;
	border: 1px dashed #e2e8f0;
	border-radius: 5px;
	color: #64748b;
}
.pat-hd-empty-icon { opacity: 0.3; margin-bottom: 12px; color: #475569; }
.pat-hd-empty-text { font-size: 16px; font-weight: 500; color: #334155; }
.pat-hd-empty-subtext { font-size: 13px; margin-top: 4px; }

/* ── Conversation thread (legacy classes kept as aliases) ── */
.pat-hd-thread { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.pat-hd-message {
	background: white;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 10px 12px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}
.pat-hd-message-customer,
.pat-hd-message-staff,
.pat-hd-message-system,
.pat-hd-message-ai { border-left: 0; }
.pat-hd-message-staff { background: #fafbfc; }
.pat-hd-message-system { background: #f8fafc; }
.pat-hd-message-ai { background: #fffbe8; }
.pat-hd-message.is-private { background: #fffdf5; border-color: #f0e2b6; }
.pat-hd-message-meta { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; font-size: 13px; color: #475569; flex-wrap: wrap; }
.pat-hd-message-body { font-size: 13px; line-height: 1.55; color: #334155; }
.pat-hd-message-body p:first-child { margin-top: 0; }
.pat-hd-message-body p:last-child  { margin-bottom: 0; }

.pat-hd-attachments { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px; }
.pat-hd-attachment {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	background: #f1f5f9;
	border-radius: 5px;
	font-size: 13px;
	color: #1e293b;
	text-decoration: none;
}
.pat-hd-attachment:hover { background: #e2e8f0; }
.pat-hd-attachment-image {
	flex-direction: column;
	align-items: flex-start;
	max-width: 220px;
	padding: 6px;
}
.pat-hd-attachment-image img {
	display: block;
	max-width: 100%;
	max-height: 140px;
	border-radius: 5px;
	object-fit: cover;
}
.pat-hd-message-body img,
.pat-hd-inline-img {
	display: block;
	max-width: 100%;
	height: auto;
	border-radius: 5px;
	margin: 8px 0;
	border: 1px solid #e2e8f0;
}

/* ── Stats ───────────────────────────────────────────────── */
.pat-hd-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 12px;
	margin-bottom: 16px;
}
.pat-hd-stat {
	background: white;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 12px 16px;
	position: relative;
	overflow: hidden;
	box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.pat-hd-stat::before {
	content: "";
	position: absolute;
	left: 0; top: 0; bottom: 0;
	width: 3px;
	background: var(--primary, #24478f);
	border-radius: 3px 0 0 3px;
}
.pat-hd-stat-open::before       { background: var(--primary, #24478f); }
.pat-hd-stat-unassigned::before { background: #d4af35; }
.pat-hd-stat-pending::before    { background: #f59e0b; }
.pat-hd-stat-awaiting::before   { background: #0277bd; }
.pat-hd-stat-resolved::before   { background: #059669; }
.pat-hd-stat-icon { color: var(--primary, #24478f); }
.pat-hd-stat-icon .dashicons { width: 24px; height: 24px; font-size: 24px; }
.pat-hd-stat-value { font-size: 22px; font-weight: 700; color: #1e293b; line-height: 1.2; }
.pat-hd-stat-label { font-size: 12px; color: #64748b; }

/* ── 2-col layout for ticket view + grid-2 ───────────────── */
.pat-hd-2col { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; }
@media (max-width: 992px) { .pat-hd-2col { grid-template-columns: 1fr; } }
.pat-hd-2col-side .pat-hd-card { margin-bottom: 12px; }

.pat-hd-grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 16px; }

/* ── Modal ───────────────────────────────────────────────── */
.pat-hd-modal-overlay {
	position: fixed; inset: 0;
	background: rgba(15,23,42,0.5);
	backdrop-filter: blur(4px);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 10000;
	padding: 20px;
}
.pat-hd-modal-overlay[hidden] { display: none !important; }
.pat-hd-modal {
	background: white;
	border-radius: 12px;
	box-shadow: 0 20px 60px rgba(0,0,0,0.2);
	max-width: 700px;
	width: 100%;
	max-height: 90vh;
	overflow-y: auto;
	animation: pat-hd-modal-in 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes pat-hd-modal-in { from { opacity: 0; transform: scale(0.95) translateY(8px); } to { opacity: 1; transform: scale(1) translateY(0); } }
.pat-hd-modal-header { display: flex; justify-content: space-between; align-items: center; padding: 16px 24px; border-bottom: 1px solid #e2e8f0; }
.pat-hd-modal-header h2 { margin: 0; font-size: 18px; }
.pat-hd-modal-close { background: none; border: 0; font-size: 24px; line-height: 1; cursor: pointer; color: #64748b; }
.pat-hd-modal-body { padding: 20px 24px; }
.pat-hd-modal-footer { padding: 16px 24px; border-top: 1px solid #e2e8f0; display: flex; gap: 8px; justify-content: flex-end; }

@media (max-width: 768px) {
	.pat-hd-modal-overlay { padding: 0; align-items: flex-end; }
	.pat-hd-modal { border-radius: 16px 16px 0 0; max-height: 85vh; }
}

/* ── Pagination ──────────────────────────────────────────── */
.pat-hd-pagination { display: flex; gap: 4px; justify-content: center; margin: 16px 0; }
.pat-hd-pagination a, .pat-hd-pagination button {
	min-width: 30px;
	height: 30px;
	padding: 0 10px;
	border: 1px solid #d1d5db;
	border-radius: 5px;
	font-size: 13px;
	background: white;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	color: #1e293b;
}
.pat-hd-pagination .active { background: var(--primary, #24478f); color: white; border-color: var(--primary, #24478f); }

/* ── Misc ────────────────────────────────────────────────── */
.pat-hd-muted { color: #64748b; font-size: 13px; }
.pat-hd-success-title { font-size: 18px; font-weight: 600; margin-top: 12px; }
.pat-hd-success-meta { font-family: ui-monospace, monospace; color: #475569; margin: 4px 0; }
.pat-hd-success-body { color: #475569; font-size: 13px; }

.pat-hd-form-error { margin-top: 12px; }
.pat-hd-form-error.show { background: #fef2f2; color: #991b1b; border: 1px solid #fca5a5; padding: 10px 12px; border-radius: 5px; font-size: 13px; }

/* ── Eyebrow (shared) ────────────────────────────────────── */
.pat-hd-eyebrow {
	margin: 0 0 4px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(212, 175, 53, 0.95);
}

/* ═══════════════════════════════════════════════════════════
   Contact page — brand look (navy gradients, gold, serif display)
   ═══════════════════════════════════════════════════════════ */
.pat-hd-contact {
	max-width: 760px;
	/* Avoid theme/section overflow:hidden clipping tall step content */
	overflow: visible;
	--hd-gold: #d4af35;
	--hd-navy-deep: #0b173e;
	--hd-serif: "Playfair Display", "Butler", Georgia, "Times New Roman", serif;
}
.pat-hd-contact .pat-hd-submit-card,
.pat-hd-contact .pat-hd-submit-form,
.pat-hd-contact .pat-hd-step {
	overflow: visible;
}
.pat-hd-contact-hero {
	position: relative;
	overflow: hidden;
	border-radius: 14px;
	background:
		radial-gradient(ellipse 80% 70% at 88% 0%, rgba(212, 175, 53, 0.16) 0%, transparent 55%),
		linear-gradient(230deg, #1f264a 0%, #0b173e 17%, #18295e 38%, #324778 73%, #06143b 100%);
	box-shadow: 0 18px 44px rgba(6, 20, 59, 0.28);
}
/* Diagonal geometric shapes echoing the site hero panels */
.pat-hd-contact-hero-shape {
	position: absolute;
	pointer-events: none;
}
.pat-hd-contact-hero-shape-a {
	top: -70px;
	right: -60px;
	width: 300px;
	height: 300px;
	background: linear-gradient(135deg, rgba(255,255,255,0.07) 0%, rgba(255,255,255,0) 60%);
	transform: rotate(24deg);
	border-radius: 40px;
}
.pat-hd-contact-hero-shape-b {
	bottom: -110px;
	left: -40px;
	width: 260px;
	height: 260px;
	background: linear-gradient(135deg, rgba(212,175,53,0.13) 0%, rgba(212,175,53,0) 55%);
	transform: rotate(-18deg);
	border-radius: 40px;
}
.pat-hd-contact-hero-inner {
	padding: 44px 40px 64px;
	position: relative;
	z-index: 1;
}
.pat-hd-contact-eyebrow {
	margin: 0 0 12px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--hd-gold, #d4af35);
}
.pat-hd-contact-title {
	margin: 0;
	font-family: var(--hd-serif);
	font-size: 38px;
	font-weight: 700;
	line-height: 1.15;
	color: #fff;
	letter-spacing: 0.005em;
}
.pat-hd-contact-title-accent {
	font-style: italic;
	color: var(--hd-gold, #d4af35);
	font-weight: 600;
}
.pat-hd-contact-lead {
	margin: 12px 0 0;
	font-size: 15.5px;
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.78);
	max-width: 34em;
}
.pat-hd-contact-gold-rule {
	width: 56px;
	height: 3px;
	margin-top: 18px;
	background: linear-gradient(90deg, #d4af35, #e8ca6d);
	border-radius: 2px;
}
/* Floating form card overlapping the hero */
.pat-hd-contact .pat-hd-submit-card {
	margin: -34px 20px 0;
	position: relative;
	z-index: 2;
	border: 0;
	border-radius: 14px;
	padding: 28px;
	box-shadow: 0 12px 40px rgba(11, 23, 62, 0.14), 0 2px 8px rgba(11, 23, 62, 0.06);
}
.pat-hd-contact .pat-hd-submit-card:hover {
	box-shadow: 0 12px 40px rgba(11, 23, 62, 0.14), 0 2px 8px rgba(11, 23, 62, 0.06);
}

/* Gold pill CTA (matches site buttons) */
.pat-hd-btn-gold {
	background: linear-gradient(135deg, #d9b545 0%, #c9a52e 100%);
	color: #1a1a2e;
	border: 0;
	border-radius: 999px;
	padding: 11px 24px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.01em;
	box-shadow: 0 4px 14px rgba(212, 175, 53, 0.35);
	position: relative;
}
.pat-hd-btn-gold:hover {
	background: linear-gradient(135deg, #e0bd50 0%, #d4af35 100%);
	transform: translateY(-1px);
	box-shadow: 0 7px 20px rgba(212, 175, 53, 0.45);
}
.pat-hd-btn-gold:active { transform: translateY(0); }
.pat-hd-btn-gold .pat-hd-btn-arrow { transition: transform 0.2s ease; }
.pat-hd-btn-gold:hover .pat-hd-btn-arrow { transform: translateX(3px); }
.pat-hd-btn.is-loading { pointer-events: none; }
.pat-hd-btn.is-loading .pat-hd-btn-arrow { display: none; }
.pat-hd-btn.is-loading::after {
	content: "";
	width: 14px;
	height: 14px;
	border-radius: 50%;
	border: 2px solid rgba(26, 26, 46, 0.25);
	border-top-color: #1a1a2e;
	animation: pat-hd-spin 0.7s linear infinite;
}
@keyframes pat-hd-spin { to { transform: rotate(360deg); } }
.pat-hd-contact .pat-hd-btn-secondary {
	border-radius: 999px;
	padding: 10px 20px;
	font-size: 14px;
}

/* Category cards */
.pat-hd-cat-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 10px;
}
.pat-hd-cat-card {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	border: 1.5px solid #dfe5ef;
	border-radius: 10px;
	background: #fbfcfe;
	cursor: pointer;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	color: #33415c;
	text-align: left;
	transition: all 0.18s cubic-bezier(0.22, 1, 0.36, 1);
}
.pat-hd-cat-card:hover {
	border-color: #aab8d4;
	background: white;
	transform: translateY(-1px);
	box-shadow: 0 4px 14px rgba(11, 23, 62, 0.08);
}
.pat-hd-cat-card-icon {
	font-size: 17px;
	width: 30px;
	height: 30px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	background: rgba(36, 71, 143, 0.08);
	color: var(--cat-color, #24478f);
	transition: all 0.18s ease;
}
.pat-hd-cat-card-name { line-height: 1.25; }
.pat-hd-cat-card.is-selected {
	border-color: var(--hd-navy-deep, #0b173e);
	background: linear-gradient(135deg, #1f264a 0%, #0b173e 100%);
	color: white;
	box-shadow: 0 6px 18px rgba(11, 23, 62, 0.28), inset 0 -2px 0 #d4af35;
}
.pat-hd-cat-card.is-selected .pat-hd-cat-card-icon {
	background: rgba(212, 175, 53, 0.2);
	color: #e8ca6d;
}

/* Extra per-category fields */
.pat-hd-extra-fields {
	border: 1px solid #e4e9f2;
	background: #f8fafd;
	border-radius: 12px;
	padding: 18px 18px 6px;
	margin-bottom: 18px;
	animation: pat-hd-rise 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.pat-hd-extra-fields[hidden] { display: none; }
.pat-hd-extra-heading {
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #46567a;
	margin-bottom: 14px;
	display: flex;
	align-items: center;
	gap: 8px;
}
.pat-hd-extra-heading::after {
	content: "";
	flex: 1;
	height: 1px;
	background: #e2e8f0;
}
.pat-hd-extra-field input,
.pat-hd-extra-field select,
.pat-hd-extra-field textarea { background: white; }

/* Order picker */
.pat-hd-order-list { display: flex; flex-direction: column; gap: 8px; }
.pat-hd-order-loading, .pat-hd-order-none {
	font-size: 12.5px;
	color: #64748b;
	padding: 8px 2px;
}
.pat-hd-order-option {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	padding: 10px 14px;
	border: 1.5px solid #dfe5ef;
	border-radius: 10px;
	background: white;
	cursor: pointer;
	font-family: inherit;
	text-align: left;
	transition: all 0.15s ease;
}
.pat-hd-order-option:hover { border-color: #aab8d4; box-shadow: 0 3px 10px rgba(11,23,62,0.07); }
.pat-hd-order-radio {
	width: 17px;
	height: 17px;
	border-radius: 50%;
	border: 2px solid #c3cddd;
	flex-shrink: 0;
	position: relative;
	transition: all 0.15s ease;
}
.pat-hd-order-option.is-selected { border-color: var(--hd-navy-deep, #0b173e); background: #f6f8fd; box-shadow: 0 3px 12px rgba(11,23,62,0.1); }
.pat-hd-order-option.is-selected .pat-hd-order-radio { border-color: var(--hd-navy-deep, #0b173e); }
.pat-hd-order-option.is-selected .pat-hd-order-radio::after {
	content: "";
	position: absolute;
	inset: 3px;
	border-radius: 50%;
	background: #d4af35;
}
.pat-hd-order-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pat-hd-order-num { font-weight: 700; font-size: 13.5px; color: #1e293b; }
.pat-hd-order-desc { font-size: 12px; color: #64748b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pat-hd-order-side { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; flex-shrink: 0; }
.pat-hd-order-total { font-weight: 700; font-size: 13px; color: #0b173e; }
.pat-hd-order-meta { font-size: 11px; color: #8a97ad; }
.pat-hd-order-manual { margin-top: 10px; }
.pat-hd-order-manual-label {
	display: block;
	font-size: 12px;
	font-weight: 600;
	color: #64748b;
	margin-bottom: 5px;
}

/* Secure info section */
.pat-hd-secure-section {
	border: 1.5px solid #e4e9f2;
	border-radius: 12px;
	margin-bottom: 18px;
	overflow: hidden;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.pat-hd-secure-section.is-open {
	border-color: rgba(212, 175, 53, 0.55);
	box-shadow: 0 4px 16px rgba(212, 175, 53, 0.12);
}
.pat-hd-secure-toggle {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 13px 16px;
	background: #fbfcfe;
	border: 0;
	cursor: pointer;
	font-family: inherit;
	font-size: 13.5px;
	font-weight: 600;
	color: #33415c;
	text-align: left;
	transition: background 0.15s ease;
}
.pat-hd-secure-toggle:hover { background: #f4f7fc; }
.pat-hd-secure-toggle-text small { font-weight: 500; color: #8a97ad; }
.pat-hd-secure-toggle-icon {
	width: 30px;
	height: 30px;
	border-radius: 8px;
	background: linear-gradient(135deg, #1f264a 0%, #0b173e 100%);
	color: #e8ca6d;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.pat-hd-secure-chevron { margin-left: auto; color: #8a97ad; transition: transform 0.25s cubic-bezier(0.22,1,0.36,1); }
.pat-hd-secure-section.is-open .pat-hd-secure-chevron { transform: rotate(180deg); }
.pat-hd-secure-body { padding: 4px 16px 16px; animation: pat-hd-rise 0.3s cubic-bezier(0.22,1,0.36,1); }
.pat-hd-secure-body[hidden] { display: none; }
.pat-hd-secure-callout {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	padding: 11px 13px;
	margin-bottom: 12px;
	background: #fdf9ec;
	border-left: 3px solid #d4af35;
	border-radius: 0 8px 8px 0;
	font-size: 12.5px;
	line-height: 1.55;
	color: #6b5a1e;
}
.pat-hd-secure-callout svg { flex-shrink: 0; margin-top: 1px; color: #b0891c; }

/* Success screen with animated gold checkmark */
.pat-hd-submit-success { text-align: center; padding: 28px 16px 20px; }
.pat-hd-success-check { display: inline-block; width: 74px; height: 74px; }
.pat-hd-success-check svg { width: 100%; height: 100%; }
.pat-hd-success-ring {
	stroke-dasharray: 158;
	stroke-dashoffset: 158;
}
.pat-hd-success-tick {
	stroke-dasharray: 34;
	stroke-dashoffset: 34;
}
.pat-hd-submit-success.is-shown .pat-hd-success-ring {
	animation: pat-hd-draw 0.7s cubic-bezier(0.65, 0, 0.35, 1) forwards;
}
.pat-hd-submit-success.is-shown .pat-hd-success-tick {
	animation: pat-hd-draw 0.45s cubic-bezier(0.65, 0, 0.35, 1) 0.5s forwards;
}
@keyframes pat-hd-draw { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) {
	.pat-hd-success-ring, .pat-hd-success-tick { stroke-dashoffset: 0; animation: none; }
}
.pat-hd-contact .pat-hd-success-title {
	font-family: var(--hd-serif);
	font-size: 26px;
	font-weight: 700;
	color: #0b173e;
	margin-top: 16px;
}
.pat-hd-contact .pat-hd-success-meta {
	display: inline-block;
	margin: 10px 0 6px;
	font-family: ui-monospace, monospace;
	font-size: 14px;
	font-weight: 600;
	color: #0b173e;
	background: #fdf9ec;
	border: 1px solid rgba(212, 175, 53, 0.5);
	border-radius: 999px;
	padding: 5px 16px;
}
.pat-hd-contact .pat-hd-success-meta:empty { display: none; }
.pat-hd-contact .pat-hd-success-body { font-size: 14px; color: #5a6b8c; max-width: 30em; margin-left: auto; margin-right: auto; }

/* Responsive contact layout */
@media (max-width: 768px) {
	.pat-hd-contact-hero-inner { padding: 32px 24px 56px; }
	.pat-hd-contact-title { font-size: 30px; }
	.pat-hd-contact-lead { font-size: 14px; }
	.pat-hd-contact .pat-hd-submit-card { margin: -30px 12px 0; padding: 20px; }
	.pat-hd-cat-grid { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 8px; }
	.pat-hd-cat-card { padding: 10px 12px; }
}
@media (max-width: 480px) {
	.pat-hd-contact-hero { border-radius: 12px; }
	.pat-hd-contact-hero-inner { padding: 26px 18px 50px; }
	.pat-hd-contact-title { font-size: 25px; }
	.pat-hd-contact-lead { font-size: 13px; }
	.pat-hd-contact .pat-hd-submit-card { margin: -26px 8px 0; padding: 16px; }
	.pat-hd-cat-grid { grid-template-columns: 1fr 1fr; }
	.pat-hd-contact .pat-hd-form-actions .pat-hd-btn { width: 100%; justify-content: center; }
}

/* ── My Account shells (staff inbox + member tickets/view) ── */
.pat-hd.pat-hd-wide {
	max-width: none;
	width: 100%;
	margin: 0;
	padding: 20px 24px 24px;
	box-sizing: border-box;
}
.pat-hd-wide .pat-hd-header {
	position: relative;
	top: auto;
}
/* ── Staff Help Desk app shell (sidebar + topbar) ────────── */
.pat-hd.pat-hd-app {
	max-width: none;
	width: 100%;
	margin: 0;
	padding: 20px 24px 24px;
	box-sizing: border-box;
}
.pat-hd-app-topbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	padding: 16px 24px 14px;
	background: linear-gradient(230deg, rgba(31,38,74,1) 0%, rgba(11,23,62,1) 17%, rgba(24,41,94,1) 38%, rgba(50,71,120,1) 73%, rgba(6,20,59,1) 100%);
	border: 1px solid #e2e8f0;
	border-bottom: 3px solid #d4af35;
	border-radius: 5px 5px 0 0;
}
.pat-hd-app-topbar .pat-hd-title { font-size: 22px; font-weight: 600; color: white; margin: 0; line-height: 1.3; }
.pat-hd-app-topbar-user {
	display: flex;
	align-items: center;
	gap: 10px;
}
.pat-hd-app-topbar-hi { font-size: 13px; color: rgba(255,255,255,0.8); }
.pat-hd-app-frame {
	display: grid;
	grid-template-columns: 216px minmax(0, 1fr);
	gap: 0;
	background: white;
	border: 1px solid #e2e8f0;
	border-top: 0;
	border-radius: 0 0 5px 5px;
	overflow: hidden;
}
.pat-hd-app-sidebar {
	background: #f8fafc;
	border-right: 1px solid #e2e8f0;
	padding: 12px 8px;
}
.pat-hd-app-nav {
	display: flex;
	flex-direction: column;
	gap: 2px;
	position: sticky;
	top: 12px;
}
.pat-hd-nav-item {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 9px 12px;
	border: 0;
	border-radius: 5px;
	background: transparent;
	font-family: inherit;
	font-size: 13px;
	font-weight: 500;
	color: #64748b;
	cursor: pointer;
	text-align: left;
	transition: all 0.15s ease;
}
.pat-hd-nav-item:hover { background: #f1f5f9; color: #1e293b; }
.pat-hd-nav-item.active {
	background: var(--primary, #24478f);
	color: white;
	box-shadow: 0 1px 3px rgba(36,71,143,0.3);
}
.pat-hd-nav-icon { display: inline-flex; flex-shrink: 0; }
.pat-hd-nav-label { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pat-hd-nav-count {
	font-size: 11px;
	font-weight: 600;
	min-width: 20px;
	height: 18px;
	padding: 0 6px;
	border-radius: 9px;
	background: #e2e8f0;
	color: #475569;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.pat-hd-nav-item.active .pat-hd-nav-count { background: #d4af35; color: #1a1a2e; }
.pat-hd-app-main {
	padding: 16px 20px 20px;
	min-width: 0;
}

/* ── Toolbar (search + status filter) ─────────────────────── */
.pat-hd-app-toolbar {
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
	margin-bottom: 16px;
}
.pat-hd-app-search {
	position: relative;
	flex: 1 1 240px;
	min-width: 180px;
}
.pat-hd-app-search svg {
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
	color: #94a3b8;
	pointer-events: none;
}
.pat-hd-app-search input[type="search"] { padding-left: 32px; }
.pat-hd-app-toolbar select { width: auto; min-width: 160px; flex: 0 1 200px; }
.pat-hd-app-toolbar .pat-hd-btn { flex: 0 0 auto; height: 34px; }

/* ── View heading ─────────────────────────────────────────── */
.pat-hd-view-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 12px;
}
.pat-hd-view-title { font-size: 18px; font-weight: 600; margin: 0; color: #1e293b; }
.pat-hd-view-sub { font-size: 12px; color: #64748b; margin: 2px 0 0; }
.pat-hd-view-total {
	font-size: 12px;
	font-weight: 500;
	color: #64748b;
	background: #f1f5f9;
	border-radius: 5px;
	padding: 4px 10px;
	white-space: nowrap;
}

/* ── Avatars (fallback initials + universal snippet sizing) ── */
.pat-hd-avatar {
	--pat-hd-av-size: 34px;
	width: var(--pat-hd-av-size);
	height: var(--pat-hd-av-size);
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: calc(var(--pat-hd-av-size) * 0.38);
	font-weight: 600;
	letter-spacing: 0.02em;
	flex-shrink: 0;
	user-select: none;
}
.pat-hd .pat-hd-av { flex-shrink: 0; }
.pat-hd-message-avatar { display: inline-flex; flex-shrink: 0; }

/* ── Category chips / priority pills / order links ────────── */
.pat-hd-cat-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 2px 8px;
	border-radius: 5px;
	font-size: 11px;
	font-weight: 500;
	background: #f1f5f9;
	color: #374151;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pat-hd-cat-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--cat-color, #24478f);
	flex-shrink: 0;
}
.pat-hd-priority {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 500;
	color: #374151;
	white-space: nowrap;
}
.pat-hd-priority-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.pat-hd-priority-low .pat-hd-priority-dot    { background: #94a3b8; }
.pat-hd-priority-normal .pat-hd-priority-dot { background: #0277bd; }
.pat-hd-priority-high .pat-hd-priority-dot   { background: #f59e0b; }
.pat-hd-priority-urgent .pat-hd-priority-dot { background: #dc2626; }
.pat-hd-priority-urgent { color: #dc2626; font-weight: 600; }
.pat-hd-order-link {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 11px;
	font-weight: 600;
	color: var(--primary, #24478f);
	text-decoration: none;
	background: #eff6ff;
	border: 1px solid #bfdbfe;
	border-radius: 5px;
	padding: 2px 7px;
	margin-top: 4px;
	white-space: nowrap;
}
.pat-hd-order-link:hover { background: #dbeafe; }
.pat-hd-staff-tabs {
	display: flex;
	background: #f1f5f9;
	border-radius: 5px;
	padding: 3px;
	gap: 2px;
	margin: 12px 24px;
	flex-wrap: wrap;
}
.pat-hd-staff-tabs .pat-hd-tab {
	padding: 7px 14px;
	border-radius: 4px;
	font-size: 13px;
	font-weight: 500;
	color: #64748b;
	background: transparent;
	text-decoration: none;
	border: 0;
	cursor: pointer;
	transition: all 0.15s ease;
	font-family: inherit;
	line-height: 1;
}
.pat-hd-staff-tabs .pat-hd-tab:hover { color: #1e293b; }
.pat-hd-staff-tabs .pat-hd-tab.active {
	background: white;
	color: #1e293b;
	box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}
.pat-hd-staff-inbox .pat-hd-toolbar {
	display: flex;
	gap: 8px;
	align-items: center;
	padding: 12px 24px;
	flex-wrap: wrap;
	border-top: 1px solid #f1f5f9;
}
.pat-hd-staff-inbox .pat-hd-toolbar input[type="search"] {
	min-width: 180px;
	flex: 1 1 220px;
	width: auto;
}
.pat-hd-staff-inbox .pat-hd-toolbar select {
	width: auto;
	min-width: 160px;
	flex: 0 1 200px;
}
.pat-hd-staff-inbox .pat-hd-toolbar .pat-hd-btn { flex: 0 0 auto; }
.pat-hd-staff-body {
	transition: opacity 0.15s ease;
	min-height: 120px;
}
.pat-hd-staff-body.is-loading,
.pat-hd-staff-inbox.is-loading,
.pat-hd-my-tickets.is-loading {
	opacity: 0.45;
	pointer-events: none;
}
.pat-hd-staff-queue {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.pat-hd-staff-queue .pat-hd-table-header-staff,
.pat-hd-staff-queue .pat-hd-table-row-staff {
	display: grid;
	grid-template-columns: 92px minmax(180px, 1.9fr) minmax(130px, 1fr) 108px 92px minmax(140px, 1.1fr) 96px 96px;
	gap: 12px;
	align-items: center;
	min-width: 1080px;
}
.pat-hd-staff-queue .pat-hd-table-row-staff > div {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pat-hd-staff-queue .pat-hd-table-row-staff > div:nth-child(4) {
	overflow: visible;
}
.pat-hd-cell-subject { display: flex; flex-direction: column; gap: 1px; }
.pat-hd-subject-line {
	font-weight: 500;
	color: #1e293b;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pat-hd-requester-line {
	font-size: 11px;
	color: #64748b;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pat-hd-cell-category { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.pat-hd-cell-assignee { display: flex; align-items: center; gap: 8px; }
.pat-hd-assignee-name {
	font-size: 12px;
	color: #374151;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pat-hd-cell-time { font-size: 12px; color: #64748b; }
.pat-hd-staff-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: 16px;
}
.pat-hd-staff-side .pat-hd-card { margin-bottom: 12px; }
.pat-hd-section-heading { font-size: 16px; font-weight: 600; margin: 0 0 12px 0; }
.pat-hd-staff-reply-card { border-left: 3px solid var(--primary, #24478f); }
.pat-hd-staff-notes-card {
	border-left: 3px solid #f59e0b;
	background: #fffbeb;
}
.pat-hd-staff-notes-card .pat-hd-section-heading { color: #92400e; }
.pat-hd-notes-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 16px;
	max-height: 320px;
	overflow-y: auto;
}
.pat-hd-note-item {
	background: #fff;
	border: 1px solid #fde68a;
	border-radius: 5px;
	padding: 12px;
}

/* ── Staff ticket detail ─────────────────────────────────── */
.pat-hd-ticket-topline {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 12px;
}
.pat-hd-btn-back { padding-left: 10px; }
.pat-hd-ticket-number { font-size: 13px; }
.pat-hd-ticket-head { margin-bottom: 16px; }
.pat-hd-ticket-subject {
	font-size: 20px;
	font-weight: 600;
	color: #1e293b;
	margin: 0 0 8px;
	line-height: 1.3;
}
.pat-hd-ticket-badges {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	font-size: 12px;
}
.pat-hd-requester-row {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}
.pat-hd-requester-info { min-width: 0; display: flex; flex-direction: column; }
.pat-hd-requester-name { font-size: 13px; font-weight: 600; color: #1e293b; }
.pat-hd-requester-email {
	font-size: 12px;
	color: var(--primary, #24478f);
	text-decoration: none;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pat-hd-requester-email:hover { text-decoration: underline; }
.pat-hd-requester-order { margin-top: 10px; }
.pat-hd-detail-list { margin: 0; }
.pat-hd-detail-list > div {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	padding: 6px 0;
	border-bottom: 1px solid #f1f5f9;
	font-size: 12px;
}
.pat-hd-detail-list > div:last-child { border-bottom: 0; }
.pat-hd-detail-list dt { color: #64748b; font-weight: 500; margin: 0; }
.pat-hd-detail-list dd { color: #1e293b; margin: 0; text-align: right; }

/* ── Assignee search (ticket sidebar) ─────────────────────── */
.pat-hd-assign-search { margin-top: 12px; }
.pat-hd-assign-search .pat-hd-label { display: block; margin-bottom: 6px; }
.pat-hd-assign-results {
	border: 1px solid #e2e8f0;
	border-radius: 5px;
	margin-top: 6px;
	max-height: 220px;
	overflow-y: auto;
	background: white;
	box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.pat-hd-assign-option {
	display: flex;
	flex-direction: column;
	gap: 1px;
	width: 100%;
	text-align: left;
	background: white;
	border: 0;
	border-bottom: 1px solid #f1f5f9;
	padding: 8px 12px;
	cursor: pointer;
	font-family: inherit;
}
.pat-hd-assign-option:last-child { border-bottom: 0; }
.pat-hd-assign-option:hover { background: #f8fafc; }
.pat-hd-assign-option strong { font-size: 13px; color: #1e293b; font-weight: 500; }
.pat-hd-assign-option span { font-size: 11px; color: #64748b; }

/* ── Member My Tickets table ─────────────────────────────── */
.pat-hd-my-table .pat-hd-table-header-my,
.pat-hd-my-table .pat-hd-table-row-my {
	display: grid;
	grid-template-columns: 100px minmax(160px, 1.8fr) minmax(130px, 1fr) 130px 120px;
	gap: 12px;
	align-items: center;
}
.pat-hd-my-table .pat-hd-table-row-my > div {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
/* ── WYSIWYG editor ──────────────────────────────────────── */
.pat-hd-wysiwyg {
	border: 1px solid #d1d5db;
	border-radius: 5px;
	background: #fff;
	overflow: hidden;
	transition: border-color 0.15s, box-shadow 0.15s;
}
.pat-hd-wysiwyg:focus-within {
	border-color: var(--primary, #24478f);
	box-shadow: 0 0 0 3px rgba(36,71,143,0.1);
}
.pat-hd-wysiwyg-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
	padding: 6px 8px;
	background: #f8fafc;
	border-bottom: 1px solid #e2e8f0;
}
.pat-hd-wysiwyg-btn {
	appearance: none;
	border: 1px solid transparent;
	background: transparent;
	color: #374151;
	border-radius: 5px;
	padding: 4px 8px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	font-family: inherit;
}
.pat-hd-wysiwyg-btn:hover {
	background: #fff;
	border-color: #d1d5db;
}
.pat-hd-wysiwyg-sep {
	width: 1px;
	height: 18px;
	background: #e2e8f0;
	margin: 0 4px;
}
.pat-hd-wysiwyg-editor {
	min-height: 140px;
	max-height: 420px;
	overflow-y: auto;
	padding: 12px;
	font-size: 14px;
	line-height: 1.55;
	outline: none;
}
/* Contact ticket message: taller scroll area so long drafts aren't cramped */
.pat-hd-contact .pat-hd-wysiwyg-editor {
	min-height: 180px;
	max-height: min(70vh, 720px);
}
.pat-hd-wysiwyg-editor:empty:before {
	content: attr(data-placeholder);
	color: #94a3b8;
	pointer-events: none;
}
.pat-hd-wysiwyg-editor blockquote {
	margin: 8px 0;
	padding: 6px 12px;
	border-left: 3px solid #d4af35;
	color: #475569;
	background: #fafbfc;
}
.pat-hd-wysiwyg-editor ul,
.pat-hd-wysiwyg-editor ol { padding-left: 20px; margin: 8px 0; }
.pat-hd-wysiwyg-input { display: none !important; }

/* ── Dropzone uploader ───────────────────────────────────── */
.pat-hd-dropzone { margin-top: 4px; }
.pat-hd-dropzone-surface {
	border: 1.5px dashed #cbd5e1;
	border-radius: 8px;
	background: #f8fafc;
	padding: 20px 16px;
	text-align: center;
	cursor: pointer;
	transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}
.pat-hd-dropzone-surface:hover,
.pat-hd-dropzone.is-dragover .pat-hd-dropzone-surface {
	border-color: var(--primary, #24478f);
	background: #eff6ff;
	box-shadow: 0 0 0 3px rgba(36,71,143,0.08);
}
.pat-hd-dropzone-icon {
	color: var(--primary, #24478f);
	margin-bottom: 8px;
	opacity: 0.85;
}
.pat-hd-dropzone-title {
	font-size: 14px;
	font-weight: 600;
	color: #1e293b;
	margin-bottom: 4px;
}
.pat-hd-dropzone-sub {
	font-size: 13px;
	color: #64748b;
}
.pat-hd-dropzone-browse {
	appearance: none;
	border: 0;
	background: none;
	padding: 0;
	color: var(--primary, #24478f);
	font-weight: 600;
	font-size: 13px;
	cursor: pointer;
	text-decoration: underline;
	font-family: inherit;
}
.pat-hd-dropzone-hint {
	font-size: 12px;
	color: #94a3b8;
	margin-top: 8px;
}
.pat-hd-dropzone-files {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 10px;
}
.pat-hd-file-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 8px;
	border-radius: 5px;
	font-size: 12px;
	font-weight: 500;
	background: #eff6ff;
	color: var(--primary, #24478f);
	border: 1px solid #bfdbfe;
	max-width: 100%;
}
.pat-hd-file-chip.has-preview { padding-left: 6px; }
.pat-hd-file-chip img {
	width: 36px;
	height: 36px;
	object-fit: cover;
	border-radius: 4px;
	flex-shrink: 0;
}
.pat-hd-file-chip-info { min-width: 0; }
.pat-hd-file-chip-name {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 180px;
}
.pat-hd-file-chip-meta {
	font-size: 11px;
	color: #64748b;
	font-weight: 400;
}
.pat-hd-file-chip-remove {
	appearance: none;
	border: 0;
	background: transparent;
	color: #94a3b8;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	padding: 0 2px;
	border-radius: 4px;
}
.pat-hd-file-chip-remove:hover { color: #dc2626; background: #fef2f2; }
.pat-hd-ai-draft { border-left: 3px solid #d4af35; }
.pat-hd-ai-draft-head { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.pat-hd-ai-draft-body { font-size: 14px; line-height: 1.6; padding: 8px; border: 1px dashed #e2e8f0; border-radius: 5px; margin-bottom: 12px; min-height: 60px; }

@media (max-width: 992px) {
	.pat-hd.pat-hd-wide,
	.pat-hd.pat-hd-app { padding: 16px 16px 20px; }
	.pat-hd-staff-layout { grid-template-columns: 1fr; }

	/* Sidebar becomes a horizontal scroll bar of pills. */
	.pat-hd-app-frame { grid-template-columns: 1fr; }
	.pat-hd-app-sidebar {
		border-right: 0;
		border-bottom: 1px solid #e2e8f0;
		padding: 8px;
	}
	.pat-hd-app-nav {
		flex-direction: row;
		position: static;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		gap: 4px;
	}
	.pat-hd-app-nav::-webkit-scrollbar { display: none; }
	.pat-hd-nav-item { width: auto; flex: 0 0 auto; padding: 8px 12px; }
	.pat-hd-app-main { padding: 12px 16px 16px; }

	/* Queue table degrades to cards. */
	.pat-hd-staff-queue .pat-hd-table-header-staff { display: none; }
	.pat-hd-staff-queue .pat-hd-table-row-staff {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 4px 12px;
		padding: 12px 16px;
		min-width: 0;
	}
	.pat-hd-staff-queue .pat-hd-table-row-staff > div {
		white-space: normal;
		overflow: visible;
		text-overflow: unset;
		padding: 4px 0;
	}
	.pat-hd-staff-queue .pat-hd-table-row-staff > .pat-hd-cell-subject { grid-column: 1 / -1; }
	.pat-hd-staff-queue .pat-hd-table-row-staff > div[data-label]::before {
		content: attr(data-label);
		display: block;
		font-size: 11px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.04em;
		color: #64748b;
		margin-bottom: 2px;
	}

	/* Member table degrades to cards too. */
	.pat-hd-my-table .pat-hd-table-header-my { display: none; }
	.pat-hd-my-table .pat-hd-table-row-my {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 4px 12px;
		padding: 12px 16px;
	}
	.pat-hd-my-table .pat-hd-table-row-my > div {
		white-space: normal;
		overflow: visible;
		text-overflow: unset;
		padding: 4px 0;
	}
	.pat-hd-my-table .pat-hd-table-row-my > .pat-hd-cell-subject { grid-column: 1 / -1; }
	.pat-hd-my-table .pat-hd-table-row-my > div[data-label]::before {
		content: attr(data-label);
		display: block;
		font-size: 11px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.04em;
		color: #64748b;
		margin-bottom: 2px;
	}

	.pat-hd-staff-tabs {
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		margin: 12px 16px;
	}
	.pat-hd-staff-tabs::-webkit-scrollbar { display: none; }
	.pat-hd-staff-tabs .pat-hd-tab { white-space: nowrap; flex: 0 0 auto; }
	.pat-hd-app-topbar { padding: 12px 16px 10px; }
}
@media (max-width: 768px) {
	.pat-hd.pat-hd-wide,
	.pat-hd.pat-hd-app { padding: 12px 12px 16px; }
	.pat-hd-app-toolbar { flex-direction: column; align-items: stretch; }
	.pat-hd-app-toolbar .pat-hd-app-search,
	.pat-hd-app-toolbar select,
	.pat-hd-app-toolbar .pat-hd-btn {
		width: 100%;
		min-width: 0;
		flex: none;
	}
	.pat-hd-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
	.pat-hd-app-topbar .pat-hd-title { font-size: 18px; }
	.pat-hd-app-topbar-hi { display: none; }
	.pat-hd-stats { grid-template-columns: 1fr 1fr; gap: 8px; }
	.pat-hd-staff-queue .pat-hd-table-row-staff,
	.pat-hd-my-table .pat-hd-table-row-my { grid-template-columns: 1fr; }
}

.pat-hd-toast {
	position: fixed; top: 20px; right: 20px; z-index: 100001;
	padding: 12px 16px; background: white; border-radius: 8px;
	border-left: 3px solid var(--primary, #24478f);
	box-shadow: 0 4px 12px rgba(0,0,0,0.15); font-size: 13px;
	transform: translateX(120%); transition: transform 0.3s ease;
}
.pat-hd-toast.show { transform: translateX(0); }
.pat-hd-toast.success { border-left-color: #10b981; }
.pat-hd-toast.error { border-left-color: #dc2626; }

/* ═══════════════════════════════════════════════════════════════
   INBOX v3 — single-page three-pane app (pat-hd-ibx-*)
   ═══════════════════════════════════════════════════════════════ */

.pat-hd.pat-hd-ibx {
	--ibx-navy: #24478f;
	--ibx-gold: #d4af35;
	--ibx-border: #e2e8f0;
	--ibx-border-soft: #f1f5f9;
	--ibx-ink: #1e293b;
	--ibx-muted: #64748b;
	max-width: none;
	width: 100%;
	margin: 0;
	padding: 16px 20px 24px;
	box-sizing: border-box;
}

@keyframes pat-hd-ibx-enter {
	from { opacity: 0; transform: translateY(6px); }
	to   { opacity: 1; transform: translateY(0); }
}
@keyframes pat-hd-ibx-msg-in {
	from { opacity: 0; transform: translateY(-6px); }
	to   { opacity: 1; transform: translateY(0); }
}
@keyframes pat-hd-ibx-bump {
	0% { transform: scale(1); }
	45% { transform: scale(1.25); }
	100% { transform: scale(1); }
}
@keyframes pat-hd-ibx-lockbar-in {
	from { opacity: 0; transform: translateY(-4px); }
	to   { opacity: 1; transform: translateY(0); }
}
@keyframes pat-hd-ibx-skel {
	0% { background-position: 200% 0; }
	100% { background-position: -200% 0; }
}
@keyframes pat-hd-ibx-bulk-in {
	from { opacity: 0; transform: translateY(12px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* ── Topbar ─────────────────────────────────────────────── */
.pat-hd-ibx-topbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 14px 20px 12px;
	background: linear-gradient(230deg, rgba(31,38,74,1) 0%, rgba(11,23,62,1) 17%, rgba(24,41,94,1) 38%, rgba(50,71,120,1) 73%, rgba(6,20,59,1) 100%);
	border: 1px solid var(--ibx-border);
	border-bottom: 3px solid var(--ibx-gold);
	border-radius: 8px 8px 0 0;
}
.pat-hd-ibx-topbar-brand {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
}
.pat-hd-ibx-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 8px;
	background: rgba(212,175,53,0.16);
	color: var(--ibx-gold);
	flex-shrink: 0;
}
.pat-hd-ibx-topbar .pat-hd-eyebrow { margin: 0; }
.pat-hd-ibx-title {
	font-size: 18px;
	font-weight: 600;
	color: white;
	margin: 0;
	line-height: 1.25;
}
.pat-hd-ibx-topbar-user {
	display: flex;
	align-items: center;
	gap: 10px;
}
.pat-hd-ibx-topbar-hi { font-size: 13px; color: rgba(255,255,255,0.8); white-space: nowrap; }

/* ── Frame (rail | list | detail) ───────────────────────── */
.pat-hd-ibx-frame {
	display: grid;
	grid-template-columns: 200px 330px minmax(0, 1fr);
	background: white;
	border: 1px solid var(--ibx-border);
	border-top: 0;
	border-radius: 0 0 8px 8px;
	overflow: hidden;
	height: clamp(600px, calc(100vh - 220px), 1400px);
}
.pat-hd-mibx .pat-hd-ibx-frame { grid-template-columns: 340px minmax(0, 1fr); }

/* ── Views rail ─────────────────────────────────────────── */
.pat-hd-ibx-rail {
	background: #f8fafc;
	border-right: 1px solid var(--ibx-border);
	padding: 14px 10px;
	overflow-y: auto;
}
.pat-hd-ibx-rail-label {
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: #94a3b8;
	padding: 0 10px 8px;
}
.pat-hd-ibx-nav { display: flex; flex-direction: column; gap: 2px; }
.pat-hd-ibx-nav-item {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 8px 10px;
	border: 0;
	border-radius: 6px;
	background: transparent;
	font-family: inherit;
	font-size: 13px;
	font-weight: 500;
	color: var(--ibx-muted);
	cursor: pointer;
	text-align: left;
	transition: background 0.15s ease, color 0.15s ease, transform 0.1s ease;
}
.pat-hd-ibx-nav-item:hover { background: #eef2f7; color: var(--ibx-ink); }
.pat-hd-ibx-nav-item:active { transform: scale(0.98); }
.pat-hd-ibx-nav-item.active {
	background: var(--ibx-navy);
	color: white;
	box-shadow: 0 1px 3px rgba(36,71,143,0.3);
}
.pat-hd-ibx-nav-icon { display: inline-flex; flex-shrink: 0; opacity: 0.85; }
.pat-hd-ibx-nav-label { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pat-hd-ibx-nav-count {
	font-size: 11px;
	font-weight: 600;
	min-width: 20px;
	height: 18px;
	padding: 0 6px;
	border-radius: 9px;
	background: #e2e8f0;
	color: #475569;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: background 0.15s ease;
}
.pat-hd-ibx-nav-item.active .pat-hd-ibx-nav-count { background: var(--ibx-gold); color: #1a1a2e; }
.pat-hd-ibx-nav-count.is-bumped { animation: pat-hd-ibx-bump 0.4s ease; }

/* ── List pane ──────────────────────────────────────────── */
.pat-hd-ibx-list {
	display: flex;
	flex-direction: column;
	border-right: 1px solid var(--ibx-border);
	min-width: 0;
	position: relative;
}
.pat-hd-ibx-list-head {
	padding: 14px 14px 10px;
	border-bottom: 1px solid var(--ibx-border);
	background: white;
	flex-shrink: 0;
}
.pat-hd-ibx-list-title-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-bottom: 10px;
}
.pat-hd-ibx-list-title { font-size: 15px; font-weight: 600; margin: 0; color: var(--ibx-ink); }
.pat-hd-ibx-list-total {
	font-size: 11px;
	font-weight: 600;
	color: var(--ibx-muted);
	background: var(--ibx-border-soft);
	border-radius: 9px;
	padding: 2px 8px;
}
.pat-hd-ibx-list-search {
	display: flex;
	gap: 6px;
	align-items: center;
	position: relative;
}
.pat-hd-ibx-list-search > svg {
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
	color: #94a3b8;
	pointer-events: none;
}
.pat-hd-ibx .pat-hd-ibx-list-search input[type="search"] {
	flex: 1 1 auto;
	min-width: 0;
	height: 32px;
	padding-left: 30px;
	font-size: 12px;
}
.pat-hd-ibx .pat-hd-ibx-list-search select {
	width: auto;
	flex: 0 0 auto;
	max-width: 118px;
	height: 32px;
	font-size: 12px;
	padding: 4px 26px 4px 8px;
	background-position: right 7px center;
}
.pat-hd-ibx-list-body {
	flex: 1 1 auto;
	overflow-y: auto;
	min-height: 0;
	overscroll-behavior: contain;
	transition: opacity 0.15s ease;
}
.pat-hd-ibx-list-body.is-refreshing { opacity: 0.5; pointer-events: none; }
.pat-hd-ibx-list-sentinel { flex-shrink: 0; height: 1px; }

/* Rows */
.pat-hd-ibx-row {
	display: flex;
	gap: 4px;
	padding: 10px 12px 10px 6px;
	border-bottom: 1px solid var(--ibx-border-soft);
	border-left: 3px solid transparent;
	cursor: pointer;
	transition: background 0.12s ease, border-color 0.12s ease;
	animation: pat-hd-ibx-enter 0.18s ease both;
}
.pat-hd-ibx-row:hover { background: #f8fafc; }
.pat-hd-ibx-row:focus-visible { outline: 2px solid var(--ibx-navy); outline-offset: -2px; }
.pat-hd-ibx-row.is-active {
	background: #eff4fc;
	border-left-color: var(--ibx-navy);
}
.pat-hd-ibx-check {
	display: flex;
	align-items: flex-start;
	padding: 2px 2px 0 4px;
	opacity: 0;
	transition: opacity 0.12s ease;
	flex-shrink: 0;
}
.pat-hd-ibx-row:hover .pat-hd-ibx-check,
.pat-hd-ibx-check:has(input:checked),
.pat-hd-ibx-list:has([data-bulk-check]:checked) .pat-hd-ibx-check { opacity: 1; }
.pat-hd-ibx-check input {
	width: 14px;
	height: 14px;
	margin: 2px 0 0;
	accent-color: var(--ibx-navy);
	cursor: pointer;
}
.pat-hd-ibx-row-body { flex: 1 1 auto; min-width: 0; }
.pat-hd-ibx-row-top {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px;
}
.pat-hd-ibx-row-subject {
	font-size: 13px;
	font-weight: 600;
	color: var(--ibx-ink);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	min-width: 0;
}
.pat-hd-ibx-row-time { font-size: 11px; color: #94a3b8; flex-shrink: 0; white-space: nowrap; }
.pat-hd-ibx-row-meta {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 4px;
	min-width: 0;
}
.pat-hd-ibx-row-meta .pat-hd-mono { font-size: 11px; color: #64748b; }
.pat-hd-ibx-row-spacer { flex: 1 1 auto; }
.pat-hd-ibx-row-requester { display: inline-flex; flex-shrink: 0; }
.pat-hd-status-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	flex-shrink: 0;
	background: #f1f5f9;
	color: #64748b;
}
.pat-hd-status-icon-open { background: #eff6ff; color: #24478f; }
.pat-hd-status-icon-pending { background: #fef3c7; color: #b45309; }
.pat-hd-status-icon-awaiting { background: #ffedd5; color: #c2410c; }
.pat-hd-status-icon-resolved { background: #ecfdf5; color: #059669; }
.pat-hd-status-icon-closed { background: #f1f5f9; color: #64748b; }
.pat-hd-cat-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border-radius: 5px;
	flex-shrink: 0;
	background: color-mix(in srgb, var(--cat-color, #24478f) 14%, white);
	color: var(--cat-color, #24478f);
}
.pat-hd-cat-icon .dashicons {
	width: 12px;
	height: 12px;
	font-size: 12px;
	line-height: 12px;
}
.pat-hd-ibx-prio {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	flex-shrink: 0;
	background: #94a3b8;
}
.pat-hd-ibx-prio-normal { background: #0277bd; }
.pat-hd-ibx-prio-high   { background: #f59e0b; }
.pat-hd-ibx-prio-urgent { background: #dc2626; box-shadow: 0 0 0 3px rgba(220,38,38,0.15); }
.pat-hd-ibx-row-lock {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 10px;
	font-weight: 600;
	color: #8a6d1a;
	background: #fdf6e3;
	border: 1px solid #f0e2b6;
	border-radius: 9px;
	padding: 1px 7px;
	white-space: nowrap;
	animation: pat-hd-ibx-enter 0.18s ease both;
}
.pat-hd-ibx-row-lock[hidden] { display: none; }
.pat-hd-ibx-row-tags {
	display: flex;
	align-items: center;
	gap: 4px;
	margin-top: 5px;
	flex-wrap: wrap;
}
.pat-hd-ibx-tag {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 1px 7px;
	border-radius: 9px;
	font-size: 10px;
	font-weight: 600;
	white-space: nowrap;
}
.pat-hd-ibx-tag-more { font-size: 10px; font-weight: 600; color: #94a3b8; }
.pat-hd-ibx-tag-x {
	appearance: none;
	border: 0;
	background: transparent;
	color: inherit;
	opacity: 0.55;
	font-size: 12px;
	line-height: 1;
	cursor: pointer;
	padding: 0;
	margin-left: 1px;
}
.pat-hd-ibx-tag-x:hover { opacity: 1; }

/* Empty list */
.pat-hd-ibx-list-empty {
	text-align: center;
	padding: 48px 20px;
	color: var(--ibx-muted);
}
.pat-hd-ibx-list-empty svg { opacity: 0.3; margin-bottom: 10px; }
.pat-hd-ibx-list-empty-text { font-size: 14px; font-weight: 600; color: #334155; }
.pat-hd-ibx-list-empty-sub { font-size: 12px; margin-top: 3px; }

/* Bulk bar */
.pat-hd-ibx-bulkbar {
	position: absolute;
	left: 10px;
	right: 10px;
	bottom: 10px;
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 8px 10px;
	background: #10182b;
	border-radius: 8px;
	box-shadow: 0 8px 24px rgba(10,18,40,0.35);
	z-index: 5;
	animation: pat-hd-ibx-bulk-in 0.22s cubic-bezier(0.16,1,0.3,1) both;
}
.pat-hd-ibx-bulkbar[hidden] { display: none; }
.pat-hd-ibx-bulk-count {
	font-size: 12px;
	font-weight: 700;
	background: var(--ibx-gold);
	color: #1a1a2e;
	min-width: 22px;
	height: 22px;
	border-radius: 11px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 6px;
	flex-shrink: 0;
}
.pat-hd-ibx .pat-hd-ibx-bulkbar select {
	flex: 1 1 0;
	min-width: 0;
	height: 28px;
	font-size: 11px;
	padding: 2px 22px 2px 8px;
	background-position: right 6px center;
	border-color: rgba(255,255,255,0.2);
	background-color: rgba(255,255,255,0.08);
	color: white;
}
.pat-hd-ibx .pat-hd-ibx-bulkbar select option { color: #1e293b; }
.pat-hd-ibx-bulk-btn {
	height: 28px;
	padding: 0 10px;
	border: 1px solid rgba(255,255,255,0.2);
	background: rgba(255,255,255,0.08);
	color: white;
	border-radius: 5px;
	font-size: 11px;
	font-weight: 600;
	font-family: inherit;
	cursor: pointer;
	white-space: nowrap;
	transition: background 0.15s ease;
}
.pat-hd-ibx-bulk-btn:hover { background: rgba(255,255,255,0.16); }
.pat-hd-ibx-bulk-clear {
	appearance: none;
	border: 0;
	background: transparent;
	color: rgba(255,255,255,0.6);
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	padding: 2px 4px;
	flex-shrink: 0;
}
.pat-hd-ibx-bulk-clear:hover { color: white; }

/* ── Detail pane ────────────────────────────────────────── */
.pat-hd-ibx-detail {
	min-width: 0;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	background: #fbfcfe;
}

/* Empty / welcome state */
.pat-hd-ibx-welcome {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 32px 24px;
	overflow-y: auto;
}
.pat-hd-ibx-welcome-inner {
	text-align: center;
	max-width: 560px;
	animation: pat-hd-ibx-enter 0.3s ease both;
}
.pat-hd-ibx-welcome-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	border-radius: 20px;
	background: #eff4fc;
	color: var(--ibx-navy);
	margin-bottom: 16px;
}
.pat-hd-ibx-welcome-title { font-size: 20px; font-weight: 600; color: var(--ibx-ink); margin: 0 0 6px; }
.pat-hd-ibx-welcome-sub { font-size: 13px; color: var(--ibx-muted); margin: 0 0 20px; }
.pat-hd-ibx-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
	gap: 10px;
}
.pat-hd-ibx-stat {
	background: white;
	border: 1px solid var(--ibx-border);
	border-radius: 8px;
	padding: 12px 8px 10px;
	position: relative;
	overflow: hidden;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.pat-hd-ibx-stat:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
.pat-hd-ibx-stat::before {
	content: "";
	position: absolute;
	left: 0; right: 0; top: 0;
	height: 3px;
	background: var(--ibx-navy);
}
.pat-hd-ibx-stat-unassigned::before { background: var(--ibx-gold); }
.pat-hd-ibx-stat-pending::before    { background: #f59e0b; }
.pat-hd-ibx-stat-awaiting::before   { background: #0277bd; }
.pat-hd-ibx-stat-resolved::before   { background: #059669; }
.pat-hd-ibx-stat-value { font-size: 22px; font-weight: 700; color: var(--ibx-ink); line-height: 1.15; }
.pat-hd-ibx-stat-label { font-size: 11px; color: var(--ibx-muted); margin-top: 2px; }

/* Skeleton loading */
.pat-hd-ibx-skeleton { padding: 20px; }
.pat-hd-ibx-skel-row {
	padding: 14px 0;
	border-bottom: 1px solid var(--ibx-border-soft);
}
.pat-hd-ibx-skeleton .skel-line {
	height: 13px;
	border-radius: 4px;
	margin-bottom: 8px;
	background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
	background-size: 200% 100%;
	animation: pat-hd-ibx-skel 1.5s ease-in-out infinite;
}
.pat-hd-ibx-skeleton .skel-line:last-child { margin-bottom: 0; }

/* ── Ticket view ────────────────────────────────────────── */
.pat-hd-ibx-ticket {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}
.pat-hd-ibx-ticket.is-entering { animation: pat-hd-ibx-enter 0.25s cubic-bezier(0.16,1,0.3,1) both; }

.pat-hd-ibx-thead {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 16px;
	background: white;
	border-bottom: 1px solid var(--ibx-border);
	flex-shrink: 0;
}
.pat-hd-ibx-back {
	display: none;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border: 1px solid #d1d5db;
	background: white;
	border-radius: 6px;
	color: #374151;
	cursor: pointer;
	flex-shrink: 0;
}
.pat-hd-ibx-thead-main { flex: 1 1 auto; min-width: 0; }
.pat-hd-ibx-subject {
	font-size: 16px;
	font-weight: 600;
	color: var(--ibx-ink);
	margin: 0;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pat-hd-ibx-thead-meta {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: var(--ibx-muted);
	margin-top: 2px;
	flex-wrap: wrap;
}
.pat-hd-ibx-dot { color: #cbd5e1; }
.pat-hd-ibx-thead-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}
.pat-hd-ibx-close,
.pat-hd-ibx-props-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border: 1px solid #d1d5db;
	background: white;
	border-radius: 6px;
	color: var(--ibx-muted);
	cursor: pointer;
	transition: all 0.15s ease;
}
.pat-hd-ibx-close:hover { color: #dc2626; border-color: #fca5a5; background: #fef2f2; }
.pat-hd-ibx-props-toggle:hover { color: var(--ibx-navy); border-color: #bfdbfe; background: #eff6ff; }

/* Status pill select */
.pat-hd-ibx .pat-hd-ibx-status-select {
	width: auto;
	height: 30px;
	border-radius: 15px;
	font-size: 12px;
	font-weight: 600;
	padding: 2px 28px 2px 12px;
	background-position: right 9px center;
	cursor: pointer;
	transition: all 0.15s ease;
}
.pat-hd-ibx .pat-hd-ibx-status-open              { background-color: #eff6ff; color: var(--ibx-navy); border-color: #bfdbfe; }
.pat-hd-ibx .pat-hd-ibx-status-pending           { background-color: #fef3c7; color: #b45309; border-color: #fde68a; }
.pat-hd-ibx .pat-hd-ibx-status-awaiting_customer { background-color: #e0f2fe; color: #0277bd; border-color: #bae6fd; }
.pat-hd-ibx .pat-hd-ibx-status-resolved          { background-color: #ecfdf5; color: #059669; border-color: #6ee7b7; }
.pat-hd-ibx .pat-hd-ibx-status-closed            { background-color: #f1f5f9; color: #64748b; border-color: #d1d5db; }

/* Lock pill + banner */
.pat-hd-ibx-lockpill {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11px;
	font-weight: 600;
	color: #8a6d1a;
	background: #fdf6e3;
	border: 1px solid #f0e2b6;
	border-radius: 15px;
	padding: 4px 10px;
	white-space: nowrap;
	animation: pat-hd-ibx-enter 0.2s ease both;
}
.pat-hd-ibx-lockpill[hidden] { display: none; }
.pat-hd-ibx-lockbar {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 16px;
	background: #fdf6e3;
	border-bottom: 1px solid #f0e2b6;
	font-size: 12px;
	color: #6b5413;
	flex-shrink: 0;
	animation: pat-hd-ibx-lockbar-in 0.25s ease both;
}
.pat-hd-ibx-lockbar[hidden] { display: none; }
.pat-hd-ibx-lockbar-av { display: inline-flex; flex-shrink: 0; }
.pat-hd-ibx-lockbar-text { flex: 1 1 auto; min-width: 0; }
.pat-hd-ibx-takeover {
	flex-shrink: 0;
	height: 26px;
	padding: 0 12px;
	border: 1px solid #d8bd58;
	background: white;
	color: #8a6d1a;
	border-radius: 5px;
	font-size: 11px;
	font-weight: 600;
	font-family: inherit;
	cursor: pointer;
	transition: all 0.15s ease;
}
.pat-hd-ibx-takeover:hover { background: #d4af35; color: #1a1a2e; }
.pat-hd-ibx-takeover[hidden] { display: none; }

/* Locked state */
.pat-hd-ibx-ticket.is-locked .pat-hd-ibx-composer,
.pat-hd-ibx-ticket.is-locked .pat-hd-ibx-ai { opacity: 0.62; }
.pat-hd-ibx-ticket.is-locked .pat-hd-wysiwyg-editor { background: #f8fafc; cursor: not-allowed; }
.pat-hd-ibx-ticket.is-locked .pat-hd-ibx-dropzone { pointer-events: none; }

/* Body: conversation + properties */
.pat-hd-ibx-ticket-body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 268px;
	flex: 1 1 auto;
	min-height: 0;
}
.pat-hd-ibx-ticket.props-collapsed .pat-hd-ibx-ticket-body { grid-template-columns: minmax(0, 1fr); }
.pat-hd-ibx-ticket.props-collapsed .pat-hd-ibx-props { display: none; }
.pat-hd-mibx-body { grid-template-columns: minmax(0, 1fr); }
.pat-hd-ibx-convo {
	overflow-y: auto;
	min-width: 0;
	padding: 16px;
	overscroll-behavior: contain;
}

/* AI draft card */
.pat-hd-ibx-ai {
	background: #fffdf5;
	border: 1px solid #f0e2b6;
	border-left: 3px solid var(--ibx-gold);
	border-radius: 8px;
	padding: 12px 14px;
	margin-bottom: 14px;
	animation: pat-hd-ibx-enter 0.25s ease both;
}
.pat-hd-ibx-ai-head {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
	font-size: 12px;
}
.pat-hd-ibx-ai-body {
	font-size: 13px;
	line-height: 1.6;
	background: white;
	border: 1px dashed var(--ibx-border);
	border-radius: 5px;
	padding: 10px 12px;
	margin-bottom: 10px;
	min-height: 48px;
	max-height: 320px;
	overflow-y: auto;
	outline: none;
}
.pat-hd-ibx-ai-body:focus { border-color: var(--ibx-gold); border-style: solid; }
.pat-hd-ibx-ai-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* Composer */
.pat-hd-ibx-composer {
	background: white;
	border: 1px solid var(--ibx-border);
	border-radius: 10px;
	padding: 0;
	margin-bottom: 16px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.06);
	position: relative;
	overflow: hidden;
	transition: border-color 0.2s ease, background 0.2s ease;
}
.pat-hd-ibx-composer[data-mode="note"] {
	background: #fffdf5;
	border-color: #f0e2b6;
}
.pat-hd-ibx-composer-tabs {
	display: flex;
	gap: 0;
	padding: 0 14px;
	border-bottom: 1px solid var(--ibx-border);
	background: white;
}
.pat-hd-ibx-composer[data-mode="note"] .pat-hd-ibx-composer-tabs { background: #fffdf5; border-bottom-color: #f0e2b6; }
.pat-hd-ibx-composer-tab {
	padding: 12px 14px 10px;
	border-radius: 0;
	font-size: 13px;
	font-weight: 500;
	color: #94a3b8;
	background: transparent;
	border: 0;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	cursor: pointer;
	font-family: inherit;
	transition: all 0.15s ease;
	line-height: 1;
}
.pat-hd-ibx-composer-tab:hover { color: var(--ibx-ink); }
.pat-hd-ibx-composer-tab.active {
	background: transparent;
	color: var(--ibx-navy);
	box-shadow: none;
	border-bottom-color: var(--ibx-navy);
	font-weight: 600;
}
.pat-hd-ibx-composer[data-mode="note"] .pat-hd-ibx-composer-tab.active {
	color: #8a6d1a;
	border-bottom-color: #b45309;
}
.pat-hd-ibx-composer-to {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	border-bottom: 1px solid var(--ibx-border-soft);
}
.pat-hd-ibx-composer-to[hidden] { display: none; }
.pat-hd-ibx-composer-to-label {
	font-size: 12px;
	font-weight: 600;
	color: #64748b;
	flex-shrink: 0;
}
.pat-hd-ibx-to-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 4px 10px 4px 4px;
	background: #f1f5f9;
	border: 1px solid #e2e8f0;
	border-radius: 999px;
	min-width: 0;
}
.pat-hd-ibx-to-chip-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.2;
}
.pat-hd-ibx-to-chip-text strong {
	font-size: 12px;
	font-weight: 600;
	color: var(--ibx-ink);
}
.pat-hd-ibx-to-chip-email {
	font-size: 11px;
	color: #64748b;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pat-hd-ibx-composer-hint {
	font-size: 11px;
	color: #94a3b8;
	padding: 8px 14px 0;
}
.pat-hd-ibx-composer-hint-note { color: #b45309; }
.pat-hd-ibx-composer .pat-hd-wysiwyg {
	border: 0;
	border-radius: 0;
	display: flex;
	flex-direction: column;
}
.pat-hd-ibx-composer .pat-hd-wysiwyg-toolbar {
	order: 2;
	border: 0;
	border-top: 1px solid var(--ibx-border-soft);
	background: transparent;
	padding: 6px 8px;
}
.pat-hd-ibx-composer .pat-hd-wysiwyg-editor {
	order: 1;
	min-height: 88px;
	max-height: 280px;
	border: 0;
	border-radius: 0;
	padding: 12px 14px;
	box-shadow: none;
}
.pat-hd-ibx-composer .pat-hd-wysiwyg-editor:focus { box-shadow: none; }
.pat-hd-ibx-dropzone-compact .pat-hd-dropzone-surface { display: none; }
.pat-hd-ibx-dropzone-compact .pat-hd-dropzone-files {
	padding: 0 14px;
	margin: 0;
}
.pat-hd-ibx-dropzone-compact .pat-hd-dropzone-files:empty { display: none; }
.pat-hd-ibx-composer-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 8px 10px 10px;
	border-top: 1px solid var(--ibx-border-soft);
	margin-top: 0;
}
.pat-hd-ibx-composer-tools { display: flex; gap: 4px; align-items: center; }
.pat-hd-ibx-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	padding: 0;
	border: 0;
	background: transparent;
	color: #64748b;
	border-radius: 5px;
	cursor: pointer;
	transition: all 0.15s ease;
}
.pat-hd-ibx-icon-btn:hover { background: #f1f5f9; color: var(--ibx-navy); }
.pat-hd-ibx-icon-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.pat-hd-ibx-tool-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 30px;
	padding: 0 10px;
	border: 1px solid #d1d5db;
	background: white;
	color: #374151;
	border-radius: 5px;
	font-size: 12px;
	font-weight: 500;
	font-family: inherit;
	cursor: pointer;
	transition: all 0.15s ease;
}
.pat-hd-ibx-tool-btn:hover { background: #f8fafc; border-color: var(--ibx-navy); color: var(--ibx-navy); }
.pat-hd-ibx-tool-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.pat-hd-ibx-send {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: #e8eef8;
	color: var(--ibx-navy);
	cursor: pointer;
	transition: all 0.15s ease, transform 0.1s ease;
	margin-left: auto;
}
.pat-hd-ibx-send:hover { background: #d7e3f6; }
.pat-hd-ibx-send:not(:disabled):active { transform: scale(0.97); }
.pat-hd-ibx-send:disabled { opacity: 0.4; cursor: not-allowed; }
.pat-hd-ibx-composer[data-mode="note"] .pat-hd-ibx-send {
	background: #fde68a;
	color: #92400e;
}
.pat-hd-ibx-composer .pat-hd-form-error { margin: 0 14px 12px; }

/* Saved replies panel */
.pat-hd-ibx-saved {
	margin-top: 10px;
	border: 1px solid var(--ibx-border);
	border-radius: 8px;
	background: #fbfcfe;
	overflow: hidden;
	animation: pat-hd-ibx-enter 0.18s ease both;
}
.pat-hd-ibx-saved[hidden] { display: none; }
.pat-hd-ibx-saved-list { max-height: 220px; overflow-y: auto; }
.pat-hd-ibx-saved-loading,
.pat-hd-ibx-saved-empty { padding: 14px; font-size: 12px; color: var(--ibx-muted); }
.pat-hd-ibx-saved-item {
	display: flex;
	align-items: center;
	border-bottom: 1px solid var(--ibx-border-soft);
}
.pat-hd-ibx-saved-item:last-child { border-bottom: 0; }
.pat-hd-ibx-saved-insert {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	gap: 8px;
	text-align: left;
	background: transparent;
	border: 0;
	padding: 9px 12px;
	font-family: inherit;
	font-size: 12px;
	color: var(--ibx-ink);
	cursor: pointer;
	min-width: 0;
}
.pat-hd-ibx-saved-insert:hover { background: #eff4fc; }
.pat-hd-ibx-saved-insert strong { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pat-hd-ibx-saved-shared {
	font-size: 9px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--ibx-navy);
	background: #eff6ff;
	border-radius: 4px;
	padding: 1px 5px;
	flex-shrink: 0;
}
.pat-hd-ibx-saved-del {
	appearance: none;
	border: 0;
	background: transparent;
	color: #94a3b8;
	font-size: 16px;
	cursor: pointer;
	padding: 4px 10px;
	flex-shrink: 0;
}
.pat-hd-ibx-saved-del:hover { color: #dc2626; }
.pat-hd-ibx-saved-new {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 10px;
	border-top: 1px solid var(--ibx-border);
	background: white;
}
.pat-hd-ibx .pat-hd-ibx-saved-new input[type="text"] {
	flex: 1 1 auto;
	min-width: 0;
	height: 28px;
	font-size: 12px;
}
.pat-hd-ibx-saved-new .pat-hd-checkbox { font-size: 11px; white-space: nowrap; }
.pat-hd-ibx .pat-hd-ibx-saved-new .pat-hd-btn { height: 28px; padding: 0 10px; font-size: 12px; }

/* Thread */
.pat-hd-ibx-thread { display: flex; flex-direction: column; gap: 8px; }
.pat-hd-ibx-msg {
	background: white;
	border: 1px solid var(--ibx-border);
	border-radius: 8px;
	padding: 10px 12px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}
.pat-hd-ibx-msg.is-private {
	background: #fffdf5;
	border-color: #f0e2b6;
}
.pat-hd-ibx-msg.is-new { animation: pat-hd-ibx-msg-in 0.35s cubic-bezier(0.16,1,0.3,1) both; }
.pat-hd-ibx-msg-head {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 6px;
	flex-wrap: nowrap;
}
.pat-hd-ibx-msg-av { display: inline-flex; flex-shrink: 0; }
.pat-hd-ibx-msg-meta {
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
	flex: 1 1 auto;
}
.pat-hd-ibx-msg-author { font-size: 13px; font-weight: 600; color: var(--ibx-ink); }
.pat-hd-ibx-msg-to { font-size: 11px; color: #94a3b8; }
.pat-hd-ibx-msg-time { font-size: 11px; color: #94a3b8; margin-left: auto; white-space: nowrap; flex-shrink: 0; }
.pat-hd-ibx-msg-body { font-size: 13px; line-height: 1.55; color: #334155; overflow-wrap: break-word; }
.pat-hd-ibx-msg-body p:first-child { margin-top: 0; }
.pat-hd-ibx-msg-body p:last-child { margin-bottom: 0; }
.pat-hd-ibx-msg-body .pat-hd-bm-transcript { margin: 0; }
.pat-hd-ibx-msg-body.is-collapsible {
	max-height: 96px;
	overflow: hidden;
	position: relative;
	transition: max-height 0.28s ease;
}
.pat-hd-ibx-msg-body.is-collapsible:not(.is-expanded)::after {
	content: '';
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 36px;
	background: linear-gradient(to bottom, rgba(255,255,255,0), #fff 85%);
	pointer-events: none;
}
.pat-hd-ibx-msg.is-private .pat-hd-ibx-msg-body.is-collapsible:not(.is-expanded)::after {
	background: linear-gradient(to bottom, rgba(255,253,245,0), #fffdf5 85%);
}
.pat-hd-ibx-msg-body.is-collapsible.is-expanded {
	max-height: 4000px;
}
.pat-hd-ibx-msg-expand {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 6px;
	padding: 2px 0;
	border: 0;
	background: transparent;
	color: var(--ibx-navy);
	font-size: 12px;
	font-weight: 600;
	font-family: inherit;
	cursor: pointer;
}
.pat-hd-ibx-msg-expand:hover { text-decoration: underline; }
.pat-hd-ibx-msg-expand svg { transition: transform 0.2s ease; }
.pat-hd-ibx-msg-expand.is-open svg { transform: rotate(180deg); }
.pat-hd-ibx-msg-body pre {
	white-space: pre-wrap;
	font-family: inherit;
	font-size: 13px;
	color: #334155;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 6px;
	padding: 10px 12px;
	margin: 0;
}

/* Better Messages transcript */
.pat-hd-bm-transcript {
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 10px 12px;
}
.pat-hd-bm-meta {
	font-size: 11px;
	font-style: italic;
	color: #64748b;
	margin-bottom: 10px;
}
.pat-hd-bm-thread { display: flex; flex-direction: column; gap: 8px; }
.pat-hd-bm-line { display: flex; flex-direction: column; gap: 3px; max-width: 92%; }
.pat-hd-bm-line.is-agent { align-self: flex-start; }
.pat-hd-bm-line.is-user { align-self: flex-end; text-align: right; }
.pat-hd-bm-speaker {
	font-size: 11px;
	font-weight: 600;
	color: #64748b;
}
.pat-hd-bm-bubble {
	display: inline-block;
	text-align: left;
	font-size: 13px;
	line-height: 1.5;
	color: #1e293b;
	background: white;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 8px 10px;
}
.pat-hd-bm-line.is-agent .pat-hd-bm-bubble {
	background: #eff6ff;
	border-color: #bfdbfe;
}
.pat-hd-bm-line.is-user .pat-hd-bm-bubble {
	background: white;
}
.pat-hd-bm-heading { display: block; margin: 6px 0 2px; }

/* ── Properties panel ───────────────────────────────────── */
.pat-hd-ibx-props {
	border-left: 1px solid var(--ibx-border);
	background: #fafbfd;
	overflow-y: auto;
	padding: 14px;
	min-width: 0;
	overscroll-behavior: contain;
}
.pat-hd-ibx-prop-group { margin-bottom: 16px; }
.pat-hd-ibx-prop-label {
	display: block;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: #94a3b8;
	margin-bottom: 6px;
}
.pat-hd-ibx-prop-label-row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px;
}
.pat-hd-ibx-prop-link {
	background: none;
	border: 0;
	padding: 0;
	font-size: 11px;
	font-weight: 600;
	color: var(--ibx-navy);
	cursor: pointer;
	font-family: inherit;
}
.pat-hd-ibx-prop-link:hover { text-decoration: underline; }
.pat-hd-ibx-prop-link:disabled { opacity: 0.4; cursor: not-allowed; text-decoration: none; }
.pat-hd-ibx .pat-hd-ibx-props select { height: 32px; font-size: 12px; }

.pat-hd-ibx-assignee {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 8px;
	background: white;
	border: 1px solid var(--ibx-border);
	border-radius: 6px;
}
.pat-hd-ibx-assignee-none { color: #94a3b8; font-size: 12px; font-style: italic; }
.pat-hd-ibx-assignee-name {
	flex: 1 1 auto;
	font-size: 12px;
	font-weight: 500;
	color: var(--ibx-ink);
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pat-hd-ibx-assignee-x {
	appearance: none;
	border: 0;
	background: transparent;
	color: #94a3b8;
	font-size: 15px;
	line-height: 1;
	cursor: pointer;
	padding: 2px;
	flex-shrink: 0;
}
.pat-hd-ibx-assignee-x:hover { color: #dc2626; }
.pat-hd-ibx-assign-search { position: relative; margin-top: 8px; }
.pat-hd-ibx .pat-hd-ibx-assign-input { height: 30px; font-size: 12px; }
.pat-hd-ibx-assign-results {
	position: absolute;
	left: 0; right: 0; top: calc(100% + 4px);
	border: 1px solid var(--ibx-border);
	border-radius: 6px;
	max-height: 200px;
	overflow-y: auto;
	background: white;
	box-shadow: 0 8px 24px rgba(0,0,0,0.14);
	z-index: 80;
}
.pat-hd-ibx-assign-option {
	display: flex;
	flex-direction: column;
	gap: 1px;
	width: 100%;
	text-align: left;
	background: white;
	border: 0;
	border-bottom: 1px solid var(--ibx-border-soft);
	padding: 7px 10px;
	cursor: pointer;
	font-family: inherit;
}
.pat-hd-ibx-assign-option:last-child { border-bottom: 0; }
.pat-hd-ibx-assign-option:hover { background: #f8fafc; }
.pat-hd-ibx-assign-option strong { font-size: 12px; color: var(--ibx-ink); font-weight: 500; }
.pat-hd-ibx-assign-option span { font-size: 11px; color: var(--ibx-muted); }

/* Tags box */
.pat-hd-ibx-tagbox { position: relative; }
.pat-hd-ibx-tag-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	margin-bottom: 6px;
}
.pat-hd-ibx-tag-chips:empty { display: none; }
.pat-hd-ibx-tag-chips .pat-hd-ibx-tag { font-size: 11px; padding: 3px 9px; animation: pat-hd-ibx-enter 0.15s ease both; }
.pat-hd-ibx .pat-hd-ibx-tagbox input[type="text"] { height: 30px; font-size: 12px; }
.pat-hd-ibx-tag-suggest {
	position: absolute;
	left: 0; right: 0; top: 100%;
	margin-top: 4px;
	border: 1px solid var(--ibx-border);
	border-radius: 6px;
	background: white;
	box-shadow: 0 4px 12px rgba(0,0,0,0.1);
	z-index: 20;
	max-height: 160px;
	overflow-y: auto;
}
.pat-hd-ibx-tag-suggest[hidden] { display: none; }
.pat-hd-ibx-tag-suggest-item {
	display: block;
	width: 100%;
	text-align: left;
	background: white;
	border: 0;
	border-bottom: 1px solid var(--ibx-border-soft);
	padding: 7px 10px;
	font-size: 12px;
	font-family: inherit;
	color: var(--ibx-ink);
	cursor: pointer;
}
.pat-hd-ibx-tag-suggest-item:last-child { border-bottom: 0; }
.pat-hd-ibx-tag-suggest-item:hover { background: #eff4fc; }

/* Requester card */
.pat-hd-ibx-requester {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px;
	background: white;
	border: 1px solid var(--ibx-border);
	border-radius: 6px;
	min-width: 0;
}
.pat-hd-ibx-requester-info { min-width: 0; display: flex; flex-direction: column; }
.pat-hd-ibx-requester-name { font-size: 12px; font-weight: 600; color: var(--ibx-ink); }
.pat-hd-ibx-requester-email {
	font-size: 11px;
	color: var(--ibx-navy);
	text-decoration: none;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pat-hd-ibx-requester-email:hover { text-decoration: underline; }
.pat-hd-ibx-requester-order { margin-top: 8px; }

.pat-hd-ibx-assign-hint {
	margin: 6px 0 0;
	font-size: 11px;
	color: #b45309;
}
.pat-hd-ibx-assign-empty {
	padding: 10px 12px;
	font-size: 12px;
	color: #64748b;
}
.pat-hd-ibx-requester-alert {
	margin-top: 8px;
	font-size: 11px;
	color: #64748b;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 5px;
	padding: 6px 8px;
}
.pat-hd-ibx-requester-alert-info {
	color: var(--ibx-navy);
	background: #eff6ff;
	border-color: #bfdbfe;
}
.pat-hd-ibx-collab-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.pat-hd-ibx-collab-list li {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
}
.pat-hd-ibx-kb-actions {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.pat-hd-ibx-audit-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
	max-height: 240px;
	overflow-y: auto;
}
.pat-hd-ibx-audit-list li {
	display: flex;
	flex-direction: column;
	gap: 2px;
	font-size: 11px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--ibx-border-soft);
}
.pat-hd-ibx-audit-list li:last-child { border-bottom: 0; padding-bottom: 0; }
.pat-hd-ibx-audit-time { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: #94a3b8; }
.pat-hd-ibx-audit-action { color: var(--ibx-ink); font-weight: 600; }
.pat-hd-ibx-audit-actor { color: #64748b; }

/* Accordions */
.pat-hd-ibx-acc {
	border: 1px solid var(--ibx-border);
	border-radius: 6px;
	background: white;
	margin-bottom: 10px;
	overflow: hidden;
}
.pat-hd-ibx-acc.pat-hd-ibx-acc-overflow {
	overflow: visible;
}
.pat-hd-ibx-acc.pat-hd-ibx-acc-overflow .pat-hd-ibx-acc-body {
	overflow: visible;
}
.pat-hd-ibx-acc-head {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 9px 12px;
	background: transparent;
	border: 0;
	font-family: inherit;
	font-size: 12px;
	font-weight: 600;
	color: var(--ibx-ink);
	cursor: pointer;
	text-align: left;
}
.pat-hd-ibx-acc-head:hover { background: #f8fafc; }
.pat-hd-ibx-acc-head > span:first-child { flex: 1 1 auto; }
.pat-hd-ibx-acc-count {
	font-size: 10px;
	font-weight: 700;
	background: #eff6ff;
	color: var(--ibx-navy);
	min-width: 18px;
	height: 16px;
	border-radius: 8px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 5px;
}
.pat-hd-ibx-acc-chevron { transition: transform 0.2s ease; flex-shrink: 0; color: #94a3b8; }
.pat-hd-ibx-acc-head[aria-expanded="true"] .pat-hd-ibx-acc-chevron { transform: rotate(180deg); }
.pat-hd-ibx-acc-body { padding: 0 12px 12px; }
.pat-hd-ibx-acc-body[hidden] { display: none; }
.pat-hd-ibx-acc-body .pat-hd-detail-list > div { font-size: 11px; }

/* Linked tickets */
.pat-hd-ibx-linked-list { display: flex; flex-direction: column; gap: 6px; }
.pat-hd-ibx-linked-list:empty { display: none; }
.pat-hd-ibx-linked {
	border: 1px solid var(--ibx-border);
	border-radius: 6px;
	padding: 8px 10px;
	background: #fbfcfe;
	animation: pat-hd-ibx-enter 0.18s ease both;
}
.pat-hd-ibx-linked-top {
	display: flex;
	align-items: center;
	gap: 6px;
}
.pat-hd-ibx-linked-num {
	background: none;
	border: 0;
	padding: 0;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 11px;
	font-weight: 600;
	color: var(--ibx-navy);
	cursor: pointer;
}
.pat-hd-ibx-linked-num:hover { text-decoration: underline; }
.pat-hd-ibx-linked-x {
	appearance: none;
	border: 0;
	background: transparent;
	color: #94a3b8;
	font-size: 14px;
	line-height: 1;
	cursor: pointer;
	padding: 1px 3px;
	margin-left: auto;
	flex-shrink: 0;
}
.pat-hd-ibx-linked-x:hover { color: #dc2626; }
.pat-hd-ibx-linked-subject {
	font-size: 11px;
	color: var(--ibx-muted);
	margin-top: 3px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pat-hd-ibx-link-search { position: relative; margin-top: 8px; }
.pat-hd-ibx-link-search:focus-within,
.pat-hd-ibx-link-search:has(.pat-hd-ibx-link-results:not([hidden])) {
	margin-bottom: 200px; /* room for absolute results inside scrollport */
}
.pat-hd-ibx .pat-hd-ibx-link-search input[type="search"] { height: 30px; font-size: 11px; }
.pat-hd-ibx-assign-search { position: relative; }
.pat-hd-ibx-assign-search:focus-within {
	margin-bottom: 160px;
}
.pat-hd-ibx-link-results {
	position: absolute;
	left: 0; right: 0; top: calc(100% + 4px);
	border: 1px solid var(--ibx-border);
	border-radius: 6px;
	background: white;
	box-shadow: 0 8px 24px rgba(0,0,0,0.14);
	z-index: 80;
	max-height: 220px;
	overflow-y: auto;
}
.pat-hd-ibx-link-results[hidden] { display: none; }
.pat-hd-ibx-link-result {
	display: flex;
	align-items: center;
	gap: 6px;
	width: 100%;
	text-align: left;
	background: white;
	border: 0;
	border-bottom: 1px solid var(--ibx-border-soft);
	padding: 7px 10px;
	font-size: 11px;
	font-family: inherit;
	cursor: pointer;
	min-width: 0;
}
.pat-hd-ibx-link-result:last-child { border-bottom: 0; }
.pat-hd-ibx-link-result:hover { background: #eff4fc; }
.pat-hd-ibx-link-result-subject {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--ibx-ink);
}

/* ── Member two-pane (mibx) ─────────────────────────────── */
.pat-hd-ibx-seg {
	display: flex;
	background: var(--ibx-border-soft);
	border-radius: 6px;
	padding: 3px;
	gap: 2px;
}
.pat-hd-ibx-seg-btn {
	flex: 1 1 0;
	padding: 6px 10px;
	border-radius: 4px;
	font-size: 12px;
	font-weight: 500;
	color: var(--ibx-muted);
	background: transparent;
	border: 0;
	cursor: pointer;
	font-family: inherit;
	transition: all 0.15s ease;
	line-height: 1;
	text-align: center;
}
.pat-hd-ibx-seg-btn:hover { color: var(--ibx-ink); }
.pat-hd-ibx-seg-btn.active {
	background: white;
	color: var(--ibx-ink);
	box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}
.pat-hd-mibx .pat-hd-ibx-convo .pat-hd-thread { margin-bottom: 14px; gap: 8px; }
.pat-hd-mibx .pat-hd-ibx-convo .pat-hd-card { margin-bottom: 0; }
.pat-hd-mibx .pat-hd-ibx-convo .pat-hd-ibx-msg,
.pat-hd-mibx .pat-hd-ibx-convo .pat-hd-message { border-radius: 8px; }

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 1280px) {
	.pat-hd-ibx-frame { grid-template-columns: 56px 320px minmax(0, 1fr); }
	.pat-hd-ibx-rail { padding: 14px 8px; }
	.pat-hd-ibx-rail-label { display: none; }
	.pat-hd-ibx-nav-item { justify-content: center; padding: 9px 6px; position: relative; }
	.pat-hd-ibx-nav-label { display: none; }
	.pat-hd-ibx-nav-count {
		position: absolute;
		top: 2px;
		right: 2px;
		min-width: 16px;
		height: 14px;
		font-size: 9px;
		padding: 0 4px;
	}
	.pat-hd-ibx-ticket-body { grid-template-columns: minmax(0, 1fr) 248px; }
}

@media (max-width: 992px) {
	.pat-hd.pat-hd-ibx { padding: 10px 10px 16px; }
	.pat-hd-ibx-frame {
		grid-template-columns: 1fr;
		height: auto;
		min-height: 70vh;
	}
	.pat-hd-mibx .pat-hd-ibx-frame { grid-template-columns: 1fr; }

	/* Rail becomes a horizontal pill bar */
	.pat-hd-ibx-rail {
		border-right: 0;
		border-bottom: 1px solid var(--ibx-border);
		padding: 8px;
		overflow: visible;
	}
	.pat-hd-ibx-nav {
		flex-direction: row;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		gap: 4px;
	}
	.pat-hd-ibx-nav::-webkit-scrollbar { display: none; }
	.pat-hd-ibx-nav-item { width: auto; flex: 0 0 auto; padding: 8px 12px; justify-content: flex-start; }
	.pat-hd-ibx-nav-label { display: inline; }
	.pat-hd-ibx-nav-count { position: static; min-width: 20px; height: 18px; font-size: 11px; }

	/* One pane at a time: list OR detail */
	.pat-hd-ibx-list { border-right: 0; max-height: none; }
	.pat-hd-ibx-list-body { max-height: 60vh; }
	.pat-hd-ibx-detail { display: none; }
	.pat-hd-ibx.has-ticket .pat-hd-ibx-rail,
	.pat-hd-ibx.has-ticket .pat-hd-ibx-list { display: none; }
	.pat-hd-ibx.has-ticket .pat-hd-ibx-detail { display: flex; min-height: 70vh; }
	.pat-hd-ibx-back { display: inline-flex; }
	.pat-hd-ibx-close { display: none; }

	/* Properties stack under the conversation */
	.pat-hd-ibx-ticket-body {
		display: flex;
		flex-direction: column;
		overflow-y: auto;
	}
	.pat-hd-ibx-convo { overflow-y: visible; flex-shrink: 0; }
	.pat-hd-ibx-props {
		border-left: 0;
		border-top: 1px solid var(--ibx-border);
		overflow-y: visible;
	}
	.pat-hd-ibx-props-toggle { display: none; }
	.pat-hd-ibx-ticket.props-collapsed .pat-hd-ibx-props { display: block; }
	.pat-hd-ibx-subject { white-space: normal; }
}

@media (max-width: 480px) {
	.pat-hd.pat-hd-ibx { padding: 6px 6px 12px; }
	.pat-hd-ibx-topbar { padding: 10px 12px 8px; }
	.pat-hd-ibx-title { font-size: 16px; }
	.pat-hd-ibx-topbar-hi { display: none; }
	.pat-hd-ibx-thead { padding: 10px 12px; flex-wrap: wrap; }
	.pat-hd-ibx-convo { padding: 12px 10px; }
	.pat-hd-ibx-props { padding: 12px 10px; }
	.pat-hd-ibx-composer-foot { flex-direction: column; align-items: stretch; }
	.pat-hd-ibx-composer-foot .pat-hd-ibx-send { justify-content: center; }
	.pat-hd-ibx-stats { grid-template-columns: repeat(2, 1fr); }
	.pat-hd-ibx-bulkbar { flex-wrap: wrap; }
}

@media (prefers-reduced-motion: reduce) {
	.pat-hd-ibx *,
	.pat-hd-ibx *::before,
	.pat-hd-ibx *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* ── Submitted custom fields (staff sidebar + admin) ─────── */
.pat-hd-cfields-card { padding: 14px 16px; }
.pat-hd-cfields-card-title {
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #64748b;
	margin-bottom: 6px;
}
.pat-hd-cfields { margin: 0; }
.pat-hd-cfields-row { padding: 6px 0; border-bottom: 1px solid #f1f5f9; }
.pat-hd-cfields-row:last-child { border-bottom: 0; }
.pat-hd-cfields dt {
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #94a3b8;
	margin: 0 0 2px;
}
.pat-hd-cfields dd {
	margin: 0;
	font-size: 13px;
	color: #1e293b;
	line-height: 1.5;
	overflow-wrap: break-word;
}
.pat-hd-cfields-url {
	color: var(--primary, #24478f);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pat-hd-cfields-url:hover { text-decoration: underline; }
.pat-hd-cfields-url svg { flex-shrink: 0; }

/* ── WooCommerce order card ──────────────────────────────── */
.pat-hd-order-card {
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 10px 12px;
	background: #fafbfc;
}
.pat-hd-order-card-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-bottom: 6px;
}
.pat-hd-order-card-num {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 600;
	color: var(--primary, #24478f);
	text-decoration: none;
}
.pat-hd-order-card-num:hover { text-decoration: underline; }
.pat-hd-order-card-items { font-size: 12.5px; color: #475569; margin-bottom: 6px; }
.pat-hd-order-card-meta {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px;
}
.pat-hd-order-card-total { font-size: 13.5px; font-weight: 700; color: #1e293b; }
.pat-hd-order-card-date { font-size: 11.5px; color: #94a3b8; }
.pat-hd-order-card-warn {
	display: flex;
	gap: 6px;
	align-items: flex-start;
	margin-top: 8px;
	padding: 7px 9px;
	background: #fef3c7;
	border-radius: 6px;
	font-size: 11.5px;
	line-height: 1.45;
	color: #92400e;
}
.pat-hd-order-card-warn svg { flex-shrink: 0; margin-top: 1px; }

/* ── Secure info panel (staff) ───────────────────────────── */
.pat-hd-secure-panel {
	border: 1px solid #e4e0cd;
	border-radius: 8px;
	padding: 10px 12px;
	background: #fffdf4;
}
.pat-hd-secure-panel-info {
	display: flex;
	gap: 7px;
	align-items: flex-start;
	font-size: 11.5px;
	line-height: 1.5;
	color: #6b5a1e;
	margin-bottom: 10px;
}
.pat-hd-secure-panel-info svg { flex-shrink: 0; margin-top: 1px; color: #b0891c; }
.pat-hd-secure-value {
	margin: 0 0 10px;
	padding: 10px 12px;
	background: #1e293b;
	color: #f1f5f9;
	border-radius: 6px;
	font-family: ui-monospace, monospace;
	font-size: 12.5px;
	line-height: 1.55;
	white-space: pre-wrap;
	word-break: break-word;
	user-select: all;
}
.pat-hd-secure-value[hidden] { display: none; }
.pat-hd-secure-panel-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.pat-hd-secure-panel-actions .pat-hd-btn { font-size: 12px; padding: 5px 10px; }
.pat-hd-secure-reveal.is-revealed { background: #f1f5f9; }
.pat-hd-secure-clear:hover { border-color: #fca5a5; color: #dc2626; background: #fef2f2; }