/* ── Reset & Base ──────────────────────────────────────────── */

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

:root {
	--accent: #ef7b0b ;
	--accent-hover: #d56a00 ;
	--accent-light: rgba(239, 123, 11, 0.10) ;
	--accent-border: rgba(239, 123, 11, 0.35) ;
	--bg: #f4f2ef ;
	--surface: #ffffff ;
	--text: #1f1f1f ;
	--muted: #737373 ;
	--line: #e0ddd9 ;
	--ok: #2e7d32 ;
	--ok-bg: #edf8ee ;
	--ok-border: #bfe2c3 ;
	--warn: #c26d00 ;
	--warn-bg: #fff6ea ;
	--warn-border: #f2d3a7 ;
	--error: #c62828 ;
	--error-bg: #fce8e8 ;
	--error-border: #f5c2c2 ;
	--gap-xs: 4px ;
	--gap-sm: 8px ;
	--gap-md: 12px ;
	--gap-lg: 18px ;
	--gap-xl: 24px ;
	--gap-2xl: 36px ;
	--radius: 10px ;
	--radius-sm: 6px ;
	--radius-pill: 999px ;
	--font: "Avenir Next", "Segoe UI", system-ui, -apple-system, sans-serif ;
	--font-mono: "SF Mono", "Fira Code", "Consolas", monospace ;
	--ease: cubic-bezier(0.4, 0, 0.2, 1) ;
	--ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1) ;
	--duration: 200ms ;
	--duration-modal: 300ms ;
	--shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06) ;
	--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08) ;
	--shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12) ;
	--shadow-modal: 0 16px 48px rgba(0, 0, 0, 0.18) ;
	--shell-max: 1280px ;
}

html { font-size: 15px ; -webkit-text-size-adjust: 100% ; }
body { font-family: var(--font) ; color: var(--text) ; background: var(--bg) ; line-height: 1.5 ; min-height: 100dvh ; position: relative ; }
body::before {
	content: '' ; position: fixed ; inset: 0 ; z-index: 0 ; pointer-events: none ;
	background: url('../images/pdm-logo.svg') center center / 45vmin no-repeat ;
	opacity: 0.03 ;
}
a { color: var(--accent) ; text-decoration: none ; }
a:hover { text-decoration: underline ; }
a.btn:hover { text-decoration: none ; }
img { display: block ; max-width: 100% ; }
h1, h2, h3, h4 { font-weight: 600 ; line-height: 1.25 ; }
h1 { font-size: 1.6rem ; }
h2 { font-size: 1.25rem ; }
h3 { font-size: 1.05rem ; }

/* ── Animations ───────────────────────────────────────────── */

@keyframes fadeIn { from { opacity: 0 ; } to { opacity: 1 ; } }
@keyframes fadeOut { from { opacity: 1 ; } to { opacity: 0 ; } }
@keyframes slideUp { from { opacity: 0 ; transform: translateY(20px) ; } to { opacity: 1 ; transform: translateY(0) ; } }
@keyframes slideDown { from { opacity: 0 ; transform: translateY(-12px) ; } to { opacity: 1 ; transform: translateY(0) ; } }
@keyframes chipPop { 0% { transform: scale(0.7) ; opacity: 0 ; } 60% { transform: scale(1.06) ; } 100% { transform: scale(1) ; opacity: 1 ; } }
@keyframes toast { 0% { transform: translateY(100%) ; opacity: 0 ; } 8% { transform: translateY(0) ; opacity: 1 ; } 85% { transform: translateY(0) ; opacity: 1 ; } 100% { transform: translateY(100%) ; opacity: 0 ; } }
@keyframes spin { to { transform: rotate(360deg) ; } }
@keyframes pulse { 0%, 100% { opacity: 1 ; } 50% { opacity: 0.5 ; } }

/* ── Layout ───────────────────────────────────────────────── */

.shell { max-width: var(--shell-max) ; margin: 0 auto ; padding: 0 var(--gap-xl) ; position: relative ; z-index: 1 ; }
.grid-2 { display: grid ; grid-template-columns: 1fr 1fr ; gap: var(--gap-lg) ; }
.inline-row { display: flex ; align-items: center ; gap: var(--gap-sm) ; }
.stack { display: flex ; flex-direction: column ; gap: var(--gap-md) ; }
.stack-lg { display: flex ; flex-direction: column ; gap: var(--gap-lg) ; }
.space-between { display: flex ; justify-content: space-between ; align-items: center ; }
.gap-sm { gap: var(--gap-sm) ; }
.gap-md { gap: var(--gap-md) ; }
.gap-lg { gap: var(--gap-lg) ; }
.text-center { text-align: center ; }
.text-muted { color: var(--muted) ; }
.text-sm { font-size: 0.85rem ; }
.text-xs { font-size: 0.75rem ; }
.hidden { display: none !important ; }
.sr-only { position: absolute ; width: 1px ; height: 1px ; overflow: hidden ; clip: rect(0, 0, 0, 0) ; }

/* ── Card / Surface ───────────────────────────────────────── */

.card {
	background: var(--surface) ;
	border-radius: var(--radius) ;
	box-shadow: var(--shadow-sm) ;
	border: 1px solid var(--line) ;
}
.card-pad { padding: var(--gap-xl) ; }
.card-header {
	padding: var(--gap-lg) var(--gap-xl) ;
	border-bottom: 1px solid var(--line) ;
	font-weight: 600 ;
	font-size: 1.05rem ;
}

/* ── Buttons ──────────────────────────────────────────────── */

.btn {
	display: inline-flex ; align-items: center ; justify-content: center ; gap: var(--gap-sm) ;
	padding: 8px 18px ; border: none ; border-radius: var(--radius-sm) ;
	font-family: var(--font) ; font-size: 0.9rem ; font-weight: 500 ;
	cursor: pointer ; transition: all var(--duration) var(--ease) ;
	white-space: nowrap ; text-decoration: none ; line-height: 1.4 ;
}
.btn:active { transform: scale(0.97) ; }
.btn:disabled, .btn[disabled] { opacity: 0.5 ; cursor: not-allowed ; transform: none ; }

.btn-primary { background: var(--accent) ; color: #fff ; }
.btn-primary:hover:not(:disabled) { background: var(--accent-hover) ; }

.btn-secondary { background: var(--accent-light) ; color: var(--accent) ; }
.btn-secondary:hover:not(:disabled) { background: var(--accent-border) ; }

.btn-ghost { background: transparent ; color: var(--text) ; }
.btn-ghost:hover:not(:disabled) { background: rgba(0, 0, 0, 0.05) ; }

.btn-danger { background: var(--error-bg) ; color: var(--error) ; }
.btn-danger:hover:not(:disabled) { background: var(--error-border) ; }

.btn-danger-ghost { background: transparent ; color: var(--error) ; }
.btn-danger-ghost:hover:not(:disabled) { background: var(--error-bg) ; }

.btn-active { background: var(--accent) ; color: #fff ; }
.btn-active:hover:not(:disabled) { background: var(--accent-hover) ; }

.btn-ok { background: var(--ok-bg) ; color: var(--ok) ; }
.btn-ok:hover:not(:disabled) { opacity: 0.85 ; }

.btn-warn { background: #fef3c7 ; color: #92400e ; }
.btn-warn:hover:not(:disabled) { background: #fde68a ; }

.btn-sm { padding: 5px 12px ; font-size: 0.8rem ; }
.btn-xs { padding: 3px 8px ; font-size: 0.75rem ; border-radius: 4px ; }
.btn-icon { padding: 6px ; width: 34px ; height: 34px ; }
.btn-icon-sm { padding: 4px ; width: 28px ; height: 28px ; }
.btn-icon-xs { padding: 4px ; width: 24px ; height: 24px ; display: inline-flex ; align-items: center ; justify-content: center ; }

/* ── Form Elements ────────────────────────────────────────── */

label {
	display: block ; font-size: 0.85rem ; font-weight: 500 ;
	margin-bottom: var(--gap-xs) ; color: var(--text) ;
}
label .hint { font-weight: 400 ; color: var(--muted) ; font-size: 0.8rem ; }

input[type="text"], input[type="email"], input[type="password"],
input[type="tel"], input[type="number"], input[type="url"],
input[type="search"], input[type="date"], textarea, select {
	width: 100% ; padding: 9px 12px ;
	border: 1px solid var(--line) ; border-radius: var(--radius-sm) ;
	font-family: var(--font) ; font-size: 0.9rem ; color: var(--text) ;
	background: var(--surface) ;
	transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease) ;
	outline: none ;
}
input:focus, textarea:focus, select:focus {
	border-color: var(--accent) ;
	box-shadow: 0 0 0 3px var(--accent-light) ;
}
textarea { resize: vertical ; min-height: 80px ; line-height: 1.5 ; }
select { cursor: pointer ; appearance: none ; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23737373' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") ; background-repeat: no-repeat ; background-position: right 10px center ; padding-right: 32px ; }
input::placeholder, textarea::placeholder { color: var(--muted) ; opacity: 0.7 ; }
input[readonly] { background: var(--bg) ; color: var(--muted) ; cursor: not-allowed ; }
input[readonly].dp-display { background: var(--surface) ; color: var(--text) ; cursor: pointer ; }

.field { margin-bottom: var(--gap-lg) ; }
.stack > .field { margin-bottom: 0 ; }
.field-row { display: grid ; grid-template-columns: 1fr 1fr ; gap: var(--gap-md) ; margin-bottom: var(--gap-lg) ; }
.field-row.field-row-13 { grid-template-columns: 1fr 2fr ; }
.stack > .field-row { margin-bottom: 0 ; }
.field-row > .field { margin-bottom: 0 ; }
.field-row-align { align-items: start ; }
.field-error input, .field-error textarea, .field-error select { border-color: var(--error) ; }
.field-error .ts-control { border-color: var(--error) ; }
.field-error .chips-wrap { outline: 2px solid var(--error) ; outline-offset: 4px ; border-radius: var(--radius-sm) ; }
.field-error .dyn-list { outline: 2px solid var(--error) ; outline-offset: 4px ; border-radius: var(--radius-sm) ; }
.field-error > label:first-child { color: var(--error) ; }
.checkbox-row.field-error { color: var(--error) ; }
.field-error-msg { color: var(--error) ; font-size: 0.8rem ; margin-top: 2px ; }

/* Checkbox / Toggle */
.checkbox-row {
	display: flex ; align-items: center ; gap: var(--gap-sm) ;
	cursor: pointer ; font-size: 0.9rem ;
}
.checkbox-row input[type="checkbox"] { width: 18px ; height: 18px ; accent-color: var(--accent) ; cursor: pointer ; }

.checkbox-group { display: flex ; flex-direction: column ; gap: var(--gap-xs) ; }
.checkbox-label { display: flex ; align-items: center ; gap: var(--gap-sm) ; cursor: pointer ; font-size: 0.9rem ; }
.checkbox-label input[type="checkbox"] { width: 16px ; height: 16px ; accent-color: var(--accent) ; cursor: pointer ; }

.radio-group { display: flex ; flex-wrap: wrap ; gap: var(--gap-md) ; }
.radio-label { display: flex ; align-items: center ; gap: var(--gap-xs) ; cursor: pointer ; font-size: 0.9rem ; }
.radio-label input[type="radio"] { width: 16px ; height: 16px ; accent-color: var(--accent) ; cursor: pointer ; }

fieldset.fieldset { border: 1px solid var(--border) ; border-radius: var(--radius) ; padding: var(--gap-lg) ; margin-bottom: var(--gap-lg) ; }
fieldset.fieldset legend { font-weight: 600 ; font-size: 0.9rem ; padding: 0 var(--gap-xs) ; color: var(--fg) ; }

.deadline-row { padding: var(--gap-md) 0 ; }
.deadline-row hr { border: none ; border-top: 1px solid var(--border) ; margin-top: var(--gap-md) ; }

.btn-group-sm { display: flex ; gap: var(--gap-xs) ; align-items: center ; }

/* Toggle switch */
.toggle {
	position: relative ; display: inline-block ; width: 40px ; height: 22px ;
	cursor: pointer ;
}
.toggle input { opacity: 0 ; width: 0 ; height: 0 ; }
.toggle-slider {
	position: absolute ; inset: 0 ;
	background: var(--line) ; border-radius: 11px ;
	transition: background var(--duration) var(--ease) ;
}
.toggle-slider::before {
	content: '' ; position: absolute ; width: 16px ; height: 16px ;
	left: 3px ; bottom: 3px ; background: #fff ; border-radius: 50% ;
	transition: transform var(--duration) var(--ease) ;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) ;
}
.toggle input:checked + .toggle-slider { background: var(--accent) ; }
.toggle input:checked + .toggle-slider::before { transform: translateX(18px) ; }

/* ── Chips / Tags ─────────────────────────────────────────── */

.chip {
	display: inline-flex ; align-items: center ; gap: 4px ;
	padding: 3px 10px ; border-radius: var(--radius-pill) ;
	font-size: 0.75rem ; font-weight: 500 ; line-height: 1.4 ;
	animation: chipPop 250ms var(--ease-spring) both ;
}
.chip-accent { background: var(--accent-light) ; color: var(--accent) ; }
.chip-ok { background: var(--ok-bg) ; color: var(--ok) ; }
.chip-warn { background: var(--warn-bg) ; color: var(--warn) ; }
.chip-error, .chip-danger { background: var(--error-bg) ; color: var(--error) ; }
.chip-muted { background: rgba(0, 0, 0, 0.06) ; color: var(--muted) ; }
.chip-remove {
	display: inline-flex ; align-items: center ; justify-content: center ;
	width: 16px ; height: 16px ; border-radius: 50% ;
	background: rgba(0, 0, 0, 0.1) ; cursor: pointer ;
	font-size: 10px ; line-height: 1 ; border: none ; padding: 0 ;
	transition: background var(--duration) var(--ease) ;
}
.chip-remove:hover { background: rgba(0, 0, 0, 0.2) ; }
.chips-wrap { display: flex ; flex-wrap: wrap ; gap: var(--gap-xs) ; }
.chips-nowrap { display: flex ; flex-wrap: nowrap ; gap: var(--gap-xs) ; }
.chips-nowrap .chip { flex-shrink: 0 ; white-space: nowrap ; }

/* ── Modal ────────────────────────────────────────────────── */

.modal-backdrop {
	position: fixed ; inset: 0 ; z-index: 1000 ;
	background: rgba(0, 0, 0, 0.45) ;
	display: flex ; align-items: flex-start ; justify-content: center ;
	padding: 40px var(--gap-xl) ;
	overflow-y: auto ;
	animation: fadeIn 200ms var(--ease) both ;
}
.modal-backdrop.closing { animation: fadeOut 200ms var(--ease) both ; }

.modal-card {
	background: var(--surface) ; border-radius: var(--radius) ;
	box-shadow: var(--shadow-modal) ; width: 100% ; max-width: 720px ;
	animation: slideUp var(--duration-modal) var(--ease-spring) both ;
	max-height: calc(100dvh - 80px) ; display: flex ; flex-direction: column ;
}
/* Wide modal for list views (admin sections in modals) */
.modal-card.modal-mid { max-width: 880px ; }
.modal-card.modal-wide { max-width: 1100px ; }
.modal-backdrop.closing .modal-card { animation: none ; opacity: 0 ; transform: translateY(10px) ; transition: all 200ms var(--ease) ; }

.modal-header {
	display: flex ; align-items: flex-start ; justify-content: space-between ; gap: var(--gap-md) ;
	padding: var(--gap-lg) var(--gap-xl) ;
	border-bottom: 1px solid var(--line) ;
	flex-shrink: 0 ;
}
.modal-header h2 { margin: 0 ; font-size: 1.1rem ; }
.modal-desc { margin: 4px 0 0 ; font-size: 0.82rem ; color: var(--muted) ; line-height: 1.4 ; }

.modal-body { padding: var(--gap-xl) ; overflow-y: auto ; flex: 1 ; }
.modal-footer {
	padding: var(--gap-lg) var(--gap-xl) ;
	border-top: 1px solid var(--line) ;
	display: flex ; justify-content: flex-end ; gap: var(--gap-sm) ;
	flex-shrink: 0 ;
}

/* ── Login Scene (split-screen like exhibitor portal) ─────── */

.login-scene {
	min-height: 100dvh ; display: grid ;
	grid-template-columns: 1fr 1fr ;
	position: relative ; z-index: 1 ;
}
.login-brand {
	background: var(--text) ; color: #fff ;
	display: flex ; flex-direction: column ; justify-content: center ;
	padding: var(--gap-2xl) ;
}
.login-logo {
	height: 8rem ; width: auto ;
	margin-inline-end: auto ; margin-bottom: var(--gap-xl) ;
	filter: invert(1) ; opacity: 0.85 ;
}
.login-brand > * { transform: translateY(-3rem) ; }
.login-brand h1 { font-size: 2rem ; margin-bottom: var(--gap-md) ; }
.login-brand p { opacity: 0.7 ; line-height: 1.6 ; }
.login-brand .accent { color: var(--accent) ; opacity: 1 ; }

.login-form-wrap {
	display: flex ; flex-direction: column ; justify-content: center ;
	padding: var(--gap-2xl) ;
}
.login-form-wrap form { max-width: 380px ; width: 100% ; }
.login-form-wrap h2 { margin-bottom: var(--gap-xl) ; }

.form-error {
	background: var(--error-bg) ; color: var(--error) ;
	padding: var(--gap-sm) var(--gap-md) ;
	border-radius: var(--radius-sm) ; font-size: 0.85rem ;
	margin-bottom: var(--gap-md) ;
	animation: slideDown 200ms var(--ease) both ;
}
.login-error {
	background: var(--error-bg) ; color: var(--error) ;
	padding: var(--gap-sm) var(--gap-md) ;
	border-radius: var(--radius-sm) ; font-size: 0.85rem ;
	margin-bottom: var(--gap-md) ;
	animation: slideDown 200ms var(--ease) both ;
}

/* ── Header ───────────────────────────────────────────────── */

.app-header {
	background: var(--surface) ; border-bottom: 1px solid var(--line) ;
	position: sticky ; top: 0 ; z-index: 100 ;
}
.app-header-inner {
	display: flex ; align-items: center ; justify-content: space-between ;
	padding: var(--gap-md) var(--gap-xl) ;
	max-width: var(--shell-max) ; margin: 0 auto ;
}
.app-header-left { display: flex ; align-items: center ; gap: var(--gap-md) ; }
.app-header-left h1 { font-size: 1.1rem ; font-weight: 600 ; }
.app-header-left .subtitle { font-size: 0.8rem ; color: var(--muted) ; margin-left: var(--gap-xs) ; }
.app-header-right { display: flex ; align-items: center ; gap: var(--gap-sm) ; flex-direction: row-reverse ; }
.app-header-right .lang-toggle { flex-shrink: 0 ; }

.lang-toggle {
	display: inline-flex ; border-radius: var(--radius-sm) ;
	border: 1px solid var(--line) ; overflow: hidden ;
}
.lang-toggle-btn {
	width: 36px ; padding: 4px 0 ; border: none ; background: transparent ;
	font-family: var(--font) ; font-size: 0.8rem ; font-weight: 600 ;
	cursor: pointer ; color: var(--muted) ; text-align: center ;
	transition: background var(--duration) var(--ease), color var(--duration) var(--ease) ;
}
.lang-toggle-btn:hover { color: var(--text) ; }
.lang-toggle-btn.active {
	background: var(--accent) ; color: #fff ;
}

/* ── Dashboard ────────────────────────────────────────────── */

.dashboard { padding: var(--gap-xl) 0 ; }
.dashboard-grid {
	display: grid ; grid-template-columns: 2fr 1fr ; gap: var(--gap-lg) ;
}

.action-list, .action-items { display: flex ; flex-direction: column ; gap: var(--gap-sm) ; }
.action-item {
	display: flex ; align-items: center ; gap: var(--gap-md) ;
	padding: var(--gap-md) var(--gap-lg) ;
	background: var(--warn-bg) ; border: 1px solid var(--warn-border) ;
	border-radius: var(--radius-sm) ; cursor: pointer ;
	transition: all var(--duration) var(--ease) ;
	animation: slideUp 300ms var(--ease) both ;
}
.action-item:hover { transform: translateX(4px) ; box-shadow: var(--shadow-sm) ; }
.action-item .action-icon { font-size: 1.2rem ; flex-shrink: 0 ; }
.action-item .action-text { flex: 1 ; font-size: 0.9rem ; font-weight: 500 ; }
.action-item .action-arrow { color: var(--muted) ; font-size: 0.9rem ; }

.action-item.done {
	background: var(--ok-bg) ; border-color: var(--ok-border) ;
	cursor: default ;
}
.action-item.done .action-text { color: var(--ok) ; }

.action-item.action-show-all {
	background: transparent ; border: 1px dashed var(--border) ;
	justify-content: center ;
}
.action-item.action-show-all .action-text {
	flex: 0 1 auto ; color: var(--muted) ; font-weight: 500 ;
}
.action-item.action-show-all:hover {
	background: var(--bg-soft, rgba(0,0,0,0.02)) ; transform: none ;
}
.action-item.action-show-all:hover .action-text { color: var(--text) ; }

/* ── Dashboard config blocks (right column) ───────────── */

.dashboard-config { display: flex ; flex-direction: column ; gap: var(--gap-sm) ; }
.dash-config-block-header {
	display: flex ; align-items: center ; justify-content: space-between ;
	margin-top: var(--gap-sm) ;
}
.dash-config-block-header:first-child { margin-top: 0 ; }
.dash-config-block-header h2 { margin: 0 ; }
.dash-config-card {
	background: var(--surface) ; border: 1px solid var(--line) ;
	border-radius: var(--radius) ; padding: var(--gap-lg) ;
}
.dash-config-year {
	font-size: 4rem ; font-weight: 700 ; color: var(--accent) ; line-height: 1.1 ;
}
.dash-config-sections { display: flex ; flex-direction: column ; gap: var(--gap-xs) ; }
.dash-config-section {
	display: flex ; justify-content: space-between ; align-items: center ;
	padding: var(--gap-xs) 0 ;
}
.dash-config-section-name { font-size: 0.85rem ; color: var(--muted) ; }
.dash-config-section-price { font-size: 0.95rem ; font-weight: 600 ; font-variant-numeric: tabular-nums ; }
.dash-config-deadlines { display: flex ; flex-direction: column ; gap: 0 ; }
.dash-config-deadline {
	display: flex ; align-items: center ; gap: var(--gap-sm) ;
	padding: var(--gap-xs) 0 ; font-size: 0.85rem ;
}
.dash-config-deadline-sub { padding-top: 0 ; }
.dash-config-deadline-sub .dash-config-deadline-amount { font-size: 0.78rem ; color: var(--muted) ; font-weight: 400 ; }
.dash-config-deadline-date { font-weight: 600 ; min-width: 78px ; }
.dash-config-deadline-label { flex: 1 ; color: var(--muted) ; }
.dash-config-deadline-amount { font-weight: 500 ; font-variant-numeric: tabular-nums ; white-space: nowrap ; }

/* ── Flag buttons ────────────────────────────────────────── */

.flag-btn {
	width: 30px ; height: 30px ; border-radius: 50% ;
	display: inline-flex ; align-items: center ; justify-content: center ;
	border: 2px solid var(--line) ; background: var(--surface) ;
	cursor: pointer ; font-size: 0.75rem ; font-weight: 700 ;
	transition: all var(--duration) var(--ease) ;
	color: var(--muted) ;
}
.cell-center { text-align: center !important ; }
.flag-btn:hover { border-color: var(--accent) ; color: var(--accent) ; }
.flag-btn.active { border-color: var(--accent) ; background: var(--accent) ; color: #fff ; }

/* ── Flag cards (presse/catalogue/site/vetting) ──────────── */

.flag-cards {
	display: flex ; flex-wrap: wrap ; gap: var(--gap-sm) ;
}
.flag-card {
	display: flex ; align-items: center ; gap: var(--gap-sm) ;
	padding: 8px 16px ; border: 2px solid var(--line) ;
	border-radius: var(--radius) ; cursor: pointer ;
	background: var(--surface) ;
	transition: all var(--duration) var(--ease) ;
	user-select: none ;
}
.flag-card:hover { border-color: var(--accent-border) ; }
.flag-card input[type="checkbox"] { display: none ; }
.flag-card-letter {
	width: 28px ; height: 28px ; border-radius: 50% ;
	display: flex ; align-items: center ; justify-content: center ;
	font-size: 0.75rem ; font-weight: 700 ;
	border: 2px solid var(--line) ; color: var(--muted) ;
	background: var(--bg) ;
	transition: all var(--duration) var(--ease) ;
}
.flag-card-label { font-size: 0.9rem ; font-weight: 500 ; }
.flag-card.active {
	border-color: var(--accent) ; background: var(--accent-light) ;
}
.flag-card.active .flag-card-letter {
	border-color: var(--accent) ; background: var(--accent) ; color: #fff ;
}

/* ── Ownership radios ────────────────────────────────────── */

.ownership-radios {
	display: flex ; flex-wrap: wrap ; gap: var(--gap-sm) ;
}
.ownership-radio {
	display: flex ; align-items: center ; gap: var(--gap-sm) ;
	padding: 8px 16px ; border: 2px solid var(--line) ;
	border-radius: var(--radius) ; cursor: pointer ;
	background: var(--surface) ; flex: 1 ;
	transition: all var(--duration) var(--ease) ;
}
.ownership-radio:hover { border-color: var(--accent-border) ; }
.ownership-radio input[type="radio"] { display: none ; }
.ownership-radio span { font-size: 0.9rem ; font-weight: 500 ; }
.ownership-radio.active {
	border-color: var(--accent) ; background: var(--accent-light) ;
	color: var(--accent) ;
}
.ownership-radio-disabled {
	opacity: 0.4 ; cursor: not-allowed ; pointer-events: none ;
}

/* ── Empty state ──────────────────────────────────────────── */

.empty-state, .empty {
	display: flex ; flex-direction: column ; align-items: center ; justify-content: center ;
	padding: var(--gap-2xl) var(--gap-xl) ;
	background: var(--surface) ; border: 2px dashed var(--line) ;
	border-radius: var(--radius) ; text-align: center ;
	animation: fadeIn 300ms var(--ease) both ;
	color: var(--muted) ; font-size: 0.95rem ;
}
.empty-state-icon { margin-bottom: var(--gap-md) ; opacity: 0.4 ; }

/* ── Rich Editor ──────────────────────────────────────────── */

.rich-editor { border: 1px solid var(--line) ; border-radius: var(--radius-sm) ; overflow: hidden ; }
.rich-editor:focus-within { border-color: var(--accent) ; box-shadow: 0 0 0 3px var(--accent-light) ; }

.rich-toolbar {
	display: flex ; align-items: center ; gap: 2px ;
	padding: 4px 6px ; background: var(--bg) ; border-bottom: 1px solid var(--line) ;
}
.rich-toolbar button {
	display: flex ; align-items: center ; justify-content: center ;
	width: 30px ; height: 28px ; border: none ; border-radius: 4px ;
	background: transparent ; cursor: pointer ; font-size: 0.85rem ;
	color: var(--text) ; transition: all 120ms var(--ease) ;
}
.rich-toolbar button:hover { background: rgba(0, 0, 0, 0.08) ; }
.rich-toolbar button.active { background: var(--accent-light) ; color: var(--accent) ; }
.rich-toolbar .sep { width: 1px ; height: 20px ; background: var(--line) ; margin: 0 4px ; }

.rich-content {
	padding: 10px 12px ; min-height: 120px ; outline: none ;
	font-family: var(--font) ; font-size: 0.9rem ; line-height: 1.6 ;
	color: var(--text) ;
}
.rich-toolbar button.re-sub,
.rich-toolbar button.re-sup { position: relative ; font-size: 0.9rem ; line-height: 1 ; }
.rich-toolbar button.re-sub span,
.rich-toolbar button.re-sup span { position: absolute ; font-size: 0.55em ; font-weight: 700 ; }
.rich-toolbar button.re-sub span { bottom: 3px ; right: 4px ; }
.rich-toolbar button.re-sup span { top: 3px ; right: 4px ; }

.re-counter {
	margin-inline-start: auto ; font-size: 0.72rem ; color: var(--muted) ; padding: 0 6px ;
	white-space: nowrap ; font-variant-numeric: tabular-nums ;
}
.re-counter-warn { color: var(--accent) ; font-weight: 600 ; }
.re-counter-over { color: var(--error) ; font-weight: 700 ; }

.rich-content:empty::before {
	content: attr(data-placeholder) ; color: var(--muted) ; opacity: 0.6 ;
}
.rich-content p { margin-bottom: 0.6em ; }
.rich-content ul, .rich-content ol { margin-left: 1.5em ; margin-bottom: 0.6em ; }
.rich-content a { color: var(--accent) ; }

/* ── Image / File uploader ────────────────────────────────── */

.upload-zone {
	border: 2px dashed var(--line) ; border-radius: var(--radius) ;
	padding: var(--gap-xl) ; text-align: center ; cursor: pointer ;
	transition: all var(--duration) var(--ease) ;
	color: var(--muted) ; font-size: 0.9rem ;
}
.upload-zone:hover, .upload-zone.dragover {
	border-color: var(--accent) ; background: var(--accent-light) ; color: var(--accent) ;
}
.upload-zone .upload-icon { font-size: 2rem ; margin-bottom: var(--gap-sm) ; }
.upload-zone .upload-preview { max-width: 200px ; max-height: 150px ; border-radius: var(--radius-sm) ; object-fit: cover ; }
.upload-zone .news-img-preview { display: inline-block ; margin-bottom: var(--gap-sm) ; }
.upload-zone .upload-input { display: none ; }

.media-grid { display: grid ; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) ; gap: var(--gap-md) ; }
.media-item {
	border: 1px solid var(--line) ; border-radius: var(--radius-sm) ;
	overflow: hidden ; background: var(--surface) ;
}
.media-item img { width: 100% ; height: 130px ; object-fit: cover ; background: var(--bg) ; }
.media-item-info { padding: var(--gap-sm) ; }
.media-item-info input { font-size: 0.8rem ; padding: 5px 8px ; margin-bottom: 4px ; }

/* ── Toast ────────────────────────────────────────────────── */

.toast-container {
	position: fixed ; bottom: var(--gap-xl) ; right: var(--gap-xl) ; z-index: 2000 ;
	display: flex ; flex-direction: column ; gap: var(--gap-sm) ;
}
.toast {
	padding: var(--gap-md) var(--gap-lg) ;
	border-radius: var(--radius-sm) ; box-shadow: var(--shadow-lg) ;
	font-size: 0.9rem ; font-weight: 500 ;
	animation: toast 3s var(--ease) both ;
}
.toast-ok { background: var(--ok) ; color: #fff ; }
.toast-error { background: var(--error) ; color: #fff ; }

/* ── Loading ──────────────────────────────────────────────── */

.spinner {
	width: 20px ; height: 20px ; border: 2px solid var(--line) ;
	border-top-color: var(--accent) ; border-radius: 50% ;
	animation: spin 600ms linear infinite ;
}
.spinner-sm { width: 14px ; height: 14px ; }
.loading-overlay {
	position: absolute ; inset: 0 ; background: rgba(255, 255, 255, 0.7) ;
	display: flex ; align-items: center ; justify-content: center ;
	z-index: 10 ; border-radius: inherit ;
}

/* ── Stats ────────────────────────────────────────────────── */

.stat-chips { display: flex ; flex-wrap: wrap ; gap: var(--gap-sm) ; margin-bottom: var(--gap-lg) ; }
.stat-chip {
	display: flex ; align-items: center ; gap: var(--gap-sm) ;
	padding: 6px 14px ; border-radius: var(--radius-pill) ;
	font-size: 0.8rem ; font-weight: 500 ;
	background: var(--surface) ; border: 1px solid var(--line) ;
}
.stat-chip .stat-val, .stat-chip .stat-value { font-weight: 700 ; color: var(--accent) ; }
.stat-chip .stat-icon { display: flex ; align-items: center ; color: var(--muted) ; }
.stat-chip .stat-icon svg { vertical-align: middle ; }
.stat-chip .stat-label { color: var(--muted) ; }

/* ── Tag Selector (tom-select style) ─────────────────────── */

.ts-wrap { position: relative ; }
.ts-control {
	display: flex ; flex-wrap: wrap ; align-items: center ; gap: 4px ;
	padding: 5px 8px ; min-height: 40px ;
	border: 1px solid var(--line) ; border-radius: var(--radius-sm) ;
	background: var(--surface) ; cursor: text ;
	transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease) ;
}
.ts-control:focus-within {
	border-color: var(--accent) ;
	box-shadow: 0 0 0 3px var(--accent-light) ;
}
.ts-chip {
	display: inline-flex ; align-items: center ; gap: 3px ;
	padding: 2px 8px ; border-radius: var(--radius-sm) ;
	background: var(--accent-light) ; color: var(--accent) ;
	font-size: 0.8rem ; font-weight: 500 ;
	animation: chipPop 200ms var(--ease-spring) both ;
}
.ts-chip-x {
	display: inline-flex ; align-items: center ; justify-content: center ;
	width: 16px ; height: 16px ; border-radius: var(--radius-sm) ;
	background: transparent ; border: none ; cursor: pointer ;
	color: var(--accent) ; font-size: 14px ; line-height: 1 ;
	transition: background var(--duration) var(--ease) ;
}
.ts-chip-x:hover { background: rgba(239, 123, 11, 0.2) ; }
.ts-input {
	flex: 1 ; min-width: 60px ; border: none !important ; outline: none ;
	font-family: var(--font) ; font-size: 0.85rem ;
	background: transparent ; color: var(--text) ;
	padding: 2px 4px ; border-radius: 0 ;
	box-shadow: none !important ; width: auto ;
}
.ts-input:focus { border: none !important ; box-shadow: none !important ; }
.ts-input::placeholder { color: var(--muted) ; opacity: 0.6 ; }
country-selector .ts-control, option-selector .ts-control { min-height: 0 ; padding: 0 ; border: none ; box-shadow: none !important ; }
country-selector .ts-input, option-selector .ts-input { padding: 9px 12px ; border: 1px solid var(--line) !important ; border-radius: var(--radius-sm) ; font-size: 0.9rem ; }
country-selector .ts-input:focus, option-selector .ts-input:focus { border-color: var(--accent) !important ; box-shadow: 0 0 0 3px var(--accent-light) !important ; }
.ts-dropdown {
	position: fixed ; z-index: 2000 ;
	background: var(--surface) ; border: 1px solid var(--line) ;
	border-radius: var(--radius-sm) ; box-shadow: var(--shadow-lg) ;
	max-height: 220px ; overflow-y: auto ;
	animation: slideDown 120ms var(--ease) both ;
}
.ts-dropdown.hidden { display: none ; }
.ts-option {
	padding: 7px 12px ; cursor: pointer ; font-size: 0.85rem ;
	transition: background 80ms var(--ease) ;
}
.ts-option:hover, .ts-option.ts-highlight {
	background: var(--accent-light) ; color: var(--accent) ;
}
.ts-option mark { background: rgba(239, 123, 11, 0.25) ; color: inherit ; border-radius: 2px ; padding: 0 1px ; }
.ts-option-sub { font-size: 0.7rem ; color: var(--muted) ; margin-left: 6px ; }
.ts-no-results { padding: 10px 12px ; font-size: 0.85rem ; color: var(--muted) ; text-align: center ; }

/* ── Bilingual Input ──────────────────────────────────────── */

.bl-wrap { position: relative ; }
.bl-label {
	display: block ; font-size: 0.85rem ; font-weight: 500 ;
	margin-bottom: var(--gap-xs) ; color: var(--text) ;
}
.bl-header {
	display: flex ; align-items: center ; gap: 0 ;
}
.bl-tab {
	padding: 5px 14px ; border: 1px solid var(--line) ;
	border-bottom: none ; background: var(--bg) ;
	font-family: var(--font) ; font-size: 0.75rem ; font-weight: 700 ;
	cursor: pointer ; color: var(--muted) ;
	border-radius: var(--radius-sm) var(--radius-sm) 0 0 ;
	transition: background var(--duration) var(--ease), color var(--duration) var(--ease), border-color var(--duration) var(--ease) ;
	position: relative ; top: 1px ; z-index: 1 ;
}
.bl-tab + .bl-tab { margin-left: -1px ; }
.bl-tab.active {
	background: var(--surface) ; color: var(--accent) ;
	border-color: var(--line) ;
}
.bl-tab:not(.active) {
	background: var(--line) ; color: var(--muted) ;
	border-color: var(--line) ;
}
.bl-tab:not(.active):hover { color: var(--text) ; background: #d6d3cf ; }
.bl-dots {
	display: flex ; align-items: center ; gap: 4px ;
	margin-left: 8px ;
}
.bl-dot {
	width: 6px ; height: 6px ; border-radius: 50% ;
	background: var(--line) ;
	transition: background var(--duration) var(--ease) ;
}
.bl-dot.filled { background: var(--accent) ; }
.bl-body {
	border: 1px solid var(--line) ; border-radius: 0 var(--radius-sm) var(--radius-sm) var(--radius-sm) ;
	background: var(--surface) ;
	transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease) ;
}
.bl-body:focus-within {
	border-color: var(--accent) ;
	box-shadow: 0 0 0 3px var(--accent-light) ;
}
.bl-wrap:focus-within .bl-tab.active { border-color: var(--accent) ; }
.bl-pane { }
.bl-pane.hidden { display: none ; }
.bl-pane input,
.bl-pane textarea {
	width: 100% ; border: none ; outline: none ; background: transparent ;
	padding: 9px 12px ; font-family: var(--font) ; font-size: 0.9rem ; color: var(--text) ;
}
.bl-pane textarea { resize: vertical ; min-height: 80px ; line-height: 1.5 ; }
.bl-pane input::placeholder,
.bl-pane textarea::placeholder { color: var(--muted) ; opacity: 0.7 ; }
.bl-pane .rich-editor { border: none ; border-radius: 0 ; }
.bl-pane .rich-editor:focus-within { box-shadow: none ; }
.bl-required { color: var(--error) ; font-weight: 700 ; }

/* ── Mandatory field indicator ───────────────────────────── */

.required-mark { color: var(--error) ; font-weight: 700 ; }

/* ── Date Picker ──────────────────────────────────────────── */

date-picker { display: block ; }
.dp-wrap { position: relative ; }
.dp-input-wrap {
	position: relative ; display: flex ; align-items: center ;
	cursor: pointer ;
}
.dp-display {
	width: 100% ; cursor: pointer ;
	padding-right: 2.2rem ;
}
.dp-icon {
	position: absolute ; right: 10px ; top: 50% ; transform: translateY(-50%) ;
	pointer-events: none ; color: var(--muted) ;
}
.dp-calendar {
	position: fixed ;
	z-index: 2000 ; width: 280px ;
	background: var(--surface) ; border: 1px solid var(--line) ;
	border-radius: var(--radius) ; box-shadow: var(--shadow-lg) ;
	padding: var(--gap-sm) ;
	animation: slideUp 150ms var(--ease) both ;
}
.dp-header {
	display: flex ; align-items: center ; justify-content: space-between ;
	padding: var(--gap-xs) 0 ;
}
.dp-month-year { font-weight: 600 ; font-size: 0.9rem ; }
.dp-nav {
	background: none ; border: none ; cursor: pointer ; padding: 4px 6px ;
	border-radius: var(--radius-sm) ; color: var(--text) ;
	display: flex ; align-items: center ; justify-content: center ;
}
.dp-nav:hover { background: var(--accent-light) ; }
.dp-days-header {
	display: grid ; grid-template-columns: repeat(7, 1fr) ;
	text-align: center ; font-size: 0.7rem ; font-weight: 600 ;
	color: var(--muted) ; padding: var(--gap-xs) 0 ;
}
.dp-grid {
	display: grid ; grid-template-columns: repeat(7, 1fr) ;
	gap: 2px ;
}
.dp-day {
	display: flex ; align-items: center ; justify-content: center ;
	width: 34px ; height: 34px ; margin: 0 auto ;
	border-radius: 50% ; font-size: 0.82rem ; cursor: pointer ;
	transition: background var(--duration) var(--ease), color var(--duration) var(--ease) ;
}
.dp-day:hover { background: var(--accent-light) ; }
.dp-day.dp-empty { cursor: default ; }
.dp-day.dp-today { font-weight: 700 ; border: 1.5px solid var(--accent) ; }
.dp-day.dp-selected { background: var(--accent) ; color: white ; font-weight: 600 ; }
.dp-day.dp-selected:hover { background: var(--accent-hover) ; }
.dp-day.dp-disabled { opacity: 0.25 ; cursor: not-allowed ; pointer-events: none ; }

/* ── Time Input ──────────────────────────────────────────── */

time-input { display: block ; }
.ti-wrap { position: relative ; }
.ti-wrap .ti-display { padding-right: 2.2rem ; }
.ti-icon {
	position: absolute ; right: 10px ; top: 50% ; transform: translateY(-50%) ;
	pointer-events: none ; color: var(--muted) ;
}

/* ── Messages panel (exhibitor dashboard) ────────────────── */

.messages-panel { display: flex ; flex-direction: column ; gap: var(--gap-sm) ; }
.message-card .msg-date { font-size: 0.75rem ; color: var(--muted) ; margin-bottom: 2px ; }
.message-card .msg-title { font-weight: 600 ; font-size: 0.9rem ; margin-bottom: 4px ; }
.message-card .msg-body { font-size: 0.85rem ; color: var(--muted) ; line-height: 1.5 ; }

/* ── Works list ───────────────────────────────────────────── */

.works-grid { display: flex ; flex-direction: column ; gap: var(--gap-sm) ; }

.work-row {
	display: grid ;
	grid-template-columns: 64px 1fr 38px 38px 30px 30px 30px 30px 60px 24px 36px 36px ;
	align-items: center ; gap: var(--gap-md) ;
	padding: var(--gap-md) var(--gap-lg) ;
	background: var(--surface) ; border: 1px solid var(--line) ;
	border-radius: var(--radius-sm) ;
	transition: all var(--duration) var(--ease) ;
	animation: slideUp 300ms var(--ease) both ;
}
.work-row:hover { box-shadow: var(--shadow-md) ; border-color: var(--accent-border) ; }

.work-thumb {
	width: 64px ; height: 64px ; border-radius: var(--radius-sm) ;
	object-fit: cover ; background: var(--bg) ;
}
.work-thumb-empty {
	width: 64px ; height: 64px ; border-radius: var(--radius-sm) ;
	background: var(--bg) ; display: flex ; align-items: center ; justify-content: center ;
	color: var(--muted) ; font-size: 1.4rem ;
}

.work-info { min-width: 0 ; }
.work-title { font-weight: 600 ; font-size: 0.9rem ; white-space: nowrap ; overflow: hidden ; text-overflow: ellipsis ; }
.work-tags { margin-top: 2px ; }

.work-stat {
	display: flex ; align-items: center ; justify-content: center ; gap: 3px ;
	font-size: 0.8rem ; color: var(--muted) ; white-space: nowrap ;
}

.work-owner {
	font-size: 0.7rem ; font-weight: 500 ; color: var(--muted) ;
	text-align: center ; white-space: nowrap ;
}

.work-sale {
	display: flex ; align-items: center ; justify-content: center ;
	color: var(--ok) ;
}
.work-sale.inactive { color: var(--line) ; }

.work-edit-btn {
	background: none ; border: none ; cursor: pointer ; color: var(--muted) ;
	padding: 4px ; border-radius: var(--radius-sm) ;
	transition: color var(--duration) var(--ease) ;
}
.work-edit-btn:hover { color: var(--accent) ; }

.work-delete-btn {
	background: none ; border: none ; cursor: pointer ; color: var(--muted) ;
	padding: 4px ; border-radius: var(--radius-sm) ;
	transition: color var(--duration) var(--ease) ;
}
.work-delete-btn:hover { color: var(--error) ; }

/* ── Section radio group ──────────────────────────────────── */

.section-radio-group { display: flex ; flex-direction: column ; gap: var(--gap-sm) ; }
.section-radio {
	display: flex ; align-items: center ; gap: var(--gap-md) ;
	padding: var(--gap-md) var(--gap-lg) ;
	border: 2px solid var(--line) ; border-radius: var(--radius) ;
	cursor: pointer ; transition: all var(--duration) var(--ease) ;
	background: var(--surface) ;
}
.section-radio:hover { border-color: var(--accent-border) ; }
.section-radio.active { border-color: var(--accent) ; background: var(--accent-light) ; }
.section-radio-dot {
	width: 20px ; height: 20px ; border-radius: 50% ;
	border: 2px solid var(--line) ; flex-shrink: 0 ;
	position: relative ; transition: all var(--duration) var(--ease) ;
}
.section-radio.active .section-radio-dot { border-color: var(--accent) ; }
.section-radio.active .section-radio-dot::after {
	content: '' ; position: absolute ; inset: 3px ;
	border-radius: 50% ; background: var(--accent) ;
	animation: chipPop 200ms var(--ease-spring) both ;
}
.section-radio-content { flex: 1 ; display: flex ; flex-direction: column ; }
.section-radio-content strong { font-size: 0.95rem ; }
.section-radio-price { font-weight: 700 ; font-size: 1rem ; color: var(--accent) ; white-space: nowrap ; }

/* ── Events sub-form ──────────────────────────────────────── */

.event-block {
	border: 1px solid var(--line) ; border-radius: var(--radius) ;
	padding: var(--gap-lg) ; margin-bottom: var(--gap-lg) ;
	background: var(--bg) ;
	display: flex ; flex-direction: column ; gap: var(--gap-md) ;
	animation: slideUp 300ms var(--ease) both ;
}
.event-block > .field,
.event-block > .field-row,
.event-block > bilingual-input,
.event-block > .flag-cards { margin-bottom: 0 ; }
.event-block-header {
	display: flex ; align-items: center ; justify-content: space-between ;
}
.event-block-header h3 { font-size: 0.95rem ; }

/* ── Dynamic lists (phones, emails, addresses) ────────────── */

.dyn-list { display: flex ; flex-direction: column ; gap: var(--gap-sm) ; }
.dyn-row {
	display: flex ; align-items: center ; gap: var(--gap-sm) ;
	padding: var(--gap-md) ;
	border: 1px solid var(--line) ; border-radius: var(--radius-sm) ;
	background: var(--bg) ;
	animation: slideUp 200ms var(--ease) both ;
}
.dyn-row .dyn-fields { flex: 1 ; display: grid ; grid-template-columns: 1fr 1fr 1fr ; gap: var(--gap-sm) ; }
.dyn-row .dyn-fields-2 { flex: 1 ; display: grid ; grid-template-columns: 1fr 1fr ; gap: var(--gap-sm) ; }
.dyn-row textarea { min-height: 50px ; }

/* ── Contact list ────────────────────────────────────────── */

.cl-list { display: flex ; flex-direction: column ; gap: var(--gap-xs) ; }

/* Row variant (phone, email): single flex line */
.cl-row {
	display: flex ; align-items: center ;
	border: 1px solid var(--line) ; border-radius: var(--radius-sm) ;
	background: var(--surface) ;
	transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease) ;
}
.cl-row:focus-within { border-color: var(--accent) ; box-shadow: 0 0 0 2px var(--accent-light) ; }
.cl-row input.cl-main,
.cl-row input.cl-main[type="tel"],
.cl-row input.cl-main[type="email"] {
	flex: 6 ; min-width: 0 ;
	border: none ; border-radius: var(--radius-sm) 0 0 var(--radius-sm) ;
	outline: none ; box-shadow: none ; background: transparent ;
	padding: 9px 10px ; font-family: var(--font) ; font-size: 0.9rem ; color: var(--text) ;
}
.cl-row input.cl-main:focus { box-shadow: none ; }
.cl-row .cl-main::placeholder { color: var(--muted) ; opacity: 0.6 ; }

/* Shared label + action styles */
input.cl-lbl, input.cl-lbl[type="text"] {
	flex: 1 ; min-width: 0 ; max-width: 5em ; width: auto ;
	border: none ; outline: none ; box-shadow: none ; background: transparent ;
	padding: 0 6px ; font-size: 0.75rem ; color: var(--muted) ;
	font-family: var(--font) ; text-align: start ; border-radius: 0 ;
}
input.cl-lbl:focus { color: var(--text) ; box-shadow: none ; border: none ; }
input.cl-lbl::placeholder { color: var(--muted) ; opacity: 0.35 ; font-weight: 600 ; }
.cl-act {
	flex: none ; width: 28px ; display: flex ; align-items: center ; justify-content: center ;
	border: none ; background: transparent ; cursor: pointer ; padding: 0 ;
	color: var(--muted) ;
}
.cl-act-add { color: var(--accent) ; width: 36px ; }
.cl-act-ghost { visibility: hidden ; }

/* Address variant — textarea with overlay labels */
.cl-row-addr {
	position: relative ; display: block ;
}
.cl-row-addr textarea.cl-main-addr,
.cl-row-addr textarea.cl-main-addr[type="textarea"] {
	width: 100% ; border: none ; border-radius: var(--radius-sm) ;
	outline: none ; box-shadow: none ; background: transparent ;
	padding: 9px 10px ; padding-right: 12em ;
	font-family: var(--font) ; font-size: 0.9rem ; color: var(--text) ;
	resize: vertical ; min-height: 64px ; display: block ;
}
.cl-row-addr textarea.cl-main-addr:focus { box-shadow: none ; }
.cl-row-addr textarea.cl-main-addr::placeholder { color: var(--muted) ; opacity: 0.6 ; }
.cl-row-overlay {
	position: absolute ; top: 0 ; right: 0 ;
	display: flex ; align-items: center ; height: 36px ;
}

/* ── File item ───────────────────────────────────────────── */

.file-item {
	display: flex ; align-items: center ; gap: var(--gap-md) ;
	padding: var(--gap-sm) var(--gap-md) ;
	border: 1px solid var(--line) ; border-radius: var(--radius-sm) ;
	margin-bottom: var(--gap-sm) ;
}
.file-item .file-name { font-size: 0.85rem ; font-weight: 500 ; flex: 1 ; min-width: 0 ; overflow: hidden ; text-overflow: ellipsis ; white-space: nowrap ; }

/* ── Skeleton loading ────────────────────────────────────── */

.skeleton {
	background: linear-gradient(90deg, var(--bg) 25%, rgba(0, 0, 0, 0.04) 50%, var(--bg) 75%) ;
	background-size: 200% 100% ;
	animation: pulse 1.5s ease-in-out infinite ;
	border-radius: var(--radius-sm) ;
}

/* ═════════════════════════════════════════════════════════════
   ADMIN-SPECIFIC STYLES
   ═════════════════════════════════════════════════════════════ */

/* ── Section toolbar (matches exhibitor pattern) ─────────── */

.section-bar {
	display: flex ; align-items: center ; gap: var(--gap-sm) ;
	padding: var(--gap-md) 0 ; flex-wrap: wrap ;
}
.toolbar-spacer { flex: 1 ; }

.works-section { padding-bottom: var(--gap-2xl) ; }

/* Inline sections (works, events, news below toolbar) */
.inline-section {
	padding: var(--gap-lg) 0 ; border-top: 1px solid var(--line) ;
}
.inline-section h2 { margin-bottom: var(--gap-md) ; }
.section-header-row { display: flex ; align-items: center ; justify-content: space-between ; gap: var(--gap-sm) ; margin-bottom: var(--gap-md) ; }
.section-header-row .toolbar-spacer { flex: 1 ; }
.section-header-row h2 { margin-bottom: 0 ; }
.inline-section:last-child { padding-bottom: var(--gap-2xl) ; }

/* ── Modal list header (add button inside list modal) ────── */

.modal-list-header {
	display: flex ; align-items: center ; justify-content: flex-end ;
	gap: var(--gap-sm) ; margin-bottom: var(--gap-md) ;
}

/* ── List search input ──────────────────────────────────── */

.list-search {
	padding: 0 12px ; border: 1px solid var(--line) ;
	border-radius: var(--radius-sm) ; font-family: var(--font) ;
	font-size: 0.8rem ; line-height: 1 ; color: var(--text) ; background: var(--surface) ;
	outline: none ; width: 160px ; max-width: 160px ; flex: 0 0 160px ; box-sizing: border-box ;
	height: 26px ; order: 99 ;
	transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease), width var(--duration) var(--ease), max-width var(--duration) var(--ease), flex-basis var(--duration) var(--ease) ;
}
.list-search:focus {
	border-color: var(--accent) ;
	box-shadow: 0 0 0 3px var(--accent-light) ;
	width: 220px ; max-width: 220px ; flex: 0 0 220px ;
}
.list-search::placeholder { color: var(--muted) ; opacity: 0.6 ; }

/* ── Admin Section Layout ────────────────────────────────── */

.admin-section {
	padding: var(--gap-xl) 0 ;
	border-bottom: 1px solid var(--line) ;
}
.admin-section:last-child { border-bottom: none ; }

.section-header {
	display: flex ; align-items: center ; justify-content: space-between ;
	margin-bottom: var(--gap-lg) ;
}
.section-header h2 { margin: 0 ; }

/* ── Data Tables ─────────────────────────────────────────── */

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

.table, .data-table {
	width: 100% ; border-collapse: collapse ;
	font-size: 0.85rem ;
}
.table th, .data-table th {
	text-align: left ; padding: var(--gap-sm) var(--gap-md) ;
	font-weight: 600 ; font-size: 0.75rem ; text-transform: uppercase ;
	letter-spacing: 0.03em ; color: var(--muted) ;
	border-bottom: 2px solid var(--line) ;
	white-space: nowrap ;
}
.table td, .data-table td {
	padding: var(--gap-sm) var(--gap-md) ;
	border-bottom: 1px solid var(--line) ;
	vertical-align: middle ;
}
.table tbody tr:last-child td, .data-table tbody tr:last-child td { border-bottom: none ; }
.table tbody tr:hover, .data-table tbody tr:hover {
	background: var(--accent-light) ;
}
.table code, .data-table code {
	font-family: var(--font-mono) ; font-size: 0.8rem ;
	padding: 2px 6px ; background: var(--bg) ;
	border-radius: 3px ;
}

.actions-cell {
	display: flex ; gap: var(--gap-xs) ; align-items: center ; flex-wrap: nowrap ; white-space: nowrap ;
}

.dots-cell { white-space: nowrap ; }

/* ── Exhibitor table specifics ───────────────────────────── */

.ex-name { font-weight: 600 ; font-size: 0.85rem ; max-width: 20rem ; white-space: nowrap ; overflow: hidden ; text-overflow: ellipsis ; }
.ex-sub { font-size: 0.75rem ; color: var(--muted) ; max-width: 28rem ; white-space: nowrap ; overflow: hidden ; text-overflow: ellipsis ; }

/* Column sizing for the exhibitors table */
.table-exhibitors .ex-col-actions { width: 1% ; white-space: nowrap ; min-width: 156px ; }

.ex-counts { display: flex ; align-items: center ; gap: var(--gap-xs) ; }
.count-badge {
	display: inline-flex ; align-items: center ; justify-content: center ;
	min-width: 22px ; height: 22px ; border-radius: 50% ;
	background: var(--accent) ; color: #fff ;
	font-size: 0.7rem ; font-weight: 700 ; padding: 0 4px ;
}
.count-badge-muted { background: var(--line) ; color: var(--muted) ; }
.count-badge-link { cursor: pointer ; border: none ; transition: opacity 0.15s ; position: relative ; }
.count-badge-link:hover { opacity: 0.75 ; }
.thumb-tooltip {
	display: none ; position: absolute ;
	right: calc(100% + 8px) ;
	top: 50% ; margin-top: -44px ;
	box-sizing: border-box ;
	width: 88px ; height: 88px ;
	background: var(--surface) ;
	border: 1px solid var(--line) ;
	border-radius: var(--radius) ;
	padding: 4px ;
	box-shadow: 0 4px 12px rgba(0,0,0,0.15) ; z-index: 100 ;
	pointer-events: none ; flex-shrink: 0 ;
}
.thumb-tooltip img {
	display: block ;
	width: 78px ; height: 78px ;
	object-fit: cover ;
	border-radius: 4px ;
}
.count-badge-link:hover .thumb-tooltip { display: block ; }
.count-badge-ok { background: var(--ok) ; color: #fff ; border-radius: var(--radius-sm) ; font-size: 0.65rem ; padding: 0 6px ; }
.count-badge-warn { background: var(--warn) ; color: #fff ; border-radius: var(--radius-sm) ; font-size: 0.65rem ; padding: 0 6px ; }

.group-row td {
	padding: var(--gap-md) var(--gap-md) var(--gap-xs) ;
	border-bottom: none ;
	background: var(--bg) ;
}

.amount { font-variant-numeric: tabular-nums ; }

/* ── Dots (confirmation indicators) ──────────────────────── */

.dot-green { display: inline-block ; width: 8px ; height: 8px ; border-radius: 50% ; background: var(--accent) ; }
.dot-grey { display: inline-block ; width: 8px ; height: 8px ; border-radius: 50% ; background: var(--line) ; }
.dots-cell { display: flex ; gap: var(--gap-xs) ; align-items: center ; }
.dots-cell:has(.dot-btn) { gap: 0 ; }

.dot-btn {
	background: none ; border: 0 ; padding: 2px ; margin: 0 ;
	cursor: pointer ; border-radius: 50% ;
	display: inline-flex ; align-items: center ; justify-content: center ;
	transition: background var(--duration) var(--ease) ;
}
.dot-btn:hover { background: var(--bg-soft, rgba(0,0,0,0.06)) ; }
.dot-btn:hover .dot-grey, .dot-btn:hover .dot-green { transform: scale(1.2) ; }
.dot-btn:focus-visible { outline: 2px solid var(--accent) ; outline-offset: 1px ; }

/* ── Exhibitor view (read-only modal) ────────────────────── */

.exhibitor-view fieldset.fieldset { scroll-margin-top: var(--gap-md) ; margin-bottom: 0 ; }
.exhibitor-view fieldset.fieldset > legend { font-weight: 600 ; font-size: 0.95rem ; }
.exhibitor-view .legend-inner { display: inline-flex ; align-items: center ; gap: var(--gap-sm) ; }
.exhibitor-view .legend-inner .chip-confirm { font-size: 0.7rem ; padding: 1px 8px ; }

/* Read-only "displayed value" — mimics input box */
.field-display {
	min-height: 38px ; padding: 9px 12px ;
	border: 1px solid var(--line) ; border-radius: var(--radius-sm) ;
	background: var(--bg) ;
	font-family: var(--font) ; font-size: 0.9rem ; color: var(--text) ;
	line-height: 1.4 ; word-break: break-word ;
	display: flex ; align-items: center ;
}
.field-display.field-display-multiline { display: flex ; align-items: center ; min-height: 38px ; }
.field-display.field-display-multiline > * { width: 100% ; }
.field-display.field-display-rich {
	display: block ; min-height: 80px ; line-height: 1.55 ;
	background: var(--surface) ; padding: 10px 14px ;
}
/* Restore default block flow for rich-content tags inside the read-only box */
.field-display.field-display-rich > p,
.field-display.field-display-rich > div { margin: 0 0 0.6em 0 ; }
.field-display.field-display-rich > p:last-child,
.field-display.field-display-rich > div:last-child { margin-bottom: 0 ; }
.field-display.field-display-rich ul,
.field-display.field-display-rich ol { margin: 0 0 0.6em 0 ; padding-left: 1.5em ; }
.field-display.field-display-rich ul { list-style: disc outside ; }
.field-display.field-display-rich ol { list-style: decimal outside ; }
.field-display.field-display-rich li { margin-bottom: 0.2em ; }
.field-display.field-display-rich li:last-child { margin-bottom: 0 ; }
.field-display.field-display-rich strong, .field-display.field-display-rich b { font-weight: 700 ; }
.field-display.field-display-rich em, .field-display.field-display-rich i { font-style: italic ; }
.field-display.field-display-rich a { color: var(--accent) ; text-decoration: underline ; }
.field-display.field-display-rich sub { vertical-align: sub ; font-size: 0.75em ; }
.field-display.field-display-rich sup { vertical-align: super ; font-size: 0.75em ; }
.field-display.field-display-empty { color: var(--muted) ; font-style: italic ; }
.field-display a { color: var(--accent) ; text-decoration: none ; }
.field-display a:hover { text-decoration: underline ; }
.field-display .chips-wrap { margin: 0 ; }

/* Equal-height row: stretch field-display-rich to match its sibling */
.field-row.field-row-equal { align-items: stretch ; }
.field-row.field-row-equal > .field { display: flex ; flex-direction: column ; }
.field-row.field-row-equal > .field > .field-display-rich { flex: 1 ; }

/* Static section-radio cards (no input) inside view */
.section-radio-static { cursor: default ; }
.section-radio-static:hover { border-color: var(--line) ; }
.section-radio-static.active:hover { border-color: var(--accent) ; }

/* Horizontal section-radio group (used in read-only view) */
.section-radio-group.section-radio-group-row {
	flex-direction: row ; flex-wrap: wrap ;
}
.section-radio-group.section-radio-group-row > .section-radio { flex: 1 ; min-width: 0 ; }

/* Contact list display (emails / phones / addresses) */
.contact-view-list { display: flex ; flex-direction: column ; width: 100% ; }
.contact-view-row {
	display: flex ; align-items: baseline ; gap: var(--gap-sm) ;
	flex-wrap: wrap ;
}
.contact-view-row + .contact-view-row {
	border-top: 1px dashed var(--line) ;
	margin-top: var(--gap-xs) ; padding-top: var(--gap-xs) ;
}
.contact-view-main { color: var(--text) ; }
.contact-view-label { font-size: 0.8rem ; color: var(--muted) ; }

/* ── Badges ──────────────────────────────────────────────── */

.badge {
	display: inline-flex ; align-items: center ; padding: 2px 8px ;
	border-radius: var(--radius-pill) ; font-size: 0.7rem ; font-weight: 600 ;
}
.badge-info { background: var(--accent-light) ; color: var(--accent) ; }
.badge-ok { background: var(--ok-bg) ; color: var(--ok) ; }
.badge-warn { background: var(--warn-bg) ; color: var(--warn) ; }
.badge-error { background: var(--error-bg) ; color: var(--error) ; }

/* ── Form actions (save button right-aligned) ────────────── */

.form-actions { display: flex ; justify-content: flex-end ; margin-top: var(--gap-md) ; }
.form-actions-split { justify-content: flex-end ; gap: var(--gap-sm) ; }

/* ── Amount + currency inline ────────────────────────────── */

.amount-with-currency {
	display: flex ; align-items: stretch ;
}
.amount-with-currency .currency-select {
	width: auto ; min-width: 70px ; flex-shrink: 0 ;
	border-radius: var(--radius-sm) 0 0 var(--radius-sm) ;
	border-right: none ;
	padding: 9px 10px ; font-weight: 600 ; font-size: 0.85rem ;
	background: var(--bg) ; color: var(--muted) ;
}
.amount-with-currency .amount-input {
	border-radius: 0 var(--radius-sm) var(--radius-sm) 0 ;
	flex: 1 ;
}

/* ── Config Form (editable, 2-column) ───────────────────── */

.config-form-grid {
	display: grid ; grid-template-columns: 1fr 2fr ; gap: var(--gap-xl) ;
}
.config-form-col { display: flex ; flex-direction: column ; gap: var(--gap-lg) ; }
.config-form-block h3 {
	font-size: 0.9rem ; font-weight: 600 ; text-transform: uppercase ;
	letter-spacing: 0.03em ; color: var(--muted) ;
	padding-bottom: var(--gap-sm) ; border-bottom: 1px solid var(--line) ;
}

.amount-input {
	font-variant-numeric: tabular-nums ; text-align: right ;
}

/* Deadline blocks */
.deadline-block {
	border: 1px solid var(--line) ; border-radius: var(--radius-sm) ;
	padding: var(--gap-md) ; margin-bottom: var(--gap-sm) ;
	background: var(--bg) ;
}
.deadline-block-header {
	display: flex ; align-items: center ; justify-content: space-between ;
	margin-bottom: var(--gap-sm) ;
}
.deadline-block-num {
	display: inline-flex ; align-items: center ; justify-content: center ;
	width: 22px ; height: 22px ; border-radius: 50% ;
	background: var(--accent) ; color: #fff ;
	font-size: 0.75rem ; font-weight: 700 ;
}
.deadline-block-body .field-row { margin-bottom: var(--gap-sm) ; }
.deadline-block-body .field-row:last-child { margin-bottom: 0 ; }

/* ── Download Grid ───────────────────────────────────────── */

.download-grid {
	display: grid ; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) ;
	gap: var(--gap-lg) ;
}
.download-card {
	background: var(--surface) ; border: 1px solid var(--line) ;
	border-radius: var(--radius) ; padding: var(--gap-lg) ;
	display: flex ; flex-direction: column ; gap: var(--gap-md) ;
}
.download-card-info h3 { font-size: 1rem ; margin-bottom: var(--gap-xs) ; }
.download-card-info p { font-size: 0.85rem ; color: var(--muted) ; }

/* ── Menu Editor ─────────────────────────────────────────── */

.menu-editor { display: flex ; flex-direction: column ; gap: 0 ; }

.menu-editor-section { margin-bottom: var(--gap-lg) ; }
.menu-editor-title {
	font-size: 0.85rem ; font-weight: 700 ; text-transform: uppercase ;
	letter-spacing: 0.04em ; color: var(--accent) ;
	padding-bottom: var(--gap-sm) ; margin-bottom: var(--gap-sm) ;
	border-bottom: 2px solid var(--accent) ;
}
.menu-editor-divider {
	border: none ; border-top: 1px solid var(--line) ;
	margin: var(--gap-md) 0 var(--gap-lg) ;
}

/* Drop zones */
.menu-drop-zone {
	display: flex ; flex-direction: column ; gap: 2px ;
	min-height: 32px ;
	padding: 2px 0 ;
}

/* Shared item row */
.menu-item-row {
	display: flex ; align-items: center ; gap: var(--gap-xs) ;
	padding: 3px 0 ;
	transition: background var(--duration) var(--ease) ;
	border-radius: var(--radius-sm) ;
}
.menu-item-row:hover { background: rgba(0, 0, 0, 0.02) ; }
.menu-item-row.menu-dragging { opacity: 0.2 ; }

/* Grip handle */
.menu-grip {
	display: flex ; align-items: center ; justify-content: center ;
	width: 24px ; height: 28px ;
	color: var(--muted) ; cursor: grab ;
	flex-shrink: 0 ; opacity: 0.5 ;
	transition: opacity var(--duration) var(--ease) ;
}
.menu-grip:hover { opacity: 1 ; }

/* Compact inputs */
.menu-input {
	padding: 5px 8px ; border: 1px solid var(--line) ;
	border-radius: var(--radius-sm) ; font-family: var(--font) ;
	font-size: 0.82rem ; color: var(--text) ; background: var(--surface) ;
	outline: none ;
	transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease) ;
}
.menu-input:focus {
	border-color: var(--accent) ;
	box-shadow: 0 0 0 2px var(--accent-light) ;
}
.menu-input-fr { flex: 2 ; min-width: 0 ; }
.menu-input-en { flex: 2 ; min-width: 0 ; }
.menu-input-url { flex: 2 ; min-width: 0 ; font-family: var(--font-mono) ; font-size: 0.78rem ; color: var(--muted) ; }

/* Row action buttons */
.menu-row-btn {
	display: flex ; align-items: center ; justify-content: center ; align-self: center ;
	width: 28px ; height: 28px ; border: none ; border-radius: var(--radius-sm) ;
	background: transparent ; cursor: pointer ; flex-shrink: 0 ;
	transition: all var(--duration) var(--ease) ;
	color: var(--muted) ; opacity: 0.5 ; padding: 0 ; margin: 0 ;
}
.menu-row-btn:hover { opacity: 1 ; }
.menu-row-btn-danger:hover { color: var(--error) ; background: var(--error-bg) ; }

/* Add buttons */
.menu-add-btn {
	display: inline-flex ; align-items: center ; gap: var(--gap-xs) ;
	padding: 4px 10px ; border: 1px dashed var(--line) ;
	border-radius: var(--radius-sm) ; background: transparent ;
	font-family: var(--font) ; font-size: 0.78rem ; color: var(--muted) ;
	cursor: pointer ; margin-top: var(--gap-xs) ;
	transition: all var(--duration) var(--ease) ;
}
.menu-add-btn:hover { border-color: var(--accent) ; color: var(--accent) ; background: var(--accent-light) ; }
.menu-add-btn-sub { margin-left: 26px ; }

/* Group block */
.menu-group-block {
	border: 1px solid var(--line) ; border-radius: var(--radius-sm) ;
	padding: var(--gap-sm) var(--gap-md) ;
	margin-bottom: var(--gap-sm) ; background: var(--bg) ;
}
.menu-group-block.menu-dragging { opacity: 0.2 ; }
.menu-group-row {
	display: flex ; align-items: center ; gap: var(--gap-sm) ;
	padding-bottom: var(--gap-xs) ;
}
.menu-group-items-zone { padding-left: 26px ; }

/* Newsletter toggle */
.menu-nl-toggle {
	display: flex ; align-items: center ; align-self: center ; gap: 4px ;
	cursor: pointer ; flex-shrink: 0 ;
	margin: 0 0 0 var(--gap-sm) ; padding: 0 ;
	height: 28px ; line-height: 28px ;
}
.menu-nl-toggle input[type="checkbox"] { width: 14px ; height: 14px ; accent-color: var(--accent) ; cursor: pointer ; margin: 0 ; vertical-align: middle ; flex-shrink: 0 ; }
.menu-nl-label { font-size: 0.7rem ; font-weight: 700 ; color: var(--muted) ; line-height: 28px ; vertical-align: middle ; }

/* Disabled menu inputs (NL mode) */
.menu-input-disabled {
	background: var(--bg) !important ; color: var(--muted) !important ;
	cursor: not-allowed !important ; opacity: 0.5 ;
}

/* Drop placeholder */
.menu-drop-placeholder {
	border: 2px dashed var(--accent-border) ;
	border-radius: var(--radius-sm) ;
	background: var(--accent-light) ;
	transition: height 100ms var(--ease) ;
}
.menu-group-placeholder { min-height: 40px ; }

/* ── Message list (admin) ────────────────────────────────── */

.message-list { display: flex ; flex-direction: column ; gap: var(--gap-sm) ; }
.message-card {
	padding: var(--gap-md) var(--gap-lg) ;
	border-left: 3px solid var(--accent) ;
	background: var(--surface) ; border-radius: 0 var(--radius-sm) var(--radius-sm) 0 ;
	box-shadow: var(--shadow-sm) ;
}
.message-list .message-card {
	display: flex ; align-items: flex-start ; gap: var(--gap-md) ;
}
.message-card-body { flex: 1 ; min-width: 0 ; }
.message-meta {
	display: flex ; align-items: center ; gap: var(--gap-sm) ;
	font-size: 0.75rem ; color: var(--muted) ; margin-bottom: 4px ;
}
.message-recipients {
	background: var(--accent-light) ; color: var(--accent) ;
	padding: 1px 8px ; border-radius: var(--radius-pill) ; font-size: 0.7rem ;
}
.message-title { font-weight: 600 ; font-size: 0.95rem ; margin-bottom: 4px ; }
.message-preview { font-size: 0.85rem ; color: var(--muted) ; line-height: 1.5 ; }
.message-actions { display: flex ; flex-direction: column ; gap: var(--gap-xs) ; flex-shrink: 0 ; }

/* ── News list (admin) ───────────────────────────────────── */

.news-grid { display: flex ; flex-direction: column ; gap: var(--gap-sm) ; }
.news-card {
	display: flex ; align-items: center ; gap: var(--gap-md) ;
	padding: var(--gap-sm) var(--gap-md) ;
	background: var(--surface) ; border: 1px solid var(--line) ;
	border-radius: var(--radius-sm) ;
	transition: box-shadow var(--duration) var(--ease) ;
}
.news-card:hover { box-shadow: var(--shadow-sm) ; border-color: var(--accent-border) ; }
.news-card-thumb {
	width: 56px ; height: 56px ; border-radius: var(--radius-sm) ;
	object-fit: cover ; background: var(--bg) ; flex-shrink: 0 ;
}
.news-card-thumb-empty {
	width: 56px ; height: 56px ; border-radius: var(--radius-sm) ;
	background: var(--bg) ; display: flex ; align-items: center ; justify-content: center ;
	color: var(--muted) ; flex-shrink: 0 ;
}
.news-card-body { flex: 1 ; min-width: 0 ; }
.news-card-meta { font-size: 0.75rem ; color: var(--muted) ; margin-bottom: 2px ; display: flex ; align-items: center ; gap: var(--gap-sm) ; }
.news-card-title { font-weight: 600 ; font-size: 0.9rem ; white-space: nowrap ; overflow: hidden ; text-overflow: ellipsis ; }
.news-card-subtitle { font-size: 0.82rem ; color: var(--muted) ; white-space: nowrap ; overflow: hidden ; text-overflow: ellipsis ; }
.news-card-actions { display: flex ; align-items: center ; gap: var(--gap-xs) ; flex-shrink: 0 ; }

/* ── Responsive (admin) ──────────────────────────────────── */

@media (max-width: 980px) {
	.login-scene { grid-template-columns: 1fr ; }
	.login-brand { display: none ; }
	.login-form-wrap { align-items: center ; }
	.dashboard-grid { grid-template-columns: 1fr ; }
	.field-row { grid-template-columns: 1fr ; }
	.config-form-grid { grid-template-columns: 1fr ; }
	.download-grid { grid-template-columns: 1fr ; }
	.work-row {
		grid-template-columns: 56px 1fr 30px 30px 28px 28px ;
	}
	.work-row .flag-btn, .work-row .work-owner, .work-row .work-sale { display: none ; }
}

@media (max-width: 640px) {
	:root { --gap-xl: 16px ; --gap-2xl: 24px ; }
	html { font-size: 14px ; }
	.shell { padding: 0 var(--gap-md) ; }
	.modal-backdrop { padding: 16px var(--gap-md) ; }
	.modal-card { max-width: 100% ; }
	.section-bar { gap: var(--gap-xs) ; }
	.section-bar .btn { font-size: 0.75rem ; padding: 5px 10px ; }
	.dyn-row .dyn-fields { grid-template-columns: 1fr ; }
	.media-grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)) ; }
	.table th, .data-table th { font-size: 0.7rem ; padding: var(--gap-xs) var(--gap-sm) ; }
	.table td, .data-table td { padding: var(--gap-xs) var(--gap-sm) ; font-size: 0.8rem ; }
}