:root {
	--brand-black: #1e1e1e;
	--brand-gray: #b8b8b8;
	--green: #00ba69;
	--green-light: #e6f9f0;
	--green-mid: #009a56;
	--text: #1e1e1e;
	--text-2: #4b5563;
	--text-3: #666666;
	--border: #e2e8f0;
	--border-dark: #cbd5e1;
	--bg: #ffffff;
	--bg-2: #ffffff;
	--bg-3: #ffffff;
	--layout-panel-gap: 16px;
	--page-gutter-x: 24px;
	--font: 'Space Grotesk', system-ui, sans-serif;
	--mono: 'JetBrains Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
	--radius: 3px;
}

* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html,
body {
	width: 100%;
	height: 100%;
}

body {
	font-family: var(--font);
	font-size: 13px;
	color: var(--text);
	background: var(--bg);
}

*::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

*::-webkit-scrollbar-thumb {
	background: #cbd5e1;
	border-radius: 999px;
}

*::-webkit-scrollbar-track {
	background: transparent;
}

* {
	scrollbar-width: thin;
	scrollbar-color: #cbd5e1 transparent;
}

:focus-visible {
	outline: 2px solid var(--green);
	outline-offset: 2px;
}

/* Anonimizados */
.anon-shell {
	display: grid;
	gap: 18px;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	color: var(--text);
}
.anon-warning {
	padding: 14px 16px;
	border-left: 4px solid #8a5700;
	background: var(--ing-amber-s);
	color: var(--text);
	font-weight: 600;
	line-height: 1.5;
}
.anon-drop {
	display: grid;
	justify-items: start;
	gap: 10px;
	padding: 24px;
	border: 2px dashed var(--ing-bc2);
	background: var(--ing-bg2);
}
.anon-drop[data-state="arrastrando"] {
	border-color: var(--green-mid);
	background: var(--green-light);
}
.anon-drop h2, .anon-toolbar h2 { font-size: 18px; }
.anon-drop p, .anon-hint, .anon-empty { color: var(--text-2); line-height: 1.5; }
#page-content .anon-file-input {
	position: absolute;
	width: 1px;
	min-width: 1px;
	max-width: 1px;
	height: 1px;
	min-height: 1px;
	padding: 0;
	border: 0;
	opacity: 0;
	overflow: hidden;
}
#page-content .anon-file-input:focus-visible + label { outline: 2px solid var(--green-mid); outline-offset: 3px; }
.anon-drop:focus-visible, .anon-drop:focus-within { outline: 2px solid var(--green-mid); outline-offset: 3px; }
#page-content .anon-review input:focus-visible { outline: 2px solid var(--green-mid); outline-offset: 2px; }
.agora-animate-enter > .anon-shell { animation: none !important; }
.anon-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 8px 14px;
	border: 1px solid var(--text);
	border-radius: 2px;
	background: var(--bg);
	color: var(--text);
	font: 700 13px var(--font);
	cursor: pointer;
	text-align: center;
}
.anon-button[data-variant="principal"] {
	background: #1b5e3b;
	border-color: #1b5e3b;
	color: #fff;
}
.anon-button:active:not(:disabled) { transform: translate(2px, 2px); }
.anon-button:disabled { opacity: .55; cursor: not-allowed; }
.anon-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.anon-live:empty { display: none; }
.anon-live { color: var(--text); font-weight: 600; }
.anon-list { display: grid; gap: 14px; }
.anon-card {
	display: grid;
	gap: 12px;
	min-width: 0;
	padding: 16px;
	border: 1px solid var(--ing-bc2);
	background: var(--ing-bg);
	box-shadow: 3px 3px 0 var(--ing-bc2);
	transition: border-color 150ms ease;
}
.anon-card[data-state="processing"] { border-color: var(--green-mid); }
.anon-card[data-state="error"] { border-color: #a52424; }
.anon-card-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.anon-card-header h3 { min-width: 0; overflow-wrap: anywhere; font-size: 15px; }
.anon-status { color: var(--text-2); line-height: 1.5; }
.anon-details { display: grid; gap: 10px; min-width: 0; line-height: 1.5; }
.anon-details:empty { display: none; }
.anon-counts, .anon-notices { padding-left: 20px; overflow-wrap: anywhere; }
.anon-preview {
	max-height: 380px;
	overflow: auto;
	padding: 14px;
	border: 1px solid var(--ing-bc2);
	background: var(--ing-bg2);
	color: var(--text);
	font: 13px/1.6 var(--mono);
	white-space: pre-wrap;
	overflow-wrap: anywhere;
	user-select: text;
}
.anon-token { background: #d3ecdf; color: #123d27; font-weight: 700; }
.anon-review { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }
.anon-review input { flex: 0 0 16px; margin-top: 3px; }
.anon-actions { display: flex; flex-wrap: wrap; gap: 8px; }
html[data-theme="dark"] #page-content .anon-token { background: #1b5e3b; color: #fff !important; }
html[data-theme="dark"] #page-content .anon-button[data-variant="principal"] { background: #1b5e3b; color: #fff !important; }
@media (max-width: 600px) {
	.anon-drop { padding: 18px; }
	.anon-card { padding: 14px; }
	.anon-actions .anon-button { flex: 1 1 140px; }
}
@media (prefers-reduced-motion: reduce) {
	.anon-card { transition: none; }
	.anon-button:active:not(:disabled) { transform: none; }
}

.dashboard-head {
	margin-bottom: 16px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--bg);
	padding: 14px 16px;
}

.dashboard-title {
	font-size: 24px;
	font-weight: 700;
	color: var(--text);
	line-height: 1.2;
}

.dashboard-subtitle {
	margin-top: 4px;
	color: var(--text-3);
	font-size: 12px;
}

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

.dashboard-kpi {
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--bg);
	padding: 14px;
}

.dashboard-kpi-label {
	color: var(--text-3);
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-weight: 700;
}

.dashboard-kpi-value {
	margin-top: 6px;
	color: var(--text);
	font-size: 28px;
	line-height: 1;
	font-weight: 700;
}

.dashboard-card {
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--bg);
	padding: 16px;
	margin-bottom: 16px;
}

.dashboard-card-title {
	color: var(--text);
	font-size: 13px;
	font-weight: 700;
	margin-bottom: 10px;
}

.dashboard-chart-toolbar {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 18px;
	margin-bottom: 10px;
}

.dashboard-chart-header { min-width: 0; }
.dashboard-chart-header .dashboard-card-title { margin-bottom: 0; }
.dashboard-filter-toggle { display: none; }
.dashboard-filter-panel { min-width: 0; }
.dashboard-filter-groups { display: flex; align-items: end; justify-content: flex-end; gap: 10px; }
.dashboard-filter-field { display: grid; width: 156px; gap: 5px; color: var(--text-3); font-size: 10px; font-weight: 600; }
.dashboard-filter-field select {
	width: 100%;
	min-width: 0;
	min-height: 38px;
	padding: 0 10px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--bg-2);
	color: var(--text);
	font: 500 12px var(--font);
	cursor: pointer;
}
.dashboard-filter-field select:focus-visible,
.dashboard-filter-toggle:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.dashboard-filter-field select option { background: var(--bg); color: var(--text); }
.dashboard-filter-field select { color-scheme: light; }
html[data-theme="dark"] .dashboard-filter-field select { color-scheme: dark; }

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

.dashboard-table th {
	text-align: left;
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--text-3);
	padding: 8px 10px;
	border-bottom: 1px solid var(--border);
}

.dashboard-table td {
	padding: 10px;
	border-bottom: 1px solid var(--border);
	color: var(--text);
	font-size: 12px;
	vertical-align: middle;
}

.dashboard-table tbody tr {
	cursor: pointer;
}

.dashboard-table tbody tr:hover {
	background: var(--bg-2);
}

.dashboard-id {
	color: var(--text-3);
	font-family: var(--mono);
	font-size: 11px;
}

.dashboard-muted {
	color: var(--text-3);
}

.dashboard-quick-links {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.dashboard-quick-link {
	height: 32px;
	padding: 0 12px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--bg);
	color: var(--text-2);
	cursor: pointer;
	font-size: 12px;
	font-weight: 600;
}

.dashboard-quick-link:hover {
	border-color: var(--border-dark);
	background: var(--bg-2);
}

:root {
	--ing-green: #00ba69;
	--ing-green-h: #009a56;
	--ing-green-s: #e6f9f0;
	--ing-red: #cf3a22;
	--ing-red-s: #fdeeea;
	--ing-amber: #b07a00;
	--ing-amber-s: #fdf5e3;
	--ing-blue: #2f6fb0;
	--ing-blue-s: #eef4fb;
	--ing-bg: #ffffff;
	--ing-bg2: #f5f5f3;
	--ing-bg3: #ececea;
	--ing-fg: #1e1e1e;
	--ing-fg2: rgba(30,30,30,0.65);
	--ing-fg3: rgba(30,30,30,0.40);
	--ing-bc: rgba(30,30,30,0.12);
	--ing-bc2: rgba(30,30,30,0.28);
	--ing-sans: 'Space Grotesk', system-ui, sans-serif;
}

#page-content .rc-shell,
#page-content .rn-shell,
#page-content .rr-shell,
#page-content .rp-page,
#page-content .rp-card {
	font-family: var(--ing-sans);
	color: var(--ing-fg);
}

#page-content .rc-shell,
#page-content .rn-shell,
#page-content .rr-shell {
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: 100%;
	max-width: none;
	min-height: 100%;
	flex: 1 1 auto;
	padding: 6px;
	background: var(--bg);
}

#page-content .rc-card,
#page-content .rn-card,
#page-content .rr-card,
#page-content .rp-card {
	background: transparent;
	border: none;
	border-radius: 0;
	overflow: visible;
	box-shadow: none;
}

#page-content .rp-page {
	max-width: none;
	margin: 0;
	width: 100%;
	min-height: 100%;
	flex: 1 1 auto;
}

#page-content > .rp-page,
#page-content > .rc-shell,
#page-content > .rn-shell,
#page-content > .rr-shell {
	width: 100%;
	min-height: 100%;
	flex: 1 1 auto;
}

#page-content .rc-head,
#page-content .rn-head,
#page-content .rr-head,
#page-content .rp-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0;
	border: none;
	background: transparent;
}

#page-content .rc-title,
#page-content .rn-title,
#page-content .rr-title,
#page-content .rp-title {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--ing-fg);
	margin: 0;
}

#page-content .rc-sub,
#page-content .rn-sub,
#page-content .rr-sub,
#page-content .rp-sub {
	margin-top: 2px;
	font-size: 12px;
	color: var(--ing-fg2);
	line-height: 1.5;
}

#page-content .rc-body,
#page-content .rn-body,
#page-content .rr-body,
#page-content .rp-body {
	padding: 0;
}

#page-content .rc-grid,
#page-content .rp-inline {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}

#page-content .rc-field,
#page-content .rp-field {
	display: flex;
	flex-direction: column;
	gap: 5px;
	margin-bottom: 8px;
}

#page-content .rc-field label,
#page-content .rp-field label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--ing-fg3);
}

#page-content input,
#page-content textarea,
#page-content select,
#page-content button {
	font-family: var(--ing-sans);
}

#page-content {
	background: var(--bg) !important;
}

#page-content {
	padding: 16px var(--page-gutter-x) 24px !important;
}

img {
	display: block;
	max-width: 100%;
	height: auto;
}

#page-content select,
#page-content input,
#page-content textarea {
	width: 100%;
	min-height: 30px;
	height: 30px;
	border: 1px solid var(--border);
	background: var(--bg);
	color: var(--text);
	border-radius: 3px;
	padding: 0 8px;
	font-size: 12px;
	box-sizing: border-box;
	font-family: var(--font);
}

#page-content textarea {
	height: auto;
	padding: 8px 10px;
	min-height: 90px;
}

#page-content select {
	padding-right: 28px;
	appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, var(--text-3) 50%), linear-gradient(135deg, var(--text-3) 50%, transparent 50%);
	background-position: calc(100% - 14px) calc(50% - 2px), calc(100% - 9px) calc(50% - 2px);
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
	background-color: var(--bg);
}

#page-content .it-select,
#page-content .ds-pager-select {
	height: 30px;
	border: 1px solid var(--border);
	border-radius: 3px;
	background: var(--bg);
	color: var(--text);
	font-size: 12px;
	font-family: var(--font);
}

#page-content textarea {
	min-height: 90px;
	resize: vertical;
}

#page-content input:focus,
#page-content textarea:focus,
#page-content select:focus {
	border-color: var(--ing-green);
	outline: none;
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ing-green) 30%, transparent);
}

#notif-badge:not([hidden]) {
	display: flex;
}

#topbar-notifications { z-index: 300; }
#notif-dropdown {
	width: min(390px, calc(100vw - 24px)) !important;
	max-height: min(560px, calc(100vh - 80px)) !important;
	overflow: auto;
	border-radius: 8px !important;
	box-shadow: 0 18px 50px rgba(15, 23, 42, .2) !important;
}
.notification-popover__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 16px;
	border-bottom: 1px solid var(--border);
}
.notification-popover__header strong { font-size: 14px; }
.notification-popover__controls { display: flex; align-items: center; gap: 12px; }
.notification-text-button {
	border: 0;
	background: transparent;
	color: var(--green);
	font: 600 11px var(--font);
	cursor: pointer;
}
.notification-popover__list { max-height: 390px; overflow: auto; }
.notification-card {
	width: 100%;
	display: flex;
	gap: 12px;
	align-items: flex-start;
	padding: 14px 16px;
	border: 0;
	border-bottom: 1px solid var(--border);
	background: var(--bg);
	color: var(--text);
	text-align: left;
	cursor: pointer;
	transition: background-color 150ms ease;
}
.notification-card:hover { background: var(--green-light); }
.notification-card.is-unread { background: color-mix(in srgb, var(--green) 8%, var(--bg)); }
.notification-card__indicator {
	flex: 0 0 9px;
	width: 9px;
	height: 9px;
	margin-top: 5px;
	border-radius: 50%;
	background: transparent;
}
.notification-card.is-unread .notification-card__indicator { background: var(--green); }
.notification-card__content { min-width: 0; display: grid; gap: 4px; }
.notification-card__heading { font-size: 13px; font-weight: 700; line-height: 1.35; }
.notification-card__message { font-size: 12px; line-height: 1.5; color: var(--text-2); overflow-wrap: anywhere; }
.notification-card__meta { display: flex; align-items: center; gap: 8px; margin-top: 3px; color: var(--text-3); font-size: 10px; }
.notification-card__type { font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.notification-card__priority { padding: 2px 6px; border-radius: 999px; background: #fef2f2; color: #b91c1c; font-size: 9px; font-weight: 700; text-transform: uppercase; }
.notification-card.is-compact { padding: 12px 14px; }
.notification-card.is-compact .notification-card__heading { font-size: 12px; }
.notification-card.is-compact .notification-card__message { font-size: 11px; }
.notification-group__summary {
	width: 100%;
	padding: 11px 16px;
	border: 0;
	border-bottom: 1px solid var(--border);
	background: var(--bg-2);
	color: var(--text-2);
	text-align: left;
	font: 600 12px var(--font);
	cursor: pointer;
}
.notification-group__items[hidden] { display: none; }
.notification-push-button {
	width: 100%;
	padding: 12px 16px;
	border: 0;
	border-top: 1px solid var(--border);
	background: var(--bg);
	color: var(--green);
	font: 600 12px var(--font);
	cursor: pointer;
}
.notification-push-status,
.notification-push-note {
	margin: 0;
	padding: 8px 14px 0;
	color: var(--text-3);
	font-size: 11px;
	line-height: 1.45;
}
.notification-push-note { padding-top: 4px; padding-bottom: 10px; }
.notification-empty { padding: 24px 16px; text-align: center; color: var(--text-3); font-size: 12px; }
.notification-empty.is-error { color: #dc2626; }
.notification-inbox {
	width: 100%;
	max-width: none;
	min-height: 100%;
	margin: 0;
	padding: 12px 14px 20px;
	display: flex;
	flex: 1 0 auto;
	flex-direction: column;
}
.notification-inbox__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 14px;
	padding: 18px 20px;
	border: 1px solid var(--border);
	border-radius: 8px;
	background: linear-gradient(135deg, color-mix(in srgb, var(--green) 9%, var(--bg)), var(--bg) 70%);
}
.notification-eyebrow { color: var(--green); font-size: 10px; font-weight: 700; letter-spacing: .12em; }
.notification-inbox__header h2 { margin: 5px 0; font-size: 25px; }
.notification-inbox__header p { color: var(--text-2); font-size: 13px; }
.notification-inbox__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.notification-primary-button,
.notification-secondary-button {
	min-height: 36px;
	padding: 0 14px;
	border: 1px solid var(--border-dark);
	border-radius: 4px;
	background: var(--bg);
	color: var(--text);
	font: 600 12px var(--font);
	cursor: pointer;
}
.notification-primary-button { border-color: var(--green); background: var(--green); color: #fff; }
.notification-primary-button:hover { background: var(--green-mid); }
.notification-secondary-button:disabled { opacity: .45; cursor: not-allowed; }
.notification-filters {
	display: grid;
	grid-template-columns: minmax(200px, 1fr) 190px 150px auto;
	gap: 10px;
	margin-bottom: 18px;
	padding: 14px;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--bg);
}
.notification-filters input,
.notification-filters select,
.notification-quiet-hours input {
	min-width: 0;
	height: 36px;
	padding: 0 10px;
	border: 1px solid var(--border-dark);
	border-radius: 4px;
	background: var(--bg);
	color: var(--text);
	font: 12px var(--font);
}
.notification-date-group {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr));
	align-content: start;
	gap: 12px;
	margin-bottom: 16px;
}
.notification-date-group > h3 {
	grid-column: 1 / -1;
	padding: 3px 2px 0;
	color: var(--text-3);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .08em;
}
.notification-inbox__list { min-height: 0; flex: 1 0 auto; }
.notification-inbox__list[aria-busy="true"] { opacity: .6; }
.notification-date-group > div { min-width: 0; }
.notification-inbox .notification-card {
	height: 100%;
	min-height: 116px;
	padding: 16px;
	border: 1px solid var(--border);
	border-radius: 7px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.notification-inbox .notification-card:hover {
	border-color: color-mix(in srgb, var(--green) 48%, var(--border));
	box-shadow: 0 5px 16px rgba(15, 23, 42, .08);
	transform: translateY(-1px);
}
.notification-inbox .notification-card.is-unread {
	border-left: 3px solid var(--green);
}
.notification-inbox .notification-card.is-high-priority {
	border-left-color: #dc2626;
}
.notification-pagination { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 18px 0; color: var(--text-3); font-size: 12px; }
.notification-empty--large { padding: 58px 20px; border: 1px dashed var(--border-dark); border-radius: 6px; }
.notification-preferences {
	margin: 0 0 18px;
	padding: 18px;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: var(--bg);
}
.notification-preferences[hidden] { display: none; }
.notification-preferences__form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.notification-preferences__form h3 { grid-column: 1 / -1; margin-top: 8px; font-size: 13px; }
.notification-preference-toggle { display: flex; align-items: center; gap: 9px; color: var(--text-2); font-size: 12px; cursor: pointer; }
.notification-preference-toggle input { accent-color: var(--green); }
.notification-quiet-hours { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; color: var(--text-3); font-size: 12px; }
.notification-preferences__feedback { align-self: center; color: var(--green-mid); font-size: 12px; }

.reminder-admin { margin: 0 0 18px; padding: 0 0 18px; border-bottom: 1px solid var(--border); }
.reminder-admin[hidden] { display: none; }
.reminder-admin h3 { margin: 0 0 4px; font-size: 13px; }
.reminder-admin__hint { margin: 0 0 12px; color: var(--text-3); font-size: 12px; }
.reminder-admin__list { display: grid; gap: 0; justify-items: start; }
.reminder-admin__row { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; padding: 10px 0; border-bottom: 1px solid var(--border); }
.reminder-admin__row.is-paused .reminder-admin__info { opacity: .55; }
.reminder-admin__info { display: grid; gap: 2px; min-width: 0; }
.reminder-admin__info span { color: var(--text-3); font-size: 12px; }
.reminder-admin__row-actions { display: flex; flex: 0 0 auto; gap: 8px; }
.reminder-admin__list > .notification-primary-button { margin-top: 12px; }
.reminder-admin__form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; margin-top: 16px; }
.reminder-admin__field { display: grid; gap: 4px; color: var(--text-2); font-size: 12px; }
.reminder-admin__field:nth-child(2) { grid-column: 1 / -1; }
.reminder-admin__actions { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; }
.reminder-admin .notification-preference-toggle input { width: auto; height: auto; min-height: 0; }
@media (max-width: 720px) {
	.reminder-admin__form { grid-template-columns: minmax(0, 1fr); }
	.reminder-admin__row { flex-direction: column; align-items: flex-start; }
}

#page-content .rc-btn,
#page-content .rn-btn,
#page-content .rr-btn,
#page-content .res-btn {
	height: 34px;
	padding: 0 14px;
	border: 1px solid var(--ing-bc2);
	background: var(--ing-bg);
	color: var(--ing-fg);
	border-radius: 0;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 160ms ease, border-color 160ms ease, transform 120ms ease;
}

#page-content .rc-btn:hover,
#page-content .rn-btn:hover,
#page-content .rr-btn:hover,
#page-content .res-btn:hover {
	background: var(--ing-bg2);
	border-color: var(--ing-bc2);
}

#page-content .rc-btn.primary,
#page-content .rn-btn.primary,
#page-content .rr-btn.primary,
#page-content .res-btn.primary {
	background: var(--ing-green);
	border-color: var(--ing-green);
	color: #fff;
}

#page-content .rc-btn.primary:hover,
#page-content .rn-btn.primary:hover,
#page-content .rr-btn.primary:hover,
#page-content .res-btn.primary:hover {
	background: var(--ing-green-h);
	border-color: var(--ing-green-h);
}

#page-content .rc-actions,
#page-content .rn-actions,
#page-content .rr-actions,
#page-content .rp-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	padding-top: 10px;
	border-top: 1px solid var(--ing-bc);
	margin-top: 4px;
}

#page-content .rc-top,
#page-content .rc-perms-toolbar {
	padding: 0;
	border: none;
	background: transparent;
	margin-bottom: 6px;
}

#page-content .rc-tabs {
	padding: 0;
	border: none;
	border-bottom: 1px solid var(--ing-bc);
	background: transparent;
}

#page-content .rc-item,
#page-content .rp-item {
	border: 1px solid var(--ing-bc);
	padding: 10px 12px;
	background: var(--bg);
}

#page-content .rc-item-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
}

#page-content .rc-item-title,
#page-content .rp-summary-name {
	font-weight: 700;
	font-size: 14px;
	color: var(--ing-fg);
}

#page-content .rc-item-meta {
	font-size: 12px;
	color: var(--ing-fg2);
}

#page-content .rc-error,
#page-content .rn-error,
#page-content .rp-empty,
#page-content .rp-form-note {
	font-size: 11px;
	color: var(--ing-red);
}

#page-content .rn-field-full,
#page-content .rc-field.full,
#page-content .rp-field.full {
	grid-column: 1 / -1;
}

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

	.dashboard-table-wrap {
		overflow-x: auto;
	}

	.dashboard-table {
		min-width: 760px;
	}

	#page-content .rc-grid,
	#page-content .rp-inline {
		grid-template-columns: 1fr;
	}
}

html[data-theme="dark"] {
	color-scheme: dark;
	--green: #00ba69;
	--green-light: #12372b;
	--green-mid: #3ddc91;
	--text: #ffffff;
	--text-2: #f1f5f9;
	--text-3: #cbd5e1;
	--border: #303030;
	--border-dark: #505050;
	--bg: #000000;
	--bg-2: #0a0a0a;
	--bg-3: #171717;
	--ing-green: #00ba69;
	--ing-green-h: #3ddc91;
	--ing-green-s: #121212;
	--ing-red: #f87171;
	--ing-red-s: #171717;
	--ing-amber: #fbbf24;
	--ing-amber-s: #171717;
	--ing-blue: #60a5fa;
	--ing-blue-s: #101010;
	--ing-bg: #000000;
	--ing-bg2: #0a0a0a;
	--ing-bg3: #171717;
	--ing-fg: #ffffff;
	--ing-fg2: rgba(255, 255, 255, .82);
	--ing-fg3: rgba(255, 255, 255, .68);
	--ing-bc: rgba(255, 255, 255, .18);
	--ing-bc2: rgba(255, 255, 255, .34);
}

html[data-theme="light"] {
	color-scheme: light;
}

html[data-theme="dark"] body,
html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .topbar,
html[data-theme="dark"] #page-content {
	background-color: #000000;
	color: #ffffff;
}

html[data-theme="dark"] #page-content,
html[data-theme="dark"] #page-content * {
	color: #ffffff !important;
}

html[data-theme="dark"] #page-content *:not(svg):not(path) {
	border-color: var(--border);
}

html[data-theme="dark"] .sidebar .nav-item {
	color: #ffffff;
}

html[data-theme="dark"] .nav-item,
html[data-theme="dark"] .profile-item,
html[data-theme="dark"] .logout-btn,
html[data-theme="dark"] #page-content button:not(.new-ticket-btn) {
	color: #ffffff;
}

html[data-theme="dark"] #user-role-badge,
html[data-theme="dark"] .agora-badge {
	background: #171717 !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .dashboard-quick-link {
	background: #0a0a0a !important;
	border-color: #303030 !important;
	color: #ffffff !important;
}

@media (max-width: 700px) {
	.notification-inbox { padding: 8px 10px 16px; }
	.notification-inbox__header { align-items: flex-start; padding: 16px; }
	.notification-inbox__actions { flex-direction: column; }
	.notification-inbox__header h2 { font-size: 21px; }
	.notification-filters { grid-template-columns: 1fr 1fr; }
	.notification-filters input { grid-column: 1 / -1; }
	.notification-preferences__form { grid-template-columns: 1fr; }
	.notification-quiet-hours { flex-wrap: wrap; }
	.notification-date-group { grid-template-columns: minmax(0, 1fr); gap: 9px; margin-bottom: 14px; }
	.notification-inbox .notification-card { min-height: 0; padding: 13px; }
	#notif-dropdown { position: fixed !important; top: 58px !important; right: 8px !important; }
}

html[data-theme="dark"] .sg-identity-pill,
html[data-theme="dark"] .sg-status {
	background: #171717 !important;
	border-color: #505050 !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .ns-dashboard-hero {
	background: #171717 !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .ns-dashboard-nav {
	background: #303030;
}

html[data-theme="dark"] .rp-cal-status,
html[data-theme="dark"] .rp-cal-nonworking-flag {
	background: #171717 !important;
	border-color: #505050 !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .rp-cal-legend-dot.weekend,
html[data-theme="dark"] .rp-cal-legend-dot.holiday {
	background: #171717;
}

html[data-theme="dark"] .rp-cal-legend-dot.weekend { border-color: #b45309; }
html[data-theme="dark"] .rp-cal-legend-dot.holiday { border-color: #be123c; }

html[data-theme="dark"] svg.lucide {
	color: #ffffff !important;
	stroke: #ffffff !important;
}

html[data-theme="light"] svg.lucide {
	color: #000000 !important;
	stroke: #000000 !important;
}

html[data-theme="dark"] .dashboard-table th,
html[data-theme="dark"] .dashboard-table td {
	border-color: var(--border);
}

html[data-theme="dark"] #page-content .rc-item,
html[data-theme="dark"] #page-content .rp-item {
	background: var(--ing-bg2);
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
	color-scheme: dark;
	background-color: var(--bg-2);
	color: #ffffff;
}

#page-content > .page-shell,
#page-content > .sg-root,
#page-content > .rp-page,
#page-content > .vt-page,
#page-content > .it-shell,
#page-content > .pl-shell,
#page-content > .ns-shell,
#page-content > .rc-shell,
#page-content > .rn-shell,
#page-content > .rr-shell,
#page-content > .settings-page {
	gap: var(--layout-panel-gap) !important;
}

#page-content > .page-shell {
	padding: 0 !important;
}

.new-ticket-btn {
	color: var(--brand-black);
	transition: background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.new-ticket-btn:hover:not(:disabled) {
	box-shadow: 0 2px 0 color-mix(in srgb, var(--brand-black) 22%, transparent);
	transform: translateY(-1px);
}

.nav-item,
.profile-item,
.dashboard-quick-link,
.settings-theme-option {
	transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.sidebar .nav-item svg {
	transition: transform 180ms cubic-bezier(.2, .8, .2, 1), color 160ms ease;
}

.sidebar .nav-item:hover:not(.active),
.sidebar .nav-item:focus-visible {
	background: color-mix(in srgb, var(--green) 10%, transparent);
	color: var(--green);
}

.sidebar .nav-item:hover svg,
.sidebar .nav-item:focus-visible svg {
	transform: scale(1.45);
}

.sidebar .nav-item:active svg {
	transform: scale(1.2);
}

/* Colapsado: cada sección se separa con una línea fina */
@media (min-width: 901px) {
	body.sidebar-collapsed .sidebar .nav-group-label {
		max-width: none;
		height: 1px;
		margin: 10px 8px;
		padding: 0;
		font-size: 0;
		opacity: 1;
		visibility: visible;
		background: var(--border, #e5e7eb);
	}
}

@media (min-width: 701px) {
	.ticket-list-shell #tk-table-scroll .ticket-list-table tbody { gap: 0; }
	.ticket-list-shell #tk-table-scroll .ticket-row {
		min-height: 48px;
		border: 0;
		border-bottom: 1px solid var(--border);
		border-radius: 0;
		box-shadow: none;
	}
	.ticket-list-shell #tk-table-scroll .ticket-row:hover {
		transform: none;
		box-shadow: none;
	}
	.ticket-list-shell #tk-table-scroll .ticket-row > td { padding: 6px 10px !important; }
	.ticket-list-shell #tk-table-scroll .ticket-subject-cell { gap: 2px; }
}

@media (max-width: 700px) {
	.ticket-list-shell #tk-table-scroll .ticket-row {
		margin-bottom: 0;
		border: 0;
		border-bottom: 1px solid var(--border);
		border-radius: 0;
		box-shadow: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sidebar .nav-item svg { transition: none; }
	.sidebar .nav-item:hover svg { transform: none; }
}

.nav-item.active {
	color: var(--brand-black);
}

html[data-theme="dark"] .nav-item.active {
	color: #ffffff !important;
}

#page-content .rc-btn.primary,
#page-content .rn-btn.primary,
#page-content .rr-btn.primary,
#page-content .res-btn.primary {
	color: var(--brand-black);
}

html[data-theme="dark"] #page-content :is(.rc-btn.primary, .rn-btn.primary, .rr-btn.primary, .res-btn.primary) {
	color: #000000 !important;
}

html[data-theme="dark"] #page-content .rpager button[aria-current="page"] {
	color: #000000 !important;
}

.page-loading {
	display: grid;
	grid-template-columns: 20px minmax(0, 1fr);
	align-items: center;
	gap: 10px 12px;
	min-height: 190px;
	padding: 24px;
	color: var(--text-3);
	font-size: 12px;
}

.page-loading__spinner {
	width: 18px;
	height: 18px;
	border: 2px solid var(--border);
	border-top-color: var(--green);
	border-radius: 50%;
	animation: page-loading-spin 700ms linear infinite;
}

.page-loading__label {
	font-weight: 600;
	color: var(--text-2);
}

.page-loading__skeleton {
	grid-column: 1 / -1;
	display: grid;
	gap: 10px;
	margin-top: 10px;
}

.page-loading__skeleton span {
	display: block;
	height: 12px;
	border-radius: 2px;
	background: var(--bg-2);
	animation: page-loading-pulse 1.4s ease-in-out infinite alternate;
}

.page-loading__skeleton span:nth-child(2) { width: 84%; }
.page-loading__skeleton span:nth-child(3) { width: 62%; }

.page-load-error {
	padding: 24px;
	border-left: 3px solid var(--ing-red);
	background: var(--bg-2);
	color: var(--ing-red);
	font-size: 13px;
	line-height: 1.5;
}

.app-boot-loader {
	width: min(100%, 680px);
	margin: 0 auto;
}

@keyframes page-loading-spin {
	to { transform: rotate(360deg); }
}

@keyframes page-loading-pulse {
	from { opacity: 0.55; }
	to { opacity: 1; }
}

.settings-page {
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
}

.settings-intro {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 20px;
	margin-bottom: 16px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--bg);
}

.settings-intro-icon {
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	flex: 0 0 44px;
	border-radius: var(--radius);
	background: var(--green-light);
	color: var(--green);
}

.settings-intro-icon svg { width: 20px; height: 20px; }
.settings-intro h2 { font-size: 19px; line-height: 1.3; }
.settings-intro p,
.settings-section-heading p {
	margin-top: 4px;
	color: var(--text-3);
	font-size: 12px;
	line-height: 1.5;
}

.settings-section {
	padding: 20px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--bg);
}

.settings-section-heading {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 16px;
}

.settings-section-heading h3 { font-size: 15px; }

.settings-section-tag {
	flex: 0 0 auto;
	padding: 5px 8px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	color: var(--text-3);
	font-size: 10px;
	font-weight: 600;
}

.settings-theme-options {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
}

.settings-theme-option {
	position: relative;
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
	padding: 14px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--bg);
	color: var(--text);
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease;
}

.settings-theme-option:hover { border-color: var(--border-dark); }
.settings-theme-option[aria-pressed="true"] {
	border-color: var(--green);
	background: var(--green-light);
}

.settings-theme-preview {
	width: 68px;
	height: 54px;
	flex: 0 0 68px;
	display: grid;
	grid-template-columns: 16px 1fr;
	grid-template-rows: 9px 1fr 1fr;
	gap: 3px;
	padding: 5px;
	overflow: hidden;
	border: 1px solid var(--border-dark);
	border-radius: 3px;
	background: #fff;
}

.settings-theme-preview span { border-radius: 1px; background: #e2e8f0; }
.settings-theme-preview span:first-child { grid-row: 1 / -1; background: #f1f5f9; }
.settings-theme-preview span:nth-child(2) { grid-column: 2; background: #cbd5e1; }
.settings-theme-preview span:nth-child(3) { background: #fff; }
.settings-theme-preview span:nth-child(4) { background: #e6f9f0; }
.settings-theme-preview--dark { background: #000; border-color: #505050; }
.settings-theme-preview--dark span { background: #303030; }
.settings-theme-preview--dark span:first-child { background: #0a0a0a; }
.settings-theme-preview--dark span:nth-child(2) { background: #171717; }
.settings-theme-preview--dark span:nth-child(3) { background: #0a0a0a; }
.settings-theme-preview--dark span:nth-child(4) { background: #121212; }
.settings-theme-preview--system {
	background: linear-gradient(90deg, #fff 0 50%, #000 50% 100%);
}
.settings-theme-preview--system span:first-child { background: linear-gradient(90deg, #f1f5f9 0 50%, #0a0a0a 50% 100%); }
.settings-theme-preview--system span:nth-child(2) { background: linear-gradient(90deg, #cbd5e1 0 50%, #303030 50% 100%); }
.settings-theme-preview--system span:nth-child(3) { background: linear-gradient(90deg, #fff 0 50%, #171717 50% 100%); }
.settings-theme-preview--system span:nth-child(4) { background: linear-gradient(90deg, #e6f9f0 0 50%, #121212 50% 100%); }

.settings-theme-copy {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 5px;
	min-width: 0;
}

.settings-theme-title {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 13px;
	font-weight: 700;
}

.settings-theme-title svg { width: 15px; height: 15px; color: var(--green); }
.settings-theme-description { color: var(--text-3); font-size: 11px; line-height: 1.45; }
.settings-theme-check { color: var(--green); opacity: 0; }
.settings-theme-check svg { width: 17px; height: 17px; }
.settings-theme-option[aria-pressed="true"] .settings-theme-check { opacity: 1; }
.settings-theme-status { margin-top: 14px; color: var(--text-3); font-size: 11px; line-height: 1.5; }

.profile-page {
	display: flex;
	width: 100%;
	flex-direction: column;
	gap: 16px;
	max-width: 1240px;
	margin: 0 auto;
}

.profile-settings-page {
	max-width: none;
	margin-inline: 0;
}

.profile-editor {
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--bg);
}

.profile-layout {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
	align-items: start;
	gap: 16px;
}

.profile-business-card {
	overflow: hidden;
	border: 1px solid #303030;
	border-radius: var(--radius);
	background: #1e1e1e;
	color: #fff;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}

.profile-card-dialog {
	width: min(720px, calc(100vw - 40px));
	max-width: none;
	max-height: min(900px, calc(100dvh - 40px));
	margin: auto;
	padding: 0;
	overflow: auto;
	border: 1px solid #505050;
	border-radius: var(--radius);
	background: #000;
	color: #fff;
	box-shadow: 0 24px 80px rgba(0, 0, 0, .42);
}

.profile-card-dialog::backdrop { background: rgba(0, 0, 0, .78); }
.profile-card-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-bottom: 1px solid #303030; color: #fff; font-size: 12px; font-weight: 700; }
.profile-card-dialog-header button { display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid #505050; border-radius: var(--radius); background: transparent; color: #fff; cursor: pointer; }
.profile-card-dialog-header button svg { width: 20px; height: 20px; color: #fff !important; stroke: #fff !important; }
.profile-business-card svg.lucide,
.profile-card-dialog-header button svg.lucide { color: #fff !important; stroke: #fff !important; }
.profile-card-dialog-header button:focus-visible,
.profile-action-button:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }
.profile-card-dialog-content { padding: 16px; }
.profile-card-dialog-content .profile-business-card { width: 100%; max-width: 620px; margin: 0 auto; border-color: #505050; }
.profile-card-dialog-content .profile-card-content { grid-template-columns: minmax(0, 1fr) auto; padding: 24px; }
.profile-card-dialog-content .profile-qr-frame { width: 220px; height: 220px; padding: 10px; }
.profile-card-dialog-content .profile-card-photo { flex-basis: 76px; width: 76px; height: 76px; }
.profile-card-dialog-content .profile-card-identity h3 { font-size: 20px; }
.profile-card-dialog-content .profile-card-identity p { font-size: 13px; }
.profile-card-dialog-content .profile-card-office { gap: 11px; padding: 18px 24px; }
.profile-card-dialog-content .profile-card-office > div { font-size: 12px; }
.profile-card-dialog-hint { padding: 0 16px 16px; color: rgba(255, 255, 255, .75); font-size: 11px; line-height: 1.5; text-align: center; }

.profile-card-brand {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 68px;
	padding: 14px 18px;
	border-bottom: 1px solid rgba(255, 255, 255, .16);
}

.profile-card-brand img { display: block; width: 142px; max-height: 40px; object-fit: contain; object-position: left center; filter: brightness(0) invert(1); }
.profile-card-brand span { color: #00ba69; font-size: 10px; font-weight: 700; letter-spacing: .1em; white-space: nowrap; }

.profile-card-content {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 18px;
	padding: 20px 18px;
}

.profile-card-person { display: flex; align-items: flex-start; gap: 14px; min-width: 0; }
.profile-card-photo,
.profile-avatar-small {
	display: grid;
	flex: 0 0 64px;
	width: 64px;
	height: 64px;
	place-items: center;
	overflow: hidden;
	border-radius: 50%;
	background: #303030;
	color: #fff;
	font-size: 19px;
	font-weight: 700;
}

.profile-card-photo img,
.profile-avatar-small img { display: block; width: 100%; height: 100%; object-fit: cover; }
.profile-card-identity { min-width: 0; padding-top: 2px; }
.profile-card-identity h3 { overflow-wrap: anywhere; color: #fff; font-size: 17px; line-height: 1.3; }
.profile-card-identity p { margin-top: 6px; overflow-wrap: anywhere; color: #fff; font-size: 11px; line-height: 1.4; }
.profile-card-identity p:first-of-type { color: #00ba69; font-weight: 600; }
.profile-card-identity [data-card-phones] p { margin-top: 6px; }

.profile-qr-block { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.profile-qr-frame { display: grid; width: 148px; height: 148px; padding: 8px; place-items: center; border-radius: 2px; background: #fff; color-scheme: only light; forced-color-adjust: none; }
.profile-qr-frame img { display: block; width: 100%; height: 100%; image-rendering: pixelated; color-scheme: only light; filter: none; opacity: 1; mix-blend-mode: normal; forced-color-adjust: none; }
.profile-qr-frame img[hidden] { display: none; }
.profile-qr-error { color: #1e1e1e; font-size: 11px; text-align: center; }
.profile-qr-error[hidden] { display: none; }
.profile-qr-block > span { max-width: 148px; color: #fff; font-size: 10px; line-height: 1.35; text-align: center; }

.profile-card-office {
	display: grid;
	gap: 9px;
	padding: 14px 18px 16px;
	border-top: 1px solid rgba(255, 255, 255, .16);
	background: #171717;
}

.profile-card-office > div { display: flex; align-items: flex-start; gap: 9px; color: #fff; font-size: 10px; line-height: 1.45; }
.profile-business-card svg.lucide { flex: 0 0 14px; width: 14px; height: 14px; margin-top: 1px; color: #fff !important; stroke: #fff !important; }
.profile-card-office a { color: inherit; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .42); text-underline-offset: 2px; }

.profile-editor { padding: 20px; }
.profile-section-heading h3 { color: var(--text); font-size: 16px; }
.profile-section-heading p { margin-top: 5px; color: var(--text-3); font-size: 11px; line-height: 1.5; }
.profile-identity-readonly { display: flex; align-items: center; gap: 11px; margin: 18px 0; padding: 12px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-2); }
.profile-avatar-small { flex-basis: 44px; width: 44px; height: 44px; font-size: 14px; }
.profile-identity-readonly > div:nth-child(2) { display: flex; flex: 1; flex-direction: column; gap: 4px; min-width: 0; }
.profile-identity-readonly strong,
.profile-identity-readonly span { overflow-wrap: anywhere; }
.profile-identity-readonly strong { color: var(--text); font-size: 12px; }
.profile-identity-readonly > div:nth-child(2) span { color: var(--text-3); font-size: 11px; }
.profile-source-badge { display: inline-flex; align-items: center; gap: 5px; color: var(--text-3); font-size: 10px; white-space: nowrap; }
.profile-source-badge svg { width: 13px; height: 13px; color: var(--green-mid); }

.profile-editor form { display: grid; gap: 14px; }
.profile-field { display: grid; gap: 6px; color: var(--text); font-size: 11px; font-weight: 600; }
.profile-field input,
.profile-field select,
.profile-field textarea { width: 100%; min-height: 42px; padding: 0 11px; border: 1px solid var(--border-dark); border-radius: var(--radius); background: var(--bg); color: var(--text); font: inherit; font-weight: 400; }
.profile-field textarea { min-height: 64px; padding-block: 9px; resize: vertical; }
.profile-field input::placeholder,
.profile-field textarea::placeholder { color: var(--text-3); opacity: .8; }
.profile-field input:focus-visible,
.profile-field select:focus-visible,
.profile-field textarea:focus-visible { border-color: var(--green); outline: 2px solid rgba(0, 186, 105, .22); outline-offset: 1px; }

.profile-privacy-note { display: flex; align-items: flex-start; gap: 8px; color: var(--text-3); font-size: 10px; line-height: 1.5; }
.profile-privacy-note svg { flex: 0 0 14px; width: 14px; height: 14px; margin-top: 1px; color: var(--green-mid); }
.profile-form-actions { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.profile-download-link,
.profile-save-button { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; gap: 7px; padding: 0 12px; border: 1px solid var(--border-dark); border-radius: var(--radius); background: transparent; color: var(--text); font: inherit; font-size: 11px; font-weight: 600; text-decoration: none; cursor: pointer; }
.profile-download-link svg,
.profile-save-button svg { width: 15px; height: 15px; }
.profile-save-button { border-color: var(--green); background: var(--green); color: #000; }
.profile-save-button:disabled { cursor: wait; opacity: .65; }
.profile-form-status { min-height: 16px; color: var(--text-3); font-size: 11px; line-height: 1.45; }

.profile-layout--card { grid-template-columns: minmax(0, 1fr) minmax(260px, .55fr); }
.profile-card-actions,
.profile-settings-panel { padding: 20px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-1); }
.profile-card-actions { display: grid; align-content: start; gap: 12px; }
.profile-card-actions .profile-section-heading { margin-bottom: 4px; }
.profile-action-button { display: inline-flex; min-height: 44px; align-items: center; justify-content: flex-start; gap: 9px; padding: 0 13px; border: 1px solid var(--border-dark); border-radius: var(--radius); background: var(--bg); color: var(--text); font: inherit; font-size: 12px; font-weight: 600; text-decoration: none; cursor: pointer; }
.profile-action-button svg { width: 16px; height: 16px; }
.profile-action-button:hover { border-color: var(--green); }
.profile-action-button--primary { border-color: var(--green); background: var(--green); color: #000; }
.profile-action-button--primary svg { color: #000; }
@media (max-width: 900px) {
	.profile-card-actions { width: 100%; }
	.profile-action-button { min-height: 48px; line-height: 1.35; white-space: normal; }
	.profile-action-button svg { flex: 0 0 18px; width: 18px; height: 18px; }
}
.profile-back-link { display: inline-flex; min-height: 36px; align-items: center; gap: 7px; margin-bottom: 14px; color: var(--text-2); font-size: 12px; font-weight: 600; text-decoration: none; }
.profile-back-link:hover { color: var(--green-mid); }
.profile-back-link svg { width: 16px; height: 16px; }
.profile-settings-form { display: grid; gap: 14px; }
.profile-phone-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 12px; }
.profile-hours-section { display: grid; gap: 12px; padding-top: 6px; }
.profile-weekly-hours { display: grid; gap: 8px; }
.profile-hours-row { overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg); animation: profile-hours-enter 300ms cubic-bezier(.22, 1, .36, 1) both; }
.profile-hours-row:nth-child(2) { animation-delay: 35ms; }
.profile-hours-row:nth-child(3) { animation-delay: 70ms; }
.profile-hours-row:nth-child(4) { animation-delay: 105ms; }
.profile-hours-row:nth-child(5) { animation-delay: 140ms; }
.profile-hours-row-header { display: grid; grid-template-columns: auto minmax(0, 1fr) 36px; align-items: center; gap: 12px; min-height: 54px; padding: 8px 10px 8px 12px; }
.profile-hours-day { display: inline-flex; align-items: center; gap: 8px; color: var(--text); font-size: 11px; font-weight: 600; }
.profile-hours-day input,
.profile-hours-afternoon-toggle input { flex: 0 0 16px; width: 16px !important; min-width: 16px; height: 16px !important; min-height: 16px !important; margin: 0; padding: 0; accent-color: var(--green); }
.profile-hours-afternoon-toggle { display: inline-flex; align-items: center; gap: 6px; color: var(--text); font-size: 10px; line-height: 1.25; }
.profile-hours-summary { min-width: 0; overflow: hidden; color: var(--text-3); font-size: 11px; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.profile-hours-expand { display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-2); color: var(--text-2); cursor: pointer; }
.profile-hours-expand svg { width: 16px; height: 16px; transition: transform 160ms ease; }
.profile-hours-expand[aria-expanded="true"] svg { transform: rotate(180deg); }
.profile-hours-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 12px; border-top: 1px solid var(--border); background: var(--bg-2); }
.profile-hours-controls[hidden] { display: none; }
.profile-hours-period { display: grid; align-content: start; gap: 7px; min-width: 0; }
.profile-hours-period-label { color: var(--text-3); font-size: 10px; font-weight: 600; }
.profile-hours-time-range { display: grid; grid-template-columns: minmax(0, 1fr) 12px minmax(0, 1fr); align-items: center; gap: 6px; min-width: 0; }
.profile-hours-row .profile-hours-time-range .profile-field input { min-width: 0; height: 38px !important; min-height: 38px !important; padding: 0 8px; }
.profile-hours-separator { color: var(--text-3); font-size: 11px; text-align: center; }
.profile-hours-closed { grid-column: 1 / -1; color: var(--text-3); font-size: 10px; }
.profile-hours-closed[hidden] { display: none; }
.profile-hours-row .profile-field input:disabled { opacity: .55; }
.profile-hours-row .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.profile-hours-day input,
.profile-hours-afternoon-toggle input,
.profile-hours-expand,
.profile-save-button { transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease, opacity 160ms ease, transform 160ms ease; }
.profile-hours-row:focus-within { border-color: var(--green); }
.profile-hours-expand:hover { border-color: var(--green); color: var(--green-mid); }
.profile-hours-expand:active { transform: scale(.94); }
.profile-settings-form .profile-field input,
.profile-settings-form .profile-field select { transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease; }
.profile-settings-form .profile-field input:focus,
.profile-settings-form .profile-field select:focus { box-shadow: 0 0 0 3px rgba(0, 186, 105, .12); }
.profile-save-button:hover:not(:disabled) { box-shadow: 0 4px 12px rgba(0, 186, 105, .22); transform: translateY(-1px); }
.profile-save-button:active:not(:disabled) { box-shadow: none; transform: translateY(0) scale(.98); }

@keyframes profile-hours-enter {
	from { opacity: 0; transform: translateY(7px); }
	to { opacity: 1; transform: translateY(0); }
}

html[data-theme="dark"] #page-content .profile-save-button { color: #000 !important; }
html[data-theme="dark"] #page-content .profile-save-button svg { color: #000 !important; stroke: #000 !important; }
html[data-theme="dark"] #page-content .profile-action-button--primary { color: #000 !important; }
html[data-theme="dark"] #page-content .profile-action-button--primary svg { color: #000 !important; stroke: #000 !important; }
html[data-theme="dark"] #page-content .profile-qr-error { color: #1e1e1e !important; }
html[data-theme="dark"] #page-content .profile-business-card .profile-card-brand span,
html[data-theme="dark"] #page-content .profile-business-card .profile-card-identity p:first-of-type { color: #00ba69 !important; }

html[data-theme="dark"] .settings-theme-option[aria-pressed="true"] {
	background: #121212;
}

@media (max-width: 900px) {
	.profile-layout { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 901px) {
	.profile-settings-form { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
	.profile-settings-form > .profile-phone-fields,
	.profile-settings-form > .profile-hours-section,
	.profile-settings-form > .profile-privacy-note,
	.profile-settings-form > .profile-form-actions,
	.profile-settings-form > .profile-form-status { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
	.settings-intro,
	.settings-section { padding: 16px; }
	.settings-intro { align-items: flex-start; }
	.settings-intro h2 { font-size: 17px; }
	.settings-section-heading { flex-direction: column; gap: 8px; }
	.settings-theme-options { grid-template-columns: 1fr; }
	.settings-theme-option { min-height: 78px; }
	.profile-editor,
	.profile-card-actions,
	.profile-settings-panel { padding: 16px; }
	.profile-card-content { grid-template-columns: minmax(0, 1fr); justify-items: start; }
	.profile-qr-block { width: 100%; flex-direction: row; align-items: center; }
	.profile-qr-block > span { max-width: none; flex: 1; text-align: left; }
	.profile-qr-frame { width: 148px; height: 148px; }
	.profile-card-brand { padding-inline: 14px; }
	.profile-card-brand img { width: 118px; }
	.profile-card-brand span { font-size: 8px; }
	.profile-card-office { padding-inline: 14px; }
	.profile-form-actions { align-items: stretch; }
	.profile-download-link,
	.profile-save-button { flex: 1 1 auto; }
	.profile-phone-fields { grid-template-columns: minmax(0, 1fr); }
	.profile-identity-readonly { flex-wrap: wrap; }
	.profile-source-badge { margin-left: auto; }
}

@media (max-width: 520px) {
	.profile-hours-row-header { grid-template-columns: auto minmax(0, 1fr) 34px; gap: 8px; padding-inline: 9px; }
	.profile-hours-summary { font-size: 10px; }
	.profile-hours-controls { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 10px; }
}

@media (max-width: 900px) {
	.profile-card-dialog {
		position: fixed;
		inset: 0;
		width: 100vw;
		max-width: none;
		height: 100dvh;
		max-height: none;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		overflow-x: hidden;
		overflow-y: auto;
		background: #000;
	}

	.profile-card-dialog-header {
		position: absolute;
		top: max(8px, env(safe-area-inset-top));
		right: 10px;
		z-index: 2;
		padding: 0;
		border: 0;
	}

	.profile-card-dialog-header > span,
	.profile-card-dialog-hint { display: none; }
	.profile-card-dialog-header button { flex: 0 0 44px; width: 44px; height: 44px; border-color: rgba(255, 255, 255, .28); background: rgba(0, 0, 0, .6); }
	.profile-card-dialog-content { display: flex; width: 100%; min-height: 100dvh; align-items: stretch; padding: 0; }
	.profile-card-dialog-content .profile-business-card--presentation {
		display: flex;
		width: 100%;
		max-width: none;
		min-height: 100dvh;
		flex-direction: column;
		justify-content: space-between;
		border: 0;
		border-radius: 0;
		background: #000;
		box-shadow: none;
	}
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-brand {
		min-height: 0;
		justify-content: center;
		padding: max(32px, calc(env(safe-area-inset-top) + 24px)) 22px 8px;
		border: 0;
	}
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-brand img {
		width: min(56vw, 320px);
		max-height: 72px;
		object-position: center;
	}
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-brand span,
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-office { display: none; }
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-content {
		display: flex;
		width: 100%;
		flex: 1;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		gap: clamp(18px, 3.2dvh, 34px);
		padding: clamp(12px, 2dvh, 22px) 20px max(20dvh, env(safe-area-inset-bottom), 22px);
	}
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-person {
		width: 100%;
		flex-direction: column;
		align-items: center;
		gap: 16px;
		text-align: center;
	}
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-photo {
		flex: 0 0 auto;
		width: clamp(80px, 26vw, 144px);
		height: clamp(80px, 26vw, 144px);
		border: 3px solid #fff;
		background: #222;
		font-size: 28px;
	}
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-identity { width: min(100%, 420px); padding: 0; }
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-identity h3 { font-size: clamp(22px, 6vw, 30px); line-height: 1.2; }
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-identity p { margin-top: 8px; font-size: clamp(14px, 4vw, 18px); line-height: 1.35; }
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-identity p:first-of-type { color: rgba(255, 255, 255, .9) !important; font-weight: 400; }
	.profile-card-dialog-content .profile-business-card--presentation .profile-qr-block { width: 100%; flex-direction: column; gap: 0; }
	.profile-card-dialog-content .profile-business-card--presentation .profile-qr-frame {
		width: min(64vw, 28dvh, 360px);
		height: min(64vw, 28dvh, 360px);
		padding: 10px;
		border: 6px solid var(--green);
		border-radius: 22px;
	}
	.profile-card-dialog-content .profile-business-card--presentation .profile-qr-block { margin-top: auto; }
	.profile-card-dialog-content .profile-business-card--presentation .profile-qr-frame .profile-qr-error { font-size: 10px; }
	.profile-card-dialog-content .profile-business-card--presentation .profile-qr-block > span { display: none; }
}

@media (max-width: 900px) and (max-height: 650px) and (orientation: portrait) {
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-brand { padding-top: max(22px, calc(env(safe-area-inset-top) + 14px)); }
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-content { gap: 10px; padding-top: 4px; padding-bottom: max(12px, env(safe-area-inset-bottom)); }
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-person { gap: 7px; }
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-photo { width: clamp(76px, 19vw, 108px); height: clamp(76px, 19vw, 108px); border-width: 2px; }
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-identity h3 { font-size: clamp(18px, 5vw, 24px); }
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-identity p { margin-top: 4px; font-size: clamp(12px, 3.5vw, 15px); }
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-content { padding-bottom: max(20dvh, env(safe-area-inset-bottom), 22px); }
	.profile-card-dialog-content .profile-business-card--presentation .profile-qr-frame { width: min(56vw, 27dvh, 270px); height: min(56vw, 27dvh, 270px); padding: 7px; border-width: 5px; border-radius: 17px; }
}

@media (max-width: 900px) and (orientation: landscape) and (max-height: 600px) {
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-brand {
		padding: max(10px, env(safe-area-inset-top)) 20px 4px;
	}
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-brand img {
		width: auto;
		height: clamp(28px, 9dvh, 42px);
	}
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-content {
		flex-direction: row;
		justify-content: space-evenly;
		gap: 16px;
		padding: 8px max(20px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));
	}
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-person {
		width: auto;
		flex-direction: row;
		align-items: center;
		gap: 12px;
		text-align: left;
	}
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-photo {
		width: clamp(54px, 15dvh, 78px);
		height: clamp(54px, 15dvh, 78px);
	}
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-identity { width: min(34vw, 300px); }
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-identity h3 { font-size: clamp(16px, 4.2vh, 22px); }
	.profile-card-dialog-content .profile-business-card--presentation .profile-card-identity p { margin-top: 4px; font-size: clamp(11px, 2.8vh, 14px); }
	.profile-card-dialog-content .profile-business-card--presentation .profile-qr-block { width: auto; margin: 0; }
	.profile-card-dialog-content .profile-business-card--presentation .profile-qr-frame {
		width: min(36vw, 68dvh, 280px);
		height: min(36vw, 68dvh, 280px);
		padding: 6px;
		border-width: 4px;
		border-radius: 14px;
	}
}

.ticket-list-controls {
	display: grid;
	gap: 8px;
	padding-bottom: 10px;
}

.ticket-list-groups {
	display: flex;
	gap: 20px;
	border-bottom: 1px solid var(--border);
}

.ticket-list-groups button {
	border: 0;
	border-bottom: 2px solid transparent;
	padding: 6px 0;
	background: transparent;
	color: var(--text-2);
	cursor: pointer;
	font: 600 13px var(--font);
}

.ticket-list-groups button[aria-pressed="true"] {
	color: var(--green);
	border-bottom-color: var(--green);
}

.ticket-list-groups span {
	margin-left: 4px;
	color: var(--text-3);
	font-size: 11px;
}

.ticket-list-filters,
.ticket-bulk-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	min-width: 0;
}

.ticket-list-filters > #tk-search {
	flex: 1 1 200px !important;
	width: auto !important;
	max-width: none !important;
}

.ticket-bulk-actions {
	flex: 1 1 auto;
}

.ticket-list-pager {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-top: 6px;
	flex-wrap: wrap;
}

.ticket-detail {
	width: 100%;
}

#page-content .ticket-detail input[type="checkbox"],
#page-content .ticket-list-shell input[type="checkbox"] {
	width: 15px;
	height: 15px;
	min-height: 0;
	padding: 0;
	flex: 0 0 15px;
}

.ticket-detail-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(210px, 260px);
	gap: 24px;
	align-items: start;
}

.ticket-detail-main,
.ticket-detail-sidebar {
	min-width: 0;
}

.ticket-detail-section {
	padding: 0 0 16px;
	margin-bottom: 16px;
	border-bottom: 1px solid var(--border);
}

.ticket-detail-section:last-child {
	border-bottom: 0;
}

@media (max-width: 700px) {
	.ticket-detail-layout { grid-template-columns: minmax(0, 1fr); gap: 8px; }
	.ticket-detail-sidebar { grid-row: 1; }
}

.ticket-mobile-summary {
	display: none;
}

@media (min-width: 701px) {
	#tk-table-head { display: none; }
	#tk-table-scroll {
		flex: 1;
		overflow: auto;
		border: 0 !important;
		background: transparent !important;
	}
	#tk-table-scroll .ticket-list-table {
		display: block;
		width: 100% !important;
		height: 100%;
		background: transparent !important;
	}
	#tk-table-scroll .ticket-list-table colgroup { display: none; }
	#tk-table-scroll .ticket-list-table tbody {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		align-content: start;
		gap: 10px;
	}
	#tk-table-scroll .ticket-row,
	#tk-table-scroll .ticket-row--managed {
		display: grid;
		grid-template-columns: 52px minmax(240px, 1fr) 92px 112px 110px minmax(140px, 190px) 92px;
		grid-template-areas: "id subject priority status sla creator date";
		align-items: center;
		min-height: 76px;
		overflow: hidden;
		border: 1px solid var(--border);
		border-radius: 8px;
		background: var(--bg);
		box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
		transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
	}
	#tk-table-scroll .ticket-row--managed {
		grid-template-columns: 34px 52px minmax(240px, 1fr) 92px 112px 110px minmax(140px, 190px) 92px;
		grid-template-areas: "select id subject priority status sla creator date";
	}
	#tk-table-scroll .ticket-row:hover {
		transform: translateY(-1px);
		border-color: color-mix(in srgb, var(--green) 48%, var(--border));
		box-shadow: 0 5px 16px rgba(15, 23, 42, .08);
	}
	#tk-table-scroll .ticket-row--unread {
		border-left: 3px solid var(--green);
		background: color-mix(in srgb, var(--green) 5%, var(--bg));
	}
	#tk-table-scroll .ticket-row > td {
		display: flex;
		align-items: center;
		min-width: 0;
		height: 100%;
		padding: 12px !important;
		border: 0 !important;
		background: transparent !important;
	}
	#tk-table-scroll .ticket-select-cell { grid-area: select; justify-content: center; }
	#tk-table-scroll .ticket-id-cell { grid-area: id; font-weight: 700; }
	#tk-table-scroll .ticket-subject-cell {
		grid-area: subject;
		display: flex;
		flex-direction: column;
		align-items: flex-start !important;
		justify-content: center;
		gap: 5px;
	}
	#tk-table-scroll .ticket-subject-cell > div:first-child {
		max-width: 100%;
		overflow: hidden;
		font-size: 13px !important;
		font-weight: 700 !important;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	#tk-table-scroll .ticket-subject-cell > div:nth-child(2) {
		max-width: 100%;
		overflow: hidden;
		color: var(--text-3);
		font-size: 11px !important;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	#tk-table-scroll .ticket-priority-cell { grid-area: priority; }
	#tk-table-scroll .ticket-status-cell { grid-area: status; }
	#tk-table-scroll .ticket-sla-cell { grid-area: sla; }
	#tk-table-scroll .ticket-creator-cell { grid-area: creator; }
	#tk-table-scroll .ticket-creator-cell > div { min-width: 0; }
	#tk-table-scroll .ticket-creator-cell span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	#tk-table-scroll .ticket-date-cell { grid-area: date; white-space: nowrap; }
}

@media (min-width: 701px) and (max-width: 1100px) {
	#tk-table-scroll .ticket-row,
	#tk-table-scroll .ticket-row--managed {
		grid-template-columns: 46px minmax(180px, 1fr) 86px 100px;
		grid-template-areas: "id subject priority status";
	}
	#tk-table-scroll .ticket-row--managed {
		grid-template-columns: 32px 46px minmax(180px, 1fr) 86px 100px;
		grid-template-areas: "select id subject priority status";
	}
	#tk-table-scroll .ticket-sla-cell,
	#tk-table-scroll .ticket-creator-cell,
	#tk-table-scroll .ticket-date-cell { display: none !important; }
}

@media (max-width: 700px) {
	.dashboard-chart-toolbar { grid-template-columns: minmax(0, 1fr); gap: 0; margin-bottom: 8px; }
	.dashboard-chart-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
	.dashboard-chart-header .dashboard-card-title { padding-top: 0; }
	.dashboard-filter-toggle {
		display: inline-flex;
		max-width: 72%;
		min-height: 38px;
		align-items: center;
		gap: 6px;
		padding: 5px 8px;
		border: 1px solid var(--border);
		border-radius: var(--radius);
		background: var(--bg-2);
		color: var(--text);
		font: 600 11px var(--font);
		cursor: pointer;
	}
	.dashboard-filter-toggle > svg:first-child { flex: 0 0 15px; width: 15px; height: 15px; color: var(--green); }
	.dashboard-filter-summary { overflow: hidden; color: var(--text-3); font-size: 9px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
	.dashboard-filter-chevron { flex: 0 0 14px; width: 14px; height: 14px; transition: transform 180ms ease; }
	.dashboard-filter-toggle[aria-expanded="true"] .dashboard-filter-chevron { transform: rotate(180deg); }
	.dashboard-filter-panel {
		display: grid;
		grid-template-rows: 0fr;
		margin: 0;
		opacity: 0;
		transition: grid-template-rows 220ms ease, opacity 180ms ease, margin 220ms ease;
	}
	.dashboard-filter-panel[aria-hidden="false"] {
		grid-template-rows: 1fr;
		margin-top: 8px;
		margin-bottom: 10px;
		opacity: 1;
	}
	.dashboard-filter-panel-inner { min-height: 0; overflow: hidden; }
	.dashboard-filter-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 10px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-2); }
	.dashboard-filter-field { width: 100%; gap: 4px; font-size: 9px; }
	.dashboard-filter-field select { min-height: 40px; padding-inline: 8px; font-size: 11px; }
}

@media (max-width: 700px) {
	:root {
		--page-gutter-x: 16px;
	}

	#page-content {
		padding: 16px var(--page-gutter-x) 24px !important;
	}

	#tk-table-head {
		display: none;
	}

	#tk-table-scroll {
		overflow-x: hidden !important;
	}

	#tk-table-scroll .ticket-list-table {
		width: 100% !important;
		min-width: 0 !important;
		table-layout: auto !important;
	}

	#tk-table-scroll .ticket-list-table colgroup {
		display: none;
	}

	#tk-table-scroll .ticket-row {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		align-items: center;
		margin-bottom: 8px;
		border: 1px solid var(--border);
		border-radius: 8px;
		background: var(--bg);
		box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
	}

	#tk-table-scroll .ticket-row--managed {
		grid-template-columns: 32px minmax(0, 1fr);
	}
	#tk-table-scroll .ticket-row--unread {
		border-left: 3px solid var(--green);
		background: color-mix(in srgb, var(--green) 5%, var(--bg));
	}

	#tk-table-scroll .ticket-row > td {
		min-width: 0;
		padding: 9px 8px !important;
	}

	#tk-table-scroll .ticket-row .ticket-select-cell {
		grid-column: 1;
		grid-row: 1;
		padding: 8px 4px !important;
	}

	#tk-table-scroll .ticket-row .ticket-id-cell,
	#tk-table-scroll .ticket-row .ticket-priority-cell,
	#tk-table-scroll .ticket-row .ticket-status-cell,
	#tk-table-scroll .ticket-row .ticket-sla-cell,
	#tk-table-scroll .ticket-row .ticket-creator-cell,
	#tk-table-scroll .ticket-row .ticket-date-cell {
		display: none;
	}

	#tk-table-scroll .ticket-row .ticket-subject-cell {
		grid-column: 1;
		grid-row: 1;
		padding-left: 8px !important;
	}

	#tk-table-scroll .ticket-row--managed .ticket-subject-cell {
		grid-column: 2;
	}

	#tk-table-scroll .ticket-subject-cell > div:not(.ticket-mobile-summary) {
		display: none;
	}

	#tk-table-scroll .ticket-mobile-summary {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		grid-template-rows: auto auto;
		align-items: center;
		column-gap: 8px;
		row-gap: 3px;
		min-width: 0;
	}

	#tk-table-scroll .ticket-mobile-main {
		display: flex;
		align-items: baseline;
		gap: 6px;
		min-width: 0;
		overflow: hidden;
	}

	#tk-table-scroll .ticket-mobile-id {
		flex: 0 0 auto;
		color: var(--text-3);
		font-family: var(--mono);
		font-size: 10px;
	}

	#tk-table-scroll .ticket-mobile-title {
		min-width: 0;
		overflow: hidden;
		color: var(--text);
		font-size: 12px;
		font-weight: 600;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	#tk-table-scroll .ticket-mobile-category {
		grid-column: 1;
		overflow: hidden;
		color: var(--text-3);
		font-size: 10px;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	#tk-table-scroll .ticket-mobile-badges {
		grid-column: 2;
		grid-row: 1 / span 2;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		gap: 4px;
		white-space: nowrap;
	}

	#tk-table-scroll .ticket-mobile-badges .agora-badge {
		font-size: 9px !important;
		padding: 2px 5px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.page-loading__spinner,
	.page-loading__skeleton span {
		animation: none;
	}

	.new-ticket-btn,
	.nav-item,
	.profile-item,
	.dashboard-quick-link,
	.settings-theme-option,
	.profile-hours-row,
	.profile-hours-expand svg,
	.profile-hours-day input,
	.profile-hours-afternoon-toggle input,
	.profile-hours-expand,
	.profile-save-button,
	.profile-settings-form .profile-field input,
	.profile-settings-form .profile-field select,
	.dashboard-filter-field select,
	.dashboard-filter-toggle,
	.dashboard-filter-chevron,
	.dashboard-filter-panel {
		animation: none;
		transition: none;
		transform: none;
	}
}