Spaces:
Running
Running
Update index.html
Browse files- index.html +624 -1
index.html
CHANGED
|
@@ -1,4 +1,627 @@
|
|
| 1 |
-
<!
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 2 |
<html>
|
| 3 |
<head>
|
| 4 |
<meta charset="utf-8" />
|
|
|
|
| 1 |
+
<!index.html <!DOCTYPE html>
|
| 2 |
+
<html lang="hi">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>e-Ashram AI | डिजिटल-गुरुकुल महा-पोर्टल</title>
|
| 7 |
+
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
|
| 8 |
+
<link rel="preconnect" href="https://fonts.googleapis.com">
|
| 9 |
+
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+Devanagari:wght@400;500;600;700;800&family=Manrope:wght@400;500;700;800&display=swap" rel="stylesheet">
|
| 10 |
+
<style>
|
| 11 |
+
:root{
|
| 12 |
+
--bg:#090d16;
|
| 13 |
+
--bg-2:#0d1220;
|
| 14 |
+
--card:rgba(255,255,255,0.04);
|
| 15 |
+
--card-border:rgba(255,255,255,0.09);
|
| 16 |
+
--purple:#26215C;
|
| 17 |
+
--purple-glow:rgba(56,45,140,0.35);
|
| 18 |
+
--saffron:#f97316;
|
| 19 |
+
--saffron-2:#f59e0b;
|
| 20 |
+
--sky:#38bdf8;
|
| 21 |
+
--text:#f8fafc;
|
| 22 |
+
--muted:#94a3b8;
|
| 23 |
+
--good:#22c55e;
|
| 24 |
+
}
|
| 25 |
+
*{box-sizing:border-box; margin:0; padding:0;}
|
| 26 |
+
html{scroll-behavior:smooth;}
|
| 27 |
+
body{
|
| 28 |
+
background:var(--bg);
|
| 29 |
+
color:var(--text);
|
| 30 |
+
font-family:'Noto Sans Devanagari','Manrope',system-ui,sans-serif;
|
| 31 |
+
background-image:
|
| 32 |
+
radial-gradient(circle at 10% 5%, rgba(56,189,248,0.10) 0%, transparent 38%),
|
| 33 |
+
radial-gradient(circle at 90% 20%, rgba(249,115,22,0.10) 0%, transparent 38%),
|
| 34 |
+
radial-gradient(circle at 50% 100%, rgba(38,33,92,0.35) 0%, transparent 55%);
|
| 35 |
+
overflow-x:hidden;
|
| 36 |
+
}
|
| 37 |
+
.num, .stat-num, .lbl-en{font-family:'Manrope',sans-serif;}
|
| 38 |
+
a{color:inherit; text-decoration:none;}
|
| 39 |
+
::selection{background:var(--saffron); color:#0a0a0a;}
|
| 40 |
+
|
| 41 |
+
/* ---------- NAV ---------- */
|
| 42 |
+
nav{
|
| 43 |
+
position:sticky; top:0; z-index:500;
|
| 44 |
+
display:flex; justify-content:space-between; align-items:center;
|
| 45 |
+
padding:16px 5%;
|
| 46 |
+
background:rgba(9,13,22,0.82);
|
| 47 |
+
backdrop-filter:blur(14px);
|
| 48 |
+
border-bottom:1px solid rgba(255,255,255,0.08);
|
| 49 |
+
}
|
| 50 |
+
.logo{display:flex; align-items:center; gap:10px; font-weight:800; font-size:19px;}
|
| 51 |
+
.logo .om{
|
| 52 |
+
width:38px; height:38px; border-radius:11px;
|
| 53 |
+
background:linear-gradient(135deg,var(--saffron),var(--saffron-2));
|
| 54 |
+
display:flex; align-items:center; justify-content:center; font-size:18px; color:#1a0f00;
|
| 55 |
+
box-shadow:0 0 18px rgba(249,115,22,0.5);
|
| 56 |
+
}
|
| 57 |
+
.logo span{background:linear-gradient(135deg,#fff,#cbd5e1); -webkit-background-clip:text; -webkit-text-fill-color:transparent;}
|
| 58 |
+
.nav-links{display:flex; gap:28px; font-size:14.5px; color:var(--muted);}
|
| 59 |
+
.nav-links a:hover{color:var(--sky);}
|
| 60 |
+
.btn-access{
|
| 61 |
+
background:linear-gradient(135deg,var(--purple),#3d34a8); color:#fff;
|
| 62 |
+
padding:10px 20px; border-radius:30px; border:1px solid rgba(255,255,255,0.15);
|
| 63 |
+
font-weight:700; font-size:13.5px; cursor:pointer;
|
| 64 |
+
box-shadow:0 0 20px var(--purple-glow);
|
| 65 |
+
display:flex; align-items:center; gap:8px;
|
| 66 |
+
}
|
| 67 |
+
.nav-toggle{display:none; font-size:20px; background:none; border:none; color:#fff;}
|
| 68 |
+
|
| 69 |
+
/* ---------- HERO ---------- */
|
| 70 |
+
.hero{
|
| 71 |
+
position:relative; padding:90px 5% 70px; text-align:center;
|
| 72 |
+
display:flex; flex-direction:column; align-items:center; overflow:hidden;
|
| 73 |
+
}
|
| 74 |
+
.chakra-wrap{position:absolute; top:-60px; left:50%; transform:translateX(-50%); width:640px; height:640px; opacity:0.55; pointer-events:none;}
|
| 75 |
+
.chakra-wrap svg{width:100%; height:100%; animation:spin 90s linear infinite;}
|
| 76 |
+
@keyframes spin{from{transform:rotate(0deg);} to{transform:rotate(360deg);}}
|
| 77 |
+
@media (prefers-reduced-motion: reduce){ .chakra-wrap svg{animation:none;} }
|
| 78 |
+
|
| 79 |
+
.eyebrow{
|
| 80 |
+
position:relative; z-index:2;
|
| 81 |
+
font-size:12.5px; letter-spacing:0.14em; color:var(--sky); font-weight:700;
|
| 82 |
+
border:1px solid rgba(56,189,248,0.35); padding:6px 16px; border-radius:20px;
|
| 83 |
+
background:rgba(56,189,248,0.07); margin-bottom:22px;
|
| 84 |
+
}
|
| 85 |
+
.hero h1{
|
| 86 |
+
position:relative; z-index:2; font-size:clamp(34px,6vw,62px); font-weight:800; line-height:1.25; max-width:920px;
|
| 87 |
+
background:linear-gradient(135deg,#fff 30%,#c7d2fe 60%,var(--saffron-2) 100%);
|
| 88 |
+
-webkit-background-clip:text; -webkit-text-fill-color:transparent;
|
| 89 |
+
}
|
| 90 |
+
.hero p.sub{position:relative; z-index:2; margin-top:20px; max-width:640px; color:var(--muted); font-size:16.5px; line-height:1.7;}
|
| 91 |
+
.hero-ctas{position:relative; z-index:2; display:flex; gap:16px; margin-top:34px; flex-wrap:wrap; justify-content:center;}
|
| 92 |
+
.btn-primary, .btn-ghost{
|
| 93 |
+
padding:14px 28px; border-radius:14px; font-weight:700; font-size:15px; cursor:pointer; border:none;
|
| 94 |
+
display:flex; align-items:center; gap:10px;
|
| 95 |
+
}
|
| 96 |
+
.btn-primary{background:linear-gradient(135deg,var(--saffron),var(--saffron-2)); color:#1a0f00; box-shadow:0 8px 30px rgba(249,115,22,0.3);}
|
| 97 |
+
.btn-ghost{background:rgba(255,255,255,0.06); color:#fff; border:1px solid rgba(255,255,255,0.15);}
|
| 98 |
+
|
| 99 |
+
/* ---------- STATS ---------- */
|
| 100 |
+
.stats{
|
| 101 |
+
position:relative; z-index:2; display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
|
| 102 |
+
max-width:980px; width:100%; margin:60px auto 0;
|
| 103 |
+
background:rgba(255,255,255,0.08); border-radius:20px; overflow:hidden; border:1px solid var(--card-border);
|
| 104 |
+
}
|
| 105 |
+
.stat{background:var(--bg-2); padding:26px 14px; text-align:center;}
|
| 106 |
+
.stat-num{font-size:28px; font-weight:800; color:var(--saffron-2);}
|
| 107 |
+
.stat-lbl{font-size:12.5px; color:var(--muted); margin-top:6px;}
|
| 108 |
+
|
| 109 |
+
section{padding:80px 5%; max-width:1180px; margin:0 auto;}
|
| 110 |
+
.section-head{text-align:center; margin-bottom:48px;}
|
| 111 |
+
.section-head .eyebrow{margin-bottom:14px; display:inline-block;}
|
| 112 |
+
.section-head h2{font-size:clamp(26px,4vw,38px); font-weight:800;}
|
| 113 |
+
.section-head p{color:var(--muted); margin-top:12px; max-width:560px; margin-left:auto; margin-right:auto;}
|
| 114 |
+
|
| 115 |
+
/* ---------- PILLARS ---------- */
|
| 116 |
+
.pillars{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
|
| 117 |
+
.pillar{
|
| 118 |
+
background:var(--card); border:1px solid var(--card-border); border-radius:18px; padding:26px 20px;
|
| 119 |
+
transition:transform .25s, border-color .25s;
|
| 120 |
+
}
|
| 121 |
+
.pillar:hover{transform:translateY(-4px); border-color:rgba(56,189,248,0.4);}
|
| 122 |
+
.pillar i{font-size:24px; color:var(--sky); margin-bottom:14px; display:block;}
|
| 123 |
+
.pillar h3{font-size:16.5px; margin-bottom:8px; font-weight:700;}
|
| 124 |
+
.pillar p{font-size:13.5px; color:var(--muted); line-height:1.6;}
|
| 125 |
+
|
| 126 |
+
/* ---------- SCHEMES ---------- */
|
| 127 |
+
.scheme-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
|
| 128 |
+
.scheme-card{
|
| 129 |
+
background:var(--card); border:1px solid var(--card-border); border-radius:18px; padding:24px; position:relative;
|
| 130 |
+
}
|
| 131 |
+
.scheme-tag{font-size:11px; font-weight:700; color:var(--saffron-2); background:rgba(249,115,22,0.1); padding:4px 10px; border-radius:20px; display:inline-block; margin-bottom:14px;}
|
| 132 |
+
.scheme-card h3{font-size:17px; margin-bottom:8px; font-weight:700;}
|
| 133 |
+
.scheme-card p{font-size:13.5px; color:var(--muted); line-height:1.65; margin-bottom:16px;}
|
| 134 |
+
.scheme-card .apply{font-size:13px; font-weight:700; color:var(--sky); display:flex; align-items:center; gap:6px; cursor:pointer;}
|
| 135 |
+
|
| 136 |
+
/* ---------- REGISTRATION FORM ---------- */
|
| 137 |
+
.reg-wrap{background:var(--card); border:1px solid var(--card-border); border-radius:24px; padding:40px; display:grid; grid-template-columns:1fr 1fr; gap:36px;}
|
| 138 |
+
.reg-side h3{font-size:22px; font-weight:800; margin-bottom:14px;}
|
| 139 |
+
.reg-side p{color:var(--muted); font-size:14.5px; line-height:1.7; margin-bottom:20px;}
|
| 140 |
+
.reg-side ul{list-style:none;}
|
| 141 |
+
.reg-side li{display:flex; gap:10px; align-items:flex-start; font-size:13.5px; color:var(--muted); margin-bottom:12px;}
|
| 142 |
+
.reg-side li i{color:var(--good); margin-top:2px;}
|
| 143 |
+
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
|
| 144 |
+
.form-grid .full{grid-column:1/-1;}
|
| 145 |
+
label{font-size:12.5px; color:var(--muted); margin-bottom:6px; display:block; font-weight:600;}
|
| 146 |
+
input, select, textarea{
|
| 147 |
+
width:100%; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.14); color:#fff;
|
| 148 |
+
padding:12px 14px; border-radius:10px; font-size:14px; font-family:inherit;
|
| 149 |
+
}
|
| 150 |
+
input:focus, select:focus, textarea:focus{outline:2px solid var(--sky); border-color:transparent;}
|
| 151 |
+
.field{margin-bottom:4px;}
|
| 152 |
+
.btn-submit{
|
| 153 |
+
margin-top:10px; width:100%; background:linear-gradient(135deg,var(--purple),#453aad); color:#fff; padding:14px;
|
| 154 |
+
border:none; border-radius:12px; font-weight:700; cursor:pointer; font-size:15px;
|
| 155 |
+
}
|
| 156 |
+
.toast{
|
| 157 |
+
position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(120%); z-index:900;
|
| 158 |
+
background:#101a2c; border:1px solid var(--good); color:#fff; padding:14px 22px; border-radius:14px;
|
| 159 |
+
display:flex; align-items:center; gap:10px; font-size:14px; transition:transform .35s ease; box-shadow:0 10px 30px rgba(0,0,0,0.4);
|
| 160 |
+
}
|
| 161 |
+
.toast.show{transform:translateX(-50%) translateY(0);}
|
| 162 |
+
.toast i{color:var(--good);}
|
| 163 |
+
|
| 164 |
+
/* ---------- ADMIN ---------- */
|
| 165 |
+
.admin-locked{
|
| 166 |
+
background:var(--card); border:1px dashed rgba(255,255,255,0.25); border-radius:20px; padding:60px 20px; text-align:center;
|
| 167 |
+
}
|
| 168 |
+
.admin-locked i{font-size:34px; color:var(--sky); margin-bottom:14px;}
|
| 169 |
+
.admin-locked p{color:var(--muted); font-size:14px; margin:10px 0 20px;}
|
| 170 |
+
.demo-badge{
|
| 171 |
+
font-size:10.5px; font-weight:800; letter-spacing:0.06em; background:rgba(249,115,22,0.15); color:var(--saffron-2);
|
| 172 |
+
padding:4px 10px; border-radius:8px; border:1px solid rgba(249,115,22,0.35);
|
| 173 |
+
}
|
| 174 |
+
#adminDash{display:none;}
|
| 175 |
+
.dash-cards{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:24px;}
|
| 176 |
+
.dash-card{background:var(--card); border:1px solid var(--card-border); border-radius:16px; padding:20px;}
|
| 177 |
+
.dash-card .n{font-size:24px; font-weight:800; color:var(--sky);}
|
| 178 |
+
.dash-card .l{font-size:12px; color:var(--muted); margin-top:4px;}
|
| 179 |
+
table{width:100%; border-collapse:collapse; font-size:13.5px;}
|
| 180 |
+
th{text-align:left; color:var(--muted); font-weight:600; padding:10px 12px; border-bottom:1px solid var(--card-border); font-size:12px;}
|
| 181 |
+
td{padding:12px; border-bottom:1px solid rgba(255,255,255,0.05);}
|
| 182 |
+
.status-pill{padding:3px 10px; border-radius:20px; font-size:11px; font-weight:700;}
|
| 183 |
+
.status-pill.active{background:rgba(34,197,94,0.15); color:var(--good);}
|
| 184 |
+
.status-pill.pending{background:rgba(250,204,21,0.15); color:#facc15;}
|
| 185 |
+
.table-wrap{background:var(--card); border:1px solid var(--card-border); border-radius:18px; padding:10px 6px; overflow-x:auto;}
|
| 186 |
+
|
| 187 |
+
/* ---------- OTP MODAL ---------- */
|
| 188 |
+
.modal-backdrop{
|
| 189 |
+
display:none; position:fixed; inset:0; background:rgba(0,0,0,0.82); backdrop-filter:blur(8px);
|
| 190 |
+
z-index:1000; justify-content:center; align-items:center; padding:20px;
|
| 191 |
+
}
|
| 192 |
+
.modal-backdrop.active{display:flex;}
|
| 193 |
+
.otp-card{
|
| 194 |
+
background:#0f172a; border:1.5px solid rgba(56,189,248,0.4); border-radius:22px; padding:32px 28px; width:100%; max-width:420px;
|
| 195 |
+
box-shadow:0 0 60px rgba(56,189,248,0.18); text-align:center; position:relative;
|
| 196 |
+
}
|
| 197 |
+
.otp-card .close{position:absolute; top:16px; right:18px; background:none; border:none; color:var(--muted); font-size:18px; cursor:pointer;}
|
| 198 |
+
.otp-card h3{font-size:19px; font-weight:800; margin-bottom:8px;}
|
| 199 |
+
.otp-card p{color:var(--muted); font-size:13.5px; margin-bottom:8px;}
|
| 200 |
+
.slots{display:flex; justify-content:center; gap:12px; margin:22px 0;}
|
| 201 |
+
.slot{width:52px; height:62px; background:#1e293b; border:2px solid #334155; border-radius:12px; font-size:24px; font-weight:800; color:var(--sky); display:flex; align-items:center; justify-content:center;}
|
| 202 |
+
.slot.win{border-color:var(--good); color:var(--good); box-shadow:0 0 18px rgba(34,197,94,0.55);}
|
| 203 |
+
.btn-fill{background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.2); color:#fff; padding:12px 18px; border-radius:12px; width:100%; font-weight:700; cursor:pointer; font-size:13.5px;}
|
| 204 |
+
|
| 205 |
+
/* ---------- CHATBOT ---------- */
|
| 206 |
+
.fab{
|
| 207 |
+
position:fixed; bottom:26px; right:26px; z-index:800; width:62px; height:62px; border-radius:50%;
|
| 208 |
+
background:linear-gradient(135deg,var(--purple),#4b3fc7); border:none; cursor:pointer; color:#fff; font-size:24px;
|
| 209 |
+
box-shadow:0 8px 30px rgba(56,45,140,0.55); display:flex; align-items:center; justify-content:center;
|
| 210 |
+
}
|
| 211 |
+
.fab .dot{position:absolute; top:6px; right:6px; width:11px; height:11px; background:var(--saffron); border-radius:50%; border:2px solid var(--bg);}
|
| 212 |
+
.chat-panel{
|
| 213 |
+
position:fixed; bottom:100px; right:26px; width:380px; max-width:92vw; height:560px; max-height:75vh; z-index:800;
|
| 214 |
+
background:#0d1425; border:1px solid rgba(255,255,255,0.1); border-radius:20px; display:none; flex-direction:column; overflow:hidden;
|
| 215 |
+
box-shadow:0 20px 60px rgba(0,0,0,0.5);
|
| 216 |
+
}
|
| 217 |
+
.chat-panel.open{display:flex;}
|
| 218 |
+
.chat-head{background:linear-gradient(135deg,var(--purple),#3d34a8); padding:16px 18px; display:flex; align-items:center; gap:10px;}
|
| 219 |
+
.chat-head .om{width:34px; height:34px; border-radius:10px; background:rgba(255,255,255,0.15); display:flex; align-items:center; justify-content:center;}
|
| 220 |
+
.chat-head .info h4{font-size:14.5px; font-weight:700;}
|
| 221 |
+
.chat-head .info span{font-size:11px; color:#c7d2fe; display:flex; align-items:center; gap:5px;}
|
| 222 |
+
.chat-head .info span .live{width:6px; height:6px; background:var(--good); border-radius:50%;}
|
| 223 |
+
.chat-head .gear{margin-left:auto; background:none; border:none; color:#fff; opacity:0.75; cursor:pointer; font-size:15px;}
|
| 224 |
+
.chat-close{background:none; border:none; color:#fff; opacity:0.75; cursor:pointer; font-size:16px;}
|
| 225 |
+
.chat-body{flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:12px; background:radial-gradient(circle at 50% 0%, rgba(56,189,248,0.06), transparent 60%);}
|
| 226 |
+
.msg{max-width:82%; padding:11px 14px; border-radius:14px; font-size:13.5px; line-height:1.55;}
|
| 227 |
+
.msg.bot{background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.08); align-self:flex-start; border-bottom-left-radius:4px;}
|
| 228 |
+
.msg.user{background:linear-gradient(135deg,var(--saffron),var(--saffron-2)); color:#1a0f00; align-self:flex-end; border-bottom-right-radius:4px; font-weight:600;}
|
| 229 |
+
.chat-input-row{display:flex; gap:8px; padding:12px; border-top:1px solid rgba(255,255,255,0.08); background:#0b1120;}
|
| 230 |
+
.chat-input-row input{flex:1; padding:11px 14px; border-radius:24px; font-size:13.5px;}
|
| 231 |
+
.send-btn{width:42px; height:42px; border-radius:50%; border:none; background:var(--sky); color:#04202e; cursor:pointer; flex-shrink:0;}
|
| 232 |
+
.key-banner{margin:12px; padding:12px 14px; background:rgba(249,115,22,0.08); border:1px solid rgba(249,115,22,0.3); border-radius:12px; font-size:12px; color:#fed7aa; line-height:1.6;}
|
| 233 |
+
.key-banner input{margin-top:8px; font-size:12.5px; padding:9px 12px;}
|
| 234 |
+
.key-banner button{margin-top:8px; width:100%; padding:9px; border-radius:8px; border:none; background:var(--saffron); color:#1a0f00; font-weight:700; cursor:pointer; font-size:12.5px;}
|
| 235 |
+
.typing{display:flex; gap:4px; padding:6px 4px;}
|
| 236 |
+
.typing span{width:6px; height:6px; background:var(--muted); border-radius:50%; animation:bounce 1.2s infinite;}
|
| 237 |
+
.typing span:nth-child(2){animation-delay:.15s;} .typing span:nth-child(3){animation-delay:.3s;}
|
| 238 |
+
@keyframes bounce{0%,60%,100%{transform:translateY(0); opacity:.5;} 30%{transform:translateY(-4px); opacity:1;}}
|
| 239 |
+
|
| 240 |
+
footer{padding:50px 5% 30px; text-align:center; border-top:1px solid rgba(255,255,255,0.08); margin-top:40px;}
|
| 241 |
+
footer .logo{justify-content:center; margin-bottom:14px;}
|
| 242 |
+
footer p{color:var(--muted); font-size:13px; margin-bottom:6px;}
|
| 243 |
+
footer .salute{color:var(--saffron-2); font-weight:700; margin-top:14px; font-size:14.5px;}
|
| 244 |
+
|
| 245 |
+
@media (max-width:900px){
|
| 246 |
+
.nav-links{display:none;}
|
| 247 |
+
.stats, .pillars{grid-template-columns:repeat(2,1fr);}
|
| 248 |
+
.scheme-grid{grid-template-columns:1fr;}
|
| 249 |
+
.reg-wrap{grid-template-columns:1fr;}
|
| 250 |
+
.dash-cards{grid-template-columns:repeat(2,1fr);}
|
| 251 |
+
.form-grid{grid-template-columns:1fr;}
|
| 252 |
+
.chat-panel{right:12px; left:12px; width:auto;}
|
| 253 |
+
.fab{right:18px;}
|
| 254 |
+
}
|
| 255 |
+
</style>
|
| 256 |
+
</head>
|
| 257 |
+
<body>
|
| 258 |
+
|
| 259 |
+
<!-- NAV -->
|
| 260 |
+
<nav>
|
| 261 |
+
<div class="logo"><div class="om"><i class="fa-solid fa-om"></i></div><span>e-Ashram AI</span></div>
|
| 262 |
+
<div class="nav-links">
|
| 263 |
+
<a href="#home">होम</a>
|
| 264 |
+
<a href="#pillars">स्तंभ</a>
|
| 265 |
+
<a href="#schemes">योजनाएं</a>
|
| 266 |
+
<a href="#register">पंजीकरण</a>
|
| 267 |
+
<a href="#admin">एडमिन</a>
|
| 268 |
+
</div>
|
| 269 |
+
<button class="btn-access" onclick="openOtpModal()"><i class="fa-solid fa-shield-halved"></i> पोर्टल एक्सेस</button>
|
| 270 |
+
</nav>
|
| 271 |
+
|
| 272 |
+
<!-- HERO -->
|
| 273 |
+
<div id="home" class="hero">
|
| 274 |
+
<div class="chakra-wrap">
|
| 275 |
+
<svg viewBox="0 0 640 640" xmlns="http://www.w3.org/2000/svg">
|
| 276 |
+
<circle cx="320" cy="320" r="260" fill="none" stroke="#38bdf8" stroke-opacity="0.25" stroke-width="1.5"/>
|
| 277 |
+
<circle cx="320" cy="320" r="200" fill="none" stroke="#f97316" stroke-opacity="0.2" stroke-width="1.5"/>
|
| 278 |
+
<g stroke="#38bdf8" stroke-opacity="0.35" stroke-width="1.5">
|
| 279 |
+
<line x1="320" y1="60" x2="320" y2="580"/>
|
| 280 |
+
<line x1="60" y1="320" x2="580" y2="320"/>
|
| 281 |
+
<line x1="121" y1="121" x2="519" y2="519"/>
|
| 282 |
+
<line x1="519" y1="121" x2="121" y2="519"/>
|
| 283 |
+
<line x1="320" y1="60" x2="320" y2="580" transform="rotate(30 320 320)"/>
|
| 284 |
+
<line x1="320" y1="60" x2="320" y2="580" transform="rotate(60 320 320)"/>
|
| 285 |
+
<line x1="320" y1="60" x2="320" y2="580" transform="rotate(90 320 320)"/>
|
| 286 |
+
<line x1="320" y1="60" x2="320" y2="580" transform="rotate(120 320 320)"/>
|
| 287 |
+
<line x1="320" y1="60" x2="320" y2="580" transform="rotate(150 320 320)"/>
|
| 288 |
+
</g>
|
| 289 |
+
<circle cx="320" cy="320" r="34" fill="#f97316" fill-opacity="0.15" stroke="#f97316" stroke-opacity="0.5" stroke-width="2"/>
|
| 290 |
+
</svg>
|
| 291 |
+
</div>
|
| 292 |
+
<div class="eyebrow"><i class="fa-solid fa-satellite-dish"></i> 10,001 जन सेवा केंद्र विज़न</div>
|
| 293 |
+
<h1>डिजिटल संस्कार, आत्मिक विकास — <br>हर गांव तक e-Ashram</h1>
|
| 294 |
+
<p class="sub">डिजिटल-गुरुकुल केंद्रों का एक राष्ट्रव्यापी नेटवर्क — डिजिटल साक्षरता, महिला सशक्तिकरण, सामुदायिक रसोई और आध्यात्मिक शिक्षा को एक छत के नीचे लाते हुए।</p>
|
| 295 |
+
<div class="hero-ctas">
|
| 296 |
+
<button class="btn-primary" onclick="document.getElementById('register').scrollIntoView({behavior:'smooth'})"><i class="fa-solid fa-hands-holding-circle"></i> केंद्र पंजीकृत करें</button>
|
| 297 |
+
<button class="btn-ghost" onclick="toggleChat(true)"><i class="fa-solid fa-comment-dots"></i> AI सहायक से पूछें</button>
|
| 298 |
+
</div>
|
| 299 |
+
<div class="stats">
|
| 300 |
+
<div class="stat"><div class="stat-num">10,001</div><div class="stat-lbl">प्रस्तावित केंद्र</div></div>
|
| 301 |
+
<div class="stat"><div class="stat-num">4</div><div class="stat-lbl">मुख्य स्तंभ</div></div>
|
| 302 |
+
<div class="stat"><div class="stat-num">28+</div><div class="stat-lbl">राज्य लक्ष्य</div></div>
|
| 303 |
+
<div class="stat"><div class="stat-num">24×7</div><div class="stat-lbl">AI सहायता</div></div>
|
| 304 |
+
</div>
|
| 305 |
+
</div>
|
| 306 |
+
|
| 307 |
+
<!-- PILLARS -->
|
| 308 |
+
<section id="pillars">
|
| 309 |
+
<div class="section-head">
|
| 310 |
+
<span class="eyebrow">हमारे स्तंभ</span>
|
| 311 |
+
<h2>चार स्तंभ, एक विज़न</h2>
|
| 312 |
+
<p>हर e-Ashram केंद्र इन चार आधारों पर खड़ा है, ताकि गांव आत्मनिर्भर और जागरूक बने।</p>
|
| 313 |
+
</div>
|
| 314 |
+
<div class="pillars">
|
| 315 |
+
<div class="pillar"><i class="fa-solid fa-laptop-code"></i><h3>डिजिटल साक्षरता</h3><p>बुनियादी कंप्यूटर, इंटरनेट और सरकारी पोर्टल प्रशिक्षण गांव के हर आयु वर्ग के लिए।</p></div>
|
| 316 |
+
<div class="pillar"><i class="fa-solid fa-venus"></i><h3>महिला सशक्तिकरण</h3><p>स्वरोजगार प्रशिक्षण, स्वयं सहायता समूह और वित्तीय जागरूकता कार्यक्रम।</p></div>
|
| 317 |
+
<div class="pillar"><i class="fa-solid fa-bowl-food"></i><h3>सामुदायिक रसोई</h3><p>जरूरतमंदों के लिए पोषणयुक्त भोजन और सामूहिक भंडारा व्यवस्था।</p></div>
|
| 318 |
+
<div class="pillar"><i class="fa-solid fa-om"></i><h3>आध्यात्मिक शिक्षा</h3><p>संस्कार, सत्संग और भारतीय मूल्यों की शिक्षा — गुरुकुल परंपरा में।</p></div>
|
| 319 |
+
</div>
|
| 320 |
+
</section>
|
| 321 |
+
|
| 322 |
+
<!-- SCHEMES -->
|
| 323 |
+
<section id="schemes">
|
| 324 |
+
<div class="section-head">
|
| 325 |
+
<span class="eyebrow">जन सेवाएं</span>
|
| 326 |
+
<h2>सरकारी योजना जानकारी</h2>
|
| 327 |
+
<p>केंद्र इन योजनाओं की जानकारी, फॉर्म सहायता और आवेदन की स्थिति में मदद करते हैं।</p>
|
| 328 |
+
</div>
|
| 329 |
+
<div class="scheme-grid" id="schemeGrid"></div>
|
| 330 |
+
</section>
|
| 331 |
+
|
| 332 |
+
<!-- REGISTRATION -->
|
| 333 |
+
<section id="register">
|
| 334 |
+
<div class="section-head">
|
| 335 |
+
<span class="eyebrow">जुड़िए</span>
|
| 336 |
+
<h2>अपना जन सेवा केंद्र पंजीकृत करें</h2>
|
| 337 |
+
</div>
|
| 338 |
+
<div class="reg-wrap">
|
| 339 |
+
<div class="reg-side">
|
| 340 |
+
<h3>केंद्र संचालक बनें</h3>
|
| 341 |
+
<p>अपने गांव या कस्बे में e-Ashram जन सेवा केंद्र शुरू करें और डिजिटल बदलाव के साझीदार बनें।</p>
|
| 342 |
+
<ul>
|
| 343 |
+
<li><i class="fa-solid fa-circle-check"></i> निःशुल्क प्रशिक्षण एवं प्रमाणपत्र</li>
|
| 344 |
+
<li><i class="fa-solid fa-circle-check"></i> डिजिटल किट व सॉफ़्टवेयर सहायता</li>
|
| 345 |
+
<li><i class="fa-solid fa-circle-check"></i> जिला प्रशासन से समन्वय सहायता</li>
|
| 346 |
+
<li><i class="fa-solid fa-circle-check"></i> स्थायी आय के अवसर</li>
|
| 347 |
+
</ul>
|
| 348 |
+
</div>
|
| 349 |
+
<form id="regForm" onsubmit="submitReg(event)">
|
| 350 |
+
<div class="form-grid">
|
| 351 |
+
<div class="field"><label>पूरा नाम</label><input type="text" required placeholder="आपका नाम"></div>
|
| 352 |
+
<div class="field"><label>मोबाइल नंबर</label><input type="tel" required pattern="[0-9]{10}" placeholder="10 अंकों का नंबर"></div>
|
| 353 |
+
<div class="field"><label>राज्य</label><input type="text" required placeholder="जैसे उत्तर प्रदेश"></div>
|
| 354 |
+
<div class="field"><label>जिला</label><input type="text" required placeholder="जैसे कानपुर"></div>
|
| 355 |
+
<div class="field full"><label>गांव / कस्बा</label><input type="text" required placeholder="स्थान का नाम"></div>
|
| 356 |
+
<div class="field full">
|
| 357 |
+
<label>आप किस भूमिका में रुचि रखते हैं?</label>
|
| 358 |
+
<select required>
|
| 359 |
+
<option value="">चुनें</option>
|
| 360 |
+
<option>केंद्र संचालक</option>
|
| 361 |
+
<option>स्वयंसेवक</option>
|
| 362 |
+
<option>प्रशिक्षक</option>
|
| 363 |
+
<option>दानदाता / सहयोगी</option>
|
| 364 |
+
</select>
|
| 365 |
+
</div>
|
| 366 |
+
</div>
|
| 367 |
+
<button type="submit" class="btn-submit"><i class="fa-solid fa-paper-plane"></i> पंजीकरण भेजें</button>
|
| 368 |
+
</form>
|
| 369 |
+
</div>
|
| 370 |
+
</section>
|
| 371 |
+
|
| 372 |
+
<!-- ADMIN -->
|
| 373 |
+
<section id="admin">
|
| 374 |
+
<div class="section-head">
|
| 375 |
+
<span class="eyebrow">प्रबंधन</span>
|
| 376 |
+
<h2>एडमिन डैशबोर्ड <span class="demo-badge">DEMO MODE</span></h2>
|
| 377 |
+
<p>यह डेमो डेटा दिखा रहा है। असली उपयोग के लिए सुरक्षित लॉगिन आवश्यक होगा।</p>
|
| 378 |
+
</div>
|
| 379 |
+
<div id="adminLocked" class="admin-locked">
|
| 380 |
+
<i class="fa-solid fa-lock"></i>
|
| 381 |
+
<h3>डैशबोर्ड लॉक है</h3>
|
| 382 |
+
<p>डेमो डेटा देखने के लिए पोर्टल एक्सेस वेरीफाई करें (डेमो OTP: 4190)</p>
|
| 383 |
+
<button class="btn-primary" style="margin:0 auto;" onclick="openOtpModal(true)"><i class="fa-solid fa-shield-halved"></i> वेरीफाई करके देखें</button>
|
| 384 |
+
</div>
|
| 385 |
+
<div id="adminDash">
|
| 386 |
+
<div class="dash-cards">
|
| 387 |
+
<div class="dash-card"><div class="n">1,248</div><div class="l">पंजीकृत केंद्र</div></div>
|
| 388 |
+
<div class="dash-card"><div class="n">312</div><div class="l">सक्रिय आज</div></div>
|
| 389 |
+
<div class="dash-card"><div class="n">18</div><div class="l">राज्य कवर</div></div>
|
| 390 |
+
<div class="dash-card"><div class="n">96</div><div class="l">लंबित सत्यापन</div></div>
|
| 391 |
+
</div>
|
| 392 |
+
<div class="table-wrap">
|
| 393 |
+
<table>
|
| 394 |
+
<thead><tr><th>केंद्र नाम</th><th>स्थान</th><th>संचालक</th><th>स्थिति</th></tr></thead>
|
| 395 |
+
<tbody id="dashTableBody"></tbody>
|
| 396 |
+
</table>
|
| 397 |
+
</div>
|
| 398 |
+
</div>
|
| 399 |
+
</section>
|
| 400 |
+
|
| 401 |
+
<!-- FOOTER -->
|
| 402 |
+
<footer>
|
| 403 |
+
<div class="logo"><div class="om"><i class="fa-solid fa-om"></i></div><span>e-Ashram AI</span></div>
|
| 404 |
+
<p>Shivay Office & Associate | कानपुर, उत्तर प्रदेश</p>
|
| 405 |
+
<p>डिजिटल-गुरुकुल आंदोलन — हर गांव तक ज्ञान, सेवा और संस्कार</p>
|
| 406 |
+
<div class="salute">🙏 Radhe Radhe | Jai Shri Ram 🙏</div>
|
| 407 |
+
</footer>
|
| 408 |
+
|
| 409 |
+
<!-- CHATBOT FAB -->
|
| 410 |
+
<button class="fab" onclick="toggleChat()" aria-label="AI सहायक खोलें"><i class="fa-solid fa-comment-dots"></i><span class="dot"></span></button>
|
| 411 |
+
|
| 412 |
+
<div class="chat-panel" id="chatPanel">
|
| 413 |
+
<div class="chat-head">
|
| 414 |
+
<div class="om"><i class="fa-solid fa-om"></i></div>
|
| 415 |
+
<div class="info"><h4>e-Ashram AI सहायक</h4><span><span class="live"></span> ऑनलाइन</span></div>
|
| 416 |
+
<button class="gear" onclick="toggleKeyBanner()" title="API सेटिंग"><i class="fa-solid fa-gear"></i></button>
|
| 417 |
+
<button class="chat-close" onclick="toggleChat(false)"><i class="fa-solid fa-xmark"></i></button>
|
| 418 |
+
</div>
|
| 419 |
+
<div class="key-banner" id="keyBanner" style="display:none;">
|
| 420 |
+
यह सहायक Google Gemini API से चलता है। कृपया अपनी Gemini API key डालें (यह सिर्फ़ इस सेशन में ब्राउज़र में रहती है, कहीं सेव नहीं होती):
|
| 421 |
+
<input type="password" id="geminiKeyInput" placeholder="AIza...">
|
| 422 |
+
<button onclick="saveKey()">Key सेव करें</button>
|
| 423 |
+
</div>
|
| 424 |
+
<div class="chat-body" id="chatBody">
|
| 425 |
+
<div class="msg bot">🙏 Radhe Radhe! मैं e-Ashram AI सहायक हूं। मैं आपको सरकारी योजनाओं, केंद्र पंजीकरण, या e-Ashram मिशन के बारे में जानकारी दे सकता हूं। आप क्या जानना चाहते हैं?</div>
|
| 426 |
+
</div>
|
| 427 |
+
<div class="chat-input-row">
|
| 428 |
+
<input type="text" id="chatInput" placeholder="अपना सवाल यहां लिखें..." onkeydown="if(event.key==='Enter')sendMessage()">
|
| 429 |
+
<button class="send-btn" onclick="sendMessage()"><i class="fa-solid fa-paper-plane"></i></button>
|
| 430 |
+
</div>
|
| 431 |
+
</div>
|
| 432 |
+
|
| 433 |
+
<!-- OTP MODAL (DEMO MODE) -->
|
| 434 |
+
<div class="modal-backdrop" id="otpModal">
|
| 435 |
+
<div class="otp-card">
|
| 436 |
+
<button class="close" onclick="closeOtpModal()"><i class="fa-solid fa-xmark"></i></button>
|
| 437 |
+
<span class="demo-badge">DEMO MODE — यह वास्तविक OTP नहीं है</span>
|
| 438 |
+
<h3 style="margin-top:14px;">नंबर सत्यापित करें</h3>
|
| 439 |
+
<p>+91 XXXXX-XXXXX पर भेजा गया 4-अंकों का कोड डालें</p>
|
| 440 |
+
<div class="slots">
|
| 441 |
+
<div class="slot" id="slot0">-</div>
|
| 442 |
+
<div class="slot" id="slot1">-</div>
|
| 443 |
+
<div class="slot" id="slot2">-</div>
|
| 444 |
+
<div class="slot" id="slot3">-</div>
|
| 445 |
+
</div>
|
| 446 |
+
<button class="btn-fill" onclick="autofillOtp()"><i class="fa-solid fa-wand-magic-sparkles"></i> डेमो कोड भरें: 4190</button>
|
| 447 |
+
<p style="margin-top:14px; font-size:11.5px; opacity:0.7;">प्रोडक्शन में असली SMS गेटवे (जैसे MSG91 / Firebase) से बदला जाएगा।</p>
|
| 448 |
+
</div>
|
| 449 |
+
</div>
|
| 450 |
+
|
| 451 |
+
<div class="toast" id="toast"><i class="fa-solid fa-circle-check"></i><span id="toastMsg"></span></div>
|
| 452 |
+
|
| 453 |
+
<script>
|
| 454 |
+
/* ---------------- SCHEME DATA (demo/static) ---------------- */
|
| 455 |
+
const schemes = [
|
| 456 |
+
{tag:"कृषि", name:"पीएम किसान सम्मान निधि", desc:"पात्र किसान परिवारों को ₹6,000 प्रति वर्ष की आर्थिक सहायता तीन किस्तों में।"},
|
| 457 |
+
{tag:"स्वास्थ्य", name:"आयुष्मान भारत योजना", desc:"प्रति परिवार ₹5 लाख तक का वार्षिक स्वास्थ्य बीमा कवर, द्वितीयक व तृतीयक उपचार हेतु।"},
|
| 458 |
+
{tag:"आवास", name:"प्रधानमंत्री आवास योजना", desc:"ग्रामीण व शहरी ���रीब परिवारों को पक्का घर बनाने हेतु वित्तीय सहायता।"},
|
| 459 |
+
{tag:"शिक्षा", name:"सुकन्या समृद्धि योजना", desc:"बेटियों की शिक्षा व विवाह हेतु उच्च ब्याज दर वाली बचत योजना।"},
|
| 460 |
+
{tag:"रोज़गार", name:"मनरेगा (MGNREGA)", desc:"ग्रामीण परिवारों को 100 दिन के गारंटीशुदा रोज़गार का अधिकार।"},
|
| 461 |
+
{tag:"पेंशन", name:"अटल पेंशन योजना", desc:"असंगठित क्षेत्र के श्रमिकों के लिए वृद्धावस्था में मासिक पेंशन सुविधा।"},
|
| 462 |
+
];
|
| 463 |
+
const grid = document.getElementById('schemeGrid');
|
| 464 |
+
schemes.forEach(s=>{
|
| 465 |
+
grid.innerHTML += `<div class="scheme-card">
|
| 466 |
+
<span class="scheme-tag">${s.tag}</span>
|
| 467 |
+
<h3>${s.name}</h3>
|
| 468 |
+
<p>${s.desc}</p>
|
| 469 |
+
<div class="apply" onclick="prefillChat('${s.name} के बारे में और जानकारी दें और आवेदन कैसे करें?')"><i class="fa-solid fa-comment-dots"></i> AI सहायक से पूछें</div>
|
| 470 |
+
</div>`;
|
| 471 |
+
});
|
| 472 |
+
|
| 473 |
+
/* ---------------- ADMIN DEMO DATA ---------------- */
|
| 474 |
+
const centres = [
|
| 475 |
+
{name:"e-Ashram केंद्र, बिठूर", loc:"कानपुर, उ.प्र.", op:"राधेश्याम वर्मा", status:"active"},
|
| 476 |
+
{name:"e-Ashram केंद्र, वृंदावन", loc:"मथुरा, उ.प्र.", op:"गोपाल शर्मा", status:"active"},
|
| 477 |
+
{name:"e-Ashram केंद्र, चित्रकूट", loc:"चित्रकूट, उ.प्र.", op:"सीता देवी", status:"pending"},
|
| 478 |
+
{name:"e-Ashram केंद्र, हरिद्वार", loc:"हरिद्वार, उत्तराखंड", op:"मोहन लाल", status:"active"},
|
| 479 |
+
{name:"e-Ashram केंद्र, पुष्कर", loc:"अजमेर, राजस्थान", op:"कमला बाई", status:"pending"},
|
| 480 |
+
];
|
| 481 |
+
const tbody = document.getElementById('dashTableBody');
|
| 482 |
+
centres.forEach(c=>{
|
| 483 |
+
tbody.innerHTML += `<tr>
|
| 484 |
+
<td>${c.name}</td><td>${c.loc}</td><td>${c.op}</td>
|
| 485 |
+
<td><span class="status-pill ${c.status}">${c.status==='active'?'सक्रिय':'लंबित'}</span></td>
|
| 486 |
+
</tr>`;
|
| 487 |
+
});
|
| 488 |
+
|
| 489 |
+
/* ---------------- OTP (DEMO MODE ONLY) ---------------- */
|
| 490 |
+
let otpContext = null; // 'admin' or null (general portal access)
|
| 491 |
+
function openOtpModal(forAdmin){
|
| 492 |
+
otpContext = forAdmin ? 'admin' : null;
|
| 493 |
+
document.getElementById('otpModal').classList.add('active');
|
| 494 |
+
[0,1,2,3].forEach(i=>{ const s=document.getElementById('slot'+i); s.innerText='-'; s.classList.remove('win'); });
|
| 495 |
+
}
|
| 496 |
+
function closeOtpModal(){ document.getElementById('otpModal').classList.remove('active'); }
|
| 497 |
+
function autofillOtp(){
|
| 498 |
+
['4','1','9','0'].forEach((d,i)=>{
|
| 499 |
+
setTimeout(()=>{
|
| 500 |
+
const s = document.getElementById('slot'+i);
|
| 501 |
+
s.innerText = d; s.classList.add('win');
|
| 502 |
+
if(i===3){
|
| 503 |
+
setTimeout(()=>{
|
| 504 |
+
closeOtpModal();
|
| 505 |
+
if(otpContext==='admin'){
|
| 506 |
+
document.getElementById('adminLocked').style.display='none';
|
| 507 |
+
document.getElementById('adminDash').style.display='block';
|
| 508 |
+
showToast('डेमो एक्सेस मिल गया — यह असली सत्यापन नहीं है');
|
| 509 |
+
} else {
|
| 510 |
+
showToast('पोर्टल एक्सेस (डेमो मोड) — असली OTP नहीं');
|
| 511 |
+
}
|
| 512 |
+
}, 400);
|
| 513 |
+
}
|
| 514 |
+
}, i*200);
|
| 515 |
+
});
|
| 516 |
+
}
|
| 517 |
+
|
| 518 |
+
/* ---------------- TOAST ---------------- */
|
| 519 |
+
function showToast(msg){
|
| 520 |
+
document.getElementById('toastMsg').innerText = msg;
|
| 521 |
+
const t = document.getElementById('toast');
|
| 522 |
+
t.classList.add('show');
|
| 523 |
+
setTimeout(()=>t.classList.remove('show'), 3200);
|
| 524 |
+
}
|
| 525 |
+
|
| 526 |
+
/* ---------------- REGISTRATION FORM (demo, no backend) ---------------- */
|
| 527 |
+
function submitReg(e){
|
| 528 |
+
e.preventDefault();
|
| 529 |
+
showToast('पंजीकरण प्राप्त हुआ! टीम जल्द संपर्क करेगी 🙏');
|
| 530 |
+
e.target.reset();
|
| 531 |
+
}
|
| 532 |
+
|
| 533 |
+
/* ---------------- CHATBOT ---------------- */
|
| 534 |
+
let geminiKey = null; // session-only, in-memory, never persisted to disk/localStorage
|
| 535 |
+
|
| 536 |
+
function toggleChat(force){
|
| 537 |
+
const p = document.getElementById('chatPanel');
|
| 538 |
+
const open = force===undefined ? !p.classList.contains('open') : force;
|
| 539 |
+
p.classList.toggle('open', open);
|
| 540 |
+
if(open && !geminiKey) document.getElementById('keyBanner').style.display='block';
|
| 541 |
+
}
|
| 542 |
+
function toggleKeyBanner(){
|
| 543 |
+
const b = document.getElementById('keyBanner');
|
| 544 |
+
b.style.display = b.style.display==='none' ? 'block' : 'none';
|
| 545 |
+
}
|
| 546 |
+
function saveKey(){
|
| 547 |
+
const v = document.getElementById('geminiKeyInput').value.trim();
|
| 548 |
+
if(!v){ showToast('कृपया एक मान्य API key डालें'); return; }
|
| 549 |
+
geminiKey = v;
|
| 550 |
+
document.getElementById('keyBanner').style.display='none';
|
| 551 |
+
showToast('API key सेव हो गई (सिर्फ़ इस सेशन के लिए)');
|
| 552 |
+
}
|
| 553 |
+
function prefillChat(text){
|
| 554 |
+
toggleChat(true);
|
| 555 |
+
document.getElementById('chatInput').value = text;
|
| 556 |
+
sendMessage();
|
| 557 |
+
}
|
| 558 |
+
function appendMsg(text, who){
|
| 559 |
+
const body = document.getElementById('chatBody');
|
| 560 |
+
const div = document.createElement('div');
|
| 561 |
+
div.className = 'msg ' + who;
|
| 562 |
+
div.innerText = text;
|
| 563 |
+
body.appendChild(div);
|
| 564 |
+
body.scrollTop = body.scrollHeight;
|
| 565 |
+
return div;
|
| 566 |
+
}
|
| 567 |
+
function appendTyping(){
|
| 568 |
+
const body = document.getElementById('chatBody');
|
| 569 |
+
const div = document.createElement('div');
|
| 570 |
+
div.className = 'msg bot'; div.id = 'typingIndicator';
|
| 571 |
+
div.innerHTML = '<div class="typing"><span></span><span></span><span></span></div>';
|
| 572 |
+
body.appendChild(div);
|
| 573 |
+
body.scrollTop = body.scrollHeight;
|
| 574 |
+
}
|
| 575 |
+
function removeTyping(){
|
| 576 |
+
const t = document.getElementById('typingIndicator');
|
| 577 |
+
if(t) t.remove();
|
| 578 |
+
}
|
| 579 |
+
|
| 580 |
+
const SYSTEM_PROMPT = `आप "e-Ashram AI सहायक" हैं — Shivay Office & Associate द्वारा संचालित e-Ashram डिजिटल-गुरुकुल पहल का आधिकारिक सहायक।
|
| 581 |
+
आपका काम है ग्रामीण भारत के नागरिकों को सरकारी योजनाओं, केंद्र पंजीकरण प्रक्रिया, और e-Ashram के चार स्तंभों (डिजिटल साक्षरता, महिला सशक्तिकरण, सामुदायिक रसोई, आध्यात्मिक शिक्षा) के बारे में सरल हिंदी/हिंग्लिश में जानकारी देना।
|
| 582 |
+
लहजा: विनम्र, आदरपूर्ण, थोड़ा आध्यात्मिक — उपयुक्त होने पर "🙏" या "Radhe Radhe" जैसे अभिवादन का प्रयोग करें, पर हर वाक्य में नहीं।
|
| 583 |
+
जवाब संक्षिप्त और स्पष्ट रखें (3-5 वाक्य)। अगर कोई तकनीकी या वित्तीय सलाह मांगे जो आप निश्चित रूप से नहीं जानते, तो ईमानदारी से बताएं और नज़दीकी केंद्र या संबंधित सरकारी वेबसाइट पर जाने का सुझाव दें।`;
|
| 584 |
+
|
| 585 |
+
async function sendMessage(){
|
| 586 |
+
const input = document.getElementById('chatInput');
|
| 587 |
+
const text = input.value.trim();
|
| 588 |
+
if(!text) return;
|
| 589 |
+
appendMsg(text, 'user');
|
| 590 |
+
input.value = '';
|
| 591 |
+
|
| 592 |
+
if(!geminiKey){
|
| 593 |
+
document.getElementById('keyBanner').style.display='block';
|
| 594 |
+
appendMsg('कृपया पहले ऊपर ⚙️ सेटिंग में अपनी Gemini API key डालें, ताकि मैं आपकी मदद कर सकूं।', 'bot');
|
| 595 |
+
return;
|
| 596 |
+
}
|
| 597 |
+
|
| 598 |
+
appendTyping();
|
| 599 |
+
try{
|
| 600 |
+
const res = await fetch(`https://generativelanguage.googleapis.com/v1beta/models/gemini-2.0-flash:generateContent?key=${geminiKey}`, {
|
| 601 |
+
method:'POST',
|
| 602 |
+
headers:{'Content-Type':'application/json'},
|
| 603 |
+
body: JSON.stringify({
|
| 604 |
+
contents:[{ role:'user', parts:[{text: text}] }],
|
| 605 |
+
systemInstruction:{ parts:[{text: SYSTEM_PROMPT}] },
|
| 606 |
+
generationConfig:{ temperature:0.7, maxOutputTokens:400 }
|
| 607 |
+
})
|
| 608 |
+
});
|
| 609 |
+
const data = await res.json();
|
| 610 |
+
removeTyping();
|
| 611 |
+
if(data.error){
|
| 612 |
+
appendMsg('माफ़ करें, कोई त्रुटि हुई: ' + (data.error.message || 'अज्ञात त्रुटि') + '। कृपया अपनी API key जांचें।', 'bot');
|
| 613 |
+
return;
|
| 614 |
+
}
|
| 615 |
+
const reply = data.candidates?.[0]?.content?.parts?.[0]?.text || 'माफ़ करें, मैं अभी जवाब नहीं दे पाया। कृपया पुनः प्रयास करें।';
|
| 616 |
+
appendMsg(reply, 'bot');
|
| 617 |
+
}catch(err){
|
| 618 |
+
removeTyping();
|
| 619 |
+
appendMsg('नेटवर्क त्रुटि हुई। कृपया अपना इंटरनेट कनेक्शन जांचें और पुनः प्रयास करें।', 'bot');
|
| 620 |
+
}
|
| 621 |
+
}
|
| 622 |
+
</script>
|
| 623 |
+
</body>
|
| 624 |
+
</html> html>
|
| 625 |
<html>
|
| 626 |
<head>
|
| 627 |
<meta charset="utf-8" />
|