/* ECUJura File Service - front
   Kolory, odstepy i typografia brane sa ze zmiennych motywu ECUJura
   (--c-*, --sp-*, --fs-*, --radius, --ease). Wartosci po przecinku to
   fallback, gdy wtyczka dziala na innym motywie. */

.efs-panel,
.efs-form,
.efs-box,
.efs-landing {
	--efs-bg: var(--c-bg, #0b0e13);
	--efs-bg-alt: var(--c-bg-alt, #10151d);
	--efs-raised: var(--c-bg-raised, #161d27);
	--efs-inset: var(--c-bg-inset, #080b10);
	--efs-text: var(--c-text, #e8eef5);
	--efs-muted: var(--c-text-muted, #9dabba);
	--efs-dim: var(--c-text-dim, #75838f);
	--efs-accent: var(--c-accent, #f2444e);
	--efs-accent-strong: var(--c-accent-strong, #d92d3a);
	--efs-accent-hover: var(--c-accent-hover, #ff6b73);
	--efs-accent-dim: var(--c-accent-dim, rgba(242, 68, 78, .12));
	--efs-on-accent: var(--c-accent-text, #fff);
	--efs-line: var(--c-border, #1e2733);
	--efs-line-strong: var(--c-border-strong, #2f3b4a);
	--efs-r: var(--radius, 10px);
	--efs-r-sm: var(--radius-sm, 6px);
	--efs-ease: var(--ease, cubic-bezier(.22, .61, .36, 1));

	color: var(--efs-text);
	font-size: var(--fs-sm, .9375rem);
}

/* ---------------- komunikaty ---------------- */

.efs-notice {
	padding: var(--sp-3, .75rem) var(--sp-4, 1rem);
	border-radius: var(--radius-sm, 6px);
	margin: 0 0 var(--sp-5, 1.5rem);
	border: 1px solid;
	font-size: var(--fs-sm, .9375rem);
}
.efs-notice.efs-ok { background: rgba(53, 192, 106, .1); border-color: rgba(53, 192, 106, .35); color: #b7ecc9; }
.efs-notice.efs-err { background: var(--c-accent-dim, rgba(242, 68, 78, .12)); border-color: rgba(242, 68, 78, .35); color: var(--c-accent-hover, #ff6b73); }

.efs-muted { color: var(--efs-muted); font-size: var(--fs-xs, .8125rem); }

/* ---------------- przyciski (spojne z .btn motywu) ---------------- */

.efs-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--sp-2, .5rem);
	padding: var(--sp-3, .75rem) var(--sp-5, 1.5rem);
	font-family: inherit;
	font-size: var(--fs-sm, .9375rem);
	font-weight: 600;
	line-height: 1.3;
	border: 1px solid transparent;
	border-radius: var(--efs-r-sm);
	background: var(--efs-accent-strong);
	color: var(--efs-on-accent) !important;
	text-decoration: none !important;
	cursor: pointer;
	transition: background .2s var(--efs-ease), border-color .2s var(--efs-ease),
	            color .2s var(--efs-ease), box-shadow .25s var(--efs-ease),
	            transform .15s var(--efs-ease);
}
.efs-btn:hover {
	background: var(--efs-accent);
	box-shadow: 0 6px 22px var(--efs-accent-dim);
}
.efs-btn:active { transform: translateY(1px); }

/* Motyw nadpisuje tlo przyciskow formularzy, stad !important i osobny
   selektor na button - inaczej wersja "ghost" wychodzi czerwona. */
.efs-btn-ghost,
button.efs-btn-ghost,
input[type="submit"].efs-btn-ghost {
	background: transparent !important;
	border-color: var(--efs-line-strong) !important;
	color: var(--efs-text) !important;
	box-shadow: none;
}
.efs-btn-ghost:hover,
button.efs-btn-ghost:hover,
input[type="submit"].efs-btn-ghost:hover {
	background: transparent !important;
	border-color: var(--efs-accent) !important;
	color: var(--efs-accent) !important;
	box-shadow: none;
}
.efs-btn-sm { padding: var(--sp-2, .5rem) var(--sp-3, .75rem); font-size: var(--fs-xs, .8125rem); }

/* ---------------- strona startowa ---------------- */

.efs-landing {
	max-width: var(--wrap-text, 760px);
	margin: 0 auto;
	padding-inline: clamp(.75rem, 3vw, 0rem);
}

.efs-hero {
	text-align: center;
	padding-bottom: var(--sp-7, 3rem);
}
.efs-kicker {
	display: inline-block;
	font-size: var(--fs-xs, .8125rem);
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--efs-accent);
	margin-bottom: var(--sp-3, .75rem);
}
.efs-hero h1 {
	margin: 0 0 var(--sp-4, 1rem);
	font-size: var(--fs-2xl, clamp(1.7rem, 1.3rem + 1.9vw, 2.5rem));
	letter-spacing: -.02em;
	line-height: 1.12;
}
.efs-hero p {
	margin: 0 auto;
	max-width: 48ch;
	color: var(--efs-muted);
	font-size: var(--fs-base, 1.0625rem);
}

.efs-tabs {
	display: flex;
	gap: var(--sp-1, .25rem);
	background: var(--efs-bg-alt);
	border: 1px solid var(--efs-line);
	border-radius: var(--efs-r);
	padding: 5px;
	margin-bottom: var(--sp-5, 1.5rem);
}
.efs-tab {
	flex: 1;
	text-align: center;
	padding: var(--sp-3, .75rem) var(--sp-4, 1rem);
	border-radius: var(--efs-r-sm);
	font-size: var(--fs-sm, .9375rem);
	font-weight: 600;
	color: var(--efs-muted) !important;
	text-decoration: none !important;
	transition: background .2s var(--efs-ease), color .2s var(--efs-ease);
}
.efs-tab:hover { color: var(--efs-text) !important; }
.efs-tab.is-active {
	background: var(--efs-accent-strong);
	color: var(--efs-on-accent) !important;
}

/* przelacznik jezyka portalu */
.efs-langs {
	display: flex;
	justify-content: center;
	gap: 6px;
	margin: 0 0 var(--sp-4, 1rem);
}
.efs-lang {
	display: inline-flex;
	align-items: center;
	padding: 4px 12px;
	border: 1px solid var(--efs-line);
	border-radius: 999px;
	font-size: var(--fs-xs, .8125rem);
	font-weight: 700;
	letter-spacing: .04em;
	line-height: 1.6;
	color: var(--efs-muted) !important;
	text-decoration: none !important;
	background: var(--efs-bg-alt);
	transition: color .2s var(--efs-ease), border-color .2s var(--efs-ease), background .2s var(--efs-ease);
}
.efs-lang:hover {
	color: var(--efs-text) !important;
	border-color: var(--efs-accent-strong);
}
.efs-lang.is-active {
	background: var(--efs-accent-strong);
	border-color: var(--efs-accent-strong);
	color: var(--efs-on-accent) !important;
}

/* karta - wyglada jak .card motywu, dziala tez bez niego */
.efs-card {
	position: relative;
	background: var(--efs-raised);
	border: 1px solid var(--efs-line);
	border-radius: var(--efs-r);
	padding: var(--sp-6, 2rem);
	overflow: hidden;
}
/* czerwona krawedz "lasera" - korzysta z keyframes motywu, jesli sa */
.efs-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(90deg, var(--efs-accent-strong), var(--efs-accent-hover));
	transform: scaleX(0);
	transform-origin: 0 50%;
	transition: transform .45s var(--ease-out, cubic-bezier(.16, 1, .3, 1));
}
.efs-card.is-visible::before,
.efs-card:hover::before {
	transform: scaleX(1);
	animation: laser-edge 2.6s var(--ease-out, cubic-bezier(.16, 1, .3, 1)) .35s;
}

.efs-card h2 {
	margin: 0 0 var(--sp-5, 1.5rem);
	font-size: var(--fs-lg, 1.1875rem);
}
.efs-card a { color: var(--efs-accent); }
.efs-card .efs-form {
	background: none;
	border: 0;
	padding: 0;
	border-radius: 0;
}

/* formularz logowania WordPressa wewnatrz karty */
.efs-card .login-username label,
.efs-card .login-password label {
	display: block;
	font-size: var(--fs-xs, .8125rem);
	color: var(--efs-muted);
	margin-bottom: var(--sp-1, .25rem);
}
.efs-card .login input[type="text"],
.efs-card .login input[type="password"] {
	width: 100%;
	background: var(--efs-inset);
	border: 1px solid var(--efs-line-strong);
	border-radius: var(--efs-r-sm);
	color: var(--efs-text);
	padding: var(--sp-3, .75rem);
	font-family: inherit;
	font-size: var(--fs-base, 1.0625rem);
}
.efs-card .login input:focus { outline: none; border-color: var(--efs-accent); }
.efs-card .login-remember { margin: var(--sp-4, 1rem) 0; font-size: var(--fs-sm, .9375rem); color: var(--efs-muted); }
.efs-card .login-submit input[type="submit"] {
	background: var(--efs-accent-strong);
	color: var(--efs-on-accent);
	border: 0;
	border-radius: var(--efs-r-sm);
	padding: var(--sp-3, .75rem) var(--sp-5, 1.5rem);
	font-family: inherit;
	font-size: var(--fs-sm, .9375rem);
	font-weight: 600;
	cursor: pointer;
	transition: background .2s var(--efs-ease), box-shadow .25s var(--efs-ease);
}
.efs-card .login-submit input[type="submit"]:hover {
	background: var(--efs-accent);
	box-shadow: 0 6px 22px var(--efs-accent-dim);
}

/* ---------------- panel ---------------- */

.efs-panel,
.efs-form,
.efs-box {
	background: var(--efs-raised);
	border: 1px solid var(--efs-line);
	border-radius: var(--efs-r);
	padding: var(--sp-6, 2rem);
}

/* Tlo panelu idzie przez cala szerokosc okna (full-bleed), niezaleznie od
   waskiej kolumny tresci motywu. Naglowek strony zostaje bez zmian. */
.efs-panel {
	width: auto;
	max-width: none;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	border-left: 0;
	border-right: 0;
	border-radius: 0;
	padding-block: clamp(1.25rem, 3vw, 2.5rem);
	/* Im mniejszy ekran, tym mniej marginesu i wiecej miejsca na dane.
	   Na telefonie zostaje 12 px z boku, na duzym monitorze 40 px. */
	padding-inline: clamp(.75rem, 3vw, 2.5rem);
}

/* Sama tresc ma gorna granice szerokosci, zeby wzrok nie biegal przez
   caly monitor. Ponizej tej granicy zajmuje wszystko, co jest dostepne. */
.efs-panel-inner {
	max-width: 1400px;
	width: 100%;
	margin-inline: auto;
}

.efs-head-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-2, .5rem);
}

/* Filtry statusu w panelu obslugi */
/* Zlecenie z nieprzeczytana wiadomoscia - ma rzucac sie w oczy bez
   zmiany statusu. Pulsowanie gasnie po kilku cyklach, zeby nie meczyc. */
.efs-row-unread td {
	background: rgba(242, 68, 78, .07);
}
.efs-row-unread td:first-child {
	box-shadow: inset 3px 0 0 var(--efs-accent);
}
.efs-new-msg {
	display: inline-block;
	margin-top: 3px;
	padding: 1px 7px;
	border: 1px solid var(--efs-accent);
	border-radius: 999px;
	font-size: var(--fs-xs, .8125rem);
	font-weight: 600;
	color: var(--efs-accent-hover);
	white-space: nowrap;
	animation: efs-pulse 1.4s ease-in-out 4;
}
@keyframes efs-pulse {
	0%, 100% { opacity: 1; }
	50%      { opacity: .35; }
}
@media ( prefers-reduced-motion: reduce ) {
	.efs-new-msg { animation: none; }
}

.efs-unread-link {
	text-decoration: none;
	border-bottom: 1px dashed var(--efs-accent);
}
.efs-unread-link:hover .efs-unread { opacity: .75; }

/* Kto prowadzi zlecenie */
.efs-owner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sp-3, .75rem);
	padding: var(--sp-3, .75rem) var(--sp-4, 1rem);
	margin-bottom: var(--sp-4, 1rem);
	background: var(--efs-bg-alt);
	border: 1px solid var(--efs-line);
	border-radius: var(--efs-r);
	font-size: var(--fs-sm, .9375rem);
}
.efs-owner .efs-mini-form { margin-left: auto; }
.efs-owner-me { color: #35c06a; font-weight: 600; }
.efs-owner-other { color: var(--efs-accent-hover); font-weight: 600; }

.efs-owner-tag {
	margin-top: 4px;
	font-size: var(--fs-xs, .8125rem);
	color: var(--efs-accent-hover);
	white-space: nowrap;
}
.efs-owner-tag.is-me { color: #35c06a; }
.efs-owner-tag.is-seen { color: var(--efs-dim); }

/* Dziennik zdarzen */
.efs-h2 {
	margin: var(--sp-6, 2rem) 0 var(--sp-2, .5rem);
	font-size: var(--fs-lg, 1.125rem);
}
.efs-row-danger td {
	background: var(--efs-accent-dim);
}

/* Ostatni ruch w zleceniu - widoczny w kolumnie daty */
.efs-moved {
	display: inline-block;
	font-size: var(--fs-xs, .8125rem);
	color: var(--efs-muted);
	white-space: nowrap;
}
.efs-moved.is-today {
	color: #35c06a;
	font-weight: 600;
}

/* Licznik i przewijanie stron pod tabela zlecen */
.efs-pager {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--sp-3, .75rem);
	margin-top: var(--sp-3, .75rem);
	font-size: var(--fs-sm, .9375rem);
}
.efs-pager-links {
	display: flex;
	align-items: center;
	gap: var(--sp-2, .5rem);
}
.efs-pager-pos {
	color: var(--efs-muted);
	font-variant-numeric: tabular-nums;
}

.efs-filters {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-1, .25rem);
	background: var(--efs-bg-alt);
	border: 1px solid var(--efs-line);
	border-radius: var(--efs-r);
	padding: 5px;
	margin-bottom: var(--sp-5, 1.5rem);
}
.efs-filter {
	padding: var(--sp-2, .5rem) var(--sp-4, 1rem);
	border-radius: var(--efs-r-sm);
	font-size: var(--fs-sm, .9375rem);
	font-weight: 600;
	color: var(--efs-muted) !important;
	text-decoration: none !important;
	white-space: nowrap;
	transition: background .2s var(--efs-ease), color .2s var(--efs-ease);
}
.efs-filter:hover { color: var(--efs-text) !important; }
.efs-filter.is-active {
	background: var(--efs-accent-strong);
	color: var(--efs-on-accent) !important;
}

/* Status zmieniany wprost z listy */
.efs-status-form { margin: 0; position: relative; }

.efs-status-select {
	appearance: none;
	-webkit-appearance: none;
	/* motyw ustawia select{width:100%} - tu ma byc pigulka na szerokosc tresci */
	width: auto;
	min-width: 0;
	max-width: 100%;
	display: inline-block;
	padding: 4px 26px 4px 12px;
	border-radius: 999px;
	font-family: inherit;
	font-size: var(--fs-xs, .8125rem);
	font-weight: 600;
	cursor: pointer;
	background-color: var(--efs-bg-alt);
	border: 1px solid var(--efs-line-strong);
	color: var(--efs-text);
	background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: right 12px center, right 7px center;
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
	transition: border-color .2s var(--efs-ease), background-color .2s var(--efs-ease);
}
/* mocniejszy selektor: bije i regule motywu, i .efs-form select */
.efs-panel select.efs-status-select,
.efs-panel .efs-form select.efs-status-select { width: auto; max-width: 100%; }

.efs-status-select:focus { outline: none; border-color: var(--efs-accent); }
.efs-status-select:disabled { opacity: .55; cursor: wait; }
.efs-status-select option { background: var(--efs-bg-alt); color: var(--efs-text); }

.efs-status-select.efs-status-new { color: #ffc94d; border-color: rgba(255, 201, 77, .45); background-color: rgba(255, 201, 77, .1); }
.efs-status-select.efs-status-in_progress { color: #7fb3ff; border-color: rgba(127, 179, 255, .45); background-color: rgba(127, 179, 255, .1); }
.efs-status-select.efs-status-ready { color: #4fd784; border-color: rgba(79, 215, 132, .45); background-color: rgba(79, 215, 132, .1); }
.efs-status-select.efs-status-rejected { color: var(--efs-accent-hover); border-color: rgba(242, 68, 78, .45); background-color: var(--efs-accent-dim); }

.efs-panel .is-saved { position: relative; }
.efs-panel .is-saved::after {
	content: "zapisano";
	position: absolute;
	left: 0;
	top: 100%;
	margin-top: 3px;
	font-size: 11px;
	font-weight: 600;
	color: #4fd784;
	animation: efs-fade 1.6s ease forwards;
	pointer-events: none;
}
.efs-panel .is-saving { opacity: .6; }

.efs-status-hint {
	display: block;
	margin-top: var(--sp-2, .5rem);
	font-size: var(--fs-xs, .8125rem);
	max-width: 420px;
}
.efs-status-hint.is-pending { color: #ffc94d; }

.efs-status-cancelled,
.efs-status-select.efs-status-cancelled {
	color: var(--efs-dim);
	border-color: var(--efs-line-strong);
	background-color: var(--efs-bg-alt);
}

.efs-status-revision,
.efs-status-select.efs-status-revision {
	color: #ff9d4d;
	border-color: rgba(255, 157, 77, .45);
	background-color: rgba(255, 157, 77, .1);
}

/* Historia wersji pliku zwrotnego */
.efs-versions {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--sp-2, .5rem);
}
.efs-versions li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sp-2, .5rem);
}

/* Grupy rozliczen po kliencie */
.efs-group {
	border: 1px solid var(--efs-line);
	border-radius: var(--efs-r);
	margin-bottom: var(--sp-5, 1.5rem);
	overflow: hidden;
}
.efs-group-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--sp-4, 1rem);
	padding: var(--sp-4, 1rem) var(--sp-5, 1.5rem);
	background: var(--efs-bg-alt);
	border-bottom: 1px solid var(--efs-line);
}
.efs-group-sum strong { font-size: var(--fs-lg, 1.1875rem); color: var(--efs-accent); }
.efs-group .efs-table { margin: 0; }
.efs-group .efs-table td { padding-inline: var(--sp-5, 1.5rem); }

/* Strefa nieodwracalna */
.efs-danger {
	margin-top: var(--sp-7, 3rem);
	padding: var(--sp-4, 1rem) var(--sp-5, 1.5rem);
	border: 1px solid rgba(242, 68, 78, .35);
	border-radius: var(--efs-r);
	background: var(--efs-accent-dim);
	max-width: 640px;
}
.efs-danger p { margin: var(--sp-2, .5rem) 0 var(--sp-3, .75rem); }
.efs-btn-danger {
	background: transparent;
	border: 1px solid var(--efs-accent);
	color: var(--efs-accent-hover) !important;
}
.efs-btn-danger:hover {
	background: var(--efs-accent-strong);
	color: #fff !important;
}
@keyframes efs-fade {
	0% { opacity: 0; }
	15% { opacity: 1; }
	70% { opacity: 1; }
	100% { opacity: 0; }
}

.efs-console-nav { margin-bottom: var(--sp-4, 1rem); }
.efs-mini-form { margin: 0; display: inline-block; }
.efs-billing-total {
	font-size: var(--fs-lg, 1.1875rem);
	margin: 0 0 var(--sp-5, 1.5rem);
}
.efs-billing-total strong { color: var(--efs-accent); }

.efs-stat { font-size: var(--fs-xl, 1.5rem); font-weight: 800; letter-spacing: -.03em; }
.efs-stat-hot { color: var(--efs-accent); }

/* Lista select w formularzu obslugi */
.efs-form select {
	width: 100%;
	background: var(--efs-inset);
	border: 1px solid var(--efs-line-strong);
	border-radius: var(--efs-r-sm);
	color: var(--efs-text);
	padding: var(--sp-3, .75rem);
	margin-top: var(--sp-1, .25rem);
	font-family: inherit;
	font-size: var(--fs-base, 1.0625rem);
}
.efs-form select:focus { outline: none; border-color: var(--efs-accent); }

.efs-ziplist {
	margin: var(--sp-2, .5rem) 0 0;
	padding: var(--sp-2, .5rem) var(--sp-3, .75rem);
	background: var(--efs-inset);
	border: 1px solid var(--efs-line);
	border-radius: var(--efs-r-sm);
	list-style: none;
	font-family: var(--font-mono, ui-monospace, monospace);
	font-size: var(--fs-xs, .8125rem);
	color: var(--efs-muted);
}
.efs-ziplist li { margin: 0 0 3px; }
.efs-ziplist li:last-child { margin-bottom: 0; }

.efs-order-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--sp-4, 1rem);
}
.efs-order-head .efs-order-title { margin-bottom: 0; }

/* Formularz w panelu nie rysuje drugiej ramki w ramce. */
.efs-panel .efs-form {
	background: none;
	border: 0;
	border-radius: 0;
	padding: 0;
	width: auto;
	margin: 0;
	transform: none;
}

.efs-kv td { overflow-wrap: anywhere; }

.efs-head {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-5, 1.5rem);
	align-items: center;
	justify-content: space-between;
	padding-bottom: var(--sp-5, 1.5rem);
	margin-bottom: var(--sp-5, 1.5rem);
	border-bottom: 1px solid var(--efs-line);
}
.efs-head .efs-muted {
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--efs-dim);
}
.efs-due strong { font-size: var(--fs-xl, 1.5rem); font-weight: 800; letter-spacing: -.03em; color: var(--efs-accent); }
.efs-unread { color: var(--efs-accent); font-size: var(--fs-xl, 1.5rem); font-weight: 800; }

/* ---------------- formularze ---------------- */

.efs-form h3 {
	margin: var(--sp-6, 2rem) 0 var(--sp-3, .75rem);
	font-size: var(--fs-xs, .8125rem);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .12em;
	color: var(--efs-accent);
}
.efs-form h3:first-child { margin-top: 0; }

/* Pola nie rozciagaja sie w nieskonczonosc na szerokim panelu. */
.efs-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 360px));
	justify-content: start;
	gap: var(--sp-1, .25rem) var(--sp-5, 1.5rem);
}

.efs-form textarea { max-width: 760px; }
.efs-chat-form textarea { max-width: 760px; }
.efs-form label { display: block; font-size: var(--fs-xs, .8125rem); color: var(--efs-muted); }
.efs-form input[type="text"],
.efs-form input[type="email"],
.efs-form input[type="password"],
.efs-form input[type="number"],
.efs-form textarea {
	/* block, nie inline-block: na szerokim panelu etykieta i pole mieszcza
	   sie obok siebie w jednej linii i opis laduje przy dolnej krawedzi pola. */
	display: block;
	width: 100%;
	background: var(--efs-inset);
	border: 1px solid var(--efs-line-strong);
	border-radius: var(--efs-r-sm);
	color: var(--efs-text);
	padding: var(--sp-3, .75rem);
	margin-top: var(--sp-1, .25rem);
	font-family: inherit;
	font-size: var(--fs-base, 1.0625rem);
}
.efs-form input:focus,
.efs-form textarea:focus { outline: none; border-color: var(--efs-accent); }
.efs-form input[type="file"] { color: var(--efs-muted); font-size: var(--fs-sm, .9375rem); }

.efs-services {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: var(--sp-2, .5rem) var(--sp-5, 1.5rem);
}
.efs-services label,
.efs-check label { color: var(--efs-text); font-size: var(--fs-sm, .9375rem); }

.efs-hp { position: absolute; left: -9999px; }

/* ---------------- tabela zlecen ---------------- */

.efs-table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--fs-sm, .9375rem);
}
.efs-table th {
	text-align: left;
	font-size: var(--fs-xs, .8125rem);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--efs-dim);
	padding: var(--sp-2, .5rem) var(--sp-3, .75rem);
	border-bottom: 1px solid var(--efs-line);
}
.efs-table td {
	padding: var(--sp-3, .75rem);
	border-bottom: 1px solid var(--efs-line);
	vertical-align: middle;
}
.efs-table tr:last-child td { border-bottom: 0; }

/* Tabela nigdy nie wychodzi poza karte - w razie czego przewija sie w srodku. */
.efs-table-wrap {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.efs-orders { min-width: 720px; }
.efs-orders td { vertical-align: top; }

.efs-orders .efs-c-id,
.efs-orders .efs-c-date,
.efs-orders .efs-c-status,
.efs-orders .efs-c-money,
.efs-orders .efs-c-act { white-space: nowrap; }

.efs-orders .efs-c-id { width: 1%; color: var(--efs-dim); }
.efs-orders .efs-c-date { width: 1%; }
.efs-orders .efs-c-car { min-width: 160px; font-weight: 600; overflow-wrap: anywhere; }
.efs-orders .efs-c-scope { width: 34%; min-width: 200px; }
.efs-orders .efs-c-money { width: 1%; text-align: right; }
.efs-orders .efs-c-money strong { display: inline-block; margin-bottom: 2px; }
.efs-orders .efs-c-act { width: 1%; text-align: right; }

.efs-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}
.efs-chip {
	display: inline-block;
	padding: 2px 9px;
	border-radius: 999px;
	background: var(--efs-bg-alt);
	border: 1px solid var(--efs-line-strong);
	color: var(--efs-muted);
	font-size: var(--fs-xs, .8125rem);
	line-height: 1.6;
	white-space: nowrap;
}
.efs-chip-more {
	background: var(--efs-accent-dim);
	border-color: rgba(242, 68, 78, .32);
	color: var(--efs-accent-hover);
	cursor: help;
}

.efs-row-actions {
	display: inline-flex;
	gap: var(--sp-2, .5rem);
	white-space: nowrap;
}

.efs-status {
	display: inline-block;
	padding: 3px var(--sp-3, .75rem);
	border-radius: 999px;
	font-size: var(--fs-xs, .8125rem);
	font-weight: 600;
	border: 1px solid var(--efs-line-strong);
}
.efs-status-new { color: #ffc94d; border-color: rgba(255, 201, 77, .4); background: rgba(255, 201, 77, .1); }
.efs-status-in_progress { color: #7fb3ff; border-color: rgba(127, 179, 255, .4); background: rgba(127, 179, 255, .1); }
.efs-status-ready { color: #4fd784; border-color: rgba(79, 215, 132, .4); background: rgba(79, 215, 132, .1); }
.efs-status-rejected { color: var(--efs-accent-hover); border-color: rgba(242, 68, 78, .4); background: var(--efs-accent-dim); }

.efs-paid { color: #4fd784; font-weight: 600; }
.efs-unpaid { color: var(--efs-accent-hover); font-weight: 600; }

.efs-dot {
	display: inline-block;
	min-width: 18px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--efs-accent);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	line-height: 18px;
	text-align: center;
}

/* ---------------- widok zlecenia ---------------- */

.efs-order-title { margin: var(--sp-2, .5rem) 0 var(--sp-5, 1.5rem); font-size: var(--fs-xl, 1.5rem); }

.efs-summary {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: var(--sp-4, 1rem);
	background: var(--efs-bg-alt);
	border: 1px solid var(--efs-line);
	border-radius: var(--efs-r-sm);
	padding: var(--sp-5, 1.5rem);
	margin-bottom: var(--sp-5, 1.5rem);
}
.efs-summary .efs-muted { text-transform: uppercase; letter-spacing: .08em; color: var(--efs-dim); }

.efs-kv th {
	width: 180px;
	text-transform: none;
	letter-spacing: 0;
	font-weight: 500;
	color: var(--efs-muted);
	vertical-align: top;
}

/* ---------------- czat ---------------- */

.efs-chat-title { margin: var(--sp-7, 3rem) 0 var(--sp-4, 1rem); font-size: var(--fs-lg, 1.1875rem); }

.efs-chat {
	display: flex;
	flex-direction: column;
	gap: var(--sp-3, .75rem);
	/* Na szerokim panelu dymki rozjezdzaly sie na oba konce ekranu.
	   Kolumna trzyma je blisko siebie, ale rosnie do polowy ekranu,
	   zeby dluzsze wiadomosci nie lamaly sie bez potrzeby. */
	max-width: min(100%, 50vw);
	min-width: 320px;
	max-height: 460px;
	overflow-y: auto;
	padding: 2px;
	margin-bottom: var(--sp-4, 1rem);
}
.efs-msg {
	/* Krotki tekst = waski dymek; dlugi moze zajac cala kolumne. */
	width: fit-content;
	max-width: 100%;
	padding: var(--sp-3, .75rem) var(--sp-4, 1rem);
	border-radius: var(--efs-r);
	border: 1px solid var(--efs-line);
	background: var(--efs-bg-alt);
	font-size: var(--fs-sm, .9375rem);
}
/* Wszystko przyklejone do lewej - dluzszy tekst rozciaga dymek w prawo,
   zamiast rosnac w lewo od prawej krawedzi. Autora rozroznia kolor. */
.efs-msg-mine {
	align-self: flex-start;
	background: var(--efs-accent-dim);
	border-color: rgba(242, 68, 78, .32);
}
.efs-msg-other { align-self: flex-start; }
.efs-msg-head {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--efs-dim);
	margin-bottom: var(--sp-1, .25rem);
}
.efs-msg-head span { font-weight: 400; opacity: .8; }

.efs-chat-form textarea {
	width: 100%;
	background: var(--efs-inset);
	border: 1px solid var(--efs-line-strong);
	border-radius: var(--efs-r-sm);
	color: var(--efs-text);
	padding: var(--sp-3, .75rem);
	font-family: inherit;
	font-size: var(--fs-base, 1.0625rem);
}
.efs-chat-form textarea:focus { outline: none; border-color: var(--efs-accent); }

/* ---------------- mobile ---------------- */

@media (max-width: 780px) {
	.efs-panel, .efs-form, .efs-card { padding: var(--sp-4, 1rem); }

	/* Zlecenia jako kafelki zamiast poziomego przewijania. */
	.efs-orders { min-width: 0; }
	.efs-orders thead { display: none; }
	.efs-orders tr {
		display: grid;
		grid-template-columns: auto 1fr;
		gap: var(--sp-1, .25rem) var(--sp-3, .75rem);
		padding: var(--sp-4, 1rem) 0;
		border-bottom: 1px solid var(--efs-line);
	}
	.efs-orders td { border: 0; padding: 0; white-space: normal; width: auto; text-align: left; }
	.efs-orders .efs-c-id { grid-column: 1; font-weight: 700; }
	.efs-orders .efs-c-date { grid-column: 2; justify-self: start; color: var(--efs-dim); }
	.efs-orders .efs-c-car { grid-column: 1 / -1; font-size: var(--fs-base, 1.0625rem); }
	.efs-orders .efs-c-scope { grid-column: 1 / -1; }
	.efs-orders .efs-c-status { grid-column: 1 / -1; }
	.efs-orders .efs-c-money { grid-column: 1 / -1; text-align: left; }
	.efs-orders .efs-c-act { grid-column: 1 / -1; }
	.efs-row-actions { display: flex; width: 100%; }
	.efs-row-actions .efs-btn { flex: 1; }

	.efs-kv th { display: none; }
	.efs-msg { max-width: 100%; }
}

/* Wyszukiwarka zlecen */
.efs-search {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sp-2, .5rem);
	margin: 0 0 var(--sp-4, 1rem);
}
.efs-search input[type="search"] {
	flex: 1 1 320px;
	max-width: 520px;
	background: var(--c-bg-inset, #080b10);
	border: 1px solid var(--c-border-strong, #2f3b4a);
	border-radius: var(--radius-sm, 6px);
	color: var(--c-text, #e8eef5);
	padding: var(--sp-3, .75rem);
	font-family: inherit;
	font-size: var(--fs-sm, .9375rem);
}
.efs-search input[type="search"]:focus {
	outline: none;
	border-color: var(--c-accent, #f2444e);
}
.efs-search input[type="search"]::placeholder { color: var(--c-text-dim, #75838f); }

/* Znacznik pobrania pliku przez klienta */
.efs-mod .efs-taken { color: #4fd784; font-weight: 700; }
.efs-mod .efs-untaken { color: var(--c-text-dim, #75838f); }
.efs-mod.is-taken { border-color: rgba(79, 215, 132, .45); }

.efs-taken-badge,
.efs-untaken-badge {
	display: inline-block;
	padding: 2px 10px;
	border-radius: 999px;
	font-size: var(--fs-xs, .8125rem);
	font-weight: 600;
	border: 1px solid;
}
.efs-taken-badge { color: #4fd784; border-color: rgba(79, 215, 132, .4); background: rgba(79, 215, 132, .1); }
.efs-untaken-badge { color: #ffc94d; border-color: rgba(255, 201, 77, .4); background: rgba(255, 201, 77, .1); }

/* Pelna nazwa wybranego pliku - przegladarka w polu skraca ja do kilku znakow */
.efs-file-name {
	display: block;
	margin-top: var(--sp-2, .5rem);
	font-family: var(--font-mono, ui-monospace, monospace);
	font-size: var(--fs-xs, .8125rem);
	line-height: 1.5;
	color: var(--c-text-dim, #75838f);
	overflow-wrap: anywhere;
	max-width: 520px;
}
.efs-file-name.is-set { color: #4fd784; }

/* Nazwa obecnego pliku zwrotnego tez ma sie miescic w calosci */
.efs-form .efs-btn-sm.efs-btn-ghost { overflow-wrap: anywhere; text-align: left; }

/* Numer wersji i dziennik zmian */
.efs-version {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-top: var(--sp-6, 2rem);
	padding-top: var(--sp-4, 1rem);
	border-top: 1px solid var(--efs-line);
	font-size: var(--fs-xs, .8125rem);
	color: var(--efs-muted);
}
.efs-version-no { font-family: var(--font-mono, ui-monospace, monospace); letter-spacing: .02em; }
.efs-version-link {
	color: var(--efs-muted) !important;
	text-decoration: none !important;
	border-bottom: 1px dotted currentColor;
}
.efs-version-link:hover { color: var(--efs-text) !important; }
.efs-dot-new { background: #4fd784; color: #06210f; text-transform: uppercase; letter-spacing: .06em; }

.efs-changelog { list-style: none; margin: 0; padding: 0; }
.efs-changelog-item {
	padding: var(--sp-4, 1rem) 0;
	border-bottom: 1px solid var(--efs-line);
}
.efs-changelog-item:last-child { border-bottom: 0; }
.efs-changelog-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-bottom: var(--sp-2, .5rem);
}
.efs-changelog-ver {
	font-family: var(--font-mono, ui-monospace, monospace);
	font-size: var(--fs-sm, .9375rem);
	color: var(--efs-text);
}
.efs-changelog-item.is-current .efs-changelog-ver { color: var(--efs-accent-strong); }
.efs-changelog-lines { margin: 0; padding-left: 1.15rem; }
.efs-changelog-lines li {
	margin: 0 0 4px;
	font-size: var(--fs-sm, .9375rem);
	line-height: 1.6;
	color: var(--efs-text);
}

/* Zlecenie bez kwoty - nie jest ani oplacone, ani do zaplaty */
.efs-free { color: var(--efs-muted); }

/* Zdjecia od klienta - galeria i zalaczniki na czacie */
.efs-gallery {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-2, .5rem);
	margin: var(--sp-3, .75rem) 0;
}
.efs-shot {
	display: block;
	width: 120px;
	height: 120px;
	border: 1px solid var(--efs-line);
	border-radius: var(--efs-r-sm);
	overflow: hidden;
	background: var(--efs-bg-alt);
	text-decoration: none !important;
	transition: border-color .2s var(--efs-ease), transform .2s var(--efs-ease);
}
.efs-shot:hover {
	border-color: var(--efs-accent-strong);
	transform: translateY(-2px);
}
.efs-shot img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.efs-shot-file {
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
	padding: 8px;
	font-size: 11px;
	line-height: 1.4;
	text-align: center;
	color: var(--efs-text);
	overflow-wrap: anywhere;
}
.efs-msg .efs-gallery { margin: 6px 0 0; }
.efs-msg .efs-shot { width: 92px; height: 92px; }

/* Pasek pod polem wiadomosci: dodaj zdjecia + wyslij */
.efs-chat-tools {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sp-3, .75rem);
	margin-top: var(--sp-2, .5rem);
}
.efs-attach { cursor: pointer; }
.efs-attach input[type="file"] {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	overflow: hidden;
}
.efs-attach-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--sp-2, .5rem);
	padding: var(--sp-3, .75rem) var(--sp-5, 1.5rem);
	border: 1px solid var(--efs-line-strong);
	border-radius: var(--efs-r-sm);
	font-size: var(--fs-sm, .9375rem);
	font-weight: 600;
	line-height: 1.3;
	color: var(--efs-text);
	white-space: nowrap;
	transition: color .2s var(--efs-ease), border-color .2s var(--efs-ease);
}
.efs-attach:hover .efs-attach-btn { border-color: var(--efs-accent); }
.efs-attach.is-set .efs-attach-btn { border-color: #4fd784; color: #4fd784; }
.efs-attach input[type="file"]:focus-visible + .efs-attach-btn { border-color: var(--efs-accent-strong); }

/* Kwota to cztery cyfry, nie biliard - pole ma byc na tyle szerokie i nie wiecej */
.efs-form input.efs-input-sm {
	width: 7rem;
	max-width: 100%;
}

/* Formularz realizacji: rowne odstepy miedzy blokami, zeby sie nie zlewalo */
.efs-form > p { margin: 0 0 var(--sp-4, 1rem); }
.efs-form > p:last-child { margin-bottom: 0; }
.efs-form .efs-check { margin-bottom: var(--sp-4, 1rem); }
.efs-form .efs-chat-tools { margin-bottom: var(--sp-4, 1rem); }

/* Rzad pol formularza realizacji: kazde pole zajmuje tyle, ile potrzebuje,
   wszystkie startuja od gory i od lewej, bez rozciagania na pol ekranu. */
.efs-row {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: var(--sp-3, .75rem) var(--sp-5, 1.5rem);
}
.efs-row > p {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--sp-1, .25rem);
}
.efs-row > p > label { display: block; }

/* Wlasny przycisk wyboru pliku - natywny widget przegladarki nie trzyma sie motywu */
.efs-file {
	display: inline-block;
	cursor: pointer;
	margin-top: var(--sp-1, .25rem);
}
.efs-file input[type="file"] {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	overflow: hidden;
}
.efs-file-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--sp-2, .5rem);
	padding: var(--sp-3, .75rem) var(--sp-5, 1.5rem);
	font-size: var(--fs-sm, .9375rem);
	font-weight: 600;
	line-height: 1.3;
	border: 1px solid var(--efs-line-strong);
	border-radius: var(--efs-r-sm);
	background: transparent;
	color: var(--efs-text);
	white-space: nowrap;
	transition: border-color .2s var(--efs-ease), color .2s var(--efs-ease), background .2s var(--efs-ease);
}
.efs-file:hover .efs-file-btn { border-color: var(--efs-accent); }
.efs-file input[type="file"]:focus-visible + .efs-file-btn { border-color: var(--efs-accent); }
.efs-file.is-set .efs-file-btn { border-color: #4fd784; color: #4fd784; }

/* Pytanie o poprawke - ukryte, dopoki klient nie dolaczy zalacznika */
.efs-fix-ask { display: none; }
.efs-fix-ask.is-asking {
	display: block;
	margin-top: var(--sp-4, 1rem);
	padding: var(--sp-4, 1rem);
	border: 1px solid var(--efs-accent-strong);
	border-radius: var(--efs-r-sm);
	background: var(--efs-accent-dim);
}
.efs-fix-ask-q {
	margin: 0 0 var(--sp-3, .75rem);
	font-weight: 700;
	color: var(--efs-text);
}
.efs-fix-ask .efs-check { margin: 0 0 var(--sp-2, .5rem); }
.efs-fix-ask .efs-check:last-child { margin-bottom: 0; }
.efs-fix-ask label { color: var(--efs-text); }

/* Rozliczenia: wiersz warsztatu rozwija liste jego zlecen */
.efs-fold-head { cursor: pointer; }
.efs-fold-head:hover { background: var(--efs-bg-alt); }
.efs-fold-head:focus-visible { outline: 2px solid var(--efs-accent); outline-offset: -2px; }
.efs-fold-mark {
	display: inline-block;
	margin-right: 6px;
	color: var(--efs-muted);
	transition: transform .2s var(--efs-ease);
}
.efs-fold-head.is-open .efs-fold-mark { transform: rotate(90deg); color: var(--efs-accent); }

.efs-fold-body { display: none; }
.efs-fold-body.is-open { display: table-row; }
.efs-fold-body > td {
	padding: 0 0 var(--sp-4, 1rem);
	background: var(--efs-bg-alt);
}

.efs-subtable { width: 100%; margin: 0; }
.efs-subtable th {
	font-size: var(--fs-xs, .8125rem);
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--efs-dim);
}
.efs-subtable td, .efs-subtable th { padding: var(--sp-2, .5rem) var(--sp-3, .75rem); }
.efs-subtable tbody tr.is-due td { background: rgba(242, 68, 78, .06); }
.efs-subtable tfoot td {
	border-top: 1px solid var(--efs-line-strong);
	font-size: var(--fs-sm, .9375rem);
}
.efs-subtable tfoot tr:first-child td { border-top: 1px solid var(--efs-line-strong); }
.efs-subtable tfoot tr + tr td { border-top: 0; }