/**
 * Steward Report (#516) — Safety report for /evento/ fecha-level tab.
 *
 * BEM naming: `.ne-steward-report__*`. Uses DS tokens (`--ne-*`).
 * Print-friendly via @media print overrides at the end.
 */

/* ==========================================================================
   Container
   ========================================================================== */

.ne-steward-report {
	padding: var(--ne-space-5, 1.25rem) 0;
}

/* ==========================================================================
   Empty state
   ========================================================================== */

.ne-steward-report__empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--ne-space-3, 0.75rem);
	padding: var(--ne-space-8, 4rem) var(--ne-space-4, 1rem);
	text-align: center;
	color: var(--ne-text-muted);
}

.ne-steward-report__empty i {
	font-size: 2.5rem;
	opacity: 0.4;
}

.ne-steward-report__empty p {
	font-size: 0.95rem;
	margin: 0;
}

.ne-steward-report__generate {
	margin-top: var(--ne-space-4, 1rem);
}

/* ==========================================================================
   Clean race hero
   ========================================================================== */

.ne-steward-report__clean-race {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--ne-space-3, 0.75rem);
	padding: var(--ne-space-7, 3rem) var(--ne-space-4, 1rem);
	text-align: center;
}

.ne-steward-report__clean-race-icon {
	font-size: 3rem;
	color: var(--ne-green);
	opacity: 0.85;
}

.ne-steward-report__clean-race-title {
	font-family: var(--ne-font-display);
	font-size: 1.6rem;
	font-weight: 400;
	color: var(--ne-text);
	margin: 0;
}

.ne-steward-report__clean-race-desc {
	font-size: 0.95rem;
	color: var(--ne-text-muted);
	margin: 0;
	max-width: 420px;
}

.ne-steward-report__clean-race-count {
	font-family: var(--ne-font-mono);
	font-size: 0.8rem;
	color: var(--ne-green);
	margin: var(--ne-space-2, 0.5rem) 0 0;
}

/* ==========================================================================
   Header: Safety Rating Badge + Meta
   ========================================================================== */

.ne-steward-report__header {
	display: flex;
	align-items: center;
	gap: var(--ne-space-5, 1.25rem);
	margin-bottom: var(--ne-space-7, 3rem);
}

.ne-steward-report__rating {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 88px;
	height: 88px;
	border-radius: 50%;
	border: 3px solid;
	flex-shrink: 0;
	position: relative;
}

.ne-steward-report__score {
	font-family: var(--ne-font-mono);
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1;
}

.ne-steward-report__grade {
	font-family: var(--ne-font-mono);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	opacity: 0.8;
}

.ne-steward-report__label {
	display: block;
	font-family: var(--ne-font-body);
	font-size: 0.8rem;
	font-weight: 500;
	color: var(--ne-text-muted);
	margin-top: var(--ne-space-1, 0.25rem);
	white-space: nowrap;
}

/* --- Rating colors by grade --- */
.ne-steward-report__rating--A {
	border-color: var(--ne-green);
	color: var(--ne-green);
	background: rgba(61, 214, 140, 0.08);
}

.ne-steward-report__rating--B {
	border-color: var(--ne-accent);
	color: var(--ne-accent);
	background: rgba(139, 127, 232, 0.08);
}

.ne-steward-report__rating--C {
	border-color: var(--ne-yellow);
	color: var(--ne-yellow);
	background: rgba(255, 184, 0, 0.08);
}

.ne-steward-report__rating--D {
	border-color: #E67E22;
	color: #E67E22;
	background: rgba(230, 126, 34, 0.08);
}

.ne-steward-report__rating--F {
	border-color: var(--ne-red);
	color: var(--ne-red);
	background: rgba(255, 79, 79, 0.08);
}

/* Header layout: label outside the circle on non-clean reports */
.ne-steward-report__header .ne-steward-report__label {
	position: absolute;
	top: calc(100% + var(--ne-space-2, 0.5rem));
	left: 50%;
	transform: translateX(-50%);
}

.ne-steward-report__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ne-space-2, 0.5rem) var(--ne-space-4, 1rem);
	font-family: var(--ne-font-mono);
	font-size: 0.8rem;
	color: var(--ne-text-muted);
}

.ne-steward-report__meta span {
	display: inline-flex;
	align-items: center;
}

/* ==========================================================================
   Summary Cards
   ========================================================================== */

.ne-steward-report__summary {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--ne-space-3, 0.75rem);
	margin-bottom: var(--ne-space-5, 1.25rem);
}

.ne-steward-report__stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: var(--ne-space-4, 1rem) var(--ne-space-3, 0.75rem);
	text-align: center;
}

/* Stat cards are non-interactive — disable ne-card hover */
.ne-steward-report__stat:hover {
	background: var(--ne-surface);
	border-color: var(--ne-border);
}

.ne-steward-report__stat-value {
	font-family: var(--ne-font-mono);
	font-size: 1.75rem;
	font-weight: 700;
	color: var(--ne-text);
	line-height: 1;
	margin-bottom: var(--ne-space-1, 0.25rem);
}

.ne-steward-report__stat-label {
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--ne-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

/* ==========================================================================
   Alerts / Pattern Flags
   ========================================================================== */

.ne-steward-report__alerts {
	display: flex;
	flex-direction: column;
	gap: var(--ne-space-2, 0.5rem);
	margin-bottom: var(--ne-space-5, 1.25rem);
}

.ne-steward-report__alert {
	display: flex;
	align-items: center;
	gap: var(--ne-space-3, 0.75rem);
	padding: var(--ne-space-3, 0.75rem) var(--ne-space-4, 1rem);
	border-radius: var(--ne-radius-md, 8px);
	font-size: 0.85rem;
	font-weight: 500;
}

.ne-steward-report__alert i {
	flex-shrink: 0;
	font-size: 1rem;
}

.ne-steward-report__alert--danger {
	background: rgba(255, 79, 79, 0.1);
	color: var(--ne-red);
	border-left: 3px solid var(--ne-red);
}

.ne-steward-report__alert--warning {
	background: rgba(255, 184, 0, 0.1);
	color: var(--ne-yellow);
	border-left: 3px solid var(--ne-yellow);
}

.ne-steward-report__alert--info {
	background: rgba(139, 127, 232, 0.1);
	color: var(--ne-accent);
	border-left: 3px solid var(--ne-accent);
}

/* ==========================================================================
   Table wrapper (horizontal scroll on mobile)
   ========================================================================== */

.ne-steward-report__table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin-bottom: var(--ne-space-5, 1.25rem);
}

.ne-steward-report__table-wrap .ne-table {
	min-width: 520px;
}

/* Row highlight for severe */
.ne-steward-report__row--severe {
	background: rgba(255, 79, 79, 0.05);
}

/* ==========================================================================
   Incident Log
   ========================================================================== */

.ne-steward-report__incidents {
	display: flex;
	flex-direction: column;
	gap: var(--ne-space-2, 0.5rem);
	margin-bottom: var(--ne-space-5, 1.25rem);
}

.ne-steward-report__incident {
	display: flex;
	align-items: center;
	gap: var(--ne-space-3, 0.75rem);
	padding: var(--ne-space-3, 0.75rem) var(--ne-space-4, 1rem);
	background: var(--ne-surface);
	border-radius: var(--ne-radius-md, 8px);
	border-left: 3px solid var(--ne-border);
}

.ne-steward-report__incident--severe {
	border-left-color: var(--ne-red);
}

.ne-steward-report__incident--moderate {
	border-left-color: var(--ne-yellow);
}

.ne-steward-report__incident--minor {
	border-left-color: var(--ne-text-muted);
}

.ne-steward-report__incident-speed {
	font-family: var(--ne-font-mono);
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--ne-text);
	white-space: nowrap;
	min-width: 80px;
}

.ne-steward-report__incident-detail {
	display: flex;
	align-items: center;
	gap: var(--ne-space-2, 0.5rem);
	flex-wrap: wrap;
	font-size: 0.85rem;
	color: var(--ne-text);
}

.ne-steward-report__incident-detail strong {
	font-weight: 600;
}

.ne-steward-report__incident-env {
	color: var(--ne-text-muted);
	font-style: italic;
}

.ne-steward-report__incident-detail .ne-pill {
	font-size: 0.65rem;
	padding: 2px var(--ne-space-2, 0.5rem);
}

/* ==========================================================================
   Clean Drivers
   ========================================================================== */

.ne-steward-report__clean-drivers {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ne-space-2, 0.5rem) var(--ne-space-4, 1rem);
	margin-bottom: var(--ne-space-5, 1.25rem);
}

.ne-steward-report__clean-driver {
	display: inline-flex;
	align-items: center;
	gap: var(--ne-space-2, 0.5rem);
	font-size: 0.85rem;
	color: var(--ne-text);
}

.ne-steward-report__clean-driver i {
	color: var(--ne-green);
	font-size: 0.9rem;
}

.ne-steward-report__clean-driver a {
	color: var(--ne-text);
	text-decoration: none;
}

.ne-steward-report__clean-driver a:hover {
	color: var(--ne-accent);
	text-decoration: underline;
}

.ne-steward-report__clean-pos {
	font-family: var(--ne-font-mono);
	font-size: 0.8rem;
	color: var(--ne-text-muted);
}

/* ==========================================================================
   Links inside tables
   ========================================================================== */

.ne-steward-report__contacts a,
.ne-steward-report__penalties a {
	color: var(--ne-text);
	text-decoration: none;
}

.ne-steward-report__contacts a:hover,
.ne-steward-report__penalties a:hover {
	color: var(--ne-accent);
	text-decoration: underline;
}

/* ==========================================================================
   Responsive: tablet (768px)
   ========================================================================== */

@media (max-width: 768px) {
	.ne-steward-report__summary {
		grid-template-columns: repeat(2, 1fr);
	}

	.ne-steward-report__header {
		flex-direction: column;
		align-items: center;
		text-align: center;
		margin-bottom: var(--ne-space-5, 1.25rem);
	}

	.ne-steward-report__header .ne-steward-report__label {
		position: static;
		transform: none;
	}

	.ne-steward-report__meta {
		justify-content: center;
	}
}

/* ==========================================================================
   Responsive: mobile (480px)
   ========================================================================== */

@media (max-width: 480px) {
	.ne-steward-report__summary {
		grid-template-columns: 1fr;
	}

	.ne-steward-report__rating {
		width: 76px;
		height: 76px;
	}

	.ne-steward-report__score {
		font-size: 1.25rem;
	}

	.ne-steward-report__stat-value {
		font-size: 1.4rem;
	}

	.ne-steward-report__incident {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--ne-space-1, 0.25rem);
	}

	.ne-steward-report__incident-speed {
		min-width: auto;
	}

	.ne-steward-report__clean-drivers {
		flex-direction: column;
	}
}

/* ==========================================================================
   Print
   ========================================================================== */

@media print {
	.ne-steward-report {
		color: #000;
		background: #fff;
	}

	.ne-steward-report__rating {
		border-color: #333;
		color: #333;
		background: none;
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}

	.ne-steward-report__alert {
		border: 1px solid #ccc;
		background: none;
	}

	.ne-steward-report__incident {
		border: 1px solid #ddd;
		background: none;
	}

	.ne-steward-report a {
		color: #000;
		text-decoration: underline;
	}

	.ne-steward-report .ne-pill {
		border: 1px solid currentColor;
		background: none;
	}
}