/* CSS for the footer.jsp tile definition */

.footer {
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.footer a, .footer .copyright {
	color: var(--kite-txt-primary-dark);
}

.footer .third {
	width: 33%;
	max-width: 33%;
	font-size: 0.9em;
}

.footer .text-start > a, #liveChatLink {
	white-space: nowrap;
}

.footer .text-start > a > span, #liveChatLink {
	margin-left: 5px;
	margin-right: 5px;
	text-decoration: none;
}

.footer .text-start > a:hover,
.footer .text-start > a:focus,
.footer .text-end > a:hover,
.footer .text-end > a:focus {
	color: var(--kite-link);
	transition: color 0.2s ease;
	text-decoration: underline !important; /* Using important here overrides Bootstrap rule for the Live Chat link */
}

.footer .text-start > a,
.footer .text-end > a {
	text-decoration: none;
}

.footer .copyright {
	text-align:center;
	font-weight: unset;
}

/* Responsive - Stacks footer elements into a column instead of a row for small devices */
@media (max-width: 768px) {

	.wrap_bcg:has(.footer) {
		margin: auto;
		display: flex;
	}

	/* Stacks footer elements into a column instead of a row for small devices */
	.footer {
		display: inline-grid; 
	}

	.footer .third {
		justify-content: center;
		display: inline-grid;
		max-width: 100%;
		width: 100%;
	}

	/* Centers footer links */
	.footer .text-start > a {
		justify-content: center;
		display: flex;
	}

	/* aligns icons with text */
	.footer .third > a > i {
		align-content: center;
	}

}