/* Mobile-first application layer. Loaded last on Matchday routes. */
.nb-mobile-dock { display: none; }

/* The JavaScript view selector applies this class at the admin-selected
 * breakpoint. The media query only supplies the configured 1200px safety cap. */
@media (max-width: 1200px) {
	html.nb-matchday-mobile-view {
		background: var(--nb-bg, #0A1729);
		scroll-padding-bottom: 84px;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform {
		margin: 0;
		padding-bottom: calc(72px + env(safe-area-inset-bottom));
		overflow-x: hidden;
		/* Matches the desktop shell: one dark theme across the whole app rather
		   than a second light background reintroducing the same mismatch on
		   mobile specifically. */
		background: var(--nb-bg, #0A1729);
		color: #0a1a2b;
		font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
		-webkit-text-size-adjust: 100%;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform *,
	html.nb-matchday-mobile-view body.nb-matchday-platform *::before,
	html.nb-matchday-mobile-view body.nb-matchday-platform *::after {
		box-sizing: border-box;
	}

	.nb-skip-link {
		position: fixed;
		top: 8px;
		left: 8px;
		z-index: 100000;
		transform: translateY(-160%);
		padding: 10px 14px;
		border-radius: 8px;
		background: #fff;
		color: #07192b;
		font-weight: 800;
	}

	.nb-skip-link:focus { transform: translateY(0); }

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(a, button, input, select, textarea) {
		touch-action: manipulation;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(button, .nb-btn, .nbpl-btn, input, select, textarea) {
		font: inherit;
	}

	/* Compact, sticky app header. */
	.nb-mobile-site-header {
		min-height: 56px;
		padding: max(6px, env(safe-area-inset-top)) 12px 6px;
		border-bottom-width: 2px;
		box-shadow: 0 4px 14px rgba(7, 25, 43, .12);
	}

	.nb-mobile-site-brand img { height: 36px; max-width: 132px; }
	.nb-mobile-site-actions { gap: 5px; }
	.nb-mobile-site-actions a:first-of-type { display: none; }
	.nb-mobile-site-actions :is(a, button) {
		min-width: 42px;
		min-height: 42px;
		padding: 0 9px;
		border-radius: 999px;
		font-size: 11px;
	}

	/* Edge-to-edge application canvas with a readable inner rhythm. */
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-mobile-platform-shell,
	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-centre-page-shell, .nb-match-centre-shell, .nb-public-profile-shell, .nbpl-plugin-page-shell, .nbpl-builder-experience) {
		width: 100% !important;
		max-width: none !important;
		margin: 0 !important;
		padding: 8px !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-centre-content-grid, .nb-unified-layout, .nbpl-squad-layout) {
		display: flex !important;
		flex-direction: column !important;
		gap: 10px !important;
		width: 100% !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-pred-wrap, .nb-profile-page, .nbpl-wrap, .nbpl-squad, .nb-single-match-main) {
		width: 100% !important;
		max-width: none !important;
		margin: 0 !important;
		padding-inline: 10px !important;
		border-radius: 12px !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-centre-hero, .nbpl-player-directory-hero, .nb-formation-page-heading) {
		min-height: 0 !important;
		margin: 0 0 10px !important;
		padding: 16px 14px !important;
		border-radius: 12px !important;
		box-shadow: none !important;
		text-align: left !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-centre-hero, .nbpl-player-directory-hero, .nb-formation-page-heading) :is(h1, h2, .nb-formation-page-heading__title) {
		margin: 3px 0 6px !important;
		font-size: clamp(25px, 8vw, 34px) !important;
		line-height: 1.03 !important;
		letter-spacing: -.02em !important;
		text-wrap: balance;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-centre-hero, .nbpl-player-directory-hero, .nb-formation-page-heading) p {
		margin: 0 !important;
		font-size: 13px !important;
		line-height: 1.45 !important;
	}

	/* Filters scroll like a scores application, without squeezing labels. */
	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-competition-tabs, .nb-profile-filters, .nbpl-bench-filters, .nb-lb-week-nav) {
		display: flex !important;
		gap: 7px !important;
		overflow-x: auto !important;
		padding: 4px 2px 8px !important;
		scroll-snap-type: x proximity;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-competition-tabs, .nb-profile-filters, .nbpl-bench-filters, .nb-lb-week-nav)::-webkit-scrollbar { display: none; }
	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-competition-tabs, .nb-profile-filters, .nbpl-bench-filters, .nb-lb-week-nav) > * {
		flex: 0 0 auto !important;
		scroll-snap-align: start;
	}

	/* Score-first match cards. */
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-match {
		width: 100% !important;
		max-width: none !important;
		margin: 0 0 10px !important;
		padding: 12px 10px !important;
		border-radius: 12px !important;
		box-shadow: 0 3px 12px rgba(7, 25, 43, .09) !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-match-meta {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 6px !important;
		margin-bottom: 8px !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-kickoff-tag, .nb-lock-tag) {
		min-width: 0 !important;
		padding: 7px 8px !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-teams-row {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) 104px minmax(0, 1fr) !important;
		gap: 5px !important;
		align-items: center !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-team { min-width: 0 !important; gap: 5px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-team-name {
		font-size: 13px !important;
		line-height: 1.15 !important;
		overflow-wrap: anywhere;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-crest-img, .nb-team .nb-crest) {
		width: 42px !important;
		height: 42px !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-score-entry { min-width: 0 !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-scoreboard-inline { gap: 4px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-digit-tile {
		width: 42px !important;
		height: 48px !important;
		padding: 0 !important;
		font-size: 25px !important;
		text-align: center;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-step-btn {
		min-width: var(--nb-step-size, 32px) !important;
		min-height: var(--nb-step-size, 32px) !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-actions-row {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) auto !important;
		gap: 8px !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-actions-row :is(button, .nb-btn) {
		min-height: var(--nb-btn-height, 44px) !important;
		padding: 10px 12px !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-prediction-grid { grid-template-columns: 1fr !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-prediction-item { min-height: 50px !important; }

	/* No desktop-width tables on phones. */
	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-leaderboard-wrap, .nb-profile-table-wrap, .nb-comp-block, .nb-player-season-table) {
		overflow: visible !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-leaderboard, .nb-profile-table, .nb-player-season-table table) {
		display: block !important;
		width: 100% !important;
		min-width: 0 !important;
		border: 0 !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-leaderboard, .nb-profile-table, .nb-player-season-table table) thead {
		position: absolute !important;
		width: 1px !important;
		height: 1px !important;
		overflow: hidden !important;
		clip-path: inset(50%) !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-leaderboard, .nb-profile-table, .nb-player-season-table table) tbody {
		display: grid !important;
		gap: 8px !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-leaderboard, .nb-profile-table, .nb-player-season-table table) tbody tr {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 0 10px !important;
		margin: 0 !important;
		padding: 10px 12px !important;
		border: 1px solid #d4dce5 !important;
		border-radius: 12px !important;
		background: #fff !important;
		box-shadow: 0 2px 8px rgba(7, 25, 43, .06) !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-leaderboard, .nb-profile-table, .nb-player-season-table table) tbody td {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		gap: 8px !important;
		min-width: 0 !important;
		padding: 7px 2px !important;
		border: 0 !important;
		color: #10243a !important;
		text-align: right !important;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-leaderboard, .nb-profile-table) tbody td::before {
		content: attr(data-label);
		color: #657589;
		font-size: 10px;
		font-weight: 800;
		letter-spacing: .05em;
		text-align: left;
		text-transform: uppercase;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-leaderboard tbody tr:not(.nb-leaderboard-empty) td:first-child { display: none !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-leaderboard, .nb-profile-table) tbody td:is([data-label="Fan"], [data-label="Match"], [data-label="Share"], [data-label="Weekly reward"]) { grid-column: 1 / -1; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-leaderboard tbody tr.nb-leaderboard-empty {
		display: block !important;
	}
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-leaderboard tbody tr.nb-leaderboard-empty td {
		display: block !important;
		padding: 18px 12px !important;
		text-align: center !important;
	}
	html.nb-matchday-mobile-view body.nb-matchday-platform :is(.nb-leaderboard, .nb-profile-table) .nb-user-link {
		color: #10243a !important;
	}

	/* Add labels to the generated player-stat rows without changing stored data. */
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-player-season-table tbody td:nth-child(1)::before { content: "Season"; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-player-season-table tbody td:nth-child(2)::before { content: "Competition"; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-player-season-table tbody td:nth-child(3)::before { content: "Apps"; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-player-season-table tbody td:nth-child(4)::before { content: "Goals"; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-player-season-table tbody td:nth-child(5)::before { content: "Assists"; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-player-season-table tbody td:nth-child(6)::before { content: "Cards"; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-player-season-table tbody td::before {
		color: #657589;
		font-size: 10px;
		font-weight: 800;
		letter-spacing: .05em;
		text-transform: uppercase;
	}

	/* Profiles and player cards. */
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-profile-hero { align-items: center !important; gap: 12px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-profile-avatar img { width: 58px !important; height: 58px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-profile-name { font-size: 24px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-profile-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-stat { min-height: 76px !important; padding: 10px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-profile-controls { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-profile-controls select { width: 100% !important; }

	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-card-body { padding: 9px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-card-name { font-size: 13px !important; line-height: 1.2 !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-profile-hero { display: grid !important; grid-template-columns: 88px 1fr !important; gap: 12px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-profile-photo { width: 88px !important; height: 108px !important; }

	/* Squad builder: controls, pitch and bench stay inside the viewport. */
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-squad-controls { padding: 12px 10px !important; border-radius: 12px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-squad-controls :is(input, select) { width: 100% !important; min-height: 46px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-pitch-outer { width: 100% !important; max-width: 100% !important; padding: 0 !important; overflow: hidden !important; border-radius: 10px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-pitch { width: 100% !important; max-width: 100% !important; height: min(720px, 150vw) !important; min-height: 520px !important; border-radius: 8px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-bench { margin-top: 10px !important; padding: 10px 8px !important; border-radius: 12px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-bench-list { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 6px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-bench-player { width: 100% !important; min-width: 0 !important; min-height: 88px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-squad-actions { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 7px !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-squad-actions .nbpl-btn-primary { grid-column: 1 / -1; min-height: var(--nb-btn-height, 44px) !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-share-dialog { padding: max(12px, env(safe-area-inset-top)) 8px calc(80px + env(safe-area-inset-bottom)) !important; overflow-y: auto !important; }

	/* Persistent five-destination navigation. */
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-mobile-dock {
		position: fixed;
		inset: auto 0 0;
		z-index: 99990;
		display: grid;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		padding: 5px max(5px, env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom)) max(5px, env(safe-area-inset-left));
		border-top: 1px solid #294661;
		background: rgba(7, 25, 43, .97);
		box-shadow: 0 -8px 24px rgba(7, 25, 43, .24);
		backdrop-filter: blur(14px);
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-mobile-dock a {
		display: grid;
		place-items: center;
		gap: 2px;
		min-width: 0;
		min-height: 54px;
		padding: 4px 2px;
		border-radius: 10px;
		color: #bdcad8;
		font-size: 10px;
		font-weight: 750;
		line-height: 1;
		text-decoration: none;
	}

	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-mobile-dock a.is-active { background: #e30613; color: #fff; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-mobile-dock__icon { width: 23px; height: 23px; color: #d5aa32; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-mobile-dock__icon svg { display: block; width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-mobile-dock__icon svg circle:first-child,
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-mobile-dock__icon svg path:first-child { fill: none; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-mobile-dock a.is-active .nb-mobile-dock__icon { color: #fff; }

	html.nb-matchday-mobile-view body.nb-matchday-platform.nb-matchday-mobile-dock-enabled .nb-shared-menu2-portal { display: none !important; }

	.nb-mobile-site-footer { padding-bottom: calc(88px + env(safe-area-inset-bottom)); }
}

@media (max-width: 340px) {
	html.nb-matchday-mobile-view body.nb-matchday-platform .nbpl-grid { grid-template-columns: 1fr !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-teams-row { grid-template-columns: minmax(0, 1fr) 96px minmax(0, 1fr) !important; }
	html.nb-matchday-mobile-view body.nb-matchday-platform .nb-profile-controls { grid-template-columns: 1fr !important; }
}

@media (prefers-reduced-motion: reduce) {
	html.nb-matchday-mobile-view *,
	html.nb-matchday-mobile-view *::before,
	html.nb-matchday-mobile-view *::after {
		scroll-behavior: auto !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}
