/*
 * College Sportslytics Demo UI — Custom styles, print sheet, animated badge states
 * Supplements Tailwind CDN Play.
 * Mirrors production sportslytics-ui.css; all canvas class names intentionally identical
 * so the demo shortcodes (which reuse sportslytics-* canvas names) pick up the same rules.
 */

/* ── Divi isolation wrapper — outermost container for all shortcodes ──────── */

.sportslytics-divi-wrapper {
	all: initial;
	display: block;
	font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 16px;
	line-height: 1.5;
	color: #111827;
	box-sizing: border-box;
}

.sportslytics-divi-wrapper *,
.sportslytics-divi-wrapper *::before,
.sportslytics-divi-wrapper *::after {
	box-sizing: border-box;
}

.sportslytics-divi-wrapper .et_pb_module,
.sportslytics-divi-wrapper .et_pb_row,
.sportslytics-divi-wrapper .et_pb_column {
	margin: 0 !important;
	padding: 0 !important;
	width: auto !important;
}

/* ── Global form-element border enforcement ──────────────────────────────── */

.sportslytics-divi-wrapper input,
.sportslytics-divi-wrapper select,
.sportslytics-divi-wrapper textarea {
	border-color: #000000 !important;
}

.sportslytics-divi-wrapper input:focus,
.sportslytics-divi-wrapper select:focus,
.sportslytics-divi-wrapper textarea:focus {
	border-color: #0d9488 !important;
	box-shadow: 0 0 0 1px #0d9488 !important;
	outline: none !important;
}

.sportslytics-divi-wrapper .spl-currency-group {
	border-color: #000000 !important;
}

.sportslytics-divi-wrapper .spl-currency-sep {
	border-color: #000000 !important;
}

.sportslytics-divi-wrapper .spl-currency-group:focus-within {
	border-color: #0d9488 !important;
	box-shadow: 0 0 0 1px #0d9488 !important;
}

/* ── sportslytics-board-canvas — Recruiting Board namespace ─────────────── */

.sportslytics-board-canvas {
	font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 16px;
	line-height: 1.5;
	color: #111827;
	max-width: 1400px;
	margin: 0 auto;
}

.sportslytics-board-canvas *,
.sportslytics-board-canvas *::before,
.sportslytics-board-canvas *::after {
	box-sizing: border-box;
}

.sportslytics-board-canvas input,
.sportslytics-board-canvas select,
.sportslytics-board-canvas button {
	font-family: inherit;
	font-size: inherit;
}

.sportslytics-board-canvas select:focus,
.sportslytics-board-canvas input:focus,
.sportslytics-board-canvas button:focus-visible {
	outline: none;
	border-color: #0d9488 !important;
	box-shadow: 0 0 0 1px #0d9488 !important;
}

.sportslytics-board-canvas .spl-phase-column {
	min-height: 220px;
}

.sportslytics-board-canvas .spl-board-card {
	animation: spl-fade-in .18s ease;
	transition: box-shadow .12s, border-color .12s;
}

.sportslytics-board-canvas .spl-board-card:hover {
	box-shadow: 0 2px 10px rgba(0,0,0,.06);
}

/* ── Micro-tag pill tokens ────────────────────────────────────────────────── */

.spl-tag-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 6px;
	font-size: .875rem;
	cursor: pointer;
	transition: background .12s, border-color .12s, transform .08s;
	border: 1px solid transparent;
}

.spl-tag-pill:active {
	transform: scale(.9);
}

.spl-tag-off {
	background: #f3f4f6;
	border-color: #e5e7eb;
	opacity: .55;
}

.spl-tag-off:hover {
	background: #e5e7eb;
	opacity: .85;
}

.spl-tag-on {
	background: #dbeafe;
	border-color: #93c5fd;
	opacity: 1;
}

.spl-tag-on:hover {
	background: #bfdbfe;
}

/* ── Phase column left-border accent classes (used by JS card move) ──────── */

.border-l-gray-300  { border-left-color: #d1d5db !important; }
.border-l-blue-400  { border-left-color: #60a5fa !important; }
.border-l-amber-400 { border-left-color: #fbbf24 !important; }
.border-l-green-400 { border-left-color: #4ade80 !important; }
.border-l-teal-500  { border-left-color: #14b8a6 !important; }

/* ── Print styles for the board ─────────────────────────────────────────── */

@media print {
	.sportslytics-board-canvas .spl-no-print,
	.sportslytics-board-canvas select,
	.sportslytics-board-canvas .spl-tag-pill {
		display: none !important;
	}

	.sportslytics-board-canvas .spl-board-card {
		page-break-inside: avoid;
		border: 1px solid #d1d5db !important;
		border-left-width: 3px !important;
		box-shadow: none !important;
		animation: none !important;
		margin-bottom: 6pt;
	}

	.sportslytics-board-canvas .spl-phase-column {
		page-break-inside: avoid;
	}

	.sportslytics-board-canvas #[id$="-kanban"] {
		display: block !important;
	}

	.sportslytics-board-canvas .spl-phase-column {
		margin-bottom: 16pt;
		break-before: auto;
	}
}

/* ── sportslytics-discovery-canvas — Discovery Engine namespace ─────────── */

.sportslytics-discovery-canvas {
	font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 16px;
	line-height: 1.5;
	color: #111827;
	max-width: 1200px;
	margin: 0 auto;
}

.sportslytics-discovery-canvas *,
.sportslytics-discovery-canvas *::before,
.sportslytics-discovery-canvas *::after {
	box-sizing: border-box;
}

.sportslytics-discovery-canvas input,
.sportslytics-discovery-canvas select,
.sportslytics-discovery-canvas textarea,
.sportslytics-discovery-canvas button {
	font-family: inherit;
	font-size: inherit;
}

.sportslytics-discovery-canvas input:focus,
.sportslytics-discovery-canvas select:focus,
.sportslytics-discovery-canvas textarea:focus {
	outline: none;
	border-color: #0d9488 !important;
	box-shadow: 0 0 0 1px #0d9488 !important;
}

.sportslytics-discovery-canvas .spl-disc-slider {
	-webkit-appearance: none;
	appearance: none;
	height: 20px;
	background: transparent;
	cursor: pointer;
}

.sportslytics-discovery-canvas .spl-disc-slider::-webkit-slider-runnable-track {
	height: 6px;
	background: #e5e7eb;
	border-radius: 999px;
}

.sportslytics-discovery-canvas .spl-disc-slider::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 18px;
	height: 18px;
	margin-top: -6px;
	border-radius: 50%;
	background: #1d4ed8;
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px #1d4ed8, 0 2px 4px rgba(0,0,0,.15);
	transition: transform .1s;
}

.sportslytics-discovery-canvas .spl-disc-slider::-webkit-slider-thumb:active {
	transform: scale(1.2);
}

.sportslytics-discovery-canvas .spl-disc-slider::-moz-range-track {
	height: 6px;
	background: #e5e7eb;
	border-radius: 999px;
}

.sportslytics-discovery-canvas .spl-disc-slider::-moz-range-thumb {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #1d4ed8;
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px #1d4ed8;
	cursor: pointer;
}

.sportslytics-discovery-canvas #[id$="-sticky-banner"]:not(.hidden) {
	animation: spl-banner-in .2s ease;
}

@keyframes spl-banner-in {
	from { transform: translateY(100%); opacity: 0; }
	to   { transform: translateY(0);   opacity: 1; }
}

.sportslytics-discovery-canvas .spl-result-row {
	animation: spl-fade-in .22s ease;
}

.sportslytics-discovery-canvas select[multiple] {
	overflow-y: auto;
}

/* ── sportslytics-form-canvas — Program Settings / Onboarding Hub namespace  */

.sportslytics-form-canvas {
	font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 16px;
	line-height: 1.5;
	color: #111827;
	max-width: 1100px;
	margin: 0 auto;
}

.sportslytics-form-canvas *,
.sportslytics-form-canvas *::before,
.sportslytics-form-canvas *::after {
	box-sizing: border-box;
}

.sportslytics-form-canvas input,
.sportslytics-form-canvas select,
.sportslytics-form-canvas textarea,
.sportslytics-form-canvas button {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
}

.sportslytics-form-canvas input:focus,
.sportslytics-form-canvas select:focus,
.sportslytics-form-canvas textarea:focus {
	outline: none;
	border-color: #0d9488 !important;
	box-shadow: 0 0 0 1px #0d9488 !important;
}

.sportslytics-form-canvas .border-l-4.border-l-teal-600 {
	border-left: 4px solid #0d9488 !important;
}

/* ── sportslytics-profile-canvas — Recruit Profile namespace ────────────── */

.sportslytics-profile-canvas {
	font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 16px;
	line-height: 1.5;
	color: #111827;
	max-width: 1100px;
	margin: 0 auto;
}

.sportslytics-profile-canvas *,
.sportslytics-profile-canvas *::before,
.sportslytics-profile-canvas *::after {
	box-sizing: border-box;
}

.sportslytics-profile-canvas input,
.sportslytics-profile-canvas select,
.sportslytics-profile-canvas textarea,
.sportslytics-profile-canvas button {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
}

.sportslytics-profile-canvas input:focus,
.sportslytics-profile-canvas select:focus,
.sportslytics-profile-canvas textarea:focus,
.sportslytics-profile-canvas button:focus-visible {
	outline: none;
	border-color: #0d9488 !important;
	box-shadow: 0 0 0 1px #0d9488 !important;
}

.sportslytics-profile-canvas .spl-profile-slider {
	-webkit-appearance: none;
	appearance: none;
	height: 20px;
	background: transparent;
	cursor: pointer;
}

.sportslytics-profile-canvas .spl-profile-slider::-webkit-slider-runnable-track {
	height: 6px;
	background: #e5e7eb;
	border-radius: 999px;
}

.sportslytics-profile-canvas .spl-profile-slider::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 18px;
	height: 18px;
	margin-top: -6px;
	border-radius: 50%;
	background: #1d4ed8;
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px #1d4ed8, 0 2px 4px rgba(0,0,0,.15);
	transition: transform .1s;
}

.sportslytics-profile-canvas .spl-profile-slider::-webkit-slider-thumb:active {
	transform: scale(1.2);
}

.sportslytics-profile-canvas .spl-profile-slider::-moz-range-track {
	height: 6px;
	background: #e5e7eb;
	border-radius: 999px;
}

.sportslytics-profile-canvas .spl-profile-slider::-moz-range-thumb {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #1d4ed8;
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px #1d4ed8;
	cursor: pointer;
}

.sportslytics-profile-canvas .spl-score-fill {
	transition: width .45s cubic-bezier(.4,0,.2,1);
}

@media (max-width: 640px) {
	.sportslytics-profile-canvas .relative.pl-6 > .absolute {
		left: .4rem;
	}
}

@media print {
	.sportslytics-profile-canvas .spl-no-print,
	.sportslytics-profile-canvas button,
	.sportslytics-profile-canvas input[type="range"] {
		display: none !important;
	}

	.sportslytics-profile-canvas {
		max-width: 100%;
	}

	.sportslytics-profile-canvas .lg\:grid-cols-3 {
		grid-template-columns: 1fr !important;
	}

	.sportslytics-profile-canvas .lg\:col-span-2,
	.sportslytics-profile-canvas .lg\:col-span-1 {
		grid-column: span 1 !important;
	}

	.sportslytics-profile-canvas .bg-white {
		border: 1px solid #d1d5db !important;
		box-shadow: none !important;
	}

	@page {
		margin: 0.75in;
		size: letter portrait;
	}
}

/* ── Shared component classes ────────────────────────────────────────────── */

.spl-score-row > div > div:last-child {
	transition: width 0.5s cubic-bezier( 0.4, 0, 0.2, 1 );
}

/* Compliance badges */

.spl-badge-active {
	display: inline-flex;
	align-items: center;
	gap: .2rem;
	padding: .18rem .6rem;
	border-radius: 999px;
	font-size: .7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	background: #0d9488;
	color: #fff;
	border: 1.5px solid #0d9488;
}

.spl-badge-watchlist {
	display: inline-flex;
	align-items: center;
	gap: .2rem;
	padding: .18rem .6rem;
	border-radius: 999px;
	font-size: .7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	background: #fff;
	color: #b45309;
	border: 2px dashed #f59e0b;
}

.spl-badge-unrestricted {
	display: inline-flex;
	align-items: center;
	gap: .2rem;
	padding: .18rem .6rem;
	border-radius: 999px;
	font-size: .7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	background: #dbeafe;
	color: #1d4ed8;
	border: 1.5px solid #93c5fd;
}

/* Verification badges */

.spl-verify-ok {
	display: inline-flex;
	align-items: center;
	gap: .2rem;
	padding: .18rem .55rem;
	border-radius: 999px;
	font-size: .7rem;
	font-weight: 700;
	background: #ccfbf1;
	color: #0f766e;
	border: 1.5px solid #5eead4;
}

.spl-verify-proxy {
	display: inline-flex;
	align-items: center;
	gap: .2rem;
	padding: .18rem .55rem;
	border-radius: 999px;
	font-size: .7rem;
	font-weight: 700;
	background: #fffbeb;
	color: #92400e;
	border: 2px dashed #fcd34d;
	animation: spl-proxy-pulse 2.5s ease-in-out infinite;
}

@keyframes spl-proxy-pulse {
	0%, 100% { opacity: 1; }
	50%       { opacity: .6; }
}

/* Board cards */

.spl-board-card {
	transition: box-shadow .15s, opacity .3s;
}

.spl-board-card:hover {
	box-shadow: 0 4px 16px rgba(0,0,0,.07);
}

/* Prospect card fade-in */

.spl-prospect-card {
	animation: spl-fade-in .25s ease;
}

@keyframes spl-fade-in {
	from { opacity: 0; transform: translateY(6px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* Modal overlay */

.spl-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba(15,23,42,.55);
	z-index: 9998;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
}

.spl-modal-box {
	background: #fff;
	border-radius: 14px;
	padding: 2rem;
	width: 100%;
	max-width: 680px;
	max-height: 90vh;
	overflow-y: auto;
	box-shadow: 0 20px 60px rgba(0,0,0,.2);
	animation: spl-modal-in .22s cubic-bezier( 0.34, 1.56, 0.64, 1 );
}

@keyframes spl-modal-in {
	from { opacity: 0; transform: scale(.94); }
	to   { opacity: 1; transform: scale(1); }
}

/* ── Print styles (global) ───────────────────────────────────────────────── */

@media print {
	.spl-no-print,
	.spl-modal-overlay,
	button,
	select,
	input[type="range"],
	input[type="checkbox"] {
		display: none !important;
	}

	.spl-print-only {
		display: block !important;
	}

	.spl-board-card {
		box-shadow: none !important;
		animation: none !important;
		transition: none !important;
	}

	.spl-board-card {
		page-break-inside: avoid;
		border: 1px solid #ccc !important;
		border-left-width: 4px !important;
		margin-bottom: 6pt !important;
		padding: 8pt 10pt !important;
	}

	@page {
		margin: 0.75in;
		size: letter portrait;
	}
}
