/* =========================================================================
   School Management — Public / Portal / Notice Board / Admission
   Shares the same modern design language as the admin UI.
   ========================================================================= */

.sm-notice-board, .sm-result-lookup, .sm-portal-box, .sm-admission-box,
.sm-status-check-box, .sm-modal-card {
	--sm-primary: #4f46e5;
	--sm-primary-dark: #4338ca;
	--sm-accent: #7c3aed;
	--sm-success: #16a34a;
	--sm-success-bg: #ecfdf3;
	--sm-danger: #e11d48;
	--sm-danger-bg: #fef2f3;
	--sm-warning: #d97706;
	--sm-warning-bg: #fffaeb;
	--sm-text: #1e1b2e;
	--sm-text-muted: #6b7280;
	--sm-border: #e6e5f0;
	--sm-radius-sm: 8px;
	--sm-radius: 14px;
	--sm-radius-lg: 20px;
	--sm-shadow: 0 4px 16px rgba(30,27,46,0.07), 0 1px 3px rgba(30,27,46,0.05);
	--sm-shadow-lg: 0 14px 34px rgba(30,27,46,0.12);
	font-family: 'Hind Siliguri', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	color: var(--sm-text);
	box-sizing: border-box;
}
.sm-notice-board *, .sm-result-lookup *, .sm-portal-box *, .sm-admission-box *,
.sm-status-check-box *, .sm-modal-card * { box-sizing: border-box; }

/* ---------- নোটিশ বোর্ড ---------- */
.sm-notice-board {
	border: 1px solid var(--sm-border);
	border-radius: var(--sm-radius-lg);
	padding: 24px;
	background: #fff;
	max-width: 700px;
	margin: 20px 0;
	box-shadow: var(--sm-shadow);
}
.sm-notice-title {
	margin: -24px -24px 16px;
	padding: 18px 24px;
	border-radius: var(--sm-radius-lg) var(--sm-radius-lg) 0 0;
	background: linear-gradient(135deg, var(--sm-primary), var(--sm-accent));
	color: #fff;
	font-size: 18px;
}
.sm-notice-list { list-style: none; margin: 0; padding: 0; }
.sm-notice-item { padding: 14px 0; border-bottom: 1px solid var(--sm-border); }
.sm-notice-item:last-child { border-bottom: none; }
.sm-notice-date {
	display: inline-block; font-size: 11.5px; font-weight: 600; color: var(--sm-primary-dark);
	background: #eef2ff; padding: 3px 10px; border-radius: 999px; margin-bottom: 6px;
}
.sm-notice-item-title { display: block; font-size: 16px; font-weight: 700; margin-bottom: 4px; }
.sm-notice-content { color: #444; font-size: 14px; line-height: 1.6; }

/* ---------- রেজাল্ট লুকআপ ---------- */
.sm-result-lookup { max-width: 620px; margin: 20px 0; }
.sm-result-form { display: flex; gap: 10px; align-items: center; margin-bottom: 15px; flex-wrap: wrap; }
.sm-result-table { width: 100%; border-collapse: separate; border-spacing: 0; margin-top: 10px; border-radius: var(--sm-radius-sm); overflow: hidden; box-shadow: var(--sm-shadow); }
.sm-result-table th, .sm-result-table td { border-bottom: 1px solid var(--sm-border); padding: 10px 12px; text-align: left; }
.sm-result-table th { background: #faf9ff; font-size: 12px; text-transform: uppercase; letter-spacing: .03em; color: var(--sm-text-muted); }
.sm-error { color: var(--sm-danger); font-weight: 600; }

/* ---------- শিক্ষার্থী / শিক্ষক পোর্টাল ---------- */
.sm-portal-box { max-width: 940px; margin: 20px auto; }
.sm-portal-login {
	max-width: 400px;
	border-radius: var(--sm-radius-lg);
	padding: 32px;
	background: #fff;
	box-shadow: var(--sm-shadow-lg);
	border-top: 4px solid var(--sm-primary);
}
.sm-portal-login h3 { margin-top: 0; font-size: 20px; }
.sm-input {
	width: 100%; padding: 10px 14px;
	border: 1px solid var(--sm-border); border-radius: var(--sm-radius-sm);
	box-sizing: border-box; font-size: 14px; transition: border-color .15s, box-shadow .15s;
}
.sm-input:focus { outline: none; border-color: var(--sm-primary); box-shadow: 0 0 0 3px #eef2ff; }
.sm-btn {
	background: linear-gradient(135deg, var(--sm-primary), var(--sm-accent));
	color: #fff; border: none; padding: 11px 22px; border-radius: 999px;
	cursor: pointer; font-size: 14px; font-weight: 700;
	box-shadow: 0 4px 14px rgba(79,70,229,.3);
	transition: filter .15s, transform .1s;
}
.sm-btn:hover { filter: brightness(1.07); }
.sm-btn:active { transform: scale(.98); }
.sm-btn-outline {
	background: transparent; color: var(--sm-primary);
	border: 1.5px solid var(--sm-primary); text-decoration: none;
	padding: 8px 16px; border-radius: 999px; font-size: 13px; font-weight: 600;
	transition: background .15s;
}
.sm-btn-outline:hover { background: #eef2ff; }
.sm-portal-header {
	display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px;
	padding: 18px 22px;
	border-radius: var(--sm-radius);
	background: linear-gradient(135deg, var(--sm-primary), var(--sm-accent));
	color: #fff;
	margin-bottom: 20px;
}
.sm-portal-header h2 { margin: 0 0 4px; }
.sm-portal-header p { margin: 0; opacity: .9; font-size: 13px; }
.sm-portal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 700px) { .sm-portal-grid { grid-template-columns: 1fr; } }
.sm-portal-card {
	border: 1px solid var(--sm-border); border-radius: var(--sm-radius);
	padding: 18px; background: #fff; box-shadow: var(--sm-shadow);
}
.sm-portal-card h3 { margin-top: 0; font-size: 15px; border-bottom: 1px solid var(--sm-border); padding-bottom: 10px; }
.sm-portal-table { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: 13px; }
.sm-portal-table th, .sm-portal-table td { border-bottom: 1px solid var(--sm-border); padding: 8px 10px; text-align: left; }
.sm-portal-notice { padding: 10px 0; border-bottom: 1px solid var(--sm-border); }
.sm-portal-notice-date { display: block; font-size: 11px; color: var(--sm-text-muted); }

/* ---------- অনলাইন ভর্তি ফরম ---------- */
.sm-admission-box {
	max-width: 760px; margin: 20px auto; background: #fff;
	border-radius: var(--sm-radius-lg); padding: 32px;
	box-shadow: var(--sm-shadow-lg);
}
.sm-admission-box h2 {
	margin: -32px -32px 22px; padding: 22px 32px;
	border-radius: var(--sm-radius-lg) var(--sm-radius-lg) 0 0;
	background: linear-gradient(135deg, var(--sm-primary), var(--sm-accent));
	color: #fff; font-size: 20px;
}
.sm-admission-form .sm-form-row { margin-bottom: 16px; }
.sm-admission-form .sm-form-row-group { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
@media (max-width: 600px) { .sm-admission-form .sm-form-row-group { grid-template-columns: 1fr; } }
.sm-admission-form .sm-form-row-group .sm-form-row { margin-bottom: 0; }
.sm-admission-form label { display: block; margin-bottom: 6px; font-weight: 600; font-size: 13px; color: var(--sm-text); }
.sm-admission-form input[type="text"],
.sm-admission-form input[type="date"],
.sm-admission-form input[type="email"],
.sm-admission-form input[type="file"],
.sm-admission-form select,
.sm-admission-form textarea {
	width: 100%; padding: 10px 12px; border: 1px solid var(--sm-border);
	border-radius: var(--sm-radius-sm); box-sizing: border-box; font-size: 14px;
	transition: border-color .15s, box-shadow .15s;
}
.sm-admission-form input:focus, .sm-admission-form select:focus, .sm-admission-form textarea:focus {
	outline: none; border-color: var(--sm-primary); box-shadow: 0 0 0 3px #eef2ff;
}
.sm-payment-section { background: #faf9ff; border: 1px solid var(--sm-border); border-radius: var(--sm-radius); padding: 16px; }
.sm-payment-methods { display: flex; gap: 20px; margin: 10px 0; flex-wrap: wrap; }
.sm-pay-option { font-weight: normal; display: flex; align-items: center; gap: 6px; }
.sm-pay-details { margin-top: 10px; padding: 12px; background: #fff; border-radius: var(--sm-radius-sm); border: 1px solid var(--sm-border); }

/* ---------- আবেদন ফরমের ছবি আপলোড + লাইভ প্রিভিউ (৩০০×৩০০) ---------- */
.sm-photo-upload-block { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.sm-photo-preview-box {
	width: 300px; height: 300px;
	border: 2px dashed #c7c4f0;
	border-radius: var(--sm-radius);
	background: #faf9ff;
	display: flex; align-items: center; justify-content: center;
	overflow: hidden; flex-shrink: 0;
	color: var(--sm-primary); font-size: 13px; text-align: center;
}
.sm-photo-preview-box img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 400px) {
	.sm-photo-preview-box { width: 100%; max-width: 300px; height: 260px; }
}

/* ---------- কনফার্মেশন/PDF ডকুমেন্টে আবেদনকারীর ছবি (৩০০×৩০০) ---------- */
.sm-confirm-photo-row { display: flex; justify-content: flex-end; margin-bottom: 16px; }
.sm-confirm-photo {
	width: 300px; height: 300px; object-fit: cover;
	border-radius: var(--sm-radius);
	border: 1px solid var(--sm-border);
	box-shadow: var(--sm-shadow);
}
.sm-pdf-target {
	background: #fff;
	max-width: 720px;
	margin: 0 auto;
	padding: 6px 4px;
}

/* ---------- PDF/কনফার্মেশনের উপরের অংশ — প্রতিষ্ঠানের নাম ও তথ্য ---------- */
.sm-pdf-header {
	display: flex;
	align-items: center;
	gap: 16px;
	border-bottom: 3px solid var(--sm-primary);
	padding-bottom: 16px;
	margin-bottom: 20px;
}
.sm-pdf-logo { width: 64px; height: 64px; object-fit: contain; flex-shrink: 0; }
.sm-pdf-header-text h1 { margin: 0 0 4px; font-size: 20px; color: var(--sm-text); }
.sm-pdf-header-text p { margin: 2px 0; font-size: 12.5px; color: var(--sm-text-muted); }

.sm-alert { padding: 13px 18px; border-radius: var(--sm-radius-sm); margin-bottom: 18px; font-size: 14px; font-weight: 500; }
.sm-alert-success { background: var(--sm-success-bg); color: #1a7d34; border: 1px solid #b8e6c1; }
.sm-alert-error { background: var(--sm-danger-bg); color: #a02128; border: 1px solid #f3c2c5; }

.sm-admission-confirmation { max-width: 620px; margin: 20px auto; text-align: center; }
.sm-app-id-box {
	display: inline-block;
	background: linear-gradient(135deg, var(--sm-primary), var(--sm-accent));
	color: #fff; font-size: 22px; font-weight: 800; letter-spacing: 1px;
	padding: 14px 28px; border-radius: var(--sm-radius); margin: 16px 0;
	box-shadow: 0 6px 18px rgba(79,70,229,.3);
}
.sm-confirm-table { width: 100%; border-collapse: collapse; margin: 20px 0; text-align: left; border-radius: var(--sm-radius-sm); overflow: hidden; }
.sm-confirm-table th, .sm-confirm-table td { border-bottom: 1px solid var(--sm-border); padding: 10px 14px; }
.sm-confirm-table th { background: #faf9ff; width: 40%; }

.sm-badge {
	display: inline-flex; align-items: center; gap: 5px;
	padding: 4px 12px; border-radius: 999px; font-size: 11.5px; font-weight: 700;
	background: #f1f0f8; color: var(--sm-text-muted);
}
.sm-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.sm-badge-app-pending { background: var(--sm-warning-bg); color: var(--sm-warning); }
.sm-badge-app-approved { background: var(--sm-success-bg); color: var(--sm-success); }
.sm-badge-app-rejected { background: var(--sm-danger-bg); color: var(--sm-danger); }

.sm-approved-box {
	margin: 20px 0; border: 2px solid var(--sm-success); border-radius: var(--sm-radius);
	padding: 18px; background: var(--sm-success-bg); text-align: left;
}
.sm-approved-box h3 { margin-top: 0; color: #1a7d34; }

.sm-confirm-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin-top: 22px; }

.sm-status-check-box {
	max-width: 520px; margin: 20px auto; background: #fff;
	border-radius: var(--sm-radius-lg); padding: 32px; box-shadow: var(--sm-shadow-lg); text-align: center;
}
.sm-status-check-box h2 { margin-top: 0; }
.sm-status-check-sub { color: var(--sm-text-muted); font-size: 13px; margin-top: -8px; }
.sm-status-form { text-align: left; margin-top: 18px; }
.sm-status-form .sm-form-row { margin-bottom: 16px; }
.sm-status-form label { display: block; margin-bottom: 6px; font-weight: 600; font-size: 13px; color: var(--sm-text); }
.sm-status-form input {
	width: 100%; padding: 10px 12px; border: 1px solid var(--sm-border);
	border-radius: var(--sm-radius-sm); box-sizing: border-box; font-size: 14px;
}
.sm-status-form .sm-btn { width: 100%; padding: 12px; }
.sm-status-check-box .sm-admission-confirmation { text-align: left; margin: 20px 0 0; }

/* ---------- Submit Success পপ-আপ (মোডাল) ---------- */
.sm-modal-overlay {
	position: fixed; inset: 0; background: rgba(20,20,35,0.65);
	display: flex; align-items: center; justify-content: center;
	z-index: 99999; padding: 20px; box-sizing: border-box; backdrop-filter: blur(2px);
}
.sm-modal-card {
	position: relative; background: #fff; border-radius: var(--sm-radius-lg);
	max-width: 640px; width: 100%; max-height: 90vh; overflow-y: auto;
	padding: 32px 28px 26px; box-shadow: 0 20px 60px rgba(0,0,0,.3);
	animation: sm-modal-pop 0.2s ease-out;
}
@keyframes sm-modal-pop { from { transform: scale(0.94); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.sm-modal-close {
	position: absolute; top: 14px; right: 16px; background: #f1f0f8; border: none;
	width: 32px; height: 32px; border-radius: 50%; font-size: 15px; cursor: pointer;
	color: #555; line-height: 1; transition: background .15s;
}
.sm-modal-close:hover { background: #e2e2f0; }
.sm-modal-card .sm-admission-confirmation { margin: 0; }

@media print {
	.sm-no-print { display: none !important; }
}