:root {
	--bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	--app-font-display: 'Space Grotesk', 'Inter', system-ui, sans-serif;
	--app-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
	--bs-body-color: #155A92;
	--bs-body-bg: #F8F9FA;
	--bs-border-color: #E9ECEF;

	/* Paleta projektu — neutrální tmavá pro text, brand barvy jen pro akcenty */
	--app-white: #FFFFFF;
	--app-bg: #F8F9FB;
	--app-border: #E6EAEF;
	--app-muted: #6C7785;
	--app-text: #1A2332;             /* neutrální tmavá (mírně modrý nádech) — body text, nadpisy */

	/* Brand barvy z loga ACCOM Holding (použij JEN jako akcent) */
	--app-brand-blue: #1E78C3;       /* "accom" — primary akce */
	--app-brand-blue-dark: #155A92;  /* tmavší varianta — pozadí primary tlačítek */
	--app-brand-green: #69B43C;      /* "Holding" + oblé tvary — success / sekundární akcent */
	--app-brand-green-dark: #4F8C2A;
	--app-brand-orange: #E67E22;     /* in-progress / processing stavy */
	--app-brand-orange-dark: #C36410;

	/* Odvozené odstíny */
	--app-bg-hover: #F1F3F6;
	--app-border-strong: #D6DBE2;
	--app-text-soft: #3F4A5C;

	--app-shadow-sm: 0 1px 2px rgba(26, 35, 50, 0.04), 0 1px 3px rgba(26, 35, 50, 0.05);
	--app-shadow: 0 4px 6px -1px rgba(26, 35, 50, 0.05), 0 2px 4px -2px rgba(26, 35, 50, 0.04);
	--app-shadow-lg: 0 10px 24px -6px rgba(26, 35, 50, 0.08), 0 6px 10px -6px rgba(26, 35, 50, 0.05);

	--app-radius-sm: 0.5rem;
	--app-radius: 0.75rem;
	--app-radius-lg: 1rem;
	--app-radius-xl: 1.25rem;
}

* {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

html, body {
	font-family: var(--bs-body-font-family);
	font-feature-settings: 'cv11', 'ss01', 'ss03';
	background: var(--app-bg);
	color: var(--app-text);
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: var(--app-font-display);
	letter-spacing: -0.025em;
	font-weight: 600;
	color: var(--app-text);
}

.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
	font-family: var(--app-font-display);
	letter-spacing: -0.04em;
	font-weight: 700;
}

.stat-value, .page-title, .hero h1, .navbar-brand {
	font-family: var(--app-font-display);
}

code, kbd, pre, samp, .font-mono {
	font-family: var(--app-font-mono);
}

a {
	color: var(--app-text);
	text-decoration: none;
	transition: color 0.15s ease;
}

a:hover {
	color: var(--app-text);
}

.text-muted {
	color: var(--app-muted) !important;
}

/* ============ NAVBAR ============ */
.navbar {
	background: rgba(255, 255, 255, 0.85) !important;
	-webkit-backdrop-filter: saturate(180%) blur(12px);
	backdrop-filter: saturate(180%) blur(12px);
	border-bottom: 1px solid var(--app-border);
	padding-top: 0.85rem;
	padding-bottom: 0.85rem;
}

.navbar .navbar-brand {
	color: var(--app-text) !important;
	font-weight: 700;
	letter-spacing: -0.01em;
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
}

.navbar .navbar-brand .brand-logo {
	height: 36px;
	width: auto;
	display: block;
}

.navbar .navbar-brand .brand-divider {
	width: 1px;
	height: 24px;
	background: var(--app-border);
	display: inline-block;
}

.navbar .navbar-brand .brand-title {
	font-size: 1rem;
	color: var(--app-brand-blue-dark);
	font-weight: 700;
}

.navbar .nav-link {
	color: var(--app-muted) !important;
	font-weight: 500;
	padding: 0.5rem 0.9rem !important;
	border-radius: var(--app-radius-sm);
	transition: all 0.15s ease;
}

.navbar .nav-link:hover {
	color: var(--app-text) !important;
	background: var(--app-bg-hover);
}

.navbar .nav-link.active {
	color: var(--app-text) !important;
	background: var(--app-bg-hover);
}

.navbar .nav-link {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
}

.navbar .nav-link .nav-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.25rem;
	height: 1.25rem;
	padding: 0 0.4rem;
	border-radius: 999px;
	background: var(--app-brand-blue-dark);
	color: var(--app-white);
	font-size: 0.7rem;
	font-weight: 700;
	line-height: 1;
}

.navbar .navbar-toggler {
	border: 1px solid var(--app-border);
}

.navbar .navbar-toggler-icon {
	filter: invert(0.3);
}

.lang-switch {
	display: inline-flex;
	gap: 2px;
	padding: 3px;
	background: var(--app-bg-hover);
	border-radius: var(--app-radius-sm);
}

.lang-switch a {
	color: var(--app-muted) !important;
	padding: 0.25rem 0.6rem !important;
	border-radius: calc(var(--app-radius-sm) - 3px);
	font-size: 0.8rem;
	font-weight: 600;
	background: transparent;
}

.lang-switch a.active {
	background: var(--app-white);
	color: var(--app-text) !important;
	box-shadow: var(--app-shadow-sm);
}

.user-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.35rem 0.85rem;
	background: var(--app-bg-hover);
	border-radius: 999px;
	font-size: 0.85rem;
	color: var(--app-muted);
}

.user-chip .user-avatar {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--app-brand-blue-dark);
	color: var(--app-white);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.7rem;
	font-weight: 700;
}

/* ============ CARDS ============ */
.card {
	border: 1px solid var(--app-border) !important;
	border-radius: var(--app-radius-lg) !important;
	background: var(--app-white);
	box-shadow: var(--app-shadow-sm);
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.card.card-hover:hover {
	transform: translateY(-2px);
	box-shadow: var(--app-shadow-lg);
	border-color: var(--app-border-strong) !important;
}

.card-header {
	background: transparent !important;
	border-bottom: 1px solid var(--app-border);
	padding: 1.1rem 1.5rem;
}

.card-body {
	padding: 1.5rem;
}

/* Stat cards */
.stat-card .stat-icon {
	width: 48px;
	height: 48px;
	border-radius: var(--app-radius);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--app-bg);
	color: var(--app-text);
	border: 1px solid var(--app-border);
}

.stat-card .stat-icon.bg-primary-soft,
.stat-card .stat-icon.bg-warning-soft,
.stat-card .stat-icon.bg-success-soft,
.stat-card .stat-icon.bg-secondary-soft {
	background: var(--app-bg);
	color: var(--app-text);
}

.stat-card .stat-label {
	font-size: 0.8rem;
	color: var(--app-muted);
	font-weight: 500;
	letter-spacing: 0.01em;
}

.stat-card .stat-value {
	font-size: 1.75rem;
	font-weight: 800;
	line-height: 1.1;
	color: var(--app-text);
	letter-spacing: -0.02em;
}

.stat-card {
	display: block;
	text-decoration: none;
	color: inherit;
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

a.stat-card:hover {
	transform: translateY(-2px);
	box-shadow: var(--app-shadow);
	border-color: var(--app-border-strong) !important;
	color: inherit;
}

.stat-card .card-body {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: 1.2rem 1.4rem;
}

.stat-card .stat-label {
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.72rem;
	font-weight: 600;
	color: var(--app-muted);
}

.stat-card .stat-value {
	font-size: 2rem;
	font-weight: 800;
	margin-top: 0.15rem;
}

.stat-card .stat-hint {
	font-size: 0.78rem;
	color: var(--app-muted);
	margin-top: 0.25rem;
}

.stat-card.is-accent {
	background: var(--app-brand-blue-dark);
	border-color: var(--app-brand-blue-dark) !important;
	color: var(--app-white);
}

.stat-card.is-accent .stat-label,
.stat-card.is-accent .stat-hint {
	color: rgba(255, 255, 255, 0.7);
}

.stat-card.is-accent .stat-value {
	color: var(--app-white);
}

a.stat-card.is-accent:hover {
	background: var(--app-brand-blue);
	border-color: var(--app-brand-blue) !important;
	color: var(--app-white);
}

.dash-secondary .card-body {
	padding: 1.1rem 1.4rem;
}

.dash-secondary .stat-label {
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--app-muted);
}

.dash-secondary .stat-value {
	font-size: 1.6rem;
	font-weight: 700;
	color: var(--app-text);
	letter-spacing: -0.02em;
}

.dash-secondary .stat-hint {
	font-size: 0.78rem;
	color: var(--app-muted);
}

.dash-recent-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

/* ============ SETTINGS PAGE ============ */
.settings-section-head {
	margin-bottom: 1rem;
}

.settings-section-title {
	margin: 0 0 0.2rem;
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--app-text);
}

.settings-section-hint {
	margin: 0;
	font-size: 0.82rem;
	color: var(--app-muted);
}

.settings-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 0.85rem 1.2rem;
}

.dn-password-wrap {
	position: relative;
}

.dn-password-wrap > input {
	padding-right: 2.5rem;
}

.dn-password-toggle {
	position: absolute;
	top: 50%;
	right: 0.4rem;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	padding: 0;
	border: none;
	background: transparent;
	color: var(--app-muted);
	cursor: pointer;
	border-radius: var(--app-radius-sm);
	transition: color 0.15s, background 0.15s;
}

.dn-password-toggle:hover,
.dn-password-toggle:focus-visible {
	color: var(--app-text);
	background: var(--app-bg-hover);
	outline: none;
}

.dn-checkbox {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	padding: 0.6rem 0.8rem;
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	background: var(--app-white);
	cursor: pointer;
	transition: background 0.15s, border-color 0.15s;
}

.dn-checkbox:hover {
	background: var(--app-bg-hover);
}

.dn-checkbox input[type="checkbox"] {
	margin-top: 0.2rem;
	flex-shrink: 0;
}

.dn-checkbox span {
	flex: 1;
}

.settings-form .dn-field > select {
	padding: 0.4rem 0.55rem;
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	background: var(--app-white);
	font: inherit;
	font-size: 0.88rem;
	color: var(--app-text);
}

.settings-form .dn-field > select:focus {
	outline: none;
	border-color: var(--app-text);
	box-shadow: 0 0 0 2px rgba(21, 90, 146, 0.08);
}

.settings-hint {
	display: block;
	margin-top: 0.25rem;
	font-size: 0.72rem;
	color: var(--app-muted);
	letter-spacing: 0;
	text-transform: none;
	font-weight: 400;
}

.settings-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}

.settings-hint-muted {
	color: var(--app-muted);
	font-size: 0.8rem;
}

/* ============ ROLES / PERMISSIONS ============ */
.perm-group {
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid var(--app-border);
}

.perm-group:first-of-type {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

.perm-group-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 0.6rem;
}

.perm-group-head h3 {
	margin: 0;
	font-size: 0.78rem;
	font-weight: 700;
	color: var(--app-muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.perm-toggle-all {
	padding: 0.25rem 0.7rem;
	background: transparent;
	border: 1px solid var(--app-border);
	border-radius: 999px;
	font-size: 0.72rem;
	color: var(--app-text-soft);
	cursor: pointer;
	transition: all 0.15s ease;
}

.perm-toggle-all:hover {
	background: var(--app-bg-hover);
	color: var(--app-text);
	border-color: var(--app-text);
}

.perm-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 0.5rem 1rem;
}

.perm-check {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 0.55rem;
	padding: 0.45rem 0.6rem;
	background: var(--app-white);
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	cursor: pointer;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.perm-check:hover {
	background: var(--app-bg-hover);
	border-color: var(--app-border-strong);
}

.perm-check input[type=checkbox] {
	margin-top: 0.2rem;
	accent-color: var(--app-text);
	cursor: pointer;
}

.perm-check > span {
	flex: 1;
	font-size: 0.85rem;
	color: var(--app-text);
}

.perm-check > small {
	flex-basis: 100%;
	margin: 0 0 0 1.6rem;
	color: var(--app-muted);
	font-size: 0.7rem;
	word-break: break-all;
}

.perm-check > small code {
	background: var(--app-bg);
	padding: 0 0.3rem;
	border-radius: 3px;
}

/* ============ BUTTONS ============ */
.btn {
	border-radius: var(--app-radius-sm);
	font-weight: 600;
	letter-spacing: -0.005em;
	padding: 0.55rem 1.1rem;
	transition: all 0.15s ease;
	border-width: 1px;
}

.btn-lg {
	padding: 0.85rem 1.75rem;
	font-size: 1rem;
}

.btn-sm {
	padding: 0.4rem 0.85rem;
	font-size: 0.85rem;
}

.btn-primary {
	background: var(--app-brand-blue-dark);
	border-color: var(--app-brand-blue-dark);
	color: var(--app-white);
	box-shadow: 0 1px 2px rgba(21, 90, 146, 0.18);
}

.btn-primary:hover, .btn-primary:focus {
	background: var(--app-brand-blue);
	border-color: var(--app-brand-blue);
	color: var(--app-white);
	transform: translateY(-1px);
	box-shadow: 0 6px 14px -4px rgba(30, 120, 195, 0.30);
}

.btn-primary:active {
	transform: translateY(0);
}

.btn-outline-light {
	border-color: var(--app-border-strong);
	color: var(--app-text);
	background: var(--app-white);
}

.btn-outline-light:hover {
	background: var(--app-bg-hover);
	color: var(--app-text);
	border-color: var(--app-border-strong);
}

.btn-outline-secondary {
	border-color: var(--app-border-strong);
	color: var(--app-text-soft);
	background: var(--app-white);
}

.btn-outline-secondary:hover {
	background: var(--app-bg-hover);
	color: var(--app-text);
	border-color: var(--app-border-strong);
}

.btn-link-danger {
	color: var(--app-muted) !important;
	background: transparent;
	border: none;
	padding: 0.5rem 0.9rem;
	border-radius: var(--app-radius-sm);
	font-weight: 500;
	transition: all 0.15s ease;
}

.btn-link-danger:hover {
	background: var(--app-bg-hover);
	color: var(--app-text) !important;
}

/* ============ FORMS ============ */
.form-control {
	border: 1px solid var(--app-border-strong);
	border-radius: var(--app-radius-sm);
	padding: 0.7rem 0.95rem;
	font-size: 0.95rem;
	background: var(--app-white);
	color: var(--app-text);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-control::placeholder {
	color: var(--app-muted);
}

.form-control:focus {
	border-color: var(--app-text);
	box-shadow: 0 0 0 4px rgba(21, 90, 146, 0.08);
}

.form-control.is-invalid {
	border-color: var(--app-text);
}

.form-control.is-invalid:focus {
	box-shadow: 0 0 0 4px rgba(21, 90, 146, 0.12);
}

.form-label {
	font-weight: 600;
	font-size: 0.85rem;
	color: var(--app-text);
	margin-bottom: 0.45rem;
}

/* ============ ALERTS ============ */
.alert {
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius);
	padding: 0.85rem 1.1rem;
	font-size: 0.9rem;
	background: var(--app-bg);
	color: var(--app-text);
}

.alert-info {
	background: var(--app-bg);
	border-color: var(--app-border);
	color: var(--app-text);
}

.alert-danger {
	background: var(--app-white);
	border-color: var(--app-text);
	color: var(--app-text);
	border-left: 3px solid var(--app-text);
}

/* ============ HERO ============ */
.hero {
	position: relative;
	padding: 4.5rem 1rem 5rem;
	text-align: center;
}

.hero .hero-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.4rem 0.9rem;
	background: var(--app-white);
	border: 1px solid var(--app-border);
	color: var(--app-muted);
	border-radius: 999px;
	font-size: 0.8rem;
	font-weight: 600;
	margin-bottom: 1.5rem;
}

.hero .hero-icon {
	width: 80px;
	height: 80px;
	border-radius: var(--app-radius-xl);
	background: var(--app-text);
	color: var(--app-white);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1.5rem;
	box-shadow: var(--app-shadow-lg);
}

.hero h1 {
	font-size: clamp(2rem, 5vw, 3.25rem);
	color: var(--app-text);
	margin-bottom: 1rem;
}

.hero p.lead {
	color: var(--app-muted);
	font-size: 1.1rem;
	max-width: 32rem;
	margin: 0 auto 2rem;
}

/* ============ LOGIN ============ */
.auth-wrap {
	min-height: calc(100vh - 200px);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem 1rem;
}

.auth-card {
	width: 100%;
	max-width: 420px;
	background: var(--app-white);
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-xl);
	padding: 2.5rem 2rem;
	box-shadow: var(--app-shadow-lg);
}

.auth-card .auth-logo {
	display: block;
	height: 64px;
	width: auto;
	margin: 0 auto 1.25rem;
}

/* ============ EMPTY STATE ============ */
.empty-state {
	padding: 4rem 1.5rem;
	text-align: center;
	color: var(--app-muted);
}

.empty-state .empty-icon {
	width: 72px;
	height: 72px;
	border-radius: var(--app-radius-lg);
	background: var(--app-bg);
	color: var(--app-muted);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1rem;
	border: 1px solid var(--app-border);
}

/* ============ INCOMING LIST ============ */
.mail-card {
	transition: all 0.2s ease;
	cursor: default;
}

.mail-card:hover {
	transform: translateY(-1px);
	box-shadow: var(--app-shadow);
	border-color: var(--app-border-strong) !important;
}

.mail-card .mail-from {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.85rem;
	color: var(--app-muted);
}

.mail-card .mail-subject {
	font-weight: 600;
	color: var(--app-text);
	font-size: 1.02rem;
}

.mail-card .mail-time {
	font-size: 0.8rem;
	color: var(--app-muted);
	white-space: nowrap;
}

.mail-card .attachment-pill {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.35rem 0.75rem;
	background: var(--app-bg);
	border: 1px solid var(--app-border);
	border-radius: 999px;
	font-size: 0.8rem;
	color: var(--app-text);
	margin: 0.2rem 0.3rem 0.2rem 0;
	transition: all 0.15s ease;
}

.mail-card .attachment-pill:hover {
	background: var(--app-white);
	border-color: var(--app-text);
	color: var(--app-text);
}

.mail-card .attachment-pill .att-size {
	color: var(--app-muted);
	font-size: 0.75rem;
}

.mail-card .mail-delete {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 8px;
	background: transparent;
	color: var(--app-muted);
	cursor: pointer;
	transition: all 0.15s ease;
}

.mail-card .mail-delete:hover,
.mail-card .mail-delete:focus-visible {
	background: var(--app-bg-hover);
	border-color: var(--app-border-strong);
	color: var(--app-text);
	outline: none;
}

.mail-card .mail-delete:active {
	transform: scale(0.96);
}

.attachment-group {
	display: inline-flex;
	align-items: center;
	margin: 0.2rem 0.5rem 0.2rem 0;
}

.attachment-group .attachment-pill {
	margin: 0;
}

.extract-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	margin-left: -1px;
	padding: 0.35rem 0.7rem;
	background: var(--app-brand-blue-dark);
	border: 1px solid var(--app-brand-blue-dark);
	border-radius: 999px;
	font-size: 0.78rem;
	font-weight: 500;
	color: var(--app-white);
	cursor: pointer;
	transition: all 0.15s ease;
}

.extract-btn:hover,
.extract-btn:focus-visible {
	background: #000;
	border-color: #000;
	outline: none;
}

.extract-btn:disabled {
	opacity: 0.6;
	cursor: progress;
}

.result-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	margin-left: -1px;
	padding: 0.35rem 0.7rem;
	background: var(--app-white);
	border: 1px solid var(--app-border-strong);
	border-radius: 999px;
	font-size: 0.78rem;
	font-weight: 500;
	color: var(--app-text);
	cursor: pointer;
	transition: all 0.15s ease;
}

.result-btn:hover,
.result-btn:focus-visible {
	background: var(--app-bg-hover);
	border-color: var(--app-text);
	outline: none;
}

.extract-result-status {
	display: inline-block;
	margin-left: 0.4rem;
	padding: 0.1rem 0.5rem;
	background: var(--app-bg);
	border: 1px solid var(--app-border);
	border-radius: 999px;
	font-size: 0.7rem;
	font-weight: 500;
	color: var(--app-text-soft);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.extraction-block {
	margin-top: 1rem;
	padding: 0.9rem 1rem 1rem;
	background: var(--app-bg);
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
}

.extraction-block + .extraction-block {
	margin-top: 0.6rem;
}

.extraction-block-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 0.6rem;
}

.extraction-block-file {
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--app-text);
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.extraction-block-status {
	padding: 0.1rem 0.5rem;
	background: var(--app-white);
	border: 1px solid var(--app-border-strong);
	border-radius: 999px;
	font-size: 0.68rem;
	font-weight: 600;
	color: var(--app-text-soft);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.extraction-block-conf {
	margin-left: auto;
	font-size: 0.72rem;
	color: var(--app-muted);
	font-family: var(--app-font-mono);
}

.extraction-meta-list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 1.4rem;
	margin: 0 0 0.8rem;
}

.extraction-meta-list > div {
	display: flex;
	align-items: baseline;
	gap: 0.4rem;
}

.extraction-meta-list dt {
	font-size: 0.72rem;
	font-weight: 500;
	color: var(--app-muted);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0;
}

.extraction-meta-list dd {
	margin: 0;
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--app-text);
	font-family: var(--app-font-mono);
}

.extraction-rows-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	background: var(--app-white);
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	overflow: hidden;
	font-size: 0.85rem;
}

.extraction-rows-table th,
.extraction-rows-table td {
	padding: 0.5rem 0.75rem;
	text-align: left;
	border-bottom: 1px solid var(--app-border);
	vertical-align: top;
}

.extraction-rows-table thead th {
	background: var(--app-bg);
	font-weight: 600;
	color: var(--app-text-soft);
	font-size: 0.72rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	white-space: nowrap;
}

.extraction-rows-table tbody tr:last-child td {
	border-bottom: 0;
}

.extraction-rows-table th.num,
.extraction-rows-table td.num {
	text-align: right;
	font-family: var(--app-font-mono);
	white-space: nowrap;
}

.extraction-rows-table td.num {
	color: var(--app-text-soft);
}

.extraction-block.is-confirmed {
	border-color: var(--app-border-strong);
	background: var(--app-bg-hover);
}

.extraction-block-badge {
	margin-left: auto;
	padding: 0.1rem 0.6rem;
	background: var(--app-text);
	color: var(--app-white);
	border-radius: 999px;
	font-size: 0.68rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.extraction-meta-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 0.6rem 0.9rem;
	margin-bottom: 0.85rem;
}

.dn-field {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.dn-field > span {
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--app-muted);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.dn-field > input,
.extraction-rows-table.editable input {
	width: 100%;
	padding: 0.35rem 0.55rem;
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	background: var(--app-white);
	font: inherit;
	font-size: 0.85rem;
	color: var(--app-text);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.dn-field > input:focus,
.extraction-rows-table.editable input:focus {
	outline: none;
	border-color: var(--app-text);
	box-shadow: 0 0 0 2px rgba(21, 90, 146, 0.08);
}

.extraction-rows-table.editable td {
	padding: 0.3rem 0.4rem;
}

.extraction-rows-table.editable td.num input {
	text-align: right;
	font-family: var(--app-font-mono);
}

.extraction-rows-table.editable .row-action-col {
	width: 32px;
	text-align: center;
	padding-right: 0.5rem;
}

.row-remove-btn {
	width: 24px;
	height: 24px;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
	color: var(--app-muted);
	font-size: 1.1rem;
	line-height: 1;
	cursor: pointer;
	transition: all 0.15s ease;
}

.row-remove-btn:hover {
	background: var(--app-bg);
	border-color: var(--app-border-strong);
	color: var(--app-text);
}

.extraction-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 0.85rem;
	align-items: center;
}

.row-add-btn {
	padding: 0.4rem 0.85rem;
	background: var(--app-white);
	border: 1px dashed var(--app-border-strong);
	border-radius: 999px;
	font-size: 0.78rem;
	font-weight: 500;
	color: var(--app-text-soft);
	cursor: pointer;
	transition: all 0.15s ease;
}

.row-add-btn:hover {
	background: var(--app-bg-hover);
	border-style: solid;
	color: var(--app-text);
}

.confirm-btn {
	margin-left: auto;
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.45rem 1rem;
	background: var(--app-brand-blue-dark);
	border: 1px solid var(--app-brand-blue-dark);
	border-radius: 999px;
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--app-white);
	cursor: pointer;
	transition: all 0.15s ease;
}

.confirm-btn:hover,
.confirm-btn:focus-visible {
	background: var(--app-brand-blue);
	border-color: var(--app-brand-blue);
	outline: none;
}

.confirm-btn:disabled {
	opacity: 0.6;
	cursor: progress;
}

/* ============ DELIVERY NOTES PAGE ============ */
.dn-list-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	font-size: 0.9rem;
}

.dn-list-table th,
.dn-list-table td {
	padding: 0.75rem 1rem;
	border-bottom: 1px solid var(--app-border);
	vertical-align: middle;
}

.dn-list-table thead th {
	background: var(--app-bg);
	font-size: 0.72rem;
	font-weight: 600;
	color: var(--app-text-soft);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	white-space: nowrap;
}

.dn-list-table tbody tr:hover {
	background: var(--app-bg-hover);
}

.dn-list-table tbody tr.dn-row-clickable {
	cursor: pointer;
	user-select: none;
}

.dn-list-table th.num,
.dn-list-table td.num {
	text-align: right;
	font-family: var(--app-font-mono);
}

.dn-list-table .dn-time {
	font-size: 0.82rem;
	color: var(--app-muted);
	white-space: nowrap;
}

.dn-list-table .dn-link {
	font-size: 0.85rem;
	color: var(--app-text);
	border-bottom: 1px solid var(--app-border-strong);
	transition: border-color 0.15s ease;
}

.dn-list-table .dn-link:hover {
	border-color: var(--app-text);
}

.dn-list-table .dn-action-col {
	white-space: nowrap;
}

.dn-list-table .dn-delete-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	margin-left: 0.4rem;
	padding: 0;
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	background: var(--app-white);
	color: var(--app-muted);
	cursor: pointer;
	transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.dn-list-table .dn-delete-btn:hover,
.dn-list-table .dn-delete-btn:focus-visible {
	background: var(--app-bg-hover);
	border-color: var(--app-text);
	color: var(--app-text);
	outline: none;
}

.dn-list-card .dn-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	align-items: center;
	border-bottom: 1px solid var(--app-border);
}

.dn-search-wrap {
	position: relative;
	flex: 1 1 280px;
	max-width: 480px;
}

.dn-search-wrap > svg {
	position: absolute;
	left: 0.7rem;
	top: 50%;
	transform: translateY(-50%);
	color: var(--app-muted);
	pointer-events: none;
}

.dn-search {
	width: 100%;
	padding: 0.5rem 0.75rem 0.5rem 2.1rem;
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	background: var(--app-white);
	font: inherit;
	font-size: 0.88rem;
	color: var(--app-text);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.dn-search:focus {
	outline: none;
	border-color: var(--app-text);
	box-shadow: 0 0 0 2px rgba(21, 90, 146, 0.08);
}

.dn-reset-btn {
	padding: 0.45rem 0.85rem;
	background: transparent;
	border: 1px solid var(--app-border-strong);
	border-radius: 999px;
	font-size: 0.78rem;
	color: var(--app-text-soft);
	cursor: pointer;
	transition: all 0.15s ease;
}

.dn-reset-btn:hover {
	background: var(--app-bg-hover);
	color: var(--app-text);
	border-color: var(--app-text);
}

.dn-toolbar-spacer { flex: 1 1 auto; }

.dn-perpage {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.78rem;
	color: var(--app-muted);
}

.dn-perpage-select {
	padding: 0.35rem 0.55rem;
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	background: var(--app-white);
	font: inherit;
	font-size: 0.85rem;
	color: var(--app-text);
	cursor: pointer;
}

.dn-list-table th.sortable {
	padding: 0;
}

.dn-sort-btn {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.4rem;
	width: 100%;
	padding: 0.75rem 1rem;
	background: transparent;
	border: 0;
	font: inherit;
	font-size: 0.72rem;
	font-weight: 600;
	color: var(--app-text-soft);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	cursor: pointer;
	text-align: left;
}

.dn-list-table th.num .dn-sort-btn {
	justify-content: flex-end;
	flex-direction: row-reverse;
}

.dn-sort-btn:hover {
	background: var(--app-bg-hover);
	color: var(--app-text);
}

.dn-sort-ind {
	font-size: 0.65rem;
	color: var(--app-muted);
	min-width: 0.8em;
	text-align: center;
}

.dn-list-table th.is-asc .dn-sort-ind,
.dn-list-table th.is-desc .dn-sort-ind {
	color: var(--app-text);
}

.dn-filter-row th {
	padding: 0.4rem 0.6rem;
	background: var(--app-bg);
	border-bottom: 1px solid var(--app-border);
}

.dn-filter-input {
	width: 100%;
	padding: 0.3rem 0.55rem;
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	background: var(--app-white);
	font: inherit;
	font-size: 0.82rem;
	color: var(--app-text);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.dn-list-table th.num .dn-filter-input { text-align: right; }

.dn-filter-input:focus {
	outline: none;
	border-color: var(--app-text);
	box-shadow: 0 0 0 2px rgba(21, 90, 146, 0.08);
}

.dn-action-col { width: 130px; }

.dn-empty-state,
.dn-loading {
	padding: 2.2rem 1rem;
	text-align: center;
}

.dn-loading span {
	font-size: 0.85rem;
	color: var(--app-muted);
}

.dn-pager {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.6rem;
	border-top: 1px solid var(--app-border);
}

.dn-pager-info {
	font-size: 0.8rem;
	color: var(--app-muted);
}

.dn-pager-controls {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
}

.dn-page-btn {
	min-width: 34px;
	height: 34px;
	padding: 0 0.55rem;
	background: var(--app-white);
	border: 1px solid var(--app-border-strong);
	border-radius: var(--app-radius-sm);
	font-size: 0.95rem;
	color: var(--app-text);
	cursor: pointer;
	transition: all 0.15s ease;
}

.dn-page-btn:hover:not(:disabled) {
	background: var(--app-bg-hover);
	border-color: var(--app-text);
}

.dn-page-btn:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.dn-page-status {
	padding: 0 0.6rem;
	font-size: 0.85rem;
	color: var(--app-text-soft);
	font-family: var(--app-font-mono);
}

.dn-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 2rem;
	margin: 0;
}

.dn-meta > div {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}

.dn-meta dt {
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--app-muted);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0;
}

.dn-meta dd {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--app-text);
	font-family: var(--app-font-mono);
}

.dn-source-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	margin-bottom: 0.75rem;
}

.dn-section-title {
	margin: 0;
	font-size: 0.78rem;
	font-weight: 600;
	color: var(--app-muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.export-status-badge {
	display: inline-flex;
	align-items: center;
	padding: 0.15rem 0.6rem;
	border-radius: 999px;
	font-size: 0.7rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	border: 1px solid transparent;
	white-space: nowrap;
}

.export-status-pending {
	background: var(--app-bg-hover);
	color: var(--app-brand-blue-dark);
	border-color: var(--app-brand-blue-dark);
}

.export-status-exported {
	background: var(--app-brand-green);
	color: var(--app-white);
	border-color: var(--app-brand-green);
}

.export-status-failed {
	background: var(--app-white);
	color: var(--app-text);
	border-color: var(--app-text);
}

.export-status-failed::before {
	content: '!';
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 14px;
	height: 14px;
	margin-right: 0.35rem;
	border-radius: 999px;
	background: var(--app-text);
	color: var(--app-white);
	font-weight: 700;
	font-size: 0.7rem;
	line-height: 1;
}

.export-details-card .export-pre {
	background: var(--app-bg);
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	padding: 0.6rem 0.8rem;
	font-size: 0.78rem;
	color: var(--app-text);
	max-height: 320px;
	overflow: auto;
	white-space: pre-wrap;
	word-break: break-word;
	margin: 0;
}

.export-pre {
	background: var(--app-bg);
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	padding: 0.6rem 0.8rem;
	font-size: 0.78rem;
	color: var(--app-text);
	max-height: 320px;
	overflow: auto;
	white-space: pre-wrap;
	word-break: break-word;
	margin: 0;
	font-family: var(--app-font-mono);
}

.export-pre-error {
	border-color: var(--app-text);
	color: var(--app-text);
}

.dn-export-swal-html .export-pre {
	font-size: 0.75rem;
	max-height: 240px;
}

.dn-source-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.dn-source-filename {
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--app-text);
	margin-bottom: 0.75rem;
	word-break: break-all;
}

.dn-pdf-preview {
	position: relative;
	width: 100%;
	min-height: 70vh;
	background: var(--app-bg);
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	overflow: hidden;
}

.dn-pdf-frame {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 70vh;
	border: 0;
	background: var(--app-bg);
}

@media (min-width: 1200px) {
	.dn-split .card.h-100 {
		display: flex;
		flex-direction: column;
	}
	.dn-split .card.h-100 > .card-body {
		flex: 1 1 auto;
	}
}

.extract-result-meta {
	font-size: 0.85rem;
	color: var(--app-muted);
	text-align: left;
	margin-bottom: 0.5rem;
	word-break: break-all;
}

.extract-result-pre {
	text-align: left;
	background: var(--app-bg);
	border: 1px solid var(--app-border);
	border-radius: var(--app-radius-sm);
	padding: 0.85rem 1rem;
	margin: 0;
	max-height: 55vh;
	overflow: auto;
	font-family: var(--app-font-mono);
	font-size: 0.8rem;
	line-height: 1.45;
	color: var(--app-text);
	white-space: pre-wrap;
	word-break: break-word;
}

/* ============ PAGE HEADER ============ */
.page-header {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	align-items: flex-start;
	justify-content: space-between;
	margin-bottom: 1.75rem;
}

.page-header .page-title {
	font-size: 1.6rem;
	margin: 0;
	letter-spacing: -0.02em;
	color: var(--app-text);
}

.page-header .page-subtitle {
	color: var(--app-muted);
	font-size: 0.95rem;
	margin: 0.25rem 0 0;
}

/* ============ INCOMING TABS ============ */
.incoming-tabs {
	display: inline-flex;
	gap: 0.25rem;
	padding: 0.25rem;
	background: var(--app-surface, #F8F9FA);
	border: 1px solid var(--app-border, #E9ECEF);
	border-radius: 0.75rem;
}

.incoming-tab {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.4rem 0.85rem;
	border-radius: 0.5rem;
	color: var(--app-muted, #6C757D);
	font-size: 0.9rem;
	font-weight: 500;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}

.incoming-tab:hover {
	color: var(--app-text, #155A92);
	background: #FFFFFF;
}

.incoming-tab.is-active {
	color: #FFFFFF;
	background: var(--app-brand-blue-dark);
}

.incoming-tab-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.4rem;
	height: 1.4rem;
	padding: 0 0.4rem;
	border-radius: 999px;
	background: #FFFFFF;
	color: var(--app-brand-blue-dark);
	font-size: 0.75rem;
	font-weight: 600;
}

.incoming-tab:not(.is-active) .incoming-tab-badge {
	background: var(--app-text);
	color: #FFFFFF;
}

/* ============ INCOMING UPLOAD DROPZONE ============ */
.upload-dropzone {
	display: block;
	margin-bottom: 1.25rem;
	padding: 0;
	background: #FFFFFF;
	border: 2px dashed var(--app-border, #E9ECEF);
	border-radius: 0.75rem;
	transition: border-color 0.15s ease, background 0.15s ease;
}

.upload-dropzone:hover {
	border-color: var(--app-text-soft, #6C757D);
	background: var(--app-bg, #F8F9FA);
}

.upload-dropzone.is-dragover {
	border-color: var(--app-text, #155A92);
	background: var(--app-bg, #F8F9FA);
}

.upload-dropzone-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.85rem;
	padding: 1.1rem 1.25rem;
	cursor: pointer;
	color: var(--app-text-soft, #6C757D);
}

.upload-dropzone-inner > svg {
	flex-shrink: 0;
	color: var(--app-text-soft, #6C757D);
}

.upload-dropzone.is-dragover .upload-dropzone-inner > svg {
	color: var(--app-text, #155A92);
}

.upload-dropzone-text {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}

.upload-dropzone-text strong {
	color: var(--app-text, #155A92);
	font-size: 0.95rem;
	font-weight: 600;
}

.upload-dropzone-text span {
	font-size: 0.8rem;
	color: var(--app-muted, #6C757D);
}

.upload-browse-btn {
	flex-shrink: 0;
}

/* ============ FILE-CENTRIC INCOMING CARDS ============ */
.file-card {
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.file-card:hover {
	border-color: var(--app-border-strong, #E9ECEF);
}

.file-card-head {
	display: flex;
	gap: 0.75rem;
	align-items: center;
	margin-bottom: 1rem;
}

.file-card-icon {
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 0.5rem;
	background: var(--app-bg, #F8F9FA);
	color: var(--app-text-soft, #6C757D);
}

.file-card-main {
	flex: 1;
	min-width: 0;
}

.file-card-title-line {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.6rem;
	line-height: 1.3;
}

.file-card-title {
	font-size: 1rem;
	font-weight: 600;
	color: var(--app-text, #155A92);
	text-decoration: none;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
}

.file-card-title:hover {
	color: var(--app-text, #155A92);
	text-decoration: underline;
}

.file-card-size {
	font-size: 0.75rem;
	color: var(--app-muted, #6C757D);
	font-family: var(--app-font-mono);
	white-space: nowrap;
}

.file-card-preview-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.25rem 0.7rem;
	background: var(--app-bg-hover);
	border: 1px solid var(--app-border);
	border-radius: 999px;
	font-size: 0.78rem;
	font-weight: 500;
	color: var(--app-brand-blue-dark);
	text-decoration: none;
	white-space: nowrap;
	transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.file-card-preview-btn:hover,
.file-card-preview-btn:focus-visible {
	background: var(--app-brand-blue-dark);
	border-color: var(--app-brand-blue-dark);
	color: var(--app-white);
	outline: none;
}

.file-card-business {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin-top: 0.4rem;
}

.biz-pill {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.15rem 0.55rem;
	background: var(--app-bg, #F8F9FA);
	border: 1px solid var(--app-border, #E9ECEF);
	border-radius: 999px;
	font-size: 0.78rem;
	color: var(--app-text, #155A92);
}

.biz-pill-label {
	color: var(--app-muted, #6C757D);
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.biz-pill strong {
	font-family: var(--app-font-mono);
	font-weight: 600;
}

.file-card-status {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: 0.4rem;
	margin-left: auto;
}

.status-pill {
	display: inline-flex;
	align-items: center;
	padding: 0.2rem 0.65rem;
	border-radius: 999px;
	font-size: 0.72rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	border: 1px solid transparent;
	white-space: nowrap;
}

.status-pill-queued {
	background: var(--app-bg, #F8F9FA);
	color: var(--app-text-soft, #6C757D);
	border-color: var(--app-border, #E9ECEF);
}

.status-pill-processing {
	background: var(--app-brand-orange);
	color: var(--app-white);
}

.status-pill-extracted {
	background: #FFFFFF;
	color: var(--app-brand-blue-dark);
	border-color: var(--app-brand-blue-dark);
}

.status-pill-failed {
	background: var(--app-text, #155A92);
	color: #FFFFFF;
	border-color: var(--app-text, #155A92);
	position: relative;
}

.status-pill-failed::before {
	content: '!';
	display: inline-block;
	width: 14px;
	height: 14px;
	margin-right: 0.35rem;
	border-radius: 999px;
	background: #FFFFFF;
	color: var(--app-text, #155A92);
	font-weight: 700;
	font-size: 0.7rem;
	line-height: 14px;
	text-align: center;
}

.confidence-pill {
	display: inline-flex;
	align-items: center;
	padding: 0.2rem 0.55rem;
	border-radius: 999px;
	font-size: 0.72rem;
	font-weight: 700;
	font-family: var(--app-font-mono);
	background: var(--app-bg, #F8F9FA);
	color: var(--app-text, #155A92);
	border: 1px solid var(--app-border, #E9ECEF);
}

.file-card-actions {
	margin-top: 0.85rem;
}

.file-card-failure {
	margin-top: 0.85rem;
	padding: 0.85rem 1rem;
	background: var(--app-bg, #F8F9FA);
	border: 1px solid var(--app-border, #E9ECEF);
	border-radius: var(--app-radius-sm, 0.5rem);
}

.file-card-failure p {
	color: var(--app-text, #155A92);
	font-size: 0.88rem;
}

.file-card-meta {
	display: flex;
	gap: 0.75rem;
	align-items: center;
	margin-top: 1rem;
	padding-top: 0.75rem;
	border-top: 1px solid var(--app-border, #E9ECEF);
	font-size: 0.78rem;
	color: var(--app-muted, #6C757D);
}

.file-card-meta-main {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem;
	overflow: hidden;
}

.meta-from,
.meta-date,
.meta-subject {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
}

.meta-subject {
	color: var(--app-text-soft, #6C757D);
	font-style: italic;
}

.meta-sep {
	color: var(--app-border-strong, #E9ECEF);
}

.file-card-meta-actions {
	display: flex;
	gap: 0.25rem;
	flex-shrink: 0;
}

.meta-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border: 1px solid transparent;
	border-radius: 0.4rem;
	background: transparent;
	color: var(--app-muted, #6C757D);
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.meta-action:hover,
.meta-action:focus-visible {
	background: var(--app-bg, #F8F9FA);
	color: var(--app-text, #155A92);
	border-color: var(--app-border, #E9ECEF);
}

.meta-action-danger:hover,
.meta-action-danger:focus-visible {
	background: var(--app-text, #155A92);
	color: #FFFFFF;
	border-color: var(--app-text, #155A92);
}

@media (max-width: 600px) {
	.file-card-head {
		flex-wrap: wrap;
	}
	.file-card-status {
		margin-left: 0;
		width: 100%;
	}
}

/* ============ SWEETALERT2 — MONOCHROME OVERRIDES ============ */
.swal2-container {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

.swal2-backdrop-show {
	background: rgba(21, 90, 146, 0.45) !important;
}

.swal2-popup {
	background: #FFFFFF !important;
	color: #155A92 !important;
	border: 1px solid #E9ECEF !important;
	border-radius: 0.75rem !important;
	box-shadow: 0 12px 40px rgba(21, 90, 146, 0.15) !important;
	padding: 1.5rem 1.5rem 1.25rem !important;
}

.swal2-popup .swal2-title {
	color: #155A92 !important;
	font-weight: 700 !important;
	font-size: 1.15rem !important;
	letter-spacing: -0.01em !important;
	padding: 0 0 0.4rem !important;
}

.swal2-popup .swal2-html-container,
.swal2-popup .swal2-content {
	color: #6C757D !important;
	font-size: 0.95rem !important;
	line-height: 1.5 !important;
	margin: 0 !important;
}

.swal2-popup .swal2-close {
	color: #6C757D !important;
	font-size: 1.4rem !important;
	box-shadow: none !important;
	outline: none !important;
	transition: color 0.15s ease;
}

.swal2-popup .swal2-close:hover,
.swal2-popup .swal2-close:focus {
	color: #155A92 !important;
}

/* Actions row */
.swal2-popup .swal2-actions {
	gap: 0.5rem !important;
	margin: 1.25rem 0 0 !important;
}

/* Buttons — beat inline background from confirmButtonColor */
.swal2-popup .swal2-styled {
	border-radius: 0.5rem !important;
	font-weight: 600 !important;
	font-size: 0.9rem !important;
	padding: 0.55rem 1.05rem !important;
	box-shadow: none !important;
	border: 1px solid transparent !important;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.swal2-popup .swal2-confirm,
.swal2-popup .swal2-styled.swal2-confirm {
	background: #155A92 !important;
	color: #FFFFFF !important;
	border-color: #155A92 !important;
}

.swal2-popup .swal2-confirm:hover,
.swal2-popup .swal2-confirm:focus {
	background: #000000 !important;
	border-color: #000000 !important;
}

.swal2-popup .swal2-cancel,
.swal2-popup .swal2-styled.swal2-cancel,
.swal2-popup .swal2-deny,
.swal2-popup .swal2-styled.swal2-deny {
	background: #FFFFFF !important;
	color: #155A92 !important;
	border-color: #E9ECEF !important;
}

.swal2-popup .swal2-cancel:hover,
.swal2-popup .swal2-cancel:focus,
.swal2-popup .swal2-deny:hover,
.swal2-popup .swal2-deny:focus {
	background: #F8F9FA !important;
	border-color: #6C757D !important;
}

/* Inputs (if any used) */
.swal2-popup .swal2-input,
.swal2-popup .swal2-textarea,
.swal2-popup .swal2-select {
	background: #FFFFFF !important;
	color: #155A92 !important;
	border: 1px solid #E9ECEF !important;
	border-radius: 0.5rem !important;
	box-shadow: none !important;
	font-size: 0.95rem !important;
}

.swal2-popup .swal2-input:focus,
.swal2-popup .swal2-textarea:focus,
.swal2-popup .swal2-select:focus {
	border-color: #155A92 !important;
	outline: none !important;
}

.swal2-validation-message {
	background: #F8F9FA !important;
	color: #155A92 !important;
	border-radius: 0.5rem !important;
}

/* ICONS — flatten to monochrome */
.swal2-icon {
	border-color: #155A92 !important;
	color: #155A92 !important;
	margin: 0.5rem auto 1rem !important;
}

/* SUCCESS — ring + checkmark */
.swal2-icon.swal2-success .swal2-success-ring {
	border-color: #E9ECEF !important;
}
.swal2-icon.swal2-success .swal2-success-circular-line-left,
.swal2-icon.swal2-success .swal2-success-circular-line-right,
.swal2-icon.swal2-success .swal2-success-fix {
	background: transparent !important;
}
.swal2-icon.swal2-success [class^="swal2-success-line"] {
	background-color: var(--app-brand-green) !important;
}

/* ERROR — X */
.swal2-icon.swal2-error [class^="swal2-x-mark-line"] {
	background-color: #155A92 !important;
}

/* WARNING / INFO / QUESTION — circle with character */
.swal2-icon.swal2-warning,
.swal2-icon.swal2-info,
.swal2-icon.swal2-question {
	border-color: #155A92 !important;
	color: #155A92 !important;
}

.swal2-icon.swal2-warning .swal2-icon-content,
.swal2-icon.swal2-info .swal2-icon-content,
.swal2-icon.swal2-question .swal2-icon-content {
	color: #155A92 !important;
	font-weight: 700 !important;
}

/* LOADING SPINNER */
.swal2-loader {
	border-color: #155A92 transparent #155A92 transparent !important;
}

/* TIMER PROGRESS BAR */
.swal2-timer-progress-bar {
	background: #155A92 !important;
}

/* TOAST (auto-dismiss small popups in corner) */
.swal2-toast {
	border: 1px solid #E9ECEF !important;
	box-shadow: 0 8px 24px rgba(21, 90, 146, 0.12) !important;
	border-radius: 0.6rem !important;
}

.swal2-toast .swal2-title {
	font-size: 0.95rem !important;
}

/* ============ FOOTER ============ */
footer {
	background: transparent !important;
	border-top: 1px solid var(--app-border) !important;
}

footer p {
	color: var(--app-muted);
}

/* ============ ANIMATIONS ============ */
@keyframes fadeUp {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: translateY(0); }
}

main > * {
	animation: fadeUp 0.35s ease both;
}

/* ============ RESPONSIVE ============ */
@media (max-width: 768px) {
	.hero { padding: 2.5rem 1rem 3rem; }
	.auth-card { padding: 2rem 1.5rem; }
	.card-body { padding: 1.25rem; }
}