@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;700&family=Inter:wght@300;400;500;600;700&family=Noto+Sans+Devanagari:wght@700;900&family=Dancing+Script:wght@600&display=swap');
body { font-family: 'Inter', sans-serif; background-color: #f1f5f9; }
.font-industrial { font-family: 'Oswald', sans-serif; letter-spacing: 0.05em; }
.font-hindi { font-family: 'Noto Sans Devanagari', sans-serif; }
.font-script { font-family: 'Dancing Script', cursive; }
.iocl-logo-container { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1; }
.iocl-circle { position: relative; width: 4.5em; height: 4.5em; background-color: #F37021; border-radius: 50%; border: 0.22em solid #003399; box-shadow: inset 0 0 0 0.12em #ffffff; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.iocl-band { width: 100%; height: 35%; background-color: #003399; display: flex; align-items: center; justify-content: center; }
.iocl-hindi-text { color: #ffffff; font-family: 'Noto Sans Devanagari', sans-serif; font-weight: 800; font-size: 0.7em; margin-top: -0.15em; letter-spacing: -0.02em; }
.iocl-english-text { font-family: 'Arial', sans-serif; font-weight: 900; color: #ffffff; font-size: 1.1em; margin-top: 0.3em; letter-spacing: -0.02em; }
.login-bg { background-color: #0f172a; background-image: radial-gradient(#F37021 0.5px, transparent 0.5px), radial-gradient(#F37021 0.5px, #0f172a 0.5px); background-size: 20px 20px; background-position: 0 0, 10px 10px; }
.login-card { background: rgba(30, 41, 59, 0.8); backdrop-filter: blur(20px); border: 1px solid rgba(255, 255, 255, 0.1); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); }
.login-input { background: rgba(15, 23, 42, 0.6); border: 1px solid rgba(255, 255, 255, 0.1); color: white; transition: all 0.3s; }
.login-input:focus { border-color: #F37021; box-shadow: 0 0 0 2px rgba(243, 112, 33, 0.2); }
.header-bg { background: #111827; background-image: linear-gradient(to right, #0f172a, #1e293b); border-bottom: 4px solid #F37021; }
.iocl-btn { background: linear-gradient(135deg, #F37021 0%, #D84C00 100%); transition: all 0.2s ease; }
.iocl-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(243, 112, 33, 0.3); }
.nav-item { transition: all 0.2s; border-right: 3px solid transparent; }
.nav-item:hover { background-color: #e2e8f0; color: #0f172a; }
.active-nav { background-color: #fff7ed; border-right-color: #F37021; color: #c2410c !important; }
.hidden-section { display: none; }
.modal { transition: opacity 0.2s ease; }
body.modal-active { overflow: hidden; }
.fade-in { animation: fadeIn 0.5s ease-out; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }