/**
 * ETA — wspólny timeline zamówienia (konto + podsumowanie po kasie).
 * Web glass approximation — nie oficjalny Apple Liquid Glass.
 */

.eta-order-tracking-panel {
	--eta-track-accent: var(--ref-primary, #001f3f);
	--eta-track-success: #10b981;
	--eta-track-muted: var(--ref-muted, #5e6a82);
	--eta-track-faint: var(--ref-faint, #a8b2c4);
	--eta-track-surface: var(--ref-surface2, #fff);
	--eta-track-border: rgba(0, 31, 63, 0.1);
	margin: 0 0 1.75rem;
	padding: 1.5rem 1.75rem;
	border: 1px solid var(--eta-track-border);
	border-radius: var(--ref-r-xl, 1rem);
	background:
		linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.94)),
		var(--eta-track-surface);
	box-shadow: var(--ref-sh-sm, 0 1px 3px rgba(0, 31, 63, 0.08));
}

.eta-order-tracking-panel__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	margin-bottom: 1.25rem;
}

.eta-order-tracking-panel__title {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.3;
	color: var(--eta-track-accent);
}

.eta-order-tracking-panel__badge {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	padding: 0.3125rem 0.75rem;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.2;
	border: 1px solid rgba(0, 31, 63, 0.12);
	background: rgba(0, 31, 63, 0.04);
	color: var(--eta-track-accent);
}

.eta-order-tracking-panel__badge.is-progress {
	border-color: rgba(59, 130, 246, 0.28);
	background: rgba(59, 130, 246, 0.08);
	color: #1d4ed8;
}

.eta-order-tracking-panel__badge.is-success {
	border-color: rgba(16, 185, 129, 0.28);
	background: rgba(16, 185, 129, 0.08);
	color: #047857;
}

.eta-order-tracking-panel__badge.is-waiting {
	border-color: rgba(245, 158, 11, 0.28);
	background: rgba(245, 158, 11, 0.08);
	color: #b45309;
}

.eta-order-tracking-panel__meta {
	margin: 0 0 1.25rem;
	padding: 1rem 1.125rem;
	border-radius: var(--ref-r-lg, 0.75rem);
	background: rgba(0, 31, 63, 0.03);
	border: 1px solid rgba(0, 31, 63, 0.06);
}

.eta-order-tracking-panel__label {
	display: block;
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--eta-track-muted);
	margin-bottom: 0.25rem;
}

.eta-order-tracking-panel__waybill {
	margin: 0 0 0.5rem;
	font-size: 0.9375rem;
	color: var(--ref-text, #1a1f2e);
}

.eta-order-tracking-panel__waybill strong {
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.eta-order-tracking-panel__service {
	margin: 0;
	font-size: 0.875rem;
	color: var(--eta-track-muted);
}

.eta-order-tracking-panel__actions {
	margin: 0.75rem 0 0;
}

.eta-order-tracking-panel__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.75rem;
	padding: 0.625rem 1.125rem !important;
	border-radius: var(--ref-r-md, 0.5rem) !important;
	background: var(--eta-track-accent) !important;
	color: #fff !important;
	border: none !important;
	font-weight: 600;
	text-decoration: none;
}

.eta-order-tracking-timeline {
	list-style: none;
	margin: 0;
	padding: 0;
}

.eta-order-tracking-timeline__item {
	display: grid;
	grid-template-columns: 2.5rem minmax(0, 1fr);
	gap: 0 1rem;
	position: relative;
	padding-bottom: 1.5rem;
}

.eta-order-tracking-timeline__item:last-child {
	padding-bottom: 0;
}

.eta-order-tracking-timeline__item:not(:last-child)::before {
	content: "";
	position: absolute;
	left: 1.1875rem;
	top: 2.625rem;
	bottom: 0.375rem;
	width: 2px;
	background: #e5e7eb;
	border-radius: 1px;
}

.eta-order-tracking-timeline__item.is-done:not(:last-child)::before,
.eta-order-tracking-timeline__item.is-current:not(:last-child)::before {
	background: linear-gradient(180deg, var(--eta-track-success) 0%, #e5e7eb 100%);
}

.eta-order-tracking-timeline__marker {
	position: relative;
	z-index: 1;
	width: 2.375rem;
	height: 2.375rem;
	border-radius: 999px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border: 2px dashed #d1d5db;
	color: var(--eta-track-muted);
}

.eta-order-tracking-timeline__item.is-done .eta-order-tracking-timeline__marker {
	border-style: solid;
	border-color: var(--eta-track-success);
	background: rgba(16, 185, 129, 0.1);
	color: #047857;
}

.eta-order-tracking-timeline__item.is-current .eta-order-tracking-timeline__marker {
	border-style: solid;
	border-color: #3b82f6;
	background: rgba(59, 130, 246, 0.1);
	color: #1d4ed8;
	box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.12);
}

.eta-order-tracking-timeline__item.is-pending .eta-order-tracking-timeline__marker {
	border-style: dashed;
	border-color: #d1d5db;
	background: #f3f4f6;
	color: #9ca3af;
	box-shadow: none;
}

.eta-order-tracking-timeline__item.is-pending:not(:last-child)::before {
	background: #e5e7eb;
}

.eta-order-tracking-timeline__icon {
	display: block;
	width: 1.125rem;
	height: 1.125rem;
	background-color: currentColor;
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;
}

.eta-order-tracking-timeline__item[data-step="placed"] .eta-order-tracking-timeline__icon,
.eta-order-tracking-timeline__item[data-step="payment"] .eta-order-tracking-timeline__icon {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4Z'/%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E");
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4Z'/%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E");
}

.eta-order-tracking-timeline__item[data-step="confirmed"] .eta-order-tracking-timeline__icon,
.eta-order-tracking-timeline__item[data-step="processing"] .eta-order-tracking-timeline__icon {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpolyline points='3.27 6.96 12 12.01 20.73 6.96'/%3E%3Cline x1='12' y1='22.08' x2='12' y2='12'/%3E%3C/svg%3E");
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpolyline points='3.27 6.96 12 12.01 20.73 6.96'/%3E%3Cline x1='12' y1='22.08' x2='12' y2='12'/%3E%3C/svg%3E");
}

.eta-order-tracking-timeline__item[data-step="shipped"] .eta-order-tracking-timeline__icon {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 18V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v11a1 1 0 0 0 1 1h2'/%3E%3Cpath d='M15 18h2'/%3E%3Cpath d='M19 18h2a1 1 0 0 0 1-1v-3.65a1 1 0 0 0-.22-.624l-3.48-4.35A1 1 0 0 0 17.52 8H14'/%3E%3Ccircle cx='7' cy='18' r='2'/%3E%3Ccircle cx='17' cy='18' r='2'/%3E%3C/svg%3E");
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 18V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v11a1 1 0 0 0 1 1h2'/%3E%3Cpath d='M15 18h2'/%3E%3Cpath d='M19 18h2a1 1 0 0 0 1-1v-3.65a1 1 0 0 0-.22-.624l-3.48-4.35A1 1 0 0 0 17.52 8H14'/%3E%3Ccircle cx='7' cy='18' r='2'/%3E%3Ccircle cx='17' cy='18' r='2'/%3E%3C/svg%3E");
}

.eta-order-tracking-timeline__item[data-step="delivered"] .eta-order-tracking-timeline__icon,
.eta-order-tracking-timeline__item[data-step="results"] .eta-order-tracking-timeline__icon {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
}

.eta-order-tracking-timeline__row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
}

.eta-order-tracking-timeline__title {
	margin: 0;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--ref-text, #1a1f2e);
}

.eta-order-tracking-timeline__item.is-pending .eta-order-tracking-timeline__title {
	color: #9ca3af;
	font-weight: 500;
}

.eta-order-tracking-timeline__item.is-pending .eta-order-tracking-timeline__desc,
.eta-order-tracking-timeline__item.is-pending .eta-order-tracking-timeline__time {
	color: #b0b8c4;
}

.eta-order-tracking-timeline__desc {
	margin: 0.375rem 0 0;
	font-size: 0.8125rem;
	line-height: 1.55;
	color: var(--eta-track-muted);
	max-width: 42rem;
}

.eta-order-tracking-timeline__time {
	flex-shrink: 0;
	font-size: 0.75rem;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	color: var(--eta-track-faint);
	white-space: nowrap;
	padding-top: 0.125rem;
}

.eta-order-tracking__link {
	font-weight: 600;
	color: var(--eta-track-accent);
	text-decoration: underline;
}

.eta-order-tracking--empty {
	color: var(--eta-track-faint);
}

@media (max-width: 767px) {
	.eta-order-tracking-panel {
		padding: 1.25rem 1.125rem;
	}

	.eta-order-tracking-timeline__row {
		flex-direction: column;
		gap: 0.25rem;
	}

	.eta-order-tracking-timeline__time {
		padding-top: 0;
	}
}

@media (prefers-reduced-transparency: reduce) {
	.eta-order-tracking-panel {
		background: var(--eta-track-surface);
	}
}
