/* Benton Compressed — matches InDesign F5–F8 on season fronts */
@font-face {
	font-family: "BentonSansComp";
	src: url("/fonts/benton/BentonSansComp-Book.otf") format("opentype");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "BentonSansComp";
	src: url("/fonts/benton/BentonSansComp-Medium.otf") format("opentype");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "BentonSansComp";
	src: url("/fonts/benton/BentonSansComp-Black.otf") format("opentype");
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "BentonSansCond";
	src: url("/fonts/benton/BentonSansCond-Black.otf") format("opentype");
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

/* 2026–27 portrait credential preview (art 918×1350, display @ 50% = 459×675).
   Season and single-game fronts use different overlay boxes — switch via
   .bb-layout-season / .bb-layout-game on #front (see bbGames.js). */

.container.bg-light.text-dark {
	display: flex;
	flex-direction: row;
	padding: 10px 20px;
	justify-content: center;
}
#credentialRequest {
	display: flex;
}
.front-side {
	width: 459px;
	height: 675px;
	display: flex;
	flex-shrink: 0;
	flex-direction: column;
	position: relative;
	margin: 20px 20px;
	overflow: hidden;
	box-shadow: 2px 5px 15px 0px #17161694;
	background-color: #122529;
	color: #fff;
	background-image: url("/iuathletics/basketball/26/css/img/26SeasonPass.jpg");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	font-family: "BentonSansComp", "Arial Narrow", sans-serif;
}

.teamLogo{
	background-image: url("/logos/Indiana1.jpg");
	background-size: 100px;
	background-repeat: no-repeat;
	position: absolute;
	left: 33px;
	top: 341px;
	z-index: 7;
	width: 123px;
	height: 123px;
	display: none;
}

.space {
	display: block;
	width: 6%;
}
/* Keep photo out of #front flex flow so text overlays do not shift when it appears */
.show-image,
img#photCred,
.front-side img#photCred {
	position: absolute !important;
	z-index: 5;
	width: 123px !important;
	height: 123px !important;
	max-width: 123px !important;
	max-height: 123px !important;
	object-fit: cover;
	left: 33px;
	top: 341px;
	margin: 0 !important;
	padding: 0;
	flex: none;
	align-self: auto;
}
.info{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border-radius: 6px;
	font-size: 0.7rem;
	z-index: 2;
	pointer-events: none;
}
.info input,
.info button {
	pointer-events: auto;
}

/* Text block defaults — season (right of photo). Game overrides shift left.
   Stack as columns: fitty sets inline-block which would otherwise put lines side-by-side. */
.sub-info-name{
	position: absolute;
	width: 244px;
	left: 175px;
	top: 350px;
	bottom: auto;
	right: auto;
	margin: 0;
	color: #8e0617;
	text-align: left;
	overflow: hidden;
	line-height: 1.05;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.sub-info-title-department{
	position: absolute;
	width: 244px;
	left: 175px;
	top: 420px;
	bottom: auto;
	right: auto;
	margin: 0;
	color: #8e0617;
	text-align: left;
	overflow: hidden;
	line-height: 1.15;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.sub-info{
	width: 100%;
	height: 100%;
}

/* F5 First Medium 23pt → ~35px @ 1.5 display scale */
.bb-first {
	display: block !important; /* beat fitty's inline-block */
	width: 100%;
	font-family: "BentonSansComp", "Arial Narrow", sans-serif;
	font-weight: 500;
	font-size: 35px;
	line-height: 1.0;
	text-transform: uppercase;
	white-space: nowrap;
	overflow: hidden;
}
/* F6 Last Black 23pt */
.bb-last {
	display: block !important;
	width: 100%;
	font-family: "BentonSansComp", "Arial Narrow", sans-serif;
	font-weight: 900;
	font-size: 35px;
	line-height: 1.0;
	text-transform: uppercase;
	white-space: nowrap;
	overflow: hidden;
}
/* Season title Medium 8pt → ~12px (single-game overrides to 9pt) */
.bb-title {
	display: block !important;
	width: 100%;
	font-family: "BentonSansComp", "Arial Narrow", sans-serif;
	font-weight: 500;
	font-size: 12px;
	line-height: 1.15;
	text-transform: uppercase;
	white-space: nowrap;
	overflow: hidden;
}
/* Department Book 8pt → ~12px */
.bb-department {
	display: block !important;
	width: 100%;
	font-family: "BentonSansComp", "Arial Narrow", sans-serif;
	font-weight: 400;
	font-size: 12px;
	line-height: 1.15;
	text-transform: uppercase;
	white-space: nowrap;
	overflow: hidden;
}

/* --- Season layout --- */
.front-side.bb-layout-season .sub-info-name,
.front-side.bb-layout-season .sub-info-title-department,
.front-side.bb-layout-season .bb-first,
.front-side.bb-layout-season .bb-last,
.front-side.bb-layout-season .bb-title,
.front-side.bb-layout-season .bb-department {
	color: #8e0617;
}
.front-side.bb-layout-season .sub-info-name {
	left: 175px;
	top: 350px;
	width: 244px;
}
.front-side.bb-layout-season .sub-info-title-department {
	left: 175px;
	top: 420px;
	width: 244px;
}
.front-side.bb-layout-season .gameOpponent,
.front-side.bb-layout-season .gameDate,
.front-side.bb-layout-season .gameVS,
.front-side.bb-layout-season .gameLogo {
	display: none !important;
}
/* Season: white digits on crimson top-right plate */
.front-side.bb-layout-season .cred-number {
	color: #fff;
}

/* --- Single-game layout (left box + right opponent box; fonts differ from season) --- */
.front-side.bb-layout-game .sub-info-name,
.front-side.bb-layout-game .sub-info-title-department,
.front-side.bb-layout-game .bb-first,
.front-side.bb-layout-game .bb-last,
.front-side.bb-layout-game .bb-title,
.front-side.bb-layout-game .bb-department {
	color: #fff;
}
/* Name stack in left red-outline box (IDML L64) */
.front-side.bb-layout-game .sub-info-name {
	left: 64px;
	top: 355px;
	width: 244px;
}
.front-side.bb-layout-game .sub-info-title-department {
	left: 64px;
	top: 423px;
	width: 244px;
}
/* Single-game title is Medium 9pt (season uses 8pt) */
.front-side.bb-layout-game .bb-title {
	font-size: 13.5px;
}
.front-side.bb-layout-game .bb-department {
	font-size: 12px;
}
.front-side.bb-layout-game img#photCred,
.front-side.bb-layout-game .teamLogo {
	display: none !important;
}
.front-side.bb-layout-game .gameOpponent {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
}
.front-side.bb-layout-game .gameDate {
	display: block;
}
.front-side.bb-layout-game .gameLogo {
	display: flex;
}
/* Single-game: crimson digits on white top-right plate */
.front-side.bb-layout-game .cred-number {
	color: #8e0617;
}

/* 4-digit credential number — same plate on both fronts; flex-centered in the box */
.cred-number {
	position: absolute;
	left: 364px;
	top: 84px;
	width: 88px;
	height: 34px;
	margin: 0;
	padding: 0;
	z-index: 9;
	display: flex;
	align-items: center;      /* vertical center in plate */
	justify-content: center;  /* horizontal center in plate */
	font-family: "BentonSansCond", "Arial Narrow", sans-serif;
	font-weight: 900;
	font-size: 28.5px; /* Cond-Black 19pt @ 1.5x */
	line-height: 1;
	letter-spacing: 0.02em;
	text-align: center;
	pointer-events: none;
	color: #fff;
	box-sizing: border-box;
}
.gameDate{
	display: none;
	position: absolute;
	left: 319px;
	top: 345px;
	margin: 0;
	color: #fff;
	font-family: "BentonSansComp", "Arial Narrow", sans-serif;
	font-weight: 500;
	font-size: 12px;
	line-height: 1.1;
	white-space: nowrap;
	height: 14px;
	width: 90px;
	text-align: center;
	overflow: hidden;
	text-transform: uppercase;
	z-index: 8;
}
/* vs. (5pt) + team (7pt) under logo */
.gameOpponent{
	display: none;
	position: absolute;
	left: 319px;
	top: 448px;
	margin: 0;
	color: #fff;
	width: 90px;
	height: 28px;
	text-align: center;
	overflow: hidden;
	z-index: 8;
	line-height: 1.05;
}
.game-vs {
	font-family: "BentonSansComp", "Arial Narrow", sans-serif;
	font-weight: 500;
	font-size: 7.5px; /* 5pt @ 1.5x */
	text-transform: lowercase;
	letter-spacing: 0.02em;
}
.game-team {
	font-family: "BentonSansComp", "Arial Narrow", sans-serif;
	font-weight: 500;
	font-size: 10.5px; /* 7pt @ 1.5x */
	text-transform: uppercase;
	white-space: nowrap;
	overflow: hidden;
	max-width: 90px;
}
.gameVS{
	display: none;
}

.col-6{
	width: 80%;
}
.row{
	display: block;
	padding: 0 0 0 20px;
}
.form-control{
	width: auto;
}

.gameLogo {
	background-image: url("/logos/EasternIllinois.png");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
	left: 321px;
	top: 359px;
	margin: 0;
	z-index: 10;
	height: 87px;
	width: 87px;
	display: none;
}

/*
 * Access-zone letters (order M → S → P → T → C, or Gate-only).
 * Same card size for season + single-game → one shared row position.
 * Visible icons stay evenly spaced; group is centered horizontally.
 */
.access-zone-row {
	position: absolute;
	left: 40px;
	right: 40px;
	top: 556px; /* shared: between prior M (lower) and SP (higher) */
	height: 90px;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	gap: 14px;
	z-index: 7;
	pointer-events: none;
	box-sizing: border-box;
}
.access-zone-row .limitM,
.access-zone-row .limitS,
.access-zone-row .limitP,
.access-zone-row .limitT,
.access-zone-row .limitC,
.access-zone-row .limitG {
	position: relative;
	left: auto;
	top: auto;
	margin: 0;
	flex: 0 0 auto;
	display: none;
	background-repeat: no-repeat;
	background-position: center;
}
.limitM{
	background-image: url("/css/img/m_sp.png");
	background-size: contain;
	width: 48px;
	height: 72px;
}
.limitS{
	background-image: url("/css/img/s_sp.png");
	background-size: contain;
	width: 48px;
	height: 72px;
}
.limitP{
	background-image: url("/css/img/p_sp.png");
	background-size: contain;
	width: 48px;
	height: 72px;
}
.limitT{
	background-image: url("/css/img/t_sp.png");
	background-size: contain;
	width: 48px;
	height: 72px;
}
.limitC{
	background-image: url("/css/img/c_sp.png");
	background-size: contain;
	width: 48px;
	height: 72px;
}
.limitG {
	background-image: url("/css/img/g_sp.png");
	background-size: contain;
	width: 260px;
	height: 44px;
}

.watermark {
	display: flex;
	position: relative;
	overflow: hidden;
}
.watermark p {
	position: absolute;
	max-width: 400%;
	top: 0;
	left: 0;
	color: #fff;
	opacity: 0.2;
	font-size: 23px;
	pointer-events: none;
	z-index: 100;
}

@media (max-width: 992.00px) {
	.container.bg-light.text-dark {
		display: block;
		padding: 0 30px;
	}
	.col-6{
		width: 100%;
	}
	.form-control{
		width: 100%;
	}
	.row {
		width: 100%;
	}
	.front-side {
		width: 306px;
		height: 450px;
		margin: 10px auto;
	}
	img#photCred, .teamLogo, .show-image {
		left: 22px !important;
		top: 227px !important;
		width: 82px !important;
		height: 82px !important;
		max-width: 82px !important;
		max-height: 82px !important;
	}

	.bb-first, .bb-last { font-size: 23px; }
	.bb-title, .bb-department { font-size: 8px; }

	.front-side.bb-layout-season .sub-info-name {
		left: 117px !important;
		top: 233px !important;
		width: 163px !important;
	}
	.front-side.bb-layout-season .sub-info-title-department {
		left: 117px !important;
		top: 280px !important;
		width: 163px !important;
	}

	.front-side.bb-layout-game .sub-info-name {
		left: 43px !important;
		top: 237px !important;
		width: 163px !important;
	}
	.front-side.bb-layout-game .sub-info-title-department {
		left: 43px !important;
		top: 282px !important;
		width: 163px !important;
	}
	.front-side.bb-layout-game .bb-title { font-size: 9px; }
	.front-side.bb-layout-game .bb-department { font-size: 8px; }

	.gameLogo {
		left: 214px !important;
		top: 239px !important;
		width: 58px !important;
		height: 58px !important;
	}
	.gameDate {
		left: 213px !important;
		top: 230px !important;
		width: 60px !important;
		font-size: 8px;
	}
	.gameOpponent {
		left: 213px !important;
		top: 299px !important;
		width: 60px !important;
	}
	.game-vs { font-size: 5px; }
	.game-team { font-size: 7px; max-width: 60px; }

	.cred-number {
		left: 243px;
		top: 56px;
		width: 59px;
		height: 23px;
		font-size: 19px;
	}

	.access-zone-row {
		left: 24px;
		right: 24px;
		top: 371px; /* 556 * 450/675 — same for season + single-game */
		height: 60px;
		gap: 8px;
	}
	.limitM, .limitS, .limitP, .limitT, .limitC {
		width: 32px;
		height: 48px;
	}
	.limitG {
		width: 173px;
		height: 30px;
	}
}