/**
 * HelSup Skin Engine V2 — maps --hs-* onto existing UI selectors.
 * Scoped to HelSup roots only.
 */
.es-app[data-helsup-admin] {
	--es-primary: var(--hs-color-primary, var(--es-primary));
	--es-primary-hover: var(--hs-color-primary-hover, var(--es-primary-hover, #4f46e5));
	--es-primary-soft: var(--hs-color-primary-soft, var(--es-primary-soft));
	--es-bg: var(--hs-color-background-app, var(--es-bg));
	--es-sidebar: var(--hs-color-background-sidebar, var(--es-sidebar));
	--es-surface: var(--hs-color-background-surface, var(--es-surface));
	--es-text: var(--hs-color-text-primary, var(--es-text));
	--es-muted: var(--hs-color-text-muted, var(--es-muted));
	--es-border: var(--hs-color-border-default, var(--es-border));
	--es-success: var(--hs-color-status-success, var(--es-success));
	--es-warning: var(--hs-color-status-warning, var(--es-warning));
	--es-danger: var(--hs-color-status-danger, var(--es-danger));
	--es-info: var(--hs-color-status-info, var(--es-info));
	--es-sidebar-text: var(--hs-color-sidebar-text, var(--es-sidebar-text));
	--es-sidebar-muted: var(--hs-color-sidebar-muted, var(--es-sidebar-muted));
	--es-sidebar-hover: var(--hs-color-sidebar-hover, var(--es-sidebar-hover));
	--es-sidebar-active: var(--hs-color-sidebar-active, var(--es-sidebar-active));
	--es-sidebar-border: var(--hs-color-sidebar-border, var(--es-sidebar-border));
	--es-radius: var(--hs-radius-md, var(--es-radius));
	--es-radius-sm: var(--hs-radius-sm, var(--es-radius-sm));
	--es-radius-lg: var(--hs-radius-lg, var(--es-radius-lg));
	--es-shadow: var(--hs-shadow-md, var(--es-shadow));
	/* Never self-reference a custom property in its own fallback: the declaration
	 * becomes invalid when a skin omits the corresponding --hs-* token. */
	--es-sidebar-width: var(--hs-layout-sidebar-width, 260px);
	--es-sidebar-collapsed: var(--hs-layout-sidebar-collapsed-width, 76px);
	--es-header-height: var(--hs-layout-topbar-height, 64px);
	--es-font-size: var(--hs-font-size-base, var(--es-font-size));
	--es-font: var(--hs-font-family-base, var(--es-font, Inter, system-ui, sans-serif));
	background-image: var(--hs-background-app-image, none);
	letter-spacing: var(--hs-font-letter-spacing, 0);
	gap: var(--hs-layout-page-gap, 0);
}

.es-app[data-helsup-admin] h1,
.es-app[data-helsup-admin] h2,
.es-app[data-helsup-admin] h3,
.es-app[data-helsup-admin] .es-pagehead h1 {
	font-family: var(--hs-font-family-heading, var(--es-font));
	color: var(--hs-color-text-secondary, var(--es-text));
}
.es-app[data-helsup-admin] code,
.es-app[data-helsup-admin] pre {
	font-family: var(--hs-font-family-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
}

.es-app[data-helsup-admin] .es-nav {
	box-shadow: var(--hs-sidebar-shadow, none);
}
.es-app[data-helsup-admin] .es-nav__item {
	border-radius: var(--hs-sidebar-item-radius, var(--hs-comp-sidebar-radius, var(--es-radius-sm)));
	padding-block: var(--hs-sidebar-item-padding, 8px);
}
.es-app[data-helsup-admin] .es-topbar,
.es-app[data-helsup-admin] .es-header {
	background: var(--es-topbar, var(--hs-color-background-topbar, #fff));
	border-bottom-color: var(--hs-topbar-border, var(--es-border));
	box-shadow: var(--hs-topbar-shadow, none);
}

.es-app[data-helsup-admin] .es-inbox {
	background: var(--hs-inbox-background, var(--hs-comp-inbox-background, var(--es-surface)));
	border-radius: var(--hs-inbox-radius, 0);
	padding: var(--hs-inbox-padding, 0);
	border-color: var(--hs-inbox-border, var(--es-border));
}
.es-app[data-helsup-admin] .es-inbox__list {
	background: var(--hs-inbox-list-background, var(--es-surface));
}
.es-app[data-helsup-admin] .es-inbox__views {
	border-color: var(--hs-inbox-border, var(--es-border));
}
.es-app[data-helsup-admin] .es-viewbtn:hover,
.es-app[data-helsup-admin] .es-ticketrow:hover {
	background: var(--hs-inbox-row-hover, var(--hs-comp-inbox-hover-background, var(--es-bg)));
}
.es-app[data-helsup-admin] .es-viewbtn.is-active,
.es-app[data-helsup-admin] .es-ticketrow.is-selected,
.es-app[data-helsup-admin] .es-ticketrow.is-on {
	background: var(--hs-inbox-row-selected, var(--hs-comp-inbox-selected-background, var(--es-primary-soft)));
}

.es-app[data-helsup-admin][data-hs-page="tickets"] .es-card,
.es-app[data-helsup-admin][data-hs-page="ticket-workspace"] .es-card {
	background: var(--hs-ticket-surface, var(--hs-comp-ticket-background, var(--es-surface)));
	border-radius: var(--hs-ticket-radius, var(--hs-comp-ticket-radius, var(--es-radius)));
	padding: var(--hs-ticket-padding, var(--hs-layout-panel-padding, 16px));
	border-color: var(--hs-ticket-border, var(--es-border));
}

.es-app[data-helsup-admin] .es-thread {
	background: var(--hs-conversation-background, var(--hs-comp-conversation-background, var(--es-surface)));
	border-radius: var(--hs-conversation-radius, 0);
}
.es-app[data-helsup-admin] .es-thread__body {
	padding: var(--hs-conversation-padding, 18px);
}
.es-app[data-helsup-admin] .es-msg__bubble {
	border-radius: var(--hs-message-radius, var(--hs-comp-message-radius, 12px));
	padding: var(--hs-message-padding, 10px 12px);
	color: var(--hs-message-text, var(--es-text));
	box-shadow: var(--hs-message-shadow, none);
}
.es-app[data-helsup-admin] .es-msg.is-agent .es-msg__bubble {
	background: var(--hs-message-agent-background, var(--es-primary-soft));
}
.es-app[data-helsup-admin] .es-msg.is-customer .es-msg__bubble {
	background: var(--hs-message-customer-background, #fff);
}
.es-app[data-helsup-admin] .es-composer {
	background: var(--hs-composer-background, var(--hs-comp-composer-background, transparent));
	border-top-color: var(--hs-composer-border, var(--es-border));
	border-radius: var(--hs-composer-radius, 0);
	padding: var(--hs-composer-padding, 12px);
}

.es-app[data-helsup-admin] .es-btn {
	border-radius: var(--hs-button-radius, var(--hs-comp-button-radius, 10px));
	height: var(--hs-button-height, 36px);
	padding-inline: var(--hs-button-padding, 14px);
	box-shadow: var(--hs-button-shadow, none);
	transition: background var(--hs-motion-duration-fast, 120ms) var(--hs-motion-easing-standard, ease),
		transform var(--hs-motion-duration-fast, 120ms) var(--hs-motion-easing-standard, ease),
		opacity var(--hs-motion-duration-fast, 120ms) var(--hs-motion-easing-standard, ease);
}
.es-app[data-helsup-admin] .es-btn:hover:not(:disabled) {
	transform: scale(var(--hs-motion-scale-hover, 1));
	opacity: var(--hs-motion-opacity-hover, 1);
}
.es-app[data-helsup-admin] .es-btn:disabled {
	opacity: var(--hs-button-disabled-opacity, var(--hs-comp-button-disabled-opacity, 0.5));
}
.es-app[data-helsup-admin] .es-btn.is-primary {
	color: var(--hs-color-text-inverse, #fff);
	background: var(--hs-comp-button-background, var(--es-primary));
}
.es-app[data-helsup-admin] [data-hs-component="button"].es-btn.is-primary.is-soft {
	background: var(--es-primary-soft);
	color: var(--es-primary-hover, var(--es-primary));
	border-color: transparent;
}

/* Small brand text needs the darker companion on a tinted surface. */
.es-app[data-helsup-admin] .es-avatar,
.es-app[data-helsup-admin] .es-badge.is-closed,
.es-app[data-helsup-admin] .es-badge.is-vip {
	color: var(--es-primary-hover, var(--es-primary));
}
.es-app[data-helsup-admin] [data-hs-component="button"].es-btn.is-primary.is-outline {
	background: transparent;
	color: var(--es-primary);
	border-color: var(--es-primary);
}

.es-app[data-helsup-admin] .es-card,
.es-app[data-helsup-admin] [data-hs-component="card"] {
	background: var(--hs-card-background, var(--hs-comp-card-background, var(--es-surface)));
	border-radius: var(--hs-comp-card-radius, var(--es-radius));
	box-shadow: var(--hs-comp-card-shadow, var(--es-shadow));
	border-color: var(--hs-card-border, var(--hs-color-border-default, var(--es-border)));
	border-width: var(--hs-border-width, 1px);
	border-style: var(--hs-border-style, solid);
	padding: var(--hs-card-padding, var(--hs-layout-panel-padding, 16px));
}

.es-app[data-helsup-admin] .es-input,
.es-app[data-helsup-admin] input[type="text"],
.es-app[data-helsup-admin] input[type="search"],
.es-app[data-helsup-admin] textarea.es-input,
.es-app[data-helsup-admin] [data-hs-component="search"] input {
	border-radius: var(--hs-comp-input-radius, var(--es-radius-sm));
	border-color: var(--hs-color-border-default, var(--es-border));
	border-width: var(--hs-border-width, 1px);
	border-style: var(--hs-border-style, solid);
}
.es-app[data-helsup-admin] .es-input:focus,
.es-app[data-helsup-admin] .es-select.is-open .es-select__btn {
	border-color: var(--hs-comp-input-focus-border, var(--es-control-focus, var(--es-primary)));
}
.es-app[data-helsup-admin] .es-select__btn {
	border-radius: var(--hs-select-radius, var(--es-radius-sm));
	min-height: var(--hs-select-height, var(--es-control-height));
}

.es-app[data-helsup-admin] .es-table,
.es-app[data-helsup-admin] [data-hs-component="table"] {
	border-radius: var(--hs-table-radius, var(--hs-radius-md, var(--es-radius)));
	border-color: var(--hs-color-border-default, var(--es-border));
}
.es-app[data-helsup-admin] .es-table th {
	background: var(--hs-table-header-background, var(--hs-color-background-elevated, var(--es-surface)));
}
.es-app[data-helsup-admin] .es-table tbody tr,
.es-app[data-helsup-admin] [data-hs-component="table"] tbody tr {
	height: var(--hs-layout-table-row-height, var(--hs-comp-table-row-height, auto));
}
.es-app[data-helsup-admin] .es-table tr:hover td {
	background: var(--hs-table-row-hover, var(--hs-comp-table-hover-background, transparent));
}

.es-app[data-helsup-admin] .es-badge,
.es-app[data-helsup-admin] [data-hs-component="badge"] {
	border-radius: var(--hs-comp-badge-radius, var(--hs-radius-pill, 999px));
	padding: var(--hs-badge-padding, 2px 8px);
	background: var(--hs-badge-default, var(--hs-comp-badge-background, inherit));
}
.es-app[data-helsup-admin] .es-badge.is-urgent { color: var(--hs-ticket-priority-urgent, var(--es-danger)); }
.es-app[data-helsup-admin] .es-badge.is-high { color: var(--hs-ticket-priority-high, var(--es-warning)); }
.es-app[data-helsup-admin] .es-badge.is-open,
.es-app[data-helsup-admin] .es-badge.is-medium { color: var(--hs-ticket-priority-normal, var(--es-info)); }
.es-app[data-helsup-admin] .es-badge.is-low { color: var(--hs-ticket-priority-low, var(--es-muted)); }

.es-app[data-helsup-admin] .es-tabs,
.es-app[data-helsup-admin] [data-hs-component="tabs"] {
	border-radius: var(--hs-comp-tabs-radius, var(--es-radius));
}
.es-app[data-helsup-admin] .es-tabs button.is-active,
.es-app[data-helsup-admin] .es-tab.is-active {
	color: var(--hs-tabs-active-color, var(--es-primary));
	border-bottom-color: var(--hs-tabs-active-border, var(--es-primary));
}

.es-app[data-helsup-admin] .es-select__menu,
.es-app[data-helsup-admin] .es-settings-hits,
.es-app[data-helsup-admin] [data-hs-component="dropdown"] {
	background: var(--hs-dropdown-background, var(--hs-comp-dropdown-background, var(--es-surface)));
	border-radius: var(--hs-dropdown-radius, var(--es-radius));
	box-shadow: var(--hs-dropdown-shadow, var(--es-shadow));
	border-color: var(--hs-dropdown-border, var(--es-border));
	z-index: var(--es-z-dropdown, 40);
}

.es-app[data-helsup-admin] [data-hs-component="modal"] .es-modal__box,
.es-app[data-helsup-admin] .es-modal__box {
	border-radius: var(--hs-comp-modal-radius, var(--es-radius-lg));
	background: var(--hs-color-background-elevated, var(--es-overlay-surface, var(--es-surface)));
	box-shadow: var(--es-overlay-shadow, var(--es-shadow));
	animation: hs-modal-in var(--hs-motion-duration-modal, 200ms) var(--hs-motion-easing-standard, ease);
}
.es-app[data-helsup-admin] [data-hs-component="modal"] .es-modal__box:not(.is-preview):not(.is-full):not(.is-xl),
.es-app[data-helsup-admin] .es-modal__box:not(.is-preview):not(.is-full):not(.is-xl) {
	width: min(var(--hs-modal-width, 520px), 100%);
}

/* Automation template library: runtime-safe wide modal contract. */
.es-app[data-helsup-admin] .es-modal__box.is-xl {
	width: min(1200px, 94vw);
	max-width: 94vw;
	height: min(88vh, 900px);
	max-height: 88vh;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.es-app[data-helsup-admin] .es-modal__box.is-xl > .es-card__head,
.es-app[data-helsup-admin] .es-modal__box.is-xl > .es-card__foot { flex: none; position: sticky; z-index: 2; background: var(--es-surface); }
.es-app[data-helsup-admin] .es-modal__box.is-xl > .es-card__head { top: 0; }
.es-app[data-helsup-admin] .es-modal__box.is-xl > .es-card__foot { bottom: 0; }
.es-app[data-helsup-admin] .es-modal__box.is-xl > .es-card__body { flex: 1; min-height: 0; overflow: hidden; padding: 0; }
.es-app[data-helsup-admin] .es-auto-library { height: 100%; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.es-app[data-helsup-admin] .es-auto-library__paths { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 14px 16px 10px; flex: none; }
.es-app[data-helsup-admin] .es-auto-library__paths button { min-width: 0; display: flex; gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--es-border); border-radius: 10px; background: var(--es-bg); color: inherit; text-align: left; cursor: pointer; }
.es-app[data-helsup-admin] .es-auto-library__paths button.is-on { border-color: var(--es-primary); background: var(--es-primary-soft); }
.es-app[data-helsup-admin] .es-auto-library__paths span,
.es-app[data-helsup-admin] .es-auto-library__paths strong,
.es-app[data-helsup-admin] .es-auto-library__paths small { display: block; min-width: 0; }
.es-app[data-helsup-admin] .es-auto-library__paths small { margin-top: 2px; color: var(--es-muted); }
.es-app[data-helsup-admin] .es-auto-library__searchbar { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border-block: 1px solid var(--es-border); flex: none; background: var(--es-surface); }
.es-app[data-helsup-admin] .es-auto-library__search { flex: 1; min-width: 0; height: 38px; }
.es-app[data-helsup-admin] .es-auto-library__body { display: grid; grid-template-columns: 190px minmax(0, 1fr); flex: 1; min-height: 0; overflow: hidden; }
.es-app[data-helsup-admin] .es-auto-library__filters { padding: 14px; border-right: 1px solid var(--es-border); overflow-y: auto; background: var(--es-bg); }
.es-app[data-helsup-admin] .es-auto-library__filters h3 { margin: 0 0 10px; }
.es-app[data-helsup-admin] .es-auto-library__filters label { display: block; margin-top: 12px; font-size: 12px; font-weight: 600; }
.es-app[data-helsup-admin] .es-auto-library__filters select { display: block; width: 100%; margin-top: 5px; }
.es-app[data-helsup-admin] .es-auto-library__filters .es-btn { margin-top: 14px; width: 100%; }
.es-app[data-helsup-admin] .es-auto-library__catalog { min-width: 0; overflow-x: hidden; overflow-y: auto; padding: 14px 16px 24px; }
.es-app[data-helsup-admin] .es-auto-library__cataloghead { margin-bottom: 12px; }
.es-app[data-helsup-admin] .es-auto-library__cataloghead h3,
.es-app[data-helsup-admin] .es-auto-library__cataloghead p { margin: 0 0 4px; }
.es-app[data-helsup-admin] .es-auto-tplgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.es-app[data-helsup-admin] .es-auto-tplcard { min-width: 0; }
.es-app[data-helsup-admin] .es-auto-tplcard .es-row { flex-wrap: wrap; margin-top: auto; }
.es-app[data-helsup-admin] .es-auto-tplcats { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }
.es-app[data-helsup-admin] .es-auto-tplcard > .es-muted { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.es-app[data-helsup-admin] .es-auto-library__more { display: block; margin: 16px auto 0; }
.es-app[data-helsup-admin] .es-auto-library__empty { padding: 32px; text-align: center; color: var(--es-muted); }
.es-app[data-helsup-admin] .es-auto-library__detail,
.es-app[data-helsup-admin] .es-auto-library > .es-auto-tpldetail { overflow-y: auto; padding: 18px 22px 28px; }
.es-app[data-helsup-admin] .es-auto-library button:focus-visible,
.es-app[data-helsup-admin] .es-auto-library input:focus-visible,
.es-app[data-helsup-admin] .es-auto-library select:focus-visible { outline: 3px solid var(--es-primary-soft); outline-offset: 2px; }
@media (min-width: 1280px) { .es-app[data-helsup-admin] .es-auto-library__catalog .es-auto-tplgrid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .es-app[data-helsup-admin] .es-auto-library__catalog .es-auto-tplgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 768px) {
	.es-app[data-helsup-admin] .es-modal__box.is-xl { width: 94vw; max-width: 94vw; height: 90vh; max-height: 90vh; }
	.es-app[data-helsup-admin] .es-auto-library__paths { grid-template-columns: 1fr; }
	.es-app[data-helsup-admin] .es-auto-library__body { grid-template-columns: 1fr; overflow-y: auto; }
	.es-app[data-helsup-admin] .es-auto-library__filters { border-right: 0; border-bottom: 1px solid var(--es-border); overflow: visible; }
	.es-app[data-helsup-admin] .es-auto-tplcats { flex-direction: row; overflow-x: auto; flex-wrap: nowrap; }
	.es-app[data-helsup-admin] .es-auto-tplcats button { white-space: nowrap; }
	.es-app[data-helsup-admin] .es-auto-library__catalog { overflow: visible; }
}
@media (max-width: 560px) {
	.es-app[data-helsup-admin] .es-auto-library__catalog .es-auto-tplgrid { grid-template-columns: 1fr; }
	.es-app[data-helsup-admin] .es-auto-library__searchbar { align-items: stretch; flex-direction: column; }
}
.es-app[data-helsup-admin] [data-hs-component="modal"] .es-modal__box.is-full,
.es-app[data-helsup-admin] .es-modal__box.is-full {
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	border-radius: 0;
	animation: none;
	transform: none;
}
.es-app[data-helsup-admin] .es-toastwrap { z-index: var(--es-z-toast, 50); }
.es-app[data-helsup-admin] .es-drawer-mask,
.es-app[data-helsup-admin] [data-hs-component="modal"] { z-index: var(--es-z-modal, 50); }
.es-app[data-helsup-admin] .es-popup,
.es-app[data-helsup-admin] [data-hs-component="popup"] {
	border-radius: var(--hs-popup-radius, 12px);
	box-shadow: var(--hs-popup-shadow, var(--es-shadow));
}

.es-app[data-helsup-admin] [data-hs-page="ai-copilot"] .es-card,
.es-app[data-helsup-admin] [data-hs-component="ai_copilot"] {
	background: var(--hs-ai-surface, var(--hs-comp-ai-copilot-background, var(--es-surface)));
	border-radius: var(--hs-ai-radius, var(--es-radius));
}
.es-app[data-helsup-admin] [data-hs-page="ai-copilot"] {
	background: var(--hs-ai-background, var(--es-bg));
}
.es-app[data-helsup-admin] [data-hs-page="ai-copilot"] .es-btn.is-primary {
	background: var(--hs-ai-accent, var(--es-primary));
}

.es-app[data-helsup-admin] [data-hs-component="empty_state"] {
	border-radius: var(--hs-comp-empty-state-radius, var(--es-radius));
}
.es-app[data-helsup-admin] [data-hs-slot] {
	min-height: 0;
}

.es-chat-root .es-chat-panel {
	background: var(--hs-chatbox-background, var(--hs-comp-chatbox-background, var(--es-surface, #fff)));
	border-radius: var(--hs-chatbox-radius, 16px);
	box-shadow: var(--hs-chatbox-shadow, 0 12px 40px rgba(15, 23, 42, 0.12));
	width: var(--hs-chatbox-width, 380px);
	height: var(--hs-chatbox-height, 560px);
	animation: hs-chatbox-in var(--hs-motion-duration-chatbox, 200ms) var(--hs-motion-easing-standard, ease);
}
.es-chat-root .es-chat-header {
	background: var(--hs-chatbox-header-background, var(--esx-c-header-bg, var(--es-success, #16a34a)));
}
.es-chat-root .es-chat-launcher {
	background: var(--hs-launcher-background, var(--esx-l-bg, #16a34a));
	color: var(--hs-launcher-icon, var(--esx-l-icon, #fff));
	width: var(--hs-launcher-size, var(--esx-l-size, 60px));
	height: var(--hs-launcher-size, var(--esx-l-size, 60px));
	border-radius: var(--hs-launcher-radius, 999px);
	box-shadow: var(--hs-launcher-shadow, var(--esx-l-shadow, 0 10px 30px rgba(15, 23, 42, 0.22)));
	transition: transform var(--hs-motion-duration-fast, 120ms) var(--hs-motion-easing-standard, ease);
}
.es-chat-root .es-chat-launcher:hover {
	transform: scale(var(--hs-motion-scale-hover, 1.02));
}

.es-portal {
	background: var(--hs-portal-background, var(--hs-comp-portal-background, var(--es-bg, #f8fafc)));
	color: var(--hs-portal-text, var(--es-text, #0f172a));
}
.es-portal .es-p-card,
.es-portal .es-p-hero,
.es-portal .es-p-kpi {
	background: var(--hs-portal-surface, var(--es-surface, #fff));
	border-radius: var(--hs-portal-radius, var(--es-radius, 12px));
}

.es-kbpub {
	background: var(--hs-kb-background, var(--hs-comp-knowledge-base-background, var(--es-bg, #fff)));
}
.es-kbpub .es-kbpub__wrap,
.es-kbpub .es-kb-card {
	background: var(--hs-kb-surface, var(--es-surface, #fff));
	border-radius: var(--hs-kb-radius, var(--es-radius, 12px));
}
.es-kbpub a,
.es-kbpub .es-kbpub__brand {
	color: var(--hs-kb-accent, var(--es-primary, #6366f1));
}

@keyframes hs-modal-in {
	from { opacity: 0; transform: translateY(var(--hs-motion-translate-modal, 8px)); }
	to { opacity: 1; transform: none; }
}
@keyframes hs-chatbox-in {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	.es-app[data-helsup-admin] .es-btn,
	.es-chat-root .es-chat-launcher,
	.es-app[data-helsup-admin] .es-modal__box,
	.es-chat-root .es-chat-panel {
		animation: none !important;
		transition: none !important;
		transform: none !important;
	}
}

.es-skin-studio {
	display: grid;
	grid-template-columns: minmax(300px, 420px) minmax(0, 1fr);
	gap: 16px;
	align-items: start;
}
.es-skin-studio__nav {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 12px;
}
.es-skin-studio__preview {
	position: sticky;
	top: 12px;
}
.es-skin-studio__preview.is-tablet { max-width: 768px; }
.es-skin-studio__preview.is-mobile { max-width: 390px; }
.es-skin-studio__search { width: 100%; margin-bottom: 10px; }
.es-skin-section { border: 1px solid var(--es-border); border-radius: 10px; padding: 10px 12px; margin-bottom: 10px; }
.es-skin-section > summary { cursor: pointer; font-weight: 600; }
.es-skin-comp, .es-skin-slot, .es-skin-state { margin: 8px 0 8px 10px; }
.es-skin-comp > summary, .es-skin-slot > summary, .es-skin-state > summary { cursor: pointer; }
.es-skin-inspector { border: 1px dashed var(--es-border); border-radius: 8px; padding: 8px 10px; margin: 8px 0; font-size: 13px; }
.es-app[data-helsup-admin][data-hs-density="compact"] { --hs-space-4: 12px; }
.es-app[data-helsup-admin][data-hs-density="spacious"] { --hs-space-4: 20px; }
.es-app[data-helsup-admin] .es-msg.is-note .es-msg__bubble { background: var(--hs-note-background, #fef9c3); }
.es-app[data-helsup-admin] .es-msg.is-ai .es-msg__bubble { background: var(--hs-message-ai-background, var(--hs-message-agent-background, var(--es-primary-soft))); }
.es-app[data-helsup-admin] .es-msg.is-system .es-msg__bubble { background: var(--hs-message-system-background, #f1f5f9); }
.es-app[data-helsup-admin] .es-conv.is-unread { box-shadow: inset 3px 0 0 var(--hs-inbox-unread, var(--es-primary)); }
@media (max-width: 900px) {
	.es-skin-studio { grid-template-columns: 1fr; }
}