:root{
	--bg: #eef1f4;
	--panel: #ffffff;
	--panel2: #f7f8fa;
	--header: #f3f5f7;
	--border: #dde2ea;

	--text: #111827;
	--muted: #6b7280;
	--muted2: #8b94a6;

	/* z dumpa: trax_config ui.accent */
	--accent: #00BD00;
	--accentSoft: rgba(0,189,0,0.12);

	--warn: #b45309;
	--warnSoft: rgba(180,83,9,0.10);

	--r: 14px;
	--r2: 16px;

	--tap: 46px;
	--max: 1100px;

	--shadow: 0 8px 22px rgba(17,24,39,0.08);
	--shadowSm: 0 2px 10px rgba(17,24,39,0.08);
}

*{ box-sizing: border-box; }
html,body{ height:100%; }
body{
	margin:0;
	color:var(--text);
	background: var(--bg);
	font: 15px/1.35 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

a{ color:inherit; text-decoration:none; }
button, input, select{ font: inherit; color: inherit; }

html.erp-noscroll, html.erp-noscroll body{
	overflow: hidden !important;
	height: 100% !important;
}

/* ===== TOP BAR ===== */
.erp-app{ min-height: 92vh; }

.erp-top{
	position: sticky;
	top: 0;
	z-index: 50;
	padding: calc(env(safe-area-inset-top) + 10px) 12px 10px;
	background: var(--header);
	border-bottom: 1px solid var(--border);
	box-shadow: var(--shadowSm);
	display:flex;
	gap: 10px;
	align-items:center;
}

.erp-brand{ display:flex; align-items:center; gap: 10px; min-width:0; flex:1; }
.erp-logo{
	height: 75px;
	display:flex; 
	align-items:center; 
	justify-content:center;
}
.erp-logoimg{
	height: 5vh;
	display: block;
	object-fit: contain;
}
.erp-brandtext{ min-width:0; }
.erp-title{
	font-size: 14px;
	font-weight: 750;
	white-space: nowrap;
	overflow:hidden;
	text-overflow: ellipsis;
}
.erp-subtitle{
	font-size: 12px;
	color: var(--muted);
	white-space: nowrap;
	overflow:hidden;
	text-overflow: ellipsis;
}

/* ===== HEADER: zegar (środek) + licznik (prawy róg) — tylko desktop ===== */
.erp-topclock-center{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	font-size: 22px;
	font-weight: 900;
	letter-spacing: .4px;
	padding: 6px 14px;
	border-radius: var(--r);
	border: 1px solid var(--border);
	background: var(--panel);
	box-shadow: var(--shadowSm);
	white-space: nowrap;
	pointer-events: none;
}

.erp-topcounter{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	height: var(--tap);
	padding: 0 12px;
	border-radius: var(--r);
	border: 1px solid var(--border);
	background: var(--panel);
	box-shadow: var(--shadowSm);
	font-size: 14px;
	font-weight: 850;
	white-space: nowrap;
}

.erp-topcounter strong{
	font-size: 20px;
	font-weight: 950;
}

@media (max-width: 979px){
	.erp-topclock-center,
	.erp-topcounter{
		display: none !important;
	}
}

.erp-btn{
	height: var(--tap);
	padding: 0 14px;
	border-radius: var(--r);
	border: 1px solid var(--border);
	background: var(--panel);
	cursor:pointer;
	
}
.erp-btn:hover{ background: var(--panel2); }
.erp-btn:active{ transform: translateY(1px); }
.erp-btn:disabled{
	opacity: 0.55;
	cursor: not-allowed;
	background: var(--panel2);
	transform: none;
}

.erp-btn-ghost{
	background: transparent;
}

.erp-menubtn{
	min-width: 110px;
	text-align: center;
}

/* ===== SHELL ===== */
.erp-shell{
	position: relative;
	display:flex;
}

.erp-dim{
	display:none;
	position: fixed;
	inset: 0;
	background: rgba(17,24,39,0.35);
	z-index: 53;
}

/* ===== MODAL (PAYMENT EDIT) ===== */
.erp-modal-dim{
	position: fixed;
	inset: 0;
	background: rgba(17,24,39,0.40);
	z-index: 60;
	display:none; /* ważne: domyślnie ukryty */
	align-items:center;
	justify-content:center;
	padding: 14px;
}
.erp-modal-dim:not([hidden]){
	display:flex;
}
.erp-modal-dim[hidden]{
	display:none !important;
}

.erp-modal{
	width: min(520px, 94vw);
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: var(--r2);
	box-shadow: var(--shadow);
	overflow:hidden;
}

.erp-modalhead{
	padding: 12px 14px;
	background: var(--panel2);
	border-bottom: 1px solid var(--border);
	font-weight: 700;
}

.erp-modalbody{
	padding: 14px;
	display:grid;
	gap: 12px;
}

.erp-modalactions{
	padding: 12px 14px;
	border-top: 1px solid var(--border);
	display:flex;
	gap: 10px;
	justify-content:flex-end;
}

/* ===== LIGHTBOX (ZDJĘCIA) ===== */
.erp-imgmodal{
	width: min(96vw, 980px);
}
.erp-imgbody{
	padding: 0;
	background: #000;
}
.erp-imgbody img{
	display:block;
	width: 100%;
	height: auto;
	max-height: 80vh;
	object-fit: contain;
}

.erp-asktext{
	white-space: pre-line;
	line-height: 1.35;
	color: #111827;
}

@media (max-width: 520px){
	.erp-modal{ width: 94vw; }
}

/* ===== SIDEBAR (OFFCANVAS) ===== */
.erp-side{
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	width: min(86vw, 360px);
	transform: translateX(-105%);
	transition: transform .45s cubic-bezier(.22,.61,.36,1);
	will-change: transform;
	z-index: 55;

	padding: calc(env(safe-area-inset-top) + 12px) 12px 12px;
	background: var(--panel);
	border-right: 1px solid var(--border);
	box-shadow: var(--shadow);
	display: flex;
	flex-direction: column;
	overflow: visible;
}

.erp-side.is-open{ transform: translateX(0); }
.erp-dim.is-on{ display:block; }

.erp-sidehead{
	margin-bottom: 12px;
	position: relative;
}

/* UCHO (między panelem a dim): dim(53) < ucho(54) < panel(55) */
.erp-sidetab{
	position: fixed;
	top: calc(env(safe-area-inset-top) + 56px);
	left: calc(min(86vw, 360px) - 10px); /* 10px "wchodzi" pod panel */
	width: 46px;
	height: 40px;

	display:flex;
	align-items:center;
	justify-content:center;

	border: 1px solid var(--border);
	border-left: none;
	border-radius: 0 var(--r2) var(--r2) 0;
	background: var(--panel);
	box-shadow: var(--shadowSm);
	cursor: pointer;

	font-size: 22px;
	line-height: 1;

	/* domyślnie niewidoczne (menu schowane) */
	opacity: 0;
	pointer-events: none;
	transform: translateX(-14px);
	transition: opacity .18s ease, transform .18s ease, background .12s ease;

	z-index: 54; /* klucz: pomiędzy dim i panelem */
}

/* pokazuj ucho TYLKO gdy menu jest otwarte */
.erp-side.is-open + .erp-sidetab{
	opacity: 1;
	pointer-events: auto;
	transform: translateX(0);
}

.erp-sidetab:hover{ background: var(--panel2); }
.erp-sidetab:active{ transform: translateX(1px); }

.erp-user{
	display:flex;
	gap: 10px;
	align-items:center;
	padding: 12px;
	padding-right: 12px; /* miejsce na "ucho" */
	border: 1px solid var(--border);
	border-radius: var(--r2);
	background: var(--panel2);
	position: relative;
}

.erp-avatar{
	width: 38px; height: 38px;
	border-radius: var(--r);
	display:flex; align-items:center; justify-content:center;
	background: var(--panel);
	border: 1px solid var(--border);
	font-weight: 800;
}
.erp-username{ font-weight: 750; }
.erp-userhint{ color: var(--muted); font-size: 12px; }

.erp-userclose{
	position: absolute;
	top: 50%;
	right: -46px; /* "ucho" wystaje */
	transform: translateY(-50%);
	width: 46px;
	height: 40px;
	display:flex;
	align-items:center;
	justify-content:center;

	border: 1px solid var(--border);
	border-left: none;
	border-radius: 0 var(--r2) var(--r2) 0;
	background: var(--panel2);
	box-shadow: var(--shadow);
	cursor: pointer;

	font-size: 22px;
	line-height: 1;
	z-index: 55;
}

.erp-userclose:hover{ background: var(--panel); }
.erp-userclose:active{ transform: translateY(-50%) translateY(1px); }

.erp-nav{
	display:flex;
	flex-direction:column;
	gap: 14px;
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	padding-right: 2px;
}
.erp-navgroup{ display:flex; flex-direction:column; gap: 8px; }
.erp-navtitle{ color: var(--muted2); font-size: 11px; letter-spacing: .8px; }

.erp-navitem{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap: 10px;
	padding: 12px;
	border-radius: var(--r2);
	border: 1px solid var(--border);
	background: var(--panel);
	min-height: var(--tap);
}
.erp-navitem:hover{ background: var(--panel2); }
.erp-navitem.is-active{
	border-color: rgba(0,189,0,0.45);
	background: var(--accentSoft);
}
.erp-navitem.is-disabled{
	opacity: .55;
	pointer-events: none;
}

.erp-navitem.is-danger{
	border-color: rgba(220,38,38,0.35);
	background: rgba(220,38,38,0.06);
	color: #b91c1c;
}
.erp-navitem.is-danger:hover{ background: rgba(220,38,38,0.10); }

.erp-bitem.is-danger{
	border-color: rgba(220,38,38,0.35);
	background: rgba(220,38,38,0.06);
	color: #b91c1c;
}

.erp-pill{
	padding: 6px 10px;
	border-radius: 999px;
	font-size: 12px;
	border: 1px solid var(--border);
	background: var(--panel2);
}
.erp-pill-ok{ border-color: rgba(0,189,0,0.35); background: var(--accentSoft); }
.erp-pill-yellow{ border-color: rgba(202,138,4,0.45); background: rgba(202,138,4,0.10); color: #a16207; } /* w bazie rajdu */
.erp-pill-blue{ border-color: rgba(37,99,235,0.45); background: rgba(37,99,235,0.10); color: #1d4ed8; }   /* na trasie */
.erp-pill-warn{ border-color: rgba(180,83,9,0.35); background: var(--warnSoft); }
.erp-pill-danger{ border-color: rgba(220,38,38,0.35); background: rgba(220,38,38,0.08); color: #b91c1c; }
.erp-tag{ font-size: 12px; color: var(--muted); }

.erp-dot{
	display:inline-block;
	width: 10px;
	height: 10px;
	border-radius: 999px;
	margin-right: 8px;
	border: 1px solid rgba(17,24,39,0.18);
	vertical-align: middle;
}
.erp-dot-ok{ background: rgba(0,189,0,0.85); }
.erp-dot-warn{ background: rgba(220,38,38,0.85); }

.erp-role-select{
	font-size: 12px;
	border: 1px solid var(--border);
	background: var(--panel2);
	color: #111827;
	padding: 6px 10px;
	border-radius: 10px;
	max-width: 220px;
}
.erp-role-select:focus{
	outline: none;
	border-color: rgba(0,189,0,0.45);
	box-shadow: 0 0 0 3px rgba(0,189,0,0.10);
}

/* ===== MAIN ===== */
.erp-main{
	width: 100%;
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	padding: 14px 12px calc(90px + env(safe-area-inset-bottom));
}

.erp-pagehead{
	max-width: var(--max);
	margin: 0 auto 12px;
	display:flex;
	justify-content:space-between;
	gap: 12px;
	align-items:center;
}

.erp-h1{ margin:0; font-size: 18px; font-weight: 820; }
.erp-desc{ color: var(--muted); margin-top: 6px; }

.erp-view{
	max-width: var(--max);
	margin: 0 auto;
	display:flex;
	flex-direction:column;
	gap: 12px;
}
.erp-view[hidden]{
	display: none !important;
}


/* ===== BIG TILES (DASHBOARD) ===== */
.erp-tiles{
	display:grid;
	grid-template-columns: 1fr;
	gap: 12px;
}
.erp-tile{
	border: 1px solid var(--border);
	border-radius: var(--r2);
	background: var(--panel);
	box-shadow: var(--shadowSm);
	padding: 18px;
	min-height: 92px;

	display:flex;
	flex-direction:column;
	justify-content:center;
	gap: 6px;
}
.erp-tile:hover{ background: var(--panel2); }
.erp-tile-title{ font-size: 18px; font-weight: 850; }
.erp-tile-meta{ color: var(--muted); }

@media (max-width: 979px){
	/* dashboard: 2 kolumny na mobile + 95% szerokości */
	.erp-tiles{ grid-template-columns: repeat(2, 1fr); width: 95vw; margin: 0 auto; }

	/* Obsługa tagów: 4 kafle pod sobą + wypełnienie dostępnej przestrzeni */
	.erp-view[data-view="sedziowie_tagi_nfc"]{ flex: 1; }

	.erp-view[data-view="sedziowie_tagi_nfc"] .erp-card{
		flex: 1;
		display: flex;
		flex-direction: column;
	}

	.erp-view[data-view="sedziowie_tagi_nfc"] .erp-pad{
		flex: 1;
		display: flex;
		flex-direction: column;
		min-height: 0;
	}

	.erp-view[data-view="sedziowie_tagi_nfc"] .erp-tiles.erp-tiles-nfc{
		flex: 1;
		min-height: 0;

		/* węższe, żeby nie ucinało z prawej */
		max-width: 80vw;
		margin: 0 auto;

		/* override dla globalnego mobile (który robi 2 kolumny) */
		grid-template-columns: 1fr;
		grid-template-rows: repeat(5, minmax(90px, 1fr));
		gap: 12px;
	}

	.erp-view[data-view="sedziowie_tagi_nfc"] .erp-tiles.erp-tiles-nfc .erp-tile{
		min-height: 15vh;
	}

	/* gdy nic nie wybrane — pane ma nie zajmować miejsca */
	.erp-view[data-view="sedziowie_tagi_nfc"] #erpNfcPane:empty{
		display: none;
	}
}

/* ===== NFC: kafle narzędzi (Obsługa tagów) ===== */
button.erp-tile{
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	text-align: left;
	cursor: pointer;
	color: inherit;
	font: inherit;
}

button.erp-tile:disabled{
	opacity: .55;
	cursor: not-allowed;
}
button.erp-tile:disabled:hover{
	background: var(--panel);
}

.erp-tiles-nfc{
	width: min(1200px, 98vw);
	margin: 0 auto;
}

.erp-tiles-nfc .erp-tile.is-active{
	border-color: rgba(0,189,0,0.45);
	background: var(--accentSoft);
}

.erp-nfc-pane{
	margin-top: 12px;
}

/* ===== NFC: wizualizacja tagów (mapa) ===== */
.erp-mapwrap{
	border: 1px solid var(--border);
	border-radius: var(--r2);
	overflow: hidden;
	background: var(--panel2);
}

.erp-map{
	width: 100%;
	height: min(70vh, 700px);
}

@media (max-width: 979px){
	.erp-map{ height: 65vh; }
}

.erp-map-osline{
	filter: drop-shadow(0 1px 2px rgba(0,0,0,0.18));
}

.erp-map-stageline{
	filter: drop-shadow(0 1px 2px rgba(0,0,0,0.14));
}

/* ===== Leaflet: legenda + ikonki tagów ===== */
.erp-map-legend{
	background: rgba(18, 18, 18, 0.92);
	color: #fff;
	border: 1px solid rgba(255,255,255,0.12);
	border-radius: var(--r2);
	padding: 10px 12px;
	box-shadow: 0 10px 24px rgba(0,0,0,0.35);
	min-width: 180px;
}

.erp-map-legend .ttl{
	font-weight: 850;
	margin-bottom: 8px;
}

.erp-map-legend .row{
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 6px 0;
	font-size: 13px;
}

.erp-map-legend .dot{
	width: 12px;
	height: 12px;
	border-radius: 999px;
	display: inline-block;
	border: 2px solid rgba(255,255,255,0.9);
	box-shadow: 0 2px 10px rgba(0,0,0,0.25);
}

.erp-map-legend .dot.stage{ background: #1e90ff; }
.erp-map-legend .dot.os{ background: #f59e0b; }
.erp-map-legend .dot.cp{ background: #22c55e; }
.erp-map-legend .dot.other{ background: #a3a3a3; }

/* Ikonka Leaflet (DIV) */
.erp-map-icon{
	width: 18px;
	height: 18px;
	border-radius: 999px;
	border: 3px solid rgba(255,255,255,0.95);
	box-shadow: 0 6px 16px rgba(0,0,0,0.35);
	transform: translateZ(0);
}

.erp-map-icon.stage{ background: #1e90ff; }
.erp-map-icon.os{ background: #f59e0b; }
.erp-map-icon.cp{ background: #22c55e; }
.erp-map-icon.other{ background: #a3a3a3; }
.erp-map-icon.track{ background: #ef4444; }   /* pozycje kontrolne (GPS) */
.erp-map-icon.scan{ background: #3b82f6; }    /* skany NFC */

/* Live tracking: kropka + etykieta nad nią */
.erp-livemarker{
	position: relative;
	width: 60px;
	height: 34px;
}

.erp-crewdiamond{
	position: absolute;
	left: 50%;
	bottom: 1px;
	transform: translateX(-50%) rotate(45deg);
	width: 10px;
	height: 10px;
	background: #000;
	border: 2px solid #fff;
	box-shadow: 0 6px 14px rgba(0,0,0,0.35);
	border-radius: 2px;
}

/* Live tracking: tag NFC jako większa kropka (klikalna) */
.erp-tagdot{
	width: 14px;
	height: 14px;
	border-radius: 999px;
	background: #3b82f6;
	border: 3px solid #fff;
	box-shadow: 0 8px 18px rgba(0,0,0,0.25);
}

.erp-livelabel{
	position: absolute;
	left: 50%;
	bottom: 14px;
	transform: translateX(-50%);
	background: #fff;
	color: #000;
	border: 1px solid rgba(0,0,0,0.35);
	border-radius: 8px;
	padding: 2px 6px;
	font-weight: 900;
	font-size: 12px;
	line-height: 1.1;
	white-space: nowrap;
	box-shadow: 0 6px 14px rgba(0,0,0,0.18);
}

/* Live tracking: marker z numerem startowym */
.erp-livebadge{
	width: 34px;
	height: 34px;
	border-radius: 999px;
	border: 3px solid rgba(255,255,255,0.95);
	box-shadow: 0 8px 18px rgba(0,0,0,0.35);
	background: rgba(0,0,0,0.92);
	display: flex;
	align-items: center;
	justify-content: center;
	transform: translateZ(0);
}

.erp-livebadge-inner{
	color: #fff;
	font-weight: 900;
	font-size: 13px;
	line-height: 1;
	padding: 0 6px;
	white-space: nowrap;
}

/* Live tracking: checkbox w stylu ERP */
.erp-livechk{
	display:flex;
	align-items:flex-end;
	padding-bottom: 2px;
}

.erp-checkpill{
	display:flex;
	align-items:center;
	gap:10px;
	padding: 10px 12px;
	border-radius: 12px;
	border: 1px solid rgba(0,0,0,0.12);
	background: #fff;
	box-shadow: 0 8px 18px rgba(0,0,0,0.06);
	cursor: pointer;
	user-select: none;
	white-space: nowrap;
}

.erp-checkpill input{
	width: 18px;
	height: 18px;
	accent-color: #3b82f6;
	cursor: pointer;
}

.erp-checkpill span{
	font-weight: 800;
	color: #111;
	font-size: 13px;
}

.erp-geotools{
	display:flex;
	gap:10px;
	flex-wrap:wrap;
	margin-bottom:12px;
}

.erp-btn.is-active{
	border-color: rgba(0,189,0,0.45);
	background: var(--accentSoft);
}

.erp-geocrewmarker{
	position:relative;
	width:96px;
	height:62px;
}

.erp-geocrewpin{
	position:absolute;
	left:50%;
	bottom:2px;
	transform:translateX(-50%) rotate(45deg);
	width:14px;
	height:14px;
	border:3px solid #fff;
	border-radius:4px;
	box-shadow:0 8px 18px rgba(0,0,0,0.30);
}

.erp-geocrewtxt{
	position:absolute;
	left:50%;
	bottom:18px;
	transform:translateX(-50%);
	background:#fff;
	color:#000;
	border:1px solid rgba(0,0,0,0.35);
	border-radius:999px;
	padding:1px 7px;
	font-weight:900;
	font-size:11px;
	line-height:1.2;
	min-width:24px;
	text-align:center;
	pointer-events:none;
	box-shadow:0 6px 14px rgba(0,0,0,0.18);
	white-space:nowrap;
}

.erp-geocrewlabel{
	position:absolute;
	left:50%;
	bottom:38px;
	transform:translateX(-50%);
	background:#fff;
	color:#000;
	border:1px solid rgba(0,0,0,0.35);
	border-radius:8px;
	padding:2px 6px;
	font-weight:900;
	font-size:11px;
	line-height:1.1;
	white-space:nowrap;
	box-shadow:0 6px 14px rgba(0,0,0,0.18);
}

.erp-geotagdot{
	width:16px;
	height:16px;
	border-radius:999px;
	border:3px solid #fff;
	box-shadow:0 8px 18px rgba(0,0,0,0.25);
}

.erp-nfc-out{
	border: 1px solid var(--border);
	border-radius: var(--r2);
	background: var(--panel2);
	padding: 10px 12px;
	white-space: pre-wrap;
	word-break: break-word;
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	font-size: 12px;
	line-height: 1.35;
	max-height: 34vh;
	overflow: auto;
}

@media (min-width: 980px){
	/* “w środku” na desktopie */
	.erp-view[data-view="sedziowie_tagi_nfc"]{
		min-height: calc(100dvh - 240px);
		justify-content: center;
	}
}

/* ===== CARDS ===== */
.erp-card{
	border: 1px solid var(--border);
	border-radius: var(--r2);
	background: var(--panel);
	box-shadow: var(--shadowSm);
	overflow:hidden;
	width: 90vw;
}
.erp-cardhead{
	padding: 14px;
	border-bottom: 1px solid var(--border);
	display:flex;
	justify-content:space-between;
	gap: 12px;
	align-items:center;
}
.erp-cardtitle{ font-weight: 850; }
.erp-pad{ padding: 14px; }

/* ===== GRID HELPERS ===== */
.erp-grid{ display:grid; }
.erp-gap{ gap: 12px; }

/* kreator tras: karty zagnieżdżone nie mogą mieć 90vw (bo wylatują poza kontener) */
.erp-view[data-view="kreator_tras"] .erp-card .erp-card{ width: 100%; }

/* QR emulator: karty zagnieżdżone nie mogą mieć 90vw (bo wylatują poza kontener) */
.erp-view[data-view="sedziowie_qr_emulator"] .erp-card .erp-card{ width: 100%; }

/* GPS edit: karta boczna "Wybrany tag" też nie może dziedziczyć globalnego 90vw */
.erp-view[data-view="sedziowie_nfc_gps_edit"] .erp-card .erp-card{ width: 100%; }

@media (max-width: 979px){
	/* kreator tras: na telefonie jedna kolumna */
	.erp-view[data-view="kreator_tras"] .erp-grid{ grid-template-columns: 1fr !important; }
}

.erp-row{ display:flex; gap: 8px; align-items:center; flex-wrap:wrap; }
.erp-app-actions{ justify-content:flex-end; }
.erp-muted{ color: var(--muted); }

/* ===== FORMS ===== */
.erp-formrow{
	display:grid;
	gap: 12px;
	padding: 14px;
}

/* ===== KREATOR TRAS: formrow inline (bo globalnie .erp-formrow jest GRID) ===== */
.erp-view[data-view="kreator_tras"] .erp-formrow.erp-formrow-inline{
	display:flex;
	flex-wrap:wrap;
	align-items:flex-end;
	gap: 12px;
}

/* wyrównanie wysokości input/select i przycisków w kreatorze */
.erp-view[data-view="kreator_tras"] .erp-field input,
.erp-view[data-view="kreator_tras"] .erp-field select{
	height: 48px;
}

.erp-view[data-view="kreator_tras"] .erp-btn{
	height: 48px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
}

.erp-formrow.erp-formrow-2{
	grid-template-columns: 1fr 180px;
	align-items:end;
}
@media (min-width: 720px){
	.erp-formrow.erp-formrow-2{
		grid-template-columns: 1fr 260px;
		padding: 10px;
	}
}

.erp-field{ display:flex; flex-direction:column; gap: 6px; }
.erp-field span{ color: var(--muted2); font-size: 12px; }

.erp-field input,
.erp-field select{
	height: 48px;
	border-radius: var(--r);
	border: 1px solid var(--border);
	background: #ffffff;
	color: #111827;
	padding: 0 12px;
	outline: none;
	box-shadow: 0 1px 0 rgba(17,24,39,0.03);
}

.erp-field input:focus,
.erp-field select:focus{
	border-color: rgba(0,189,0,0.45);
	box-shadow: 0 0 0 3px rgba(0,189,0,0.10);
}

.erp-field textarea{
	min-height: 96px;
	border-radius: var(--r);
	border: 1px solid var(--border);
	background: #ffffff;
	color: #111827;
	padding: 10px 12px;
	outline: none;
	box-shadow: 0 1px 0 rgba(17,24,39,0.03);
	resize: vertical;
}

.erp-field textarea:focus{
	border-color: rgba(0,189,0,0.45);
	box-shadow: 0 0 0 3px rgba(0,189,0,0.10);
}

/* ===== FILE PICKER (ładny input file) ===== */
.erp-filepick{
	height: 48px;
	display:flex;
	align-items:center;
	gap: 12px;
	border-radius: var(--r);
	border: 1px solid var(--border);
	background: #ffffff;
	padding: 0 12px;
	box-shadow: 0 1px 0 rgba(17,24,39,0.03);
}

.erp-filepick-btn{
	height: 36px;
	display:inline-flex;
	align-items:center;
}

.erp-filepick-name{
	flex: 1;
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.erp-filepick-input{
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* dropdown lista: ciemny font */
.erp-field select,
.erp-field option{
	color: #111827 !important;
	background: #ffffff !important;
}

/* ===== CONFIG VIEW ===== */
.erp-view[data-view="settings"] #erpCfgGroups{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

/* grupowanie w POZIOMIE (wiersz): nagłówek po lewej, zawartość po prawej */
.erp-cfggroup{
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	padding: 0;
	border: 1px solid var(--border);
	border-radius: var(--r2);
	background: var(--panel);
	box-shadow: var(--shadowSm);
	overflow: hidden;
}

.erp-cfggrouphead{
	font-weight: 850;
	margin: 0;
	padding: 12px 14px;
	background: var(--panel2);
	border-right: 1px solid var(--border);
}

/* JS wstawia inline padding:0; nadpisujemy go */
.erp-cfggroup .erp-list{
	padding: 14px !important;
}

/* settings: element w poziomie (opis po lewej, pola po prawej) */
.erp-view[data-view="settings"] .erp-cfgitem{
	display: grid;
	grid-template-columns: 340px minmax(0, 1fr);
	gap: 16px;
	align-items: start;
}
.erp-view[data-view="settings"] .erp-cfgmeta{
	display: flex;
	flex-direction: column;
	gap: 6px;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: nowrap;
}
.erp-view[data-view="settings"] .erp-cfgfields{
	margin-top: 0; /* było pod spodem – teraz jest w prawej kolumnie */
}

@media (max-width: 979px){
	.erp-view[data-view="settings"] .erp-cfgitem{
		display: flex;
		flex-direction: column;
		gap: 10px;
	}
	.erp-view[data-view="settings"] .erp-cfgfields{
		margin-top: 10px;
	}
	.erp-cfggroup{ grid-template-columns: 1fr; }
	.erp-cfggrouphead{
		border-right: 0;
		border-bottom: 1px solid var(--border);
	}
}


.erp-cfgfields{ display:grid; gap: 12px; margin-top: 10px; }
@media (min-width: 720px){
	.erp-cfgfields{ grid-template-columns: 1fr 1fr; }
}
.erp-cfg-span2{ grid-column: 1 / -1; }

/* ===== LISTS ===== */
.erp-list{ display:flex; flex-direction:column; gap: 10px; padding: 14px; }
.erp-item{
	display:flex;
	gap: 12px;
	align-items:center;
	justify-content:space-between;
	padding: 14px;
	border-radius: var(--r2);
	border: 1px solid var(--border);
	background: var(--panel2);
	box-shadow: 0 1px 0 rgba(17,24,39,0.03);
}
.erp-itemmain{ flex: 1; min-width:0; }
.erp-itemtop{
	display:flex;
	gap: 10px;
	align-items:center;
	justify-content:space-between;
}
.erp-itemtitle{ font-weight: 850; }
.erp-itemactions{ display:flex; gap: 8px; flex-wrap:wrap; justify-content:flex-end; }


/* ===== STATYSTYKI ===== */
.erp-stats-item{
	transition: box-shadow .15s ease, border-color .15s ease;
}
.erp-stats-item.is-ready{
	border-left: 6px solid rgba(0,189,0,0.85);
	background: linear-gradient(90deg, rgba(0,189,0,0.08) 0, rgba(0,189,0,0.03) 110px, var(--panel2) 240px);
}
.erp-stats-item.is-low{
	border-left: 6px solid rgba(220,38,38,0.85);
	background: linear-gradient(90deg, rgba(220,38,38,0.08) 0, rgba(220,38,38,0.03) 110px, var(--panel2) 240px);
}
.erp-stats-summary{
	display:flex;
	flex-direction:column;
	gap:10px;
	margin-top:10px;
}
.erp-stats-summarybox,
.erp-stats-chartbox{
	align-items:stretch;
}
.erp-stats-kpis{
	display:grid;
	grid-template-columns: repeat(4, minmax(0,1fr));
	gap:10px;
	margin-top:12px;
}
.erp-stats-kpi{
	border:1px solid var(--border);
	border-radius: 14px;
	padding:10px 12px;
	background: #fff;
	box-shadow: 0 1px 6px rgba(0,0,0,0.05);
}
.erp-stats-kpi-label{
	font-size:12px;
	font-weight:850;
	color:var(--muted);
	margin-bottom:6px;
}
.erp-stats-kpi-value{
	font-size:24px;
	font-weight:900;
	line-height:1.1;
}
.erp-stats-tags{ gap: 14px; flex-wrap:wrap; }

.erp-stats-chart{
	display:grid;
	grid-template-columns: repeat(auto-fit, minmax(88px,1fr));
	gap:12px;
	align-items:end;
	margin-top:14px;
}
.erp-stats-col{
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:8px;
	min-width:0;
}
.erp-stats-colvalue{
	font-size:13px;
	font-weight:900;
}
.erp-stats-coltrack{
	height:180px;
	width:100%;
	max-width:56px;
	border-radius:14px;
	border:1px solid var(--border);
	background: linear-gradient(180deg, rgba(17,24,39,0.02), rgba(17,24,39,0.06));
	padding:6px;
	display:flex;
	align-items:flex-end;
}
.erp-stats-colbar{
	width:100%;
	border-radius:10px;
	min-height:10%;
	box-shadow: inset 0 -1px 0 rgba(255,255,255,0.35);
}
.erp-stats-collabel{
	font-size:12px;
	color:var(--muted);
	text-align:center;
	line-height:1.2;
}

.erp-stats-colbar.is-oczekujace{ background: #9ca3af; }
.erp-stats-colbar.is-zatwierdzone{ background: #f59e0b; }
.erp-stats-colbar.is-odrzucone{ background: #ef4444; }
.erp-stats-colbar.is-oplacone{ background: #00BD00; }
.erp-stats-colbar.is-wbazie{ background: #eab308; }
.erp-stats-colbar.is-natrasie{ background: #3b82f6; }
.erp-stats-colbar.is-ukonczyl{ background: #16a34a; }
.erp-stats-colbar.is-dsq{ background: #b91c1c; }
.erp-stats-colbar.is-poczasie{ background: #ea580c; }

@media (max-width: 920px){
	.erp-stats-kpis{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 560px){
	.erp-stats-kpis{ grid-template-columns: 1fr; }
	.erp-stats-coltrack{ height:140px; }
}

/* ===== TABLE ===== */
.erp-table{ padding: 14px; display:flex; flex-direction:column; gap: 8px; }
.erp-thead, .erp-trow{
	display:grid;
	/*grid-template-columns: 52px 1fr 1fr 110px;*/
	grid-template-columns: var(--erp-cols, 52px 1fr 1fr 110px);
	gap: 10px;
	align-items:center;
	padding: 12px 12px;
	border-radius: var(--r2);
	border: 1px solid var(--border);
	background: var(--panel2);
}
.erp-thead{ color: var(--muted2); font-size: 12px; }

.erp-clickrow{ cursor:pointer; }
.erp-clickrow:hover{
	border-color: rgba(0,189,0,0.35);
	box-shadow: 0 0 0 3px rgba(0,189,0,0.08);
}

/* ===== TABS (ZGŁOSZENIA) ===== */
.erp-tabs{
	display:flex;
	gap: 8px;
	flex-wrap:wrap;
}
.erp-tab{
	height: 40px;
	padding: 0 14px;
	border-radius: 6px;
	border: 1px solid var(--border);
	background: var(--panel);
	cursor:pointer;
}
.erp-tab:hover{ background: var(--panel2); }
.erp-tab.is-active{
	border-color: rgba(0,189,0,0.45);
	background: var(--accentSoft);
}

/* ===== TABLE (GRID) ===== */
.erp-tablewrap{
	padding: 0 14px 14px;
	overflow:auto;
}
.erp-tablegrid{
	width: 100%;
	border-collapse: collapse;
	min-width: 0;
	table-layout: fixed;
}
.erp-tablegrid th,
.erp-tablegrid td{
	word-break: break-word;
}
.erp-tablegrid thead th{
	text-align: left;
	font-size: 12px;
	color: var(--muted2);
	background: var(--panel2);
	border-bottom: 1px solid var(--border);
	padding: 12px;
	vertical-align: middle;
}
.erp-tablegrid tbody td{
	border-bottom: 1px solid var(--border);
	padding: 12px;
	vertical-align: middle;
}
.erp-tablegrid tbody tr:hover{
	background: var(--panel2);
}
.erp-tr{ cursor:pointer; }
.erp-td-muted{
	color: var(--muted);
	text-align: center;
	padding: 18px 12px !important;
}
.erp-small{ font-size: 12px; color: var(--muted); }
.erp-mono{
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.erp-nfc-toggle{
	min-width: 220px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	font-weight: 850;
}
.erp-kv{ display:flex; flex-direction:column; gap: 3px; }

.erp-details{
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--border);
}
.erp-details summary{
	cursor: pointer;
	user-select: none;
	color: var(--muted2);
	font-weight: 750;
}
.erp-details[open] summary{ margin-bottom: 10px; }

/* ===== APPLICATION (PODGLĄD) ===== */
.erp-detail-section{
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--border);
}
.erp-detail-h{
	font-weight: 700;
	margin: 0 0 10px;
}
.erp-detail-grid{
	display:grid;
	grid-template-columns: 1fr;
	gap: 10px;
}
@media (min-width: 720px){
	.erp-detail-grid{ grid-template-columns: 1fr 1fr; }
}
.erp-kvitem{
	border: 1px solid var(--border);
	border-radius: var(--r2);
	background: var(--panel2);
	padding: 10px;
}
.erp-kvlabel{
	font-size: 12px;
	color: var(--muted);
	margin-bottom: 4px;
}
.erp-kvvalue{
	font-size: 14px;
	line-height: 1.3;
	white-space: pre-wrap;
	word-break: break-word;
}
.erp-photo{
	width: 100%;
	max-height: 260px;
	object-fit: cover;
	border-radius: var(--r2);
	border: 1px solid var(--border);
}

.erp-photoicon{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width: 44px;
	height: 44px;
	border-radius: 14px;
	border: 1px solid var(--border);
	background: var(--panel);
	cursor:pointer;
	padding: 0;
}
.erp-photoicon:hover{ background: var(--panel2); }
.erp-photoicon span{ font-size: 20px; line-height: 1; }

.erp-veh-nameval{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap: 10px;
}

.erp-photoicon-sm{
	width: 38px;
	height: 38px;
	border-radius: 12px;
}
.erp-photoicon-sm span{ font-size: 18px; }

.erp-photoicon.is-off{
	opacity: .45;
	cursor: default;
	pointer-events: none;
}

.erp-crew-sep{
	height: 1px;
	background: var(--border);
	margin: 10px 0;
}

/* ===== CREW (PODGLĄD): Akcje + Pojazd (desktop: 2 kolumny) ===== */
.erp-actions-row{
	display:flex;
	gap: 10px;
	align-items:center;
	flex-wrap: wrap;
}

/* Akcje w podglądzie załogi: bez "małego" rozdzielacza nad sekcją */
.erp-detail-section.erp-crew-actions{
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

.erp-actions-status{
	display:flex;
	align-items:center;
	gap: 10px;
	font-weight: 800;
}

/* Crew view: status lewo, przycisk DQ prawo */
.erp-detail-section.erp-crew-actions .erp-actions-status{
	margin-right: auto;
	text-align: left;
}

.erp-select{
	height: var(--tap);
	padding: 0 12px;
	border-radius: var(--r);
	border: 1px solid var(--border);
	background: var(--panel);
	color: inherit;
	min-width: 240px;
}

.erp-btn-danger{
	border-color: rgba(220,38,38,0.35);
	background: rgba(220,38,38,0.10);
	color: #b91c1c;
	font-weight: 900;
}
.erp-btn-danger:hover{
	background: rgba(220,38,38,0.14);
}

.erp-btn-warn{
	border-color: rgba(180,83,9,0.45);
	background: var(--warnSoft);
	color: #92400e;
	font-weight: 900;
}
.erp-btn-warn:hover{
	background: rgba(180,83,9,0.14);
}

.erp-veh-grid{
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
}

.erp-veh-left{
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
}

@media (min-width: 980px){
	.erp-actions-row{ flex-wrap: nowrap; }
	.erp-select{ min-width: 320px; }

	/* pojazd: lewa (nazwa+rej) / prawa (zdjęcie) */
	.erp-veh-grid{
		grid-template-columns: 1fr 1fr;
		align-items: start;
	}
	.erp-veh-grid .erp-photo{
		max-height: 360px;
	}
}

.erp-payrow{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap: 10px;
}
.erp-btn-small{
	height: 38px;
	padding: 0 12px;
	border-radius: 12px;
}

/* ===== DETAIL LAYOUT HELPERS ===== */
.erp-span2{ grid-column: 1 / -1; }

/* Imię+PESEL w jednej linii */
.erp-splitline{
	display:grid;
	grid-template-columns: 1fr 220px;
	gap: 12px;
	align-items:start;
}
@media (max-width: 720px){
	.erp-splitline{ grid-template-columns: 1fr; }
}

/* Telefon + koszulka pod sobą */
.erp-contactstack{
	display:flex;
	flex-direction:column;
	gap: 6px;
}

/* Edycja zgłoszenia: proste pola */
.erp-editname{
	display:grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}
@media (max-width: 720px){
	.erp-editname{ grid-template-columns: 1fr; }
}

.erp-editstack{
	display:flex;
	flex-direction:column;
	gap: 10px;
}

/* Pojazd: lewa kolumna info, prawa miniatura */
.erp-vehiclebox{
	display:grid;
	grid-template-columns: 1fr 220px;
	gap: 12px;
	align-items:start;
}
@media (max-width: 720px){
	.erp-vehiclebox{ grid-template-columns: 1fr; }
}
.erp-veh-lines{
	display:flex;
	flex-direction:column;
	gap: 6px;
}
.erp-veh-line strong{ font-weight: 750; }

.erp-thumb{
	width: 100%;
	max-height: 160px;
	object-fit: cover;
	border-radius: var(--r2);
	border: 1px solid var(--border);
	background: var(--panel);
}

/* ===== APPLICATIONS: mobile tiles (bez przewijania) ===== */
@media (max-width: 720px){
	.erp-tablewrap{
		overflow: visible;
		padding: 0 14px 14px;
	}

	.erp-tablegrid{ display:block; width:100%; }
	.erp-tablegrid thead{ display:none; }

	.erp-tablegrid tbody{
		display:flex;
		flex-direction:column;
		gap: 10px;
	}

	.erp-tablegrid tbody tr{
		display:block;
		border: 1px solid var(--border);
		border-radius: var(--r2);
		background: var(--panel2);
		padding: 10px;
	}

	.erp-tablegrid tbody td{
		display:block;
		border: 0;
		padding: 8px 6px;
	}

	.erp-tablegrid tbody td + td{
		border-top: 1px dashed var(--border);
	}
}

.erp-badge{
	display:inline-block;
	margin-left: 8px;
	padding: 4px 8px;
	border-radius: 999px;
	font-size: 12px;
	border: 1px solid rgba(0,189,0,0.35);
	background: var(--accentSoft);
}

.erp-badge-danger{
	display:inline-block;
	margin-left: 8px;
	padding: 4px 8px;
	border-radius: 999px;
	font-size: 12px;
	border: 1px solid rgba(220,38,38,0.35);
	background: rgba(220,38,38,0.08);
	color: #b91c1c;
}

.erp-badge-warn{
	display:inline-block;
	margin-left: 8px;
	padding: 4px 8px;
	border-radius: 999px;
	font-size: 12px;
	border: 1px solid rgba(180,83,9,0.35);
	background: var(--warnSoft);
	color: var(--warn);
}

/* scanlog alerts badge (kółeczko na przycisku) */
.erp-btn.has-badge{
	position: relative;
	padding-right: 42px; /* miejsce na kółeczko */
}

.erp-badge-circle{
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	width: 22px;
	height: 22px;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	border: 1px solid rgba(0,189,0,0.35);
	background: var(--accentSoft);
	color: inherit;
}

.erp-badge-circle.is-bad{
	border: 1px solid rgba(220,38,38,0.35);
	background: rgba(220,38,38,0.08);
	color: #b91c1c;
}

.erp-text-danger{ color: #b91c1c; }
.erp-place-icon{ margin-left:6px; }
.erp-crew-inline{ display:none; }

.erp-crew-alert-badge{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:20px;
	height:20px;
	padding:0 6px;
	margin-left:8px;
	border-radius:999px;
	font-size:11px;
	font-weight:700;
	line-height:1;
	border:1px solid rgba(0,189,0,0.35);
	background: var(--accentSoft);
	color:#166534;
	vertical-align:middle;
}

.erp-crew-alert-badge.is-bad{
	border:1px solid rgba(220,38,38,0.35);
	background: rgba(220,38,38,0.08);
	color:#b91c1c;
}

.erp-crew-alert-badge.is-ok{
	border:1px solid rgba(0,189,0,0.35);
	background: var(--accentSoft);
	color:#166534;
}

.erp-penalty-sum{
	color:#b91c1c;
	font-size:10px;
	line-height:1.1;
	margin-top:4px;
}

@media print{
	/* NIE ustawiamy @page, żeby zostawić domyślne marginesy drukarki */

	html, body{
		background:#fff !important;
		color:#000 !important;
		font-size:11px !important;
		line-height:1.15 !important;
		margin:0 !important;
		padding:15px !important;
	}

	.erp-noprint{ display:none !important; }

	/* każda klasa (nagłówek + tabela) na nowej stronie */
	.erp-title{
		break-before: page;
		page-break-before: always;

		margin:6px 0 4px !important;
		padding:0 !important;
		border:none !important;
		box-shadow:none !important;
		font-size:14px !important;
		font-weight:700 !important;
	}

	/* ale NIE rób nowej strony przed pierwszą klasą */
	.erp-title:first-of-type{
		break-before: auto;
		page-break-before: auto;
	}

	.erp-muted{ opacity:0.75 !important; color:#000 !important; }
	.erp-crew-inline{ display:inline !important; }
	.erp-crew-extra{ display:none !important; }
	.erp-place-icon{ display:none !important; }

	.erp-table{
		border:none !important;
		border-radius:0 !important;
		box-shadow:none !important;
		background:transparent !important;
		margin:0 0 10px 0 !important;

		break-inside: avoid;
		page-break-inside: avoid;
	}

	.erp-thead, .erp-trow{
		grid-template-columns: var(--erp-cols-print, var(--erp-cols, 52px 1fr 1fr 110px));
		gap:0 !important;
	}

	.erp-thead{
		font-weight:700 !important;
		font-size:12px !important;
		color:#000 !important;
		background:transparent !important;
		border-bottom:1px solid #000 !important;
		padding:0 !important;
	}

	.erp-thead > div, .erp-trow > div{
		padding:3px 5px !important;
	}

	.erp-trow{
		border:none !important;
		border-bottom:1px solid #ddd !important;
		border-radius:0 !important;
		box-shadow:none !important;
		background:transparent !important;
		margin:0 !important;
		padding:0 !important;

		break-inside: avoid;
		page-break-inside: avoid;
	}

	/* badge’e na wydruku = zwykły tekst */
	.erp-badge,
	.erp-badge-danger{
		border:none !important;
		background:transparent !important;
		color:#000 !important;
		padding:0 !important;
		margin:0 !important;
		font-size:12px !important;
		border-radius:0 !important;
	}

	.erp-text-danger{ color:#000 !important; } /* bez czerwieni na wydruku */
	.erp-penalty-sum{
		color:#000 !important;
		font-size:10px !important;
		margin-top:2px !important;
	}
}

/* ===== FOOTER ===== */
.erp-footer{
	max-width: var(--max);
	margin: 14px auto 0;
	padding: 10px 4px 0;
	display:flex;
	justify-content:space-between;
	color: var(--muted2);
}

/* ===== BOTTOM NAV (MOBILE) ===== */
.erp-bottom{
	position: fixed;
	left: 0; right: 0; bottom: 0;
	padding: 10px 10px calc(env(safe-area-inset-bottom) + 10px);
	background: var(--header);
	border-top: 1px solid var(--border);
	display:grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
	z-index: 45;
	box-shadow: var(--shadowSm);
}
.erp-bitem{
	min-height: 46px;
	border-radius: var(--r2);
	border: 1px solid var(--border);
	background: var(--panel);
	display:flex;
	align-items:center;
	justify-content:center;
	font-size: 12px;
}
.erp-bitem.is-active{
	border-color: rgba(0,189,0,0.45);
	background: var(--accentSoft);
}

/* ===== DESKTOP ===== */
@media (min-width: 980px){
	:root{ --max: 90vw; }

	.erp-main{ padding: 18px 16px 18px; }
	.erp-bottom{ display:none; }

	/* dashboard: 3 kolumny + DUŻE kafle + szeroki obszar */
	.erp-view[data-view="dashboard"]{
		width: min(1600px, 98vw);
		max-width: none;
	}
	.erp-view[data-view="dashboard"] > .erp-card{
		width: 100%;
		max-width: 100%;
		min-width: 0;
		box-sizing: border-box;
	}
	.erp-tiles{
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 18px;
	}
	.erp-tile{
		padding: 30px;
		min-height: 170px;
	}
	.erp-tile-title{ font-size: 22px; }
	.erp-tile-meta{ font-size: 14px; }
}
@media (max-width: 768px){
	.erp-view[data-view="dashboard"] > .erp-card{
		width: 100% !important;
		margin-left: 0;
		margin-right: 0;
	}
}
/* ===== LOGIN (AUTH) ===== */
.erp-top-auth{
	justify-content: center;
}

.erp-auth{
	min-height: 100dvh;
	display:flex;
	flex-direction:column;
	background: var(--bg);
}

.erp-auth-main{
	flex: 1;
	display:flex;
	align-items:center;
	justify-content:center;
	padding: 18px 12px 24px;
}

.erp-auth-card{
	width: min(520px, 100%);
	border: 1px solid var(--border);
	border-radius: var(--r2);
	background: var(--panel);
	box-shadow: var(--shadow);
	padding: 18px;
}

.erp-auth-h1{
	margin: 0;
	font-size: 20px;
	font-weight: 850;
}

.erp-auth-p{
	margin: 6px 0 14px;
	color: var(--muted);
}

.erp-auth-form{
	display:flex;
	flex-direction:column;
	gap: 12px;
}

.erp-check{
	display:flex;
	gap: 10px;
	align-items:center;
	color: var(--muted);
	user-select:none;
}
.erp-check input{
	width: 18px;
	height: 18px;
}

.erp-btn-primary{
	border-color: rgba(0,189,0,0.35);
	background: var(--accentSoft);
}

.erp-btn-blue{
	border-color: rgba(37,99,235,0.35);
	background: rgba(37,99,235,0.12);
}
.erp-btn-blue:hover{
	background: rgba(37,99,235,0.16);
}
.erp-btn-blue:disabled{
	background: rgba(37,99,235,0.08);
}

.erp-auth-links{
	display:flex;
	justify-content:center;
	gap: 10px;
	margin-top: 6px;
	color: var(--muted);
}

.erp-link{
	color: var(--muted);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.erp-sep{ color: var(--muted2); }

.erp-auth-note{
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid var(--border);
	color: var(--muted2);
	font-size: 12px;
	text-align:center;
}

.erp-auth-footer{
	padding: 10px 12px calc(env(safe-area-inset-bottom) + 10px);
	border-top: 1px solid var(--border);
	background: var(--header);
	display:flex;
	justify-content:space-between;
	color: var(--muted2);
}
/* ===== ALERTS (LOGIN FEEDBACK) ===== */
.erp-alert{
	border: 1px solid var(--border);
	background: var(--panel2);
	border-radius: var(--r2);
	padding: 12px 12px;
	margin: 10px 0 0;
	box-shadow: var(--shadowSm);
	font-weight: 650;
}

.erp-alert-error{
	border-color: rgba(220,38,38,0.35);
	background: rgba(220,38,38,0.08);
	color: #7f1d1d;
}

.erp-alert-ok{
	border-color: rgba(0,189,0,0.35);
	background: var(--accentSoft);
	color: #14532d;
}
/* ===== FOOTER (jak w panelu zawodnika) ===== */
footer{
	margin-top: auto;
	width: 100%;
	background: var(--header);
	border-top: 1px solid var(--border);
	box-shadow: var(--shadowSm);
	padding: 12px 0 calc(env(safe-area-inset-bottom) + 12px);
	color: var(--muted2);
	height: 8vh;
}

.container{
	max-width: var(--max);
	margin: 0 auto;
	padding: 0 12px;
}

.card{
	border: 1px solid var(--border);
	border-radius: var(--r2);
	background: var(--panel);
	box-shadow: var(--shadowSm);
}

.footer-card{
	background: transparent;
	padding: 0;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.footer-grid{
	display: grid;
	grid-template-columns: 56px 1fr 1.2fr;
	gap: 10px;
	align-items: center;
}

.footer-left{
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.footer-center{
	text-align: center;
	color: var(--muted);
	font-size: 13px;
}

.footer-version{
	display: inline-block;
	margin-top: 2px;
	font-size: 12px;
	color: var(--muted2);
}

.footer-right{
	text-align: right;
	color: var(--muted);
	font-size: 13px;
}

.footer-right a{
	color: var(--text);
	text-decoration: none;
	border-bottom: 1px solid var(--border);
	padding-bottom: 1px;
}

.footer-right a:hover{
	border-bottom-color: var(--text);
}

.footer-logo{
	height: 5vh;
	display: block;
	object-fit: contain;
}

@media (max-width: 720px){
	.footer-grid{
		grid-template-columns: 1fr;
		text-align: center;
	}
	.footer-left{ justify-content: center; }
	.footer-right{ text-align: center; }
}
/* A2HS tile (mobile dashboard) */
.erp-tile-install{
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	text-align: left;
	cursor: pointer;
}
@media (min-width: 980px){
	.erp-tile-install{ display: none !important; }
}

/* ===== PŁYNNE PRZEJŚCIA WIDOKÓW (CSS-only, animacja wejścia) ===== */
@media (prefers-reduced-motion: no-preference){
	.erp-view:not([hidden]){
		animation: erpViewIn .45s ease-out both;
	}

	@keyframes erpViewIn{
		from{ opacity:0; transform: translateY(8px); }
		to  { opacity:1; transform: translateY(0); }
	}

	/* subtelnie: karty/sekcje też płynnie “siadają” */
	.erp-view:not([hidden]) .erp-card{
		animation: erpCardIn .45s ease-out both;
	}
	@keyframes erpCardIn{
		from{ opacity:0; transform: translateY(6px); }
		to  { opacity:1; transform: translateY(0); }
	}
}

/* ===== KREATOR TRAS: wyrównania form ===== */
.erp-view[data-view="kreator_tras"] .erp-formrow,
.erp-view[data-view="kreator_tras"] .erp-row{
	align-items: stretch;
}

.erp-view[data-view="kreator_tras"] .erp-field input,
.erp-view[data-view="kreator_tras"] .erp-field select{
	height: 40px;
}

.erp-view[data-view="kreator_tras"] .erp-btn{
	height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* ===== NFC pane ===== */
.erp-nfc-pane .erp-card{ width: 100%; }

/* ===== QR EMULATOR: layout + overflow fix ===== */
.erp-qr-grid{
	display: grid;
	grid-template-columns: 360px minmax(0, 1fr);
	gap: 16px;
	align-items: start;
}

/* mobile */
@media (max-width: 980px){
	.erp-qr-grid{
		grid-template-columns: 1fr;
	}
}

.erp-qr-img{
	width: 100%;
	max-width: 340px;
	aspect-ratio: 1 / 1;
	height: auto;
	object-fit: contain;
	border-radius: 12px;
	display: block;
}

/* payload MUST NOT push container width */
.erp-qr-payload{ min-width: 0; }
.erp-qr-payloadtext{
	white-space: normal !important;   /* override .erp-mono if it uses nowrap */
	overflow-wrap: anywhere;
	word-break: break-word;
}

/* expired state (optional visual) */
.erp-qr-expired .erp-qr-img{
	opacity: 0.25;
	filter: grayscale(1);
}

/* ===== TRACKING: mini podsumowania ===== */
.erp-grid2{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); }
@media (max-width: 820px){ .erp-grid2{ grid-template-columns:1fr; } }
.erp-mini{ border:1px solid #e5e7eb; border-radius:14px; padding:10px 12px; background:#fff; box-shadow: 0 1px 6px rgba(0,0,0,0.05); }
.erp-mini-ttl{ font-size:12px; font-weight:850; color:#6b7280; margin-bottom:6px; }
.erp-mini-val{ font-size:22px; font-weight:900; line-height:1.1; }
.erp-mini-sub{ font-size:12px; color:#6b7280; margin-top:4px; }

.erp-card-embedded{
	padding:0;
	overflow:hidden;
}

.erp-card-embedded .erp-cardhead{
	padding:16px 18px 12px;
	border-bottom:1px solid rgba(255,255,255,0.08);
}

.erp-embed-frame-wrap{
	width:100%;
	height:calc(100vh - 250px);
	min-height:720px;
	background:#0f172a;
}

.erp-embed-frame{
	display:block;
	width:100%;
	height:100%;
	border:0;
	background:#ffffff;
}

@media (max-width: 991px){
	.erp-embed-frame-wrap{
		height:calc(100vh - 220px);
		min-height:640px;
	}
}

@media (max-width: 767px){
	.erp-card-embedded .erp-cardhead{
		padding:14px 14px 10px;
	}
	.erp-embed-frame-wrap{
		height:calc(100vh - 190px);
		min-height:560px;
	}
}

.erp-card-embedded{
	padding:0;
	overflow:hidden;
}

.erp-embed-frame-wrap{
	width:100%;
	height:calc(100vh - 250px);
	min-height:720px;
	background:#0f172a;
}

.erp-embed-frame{
	display:block;
	width:100%;
	height:100%;
	border:0;
	background:#ffffff;
}

@media (max-width: 991px){
	.erp-embed-frame-wrap{
		height:calc(100vh - 220px);
		min-height:640px;
	}
}

@media (max-width: 767px){
	.erp-embed-frame-wrap{
		height:calc(100vh - 190px);
		min-height:560px;
	}
}

/* ===== DASHBOARD: zdrowie systemu ===== */
.erp-health-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:12px;
}
.erp-health-item{
	border:1px solid rgba(0,0,0,0.10);
	border-radius:14px;
	background:#fff;
	padding:14px;
	box-shadow:0 8px 18px rgba(0,0,0,0.05);
}
.erp-health-label{
	font-size:12px;
	color:#6b7280;
	margin-bottom:6px;
}
.erp-health-value{
	font-size:26px;
	font-weight:900;
	line-height:1.1;
}
.erp-health-value.is-ok{ color:#166534; }
.erp-health-value.is-warn{ color:#b45309; }
.erp-health-value.is-bad{ color:#b91c1c; }

@media (max-width: 900px){
	.erp-health-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 640px){
	.erp-health-grid{ grid-template-columns:1fr; }
}

/* ===== NFC: beta grid ===== */
.erp-nfc-beta-grid{
	display:flex;
	flex-direction:column;
	gap:14px;
}
.erp-nfc-beta-stage{
	border:1px solid rgba(0,0,0,0.10);
	border-radius:16px;
	background:#fff;
	box-shadow:0 8px 18px rgba(0,0,0,0.05);
	overflow:hidden;
}
.erp-nfc-beta-stagehead{
	padding:12px 14px;
	font-size:14px;
	font-weight:900;
	border-bottom:1px solid rgba(0,0,0,0.08);
	background:#f9fafb;
}
.erp-nfc-beta-rows{
	display:flex;
	flex-direction:column;
}
.erp-nfc-beta-row{
	display:grid;
	grid-template-columns:220px 1fr;
	gap:12px;
	padding:12px 14px;
	border-top:1px solid rgba(0,0,0,0.06);
	align-items:start;
}
.erp-nfc-beta-row:first-child{ border-top:0; }
.erp-nfc-beta-rowlabel{
	font-size:12px;
	font-weight:800;
	color:#374151;
	padding-top:8px;
}
.erp-nfc-beta-pills{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
}
.erp-nfc-beta-pill{
	border:1px solid rgba(0,0,0,0.10);
	border-radius:999px;
	background:#f3f4f6;
	color:#111827;
	padding:8px 12px;
	font-size:12px;
	font-weight:800;
	cursor:pointer;
	transition:.15s ease;
}
.erp-nfc-beta-pill:hover{
	transform:translateY(-1px);
	box-shadow:0 8px 16px rgba(0,0,0,0.08);
}
.erp-nfc-beta-pill .meta{
	display:block;
	font-size:11px;
	font-weight:600;
	opacity:.8;
	margin-top:2px;
}
.erp-nfc-beta-pill.is-empty{
	background:#e5e7eb;
	color:#4b5563;
}
.erp-nfc-beta-pill.is-ok{
	background:#dcfce7;
	border-color:#86efac;
	color:#166534;
}
.erp-nfc-beta-pill.is-replaced{
	background:#ffedd5;
	border-color:#fdba74;
	color:#9a3412;
}

@media (max-width: 720px){
	.erp-nfc-beta-row{
		grid-template-columns:1fr;
	}
	.erp-nfc-beta-rowlabel{
		padding-top:0;
	}
}

.erp-nfc-beta-topcard{
	border:1px solid rgba(59,130,246,0.18);
}

.erp-gps-pill{
	margin-left:0;
}

.erp-gps-pill.is-good{
	border:1px solid rgba(0,189,0,0.35);
	background:var(--accentSoft);
	color:var(--accent);
}

.erp-gps-pill.is-warn{
	border:1px solid rgba(180,83,9,0.35);
	background:var(--warnSoft);
	color:var(--warn);
}

.erp-gps-pill.is-bad{
	border:1px solid rgba(220,38,38,0.35);
	background:rgba(220,38,38,0.08);
	color:#b91c1c;
}

.erp-gps-meta{
	font-size:12px;
}

.erp-gps-live-row{
	align-items:center;
}

.erp-nfc-beta-pill.is-selected{
	outline:2px solid #2563eb;
	outline-offset:1px;
	box-shadow:0 10px 20px rgba(37,99,235,0.18);
	transform:translateY(-1px);
}

.erp-nfc-beta-pill.is-selected .meta{
	opacity:1;
}

@media (max-width: 720px){
	.erp-nfc-beta-topcard .erp-cardhead{
		flex-direction:column;
		align-items:stretch;
	}
}

/* ===== NFC MAPA: opisy punktów + pozycja użytkownika ===== */
.erp-map-legend .dot.user{
	background:#111827;
	box-shadow: inset 0 0 0 4px #60a5fa;
}

.erp-map-icon.user{
	background:#111827;
	position:relative;
}
.erp-map-icon.user::after{
	content:"";
	position:absolute;
	inset:4px;
	border-radius:999px;
	background:#60a5fa;
}

.leaflet-tooltip.erp-map-taglabel{
	background:#fff;
	border:1px solid rgba(17,24,39,0.14);
	color:#111827;
	border-radius:999px;
	box-shadow:0 6px 16px rgba(0,0,0,0.18);
	padding:2px 8px;
	font-size:11px;
	font-weight:800;
	line-height:1.25;
}
.leaflet-tooltip-top.erp-map-taglabel:before,
.leaflet-tooltip-bottom.erp-map-taglabel:before,
.leaflet-tooltip-left.erp-map-taglabel:before,
.leaflet-tooltip-right.erp-map-taglabel:before{
	display:none;
}
.erp-map.erp-map-dragging .leaflet-tooltip.erp-map-taglabel{
	display:none !important;
}
@media (max-width: 768px){
	.leaflet-tooltip.erp-map-taglabel{
		font-size:10px;
		padding:2px 6px;
		max-width:140px;
		white-space:normal;
		text-align:center;
	}
}

/* ===== NFC GPS EDIT ===== */
.erp-gpsedit-shell{
	align-items:flex-start;
}

.erp-gpsedit-mapcol{
	flex:1 1 100%;
	min-width:320px;
}

.erp-gpsedit-side{
	flex:1 1 100%;
	min-width:0;
}

.erp-map-icon.editing{
	background:#111827;
	box-shadow:0 0 0 3px rgba(220,38,38,0.25);
}
.erp-map-icon.editing::after{
	content:"";
	position:absolute;
	inset:4px;
	border-radius:999px;
	background:#ef4444;
}

.erp-gpsedit-popupactions{
	display:flex;
	gap:8px;
	margin-top:10px;
	flex-wrap:wrap;
}

.erp-gpsedit-actions{
	display:flex;
	gap:10px;
	flex-wrap:wrap;
	align-items:stretch;
}

.erp-gpsedit-actions .erp-btn{
	flex:1 1 180px;
	justify-content:center;
}

.erp-gpsedit-help{
	line-height:1.45;
	white-space:normal;
	word-break:break-word;
}

@media (max-width: 980px){
	.erp-gpsedit-mapcol{
		flex:1 1 100%;
		min-width:0;
	}

	.erp-gpsedit-side{
		flex:1 1 100%;
		min-width:0;
	}
}

.erp-gpsimport-status.is-ok{
	border-color:rgba(0,189,0,0.35);
	background:var(--accentSoft);
	color:var(--accent);
}

.erp-gpsimport-status.is-warn{
	border-color:rgba(180,83,9,0.35);
	background:var(--warnSoft);
	color:var(--warn);
}

.erp-gpsimport-status.is-bad{
	border-color:rgba(220,38,38,0.35);
	background:rgba(220,38,38,0.08);
	color:#b91c1c;
}

.erp-gpsimport-tagcell{
	display:flex;
	flex-direction:column;
	gap:4px;
}

.erp-gpsimport-pointname{
	font-weight:700;
}

.erp-gpsimport-help{
	margin-top:4px;
}

.erp-gpsimport-tablewrap{
	padding-top:0;
}

.erp-gpsimport-table .erp-select{
	min-width:220px;
	width:100%;
}

.erp-gpsimport-status{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:4px 8px;
	border-radius:999px;
	font-size:12px;
	font-weight:800;
	white-space:nowrap;
	border:1px solid var(--border);
	background:var(--panel2);
	color:var(--text);
}
.erp-gpsimport-status.is-ok{border-color:rgba(0,189,0,0.35);background:var(--accentSoft);color:var(--accent);}
.erp-gpsimport-status.is-warn{border-color:rgba(180,83,9,0.35);background:var(--warnSoft);color:var(--warn);}
.erp-gpsimport-status.is-bad{border-color:rgba(220,38,38,0.35);background:rgba(220,38,38,0.08);color:#b91c1c;}
.erp-gpsimport-status.is-muted{border-color:var(--border);background:var(--panel2);color:var(--muted);}
.erp-gpsimport-tagcell{display:flex;flex-direction:column;gap:4px;}
.erp-gpsimport-pointname{font-weight:700;}
.erp-gpsimport-help{margin-top:4px;}