/* =========================================================
   LEGAL MODAL
   Matches the existing Katie's Elite / AllStar theme
========================================================= */

.legal-modal{
	position:fixed;
	inset:0;

	z-index:9999;

	display:none;

	align-items:center;
	justify-content:center;

	padding:20px;

	background:rgba(2,20,42,.72);
}


.legal-modal.is-open{
	display:flex;
}


/* =========================================================
   OVERLAY
========================================================= */

.legal-modal-overlay{
	position:absolute;

	inset:0;

	cursor:pointer;
}


/* =========================================================
   MODAL BOX
   Matches existing .modal-box
========================================================= */

.legal-modal-content{
	position:relative;

	width:min(850px,100%);

	max-height:calc(100vh - 40px);

	background:#fff;

	border-radius:8px;

	box-shadow:
		0 25px 60px rgba(0,0,0,.3);

	overflow:hidden;

	z-index:2;
}


/* =========================================================
   LEGAL HEADER
========================================================= */

.legal-modal-header{
	display:flex;

	align-items:center;
	justify-content:space-between;

	padding:20px 24px 18px;

	border-bottom:
		1px solid var(--line);

	background:var(--bg);
}


.legal-modal-header h2{
	margin:0;

	color:var(--navy);

	font-size:21px;

	font-weight:800;

	text-transform:uppercase;
}


/* =========================================================
   CLOSE BUTTON
   Matches existing modal close behaviour
========================================================= */

.legal-modal-close{
	position:absolute;

	right:12px;
	top:7px;

	width:36px;
	height:36px;

	display:flex;

	align-items:center;
	justify-content:center;

	border:0;

	background:none;

	color:#667;

	font-size:22px;

	cursor:pointer;

	z-index:5;
}


.legal-modal-close:hover{
	color:var(--red);
}


/* =========================================================
   LEGAL CONTENT
========================================================= */

.legal-modal-body{
	max-height:calc(100vh - 40px);

	overflow-y:auto;

	padding:24px;

	color:var(--text);
}


/* =========================================================
   MAIN TITLE
========================================================= */

.legal-modal-body h1{
	margin:0 40px 18px 0;

	color:var(--navy);

	font-size:28px;

	line-height:1.2;

	font-weight:800;
}


/* =========================================================
   SECTION HEADINGS
========================================================= */

.legal-modal-body h2{
	margin:28px 0 10px;

	padding-bottom:8px;

	color:var(--navy);

	font-size:19px;

	line-height:1.3;

	font-weight:800;

	border-bottom:
		2px solid var(--red);
}


.legal-modal-body h3{
	margin:22px 0 8px;

	color:var(--navy);

	font-size:15px;

	font-weight:800;
}


/* =========================================================
   TEXT
========================================================= */

.legal-modal-body p{
	margin:0 0 14px;

	color:var(--muted);

	font-size:14px;

	line-height:1.65;
}


/* =========================================================
   LISTS
========================================================= */

.legal-modal-body ul,
.legal-modal-body ol{
	margin:0 0 16px;

	padding-left:22px;
}


.legal-modal-body li{
	margin-bottom:7px;

	color:var(--muted);

	font-size:14px;

	line-height:1.6;
}


.legal-modal-body li::marker{
	color:var(--red);
}


/* =========================================================
   LINKS
========================================================= */

.legal-modal-body a{
	color:var(--red);

	font-weight:700;

	text-decoration:none;
}


.legal-modal-body a:hover{
	text-decoration:underline;
}


/* =========================================================
   SCROLLBAR
========================================================= */

.legal-modal-body::-webkit-scrollbar{
	width:8px;
}


.legal-modal-body::-webkit-scrollbar-track{
	background:var(--bg);
}


.legal-modal-body::-webkit-scrollbar-thumb{
	background:#ccd5df;

	border-radius:4px;
}


.legal-modal-body::-webkit-scrollbar-thumb:hover{
	background:var(--blue);
}


/* =========================================================
   PREVENT BACKGROUND SCROLL
========================================================= */

body.legal-modal-open{
	overflow:hidden;
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:720px){

	.legal-modal{
		padding:14px;
	}


	.legal-modal-content{
		max-height:calc(100vh - 28px);
	}


	.legal-modal-body{
		max-height:calc(100vh - 28px);

		padding:20px;
	}


	.legal-modal-body h1{
		font-size:23px;

		margin-bottom:16px;
	}


	.legal-modal-body h2{
		font-size:17px;

		margin-top:24px;
	}


	.legal-modal-body h3{
		font-size:14px;
	}


	.legal-modal-body p,
	.legal-modal-body li{
		font-size:13px;
	}

}