/* ==========================================================================
   Tournament / League detail page polish — scoped "tn-" namespace, additive
   on top of the legacy style_dir.css/bootstrap.css bundle this page already
   loads. Uses the page's own established accent colors (orange #ff8a00,
   purple #744af4) rather than introducing a new palette.
   ========================================================================== */

:root{
	--tn-orange: #ff8a00;
	--tn-orange-dark: #d97400;
	--tn-purple: #744af4;
	--tn-purple-dark: #5c34d8;
	--tn-purple-light: #f2edfe;
	--tn-border: #e5e8ee;
	--tn-text: #22262b;
	--tn-text-muted: #6b7280;
	--tn-card-bg: #ffffff;
	--tn-radius: 12px;
	--tn-shadow: 0 2px 10px rgba(20, 24, 33, 0.06);
	--tn-shadow-hover: 0 10px 26px rgba(20, 24, 33, 0.14);
}

/* ---------- Header card (image / title / when-where / buttons / actions) ---------- */
.tn-header-card{
	background: var(--tn-card-bg);
	border: 1px solid var(--tn-border);
	border-radius: var(--tn-radius);
	box-shadow: var(--tn-shadow);
	padding: 24px 20px !important;
}

/* ---------- Action buttons (Shop LLP Items / Become a Sponsor / Volunteer / Donate) ---------- */
.tn-action-btn{
	background: var(--tn-orange) !important;
	border-radius: 8px !important;
	padding: 10px 5px !important;
	font-weight: 600;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .15);
	transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.tn-action-btn:hover{
	background: var(--tn-orange-dark) !important;
	box-shadow: var(--tn-shadow-hover);
	transform: translateY(-2px);
}

/* Register Now / My Events / Scan & Check In Players - the primary CTA buttons */
.tn-action-btn-primary{
	background: var(--tn-purple) !important;
	border-radius: 8px !important;
	box-shadow: 0 2px 8px rgba(116, 74, 244, .35);
}
.tn-action-btn-primary:hover{
	background: var(--tn-purple-dark) !important;
	box-shadow: 0 6px 18px rgba(116, 74, 244, .45);
	transform: translateY(-2px);
}

/* "Actions" dropdown */
select#admin_actions{
	border-radius: 8px !important;
	border: 2px solid var(--tn-orange) !important;
}

/* ---------- Tournament info panel (Tournament: / Director: / Registration.../ Sport:...) ---------- */
.tn-info-panel > div{
	padding: 5px 0;
	border-bottom: 1px dashed var(--tn-border);
}
.tn-info-panel > div:last-child{ border-bottom: none; }
.tn-info-panel label{
	font-weight: 700;
	color: var(--tn-text);
	margin: 0 6px 0 0;
}

/* ---------- Lines table (Format / Line#) ---------- */
table.tn-lines-table{
	border-collapse: collapse;
	margin-top: 8px;
	border: 1px solid var(--tn-border);
	border-radius: 8px;
	overflow: hidden;
}
table.tn-lines-table tr:first-child{
	background: var(--tn-orange);
}
table.tn-lines-table tr:first-child td{
	color: #fff;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 12px;
	letter-spacing: .04em;
	border: none !important;
}
table.tn-lines-table td{
	padding: 8px 18px !important;
	border: 1px solid var(--tn-border) !important;
}
table.tn-lines-table tr:not(:first-child):hover td{ background: #fff7ec; }

/* ---------- Details & Rules ---------- */
.tn-details-wrapper{ margin-top: 8px; }
.tn-details{
	background: var(--tn-card-bg);
	border: 1px solid var(--tn-border);
	border-radius: var(--tn-radius);
	box-shadow: var(--tn-shadow);
	padding: 22px 24px;
}
.tn-details-title{
	margin: 0 0 16px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--tn-orange);
	font-size: 22px !important;
	color: var(--tn-text);
}
.tn-details #desc_view{
	line-height: 1.7;
	color: var(--tn-text);
}
.tn-details #desc_view b{ color: var(--tn-text); }

/* ---------- Sponsors strip (shared with header_tourn.php / academy_league_header.php) ---------- */
.tn-sponsors-band{
	background: var(--tn-purple-light);
	border-radius: var(--tn-radius);
	padding: 16px 18px 20px;
	margin-bottom: 20px;
}
.tn-sponsors-title{
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--tn-purple-dark);
	opacity: .85;
	text-align: center;
	margin: 0 0 12px;
}
.tn-sponsor-card{
	height: 120px !important;
	background: transparent !important;
	border: none;
	border-radius: 0;
	box-shadow: none;
	margin: 0 8px;
	transition: transform .2s ease;
}
.tn-sponsor-card:hover{ transform: translateY(-3px); }
.tn-sponsor-card img{ max-width: 100% !important; max-height: 100% !important; }

/* slick.js (footer.php) initializes this carousel late, near the end of the
   page load - until then the cards are plain stacked blocks, which flashes
   the band tall. Lay them out the same way slick will (3 per row) so there's
   no visible jump once it initializes and adds .slick-initialized. */
.custom-slider:not(.slick-initialized){
	display: flex;
	flex-wrap: nowrap;
	overflow: hidden;
}
.custom-slider:not(.slick-initialized) .tn-sponsor-card{
	flex: 0 0 calc(33.333% - 16px);
}

.tn-sponsors-band .slick-prev:before,
.tn-sponsors-band .slick-next:before{ color: var(--tn-purple-dark); opacity: .85; }
.tn-sponsors-band .slick-dots li button:before{ color: var(--tn-purple-dark); opacity: .6; }
.tn-sponsors-band .slick-dots li.slick-active button:before{ opacity: 1; }

@media (max-width: 767px){
	.tn-header-card{ padding: 16px 12px !important; }
	.tn-details{ padding: 16px; }
}
