/* Frontend UI v1.5 — Mewati Trust brand */

.mnc-cal {
	--mnc-p: #006538;
	--mnc-a: #FF9933;
	--mnc-font: 'Poppins', system-ui, sans-serif;

	max-width: 1280px;
	margin: 0 auto;
	padding: 8px 16px 40px;
	font-family: var(--mnc-font);
	box-sizing: border-box;
}

.mnc-cal *, .mnc-cal *::before, .mnc-cal *::after { box-sizing: border-box; }

/* Toolbar */
.mnc-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
	padding: 16px 24px;
	margin-bottom: 28px;
	background: linear-gradient(135deg, var(--mnc-p) 0%, #004d2a 100%);
	border-radius: 16px;
	box-shadow: 0 8px 32px rgba(0,101,56,.25);
	color: #fff;
}

.mnc-toolbar__stat { display: flex; align-items: baseline; gap: 10px; }

.mnc-toolbar__num {
	font-size: 2rem;
	font-weight: 700;
	line-height: 1;
	color: var(--mnc-a);
	text-shadow: 0 2px 8px rgba(0,0,0,.15);
}

.mnc-toolbar__lbl { font-size: .9rem; font-weight: 500; opacity: .9; }

.mnc-toolbar__nav {
	display: flex;
	align-items: center;
	gap: 8px;
	background: rgba(255,255,255,.12);
	padding: 6px;
	border-radius: 12px;
	border: 1px solid rgba(255,255,255,.2);
}

.mnc-nav-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: none;
	background: rgba(255,255,255,.15);
	color: #fff;
	border-radius: 10px;
	cursor: pointer;
	transition: transform .15s, background .15s;
}

.mnc-nav-btn:hover:not(:disabled) { background: rgba(255,255,255,.28); transform: scale(1.05); }
.mnc-nav-btn:disabled { opacity: .35; cursor: not-allowed; }

.mnc-year-sel {
	appearance: none;
	background: transparent;
	border: none;
	color: #fff;
	font-family: var(--mnc-font);
	font-size: 1.25rem;
	font-weight: 700;
	padding: 8px 16px;
	cursor: pointer;
	text-align: center;
	min-width: 90px;
}

.mnc-year-sel option { color: #111; background: #fff; }

/* Grid */
.mnc-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

@media (max-width: 1100px) { .mnc-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px)  { .mnc-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .mnc-grid { grid-template-columns: 1fr; } }

/* Month card */
.mnc-card {
	background: #fff;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 2px 12px rgba(0,0,0,.06);
	border: 1px solid rgba(0,0,0,.06);
	transition: transform .25s ease, box-shadow .25s;
	animation: mncUp .45s ease both;
}

.mnc-card:nth-child(1)  { animation-delay: .02s; }
.mnc-card:nth-child(2)  { animation-delay: .04s; }
.mnc-card:nth-child(3)  { animation-delay: .06s; }
.mnc-card:nth-child(4)  { animation-delay: .08s; }
.mnc-card:nth-child(5)  { animation-delay: .10s; }
.mnc-card:nth-child(6)  { animation-delay: .12s; }
.mnc-card:nth-child(7)  { animation-delay: .14s; }
.mnc-card:nth-child(8)  { animation-delay: .16s; }
.mnc-card:nth-child(9)  { animation-delay: .18s; }
.mnc-card:nth-child(10) { animation-delay: .20s; }
.mnc-card:nth-child(11) { animation-delay: .22s; }
.mnc-card:nth-child(12) { animation-delay: .24s; }

@keyframes mncUp {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: translateY(0); }
}

.mnc-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 32px rgba(0,0,0,.1);
}

.mnc-card--live { border-color: rgba(0,101,56,.25); }

.mnc-card__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 16px 10px;
	background: var(--mnc-g, linear-gradient(135deg, var(--mnc-p) 0%, var(--mnc-a) 100%));
	color: #fff;
}

.mnc-card__month { display: flex; align-items: baseline; gap: 8px; }

.mnc-card__abbr {
	font-size: .7rem;
	font-weight: 700;
	opacity: .85;
	letter-spacing: .06em;
}

.mnc-card__name {
	margin: 0;
	font-size: 1rem;
	font-weight: 600;
}

.mnc-card__tag {
	font-size: .65rem;
	font-weight: 700;
	padding: 4px 10px;
	border-radius: 999px;
	background: rgba(255,255,255,.2);
	letter-spacing: .05em;
}

.mnc-card__tag--live { background: rgba(255,255,255,.95); color: var(--mnc-p); }

.mnc-card__cal { padding: 12px 14px 8px; }

.mnc-d--pick {
	border: none;
	font-family: inherit;
	padding: 0;
	cursor: pointer;
}

.mnc-d--pick.is-selected {
	box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--mnc-a);
	transform: scale(1.08);
}

.mnc-card__foot {
	padding: 0 14px 14px;
}

.mnc-card__hint {
	margin: 0 0 8px;
	font-size: .72rem;
	color: #666;
	text-align: center;
}

.mnc-card__wd,
.mnc-card__days {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 3px;
}

.mnc-card__wd { margin-bottom: 4px; }

.mnc-card__wd span {
	text-align: center;
	font-size: .62rem;
	font-weight: 600;
	color: #999;
	text-transform: uppercase;
}

.mnc-d {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1px;
	aspect-ratio: 1;
	font-size: .72rem;
	color: #666;
	border-radius: 8px;
	text-decoration: none;
	font-weight: 500;
	position: relative;
}

.mnc-d__num { line-height: 1.1; }

.mnc-d__dot {
	display: none;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--mnc-a);
	flex-shrink: 0;
}

.mnc-d--dl .mnc-d__dot { display: block; }

.mnc-d--dl {
	background: var(--mnc-p) !important;
	color: #fff !important;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 3px 10px rgba(0,101,56,.3);
	transition: transform .15s, background .15s;
}

.mnc-d--dl .mnc-d__dot {
	background: #fff;
	box-shadow: 0 0 0 1px rgba(255,255,255,.4);
}

.mnc-d--dl:hover {
	transform: scale(1.12);
	background: var(--mnc-a) !important;
}

.mnc-d--x { visibility: hidden; }

.mnc-card--live .mnc-card__month::after {
	content: '';
	display: inline-block;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #fff;
	margin-left: 6px;
	vertical-align: middle;
	box-shadow: 0 0 0 2px rgba(255,255,255,.35);
}

.mnc-card__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 4px 14px 14px;
	padding: 10px;
	background: var(--mnc-p);
	color: #fff !important;
	text-decoration: none !important;
	border-radius: 10px;
	font-size: .78rem;
	font-weight: 600;
	transition: background .15s, transform .15s;
}

.mnc-card__btn:hover {
	background: var(--mnc-a);
	transform: translateY(-1px);
	color: #fff !important;
}

.mnc-cal.mnc-loading .mnc-grid { opacity: .4; pointer-events: none; }

.screen-reader-text {
	clip: rect(1px,1px,1px,1px) !important;
	position: absolute !important;
	height: 1px; width: 1px; overflow: hidden;
}