﻿/*#region Website */
html, body {
	top: 0px !important;
	margin-top: 0px !important;
	margin-left: 0px !important;
	margin-right: 0px !important;
	margin-bottom: 0px !important;
	padding: 0px !important;
	font-family: 'Hind' !important;
	background-color: white !important;
	color: black !important;
	line-height: 1.8 !important;
	word-break: break-word !important;
	overflow-wrap: break-word !important;
	white-space: normal !important;
}

.bottom-tab-bar {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	display: flex;
	z-index: 999;
	justify-content: space-around;
	background: #fff;
	border-top: 1px solid #ccc;
}

.tab-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	cursor: pointer;
	text-decoration: none;
	color: #000;
	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
	flex: 1;
	text-align: center;
	font-size: Small;
	padding: 4px;
	border: 1px solid #ccc;
	justify-content: center;
	font-weight: bold;
}

	.tab-item img {
		width: 26px;
		height: 26px;
	}

/* Popup Menu */
.menu-popup {
	position: fixed;
	bottom: 58px;
	left: 0;
	right: 0;
	background: rgba(0,0,0,0.6);
	display: flex;
	justify-content: center;
	align-items: flex-end;
	z-index: 1000;
	border: 1px solid #ccc;
}

.menu-content {
	background: #fff;
	width: 100%;
}

.tab-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
}

.navbar-brand {
	padding-top: 0px !important;
	padding-bottom: 0px !important;
	font-size: 1.6rem !important;
	text-decoration: none;
}

.container {
	text-align: center;
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: 20px;
	padding-left: 15px;
	padding-right: 15px;
}

.headeritems {
	box-shadow: rgba(0, 0, 0, 0.24) 7px 10px 12px 7px;
	padding-bottom: 10px !important;
	border-radius: 10px;
	width: 100%;
}

	.headeritems a {
		text-decoration: none !important;
		color: black !important;
	}

	.headeritems h1, .headeritems h2, .headeritems h3, .headeritems h4, .headeritems h5 {
		margin: 12px 0 0 0;
		font-weight: 600;
	}

.column {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.span-12 {
	grid-column: span 12;
}

	.span-12 img {
		width: 100%;
		border-radius: 12px;
		aspect-ratio: 2/1;
		display: block;
	}

.span-6 {
	grid-column: span 6;
}

	.span-6 img {
		width: 100%;
		border-radius: 12px;
		aspect-ratio: 1/1;
		display: block;
	}

.span-4 {
	grid-column: span 4;
}

	.span-4 img {
		width: 100%;
		border-radius: 12px;
		aspect-ratio: 1/1;
		display: block;
		text-align: center;
	}

.header {
	background-image: url('/_content/SanatanApp.Shared/files/head.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	padding: 20px;
	margin-bottom: 20px;
	margin-top: 20px;
	text-align: center;
	color: white;
	font-weight: bold;
	width: 100%;
}

/*#endregion */


/*#region Common */
.contentWrapper {
	word-wrap: break-word !important;
	overflow-wrap: break-word !important;
	box-sizing: border-box;
	text-align: justify;
}

.rdfFieldset {
	padding: 20px !important;
	border: 1px solid black;
}
/*#endregion */


/*#region WikiPage */
.pagetab {
	display: flex;
	width: 100%;
	padding: 0;
	margin: 0;
	border-bottom: 1px solid #fc8e07;
}

	.pagetab > div {
		display: inline-block;
		white-space: nowrap;
		flex: 1;
		text-align: center;
		padding: 10px;
		font-size: 16px;
		font-weight: 500;
		cursor: pointer;
		background-color: #f5f5f5;
		border: 1px solid #ddd;
		border-right: none;
		box-sizing: border-box;
	}

		.pagetab > div:last-child {
			border-right: 1px solid #ddd;
		}

		.pagetab > div.active {
			background-color: #007bff;
			color: white;
			border-color: #007bff;
		}

.tabtopic {
	font-size: 2rem;
	font-weight: bold;
	color: #333;
	margin: 20px 0 20px 0;
	text-align: center;
}

.contentWrapper h2 {
	text-align: center;
	display: block;
	font-size: 1.5em;
	margin-block-start: 0.83em;
	margin-block-end: 0.83em;
	margin-inline-start: 0px;
	margin-inline-end: 0px;
	font-weight: bold;
}

.patrika-header {
	background-color: #781010;
	padding-top: 20px;
	padding-bottom: 20px;
	text-align: center;
	margin: 0px;
	color: white;
	font-weight: bold;
}

.patrika-content {
	height: 100%;
	padding: 20px;
	padding-bottom: 20px;
	text-align: justify;
	text-align: center;
	background-color: navajowhite;
	text-align: justify;
	color: black;
}

	.patrika-content h2, h3 {
		text-align: center;
	}

.image-gallery {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
}

.image-item {
	box-sizing: border-box;
	width: calc(33.333% - 10px);
	border-radius: 6px;
	overflow: hidden;
	background: #f6f6f6;
	aspect-ratio: 1 / 1;
	position: relative;
}

	.image-item img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
		border: 0;
		margin: 0;
		pointer-events: auto;
	}


.modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,0.7);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1000;
}

.modal-content {
	background: white;
	padding: 10px;
	border-radius: 8px;
	max-width: 90%;
	max-height: 90%;
	text-align: center;
}

.popup-image {
	max-width: 100%;
	max-height: 80vh;
	border-radius: 4px;
}
/*#endregion */


/*#region Spinner */
.loading-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 9999;
	display: flex;
	justify-content: center;
	align-items: center;
	opacity: 1;
	transition: opacity 0.5s ease-in-out;
}

	.loading-overlay.fade-out {
		opacity: 0;
	}

.spinner {
	border: 6px solid #f3f3f3;
	border-top: 6px solid #3498db;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	animation: spin 1s linear infinite;
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}
/*#endregion */



/*#region Blazor */
.blazor-error-boundary {
	background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
	padding: 1rem 1rem 1rem 3.7rem;
	color: white;
}

	.blazor-error-boundary::after {
		content: "An error has occurred."
	}
/*#endregion */
