/* ==============================================================
   1. GLOBAL RESET & VARIABLES
============================================================== */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Devanagari:wght@400;600;700;800&family=Poppins:wght@300;400;500;600;700&display=swap');

:root {
    --primary-color: #590F3D;
    --dark-color: #0f172a;
    --accent-color: #38bdf8;
    --bg-light: #f4f7fb;
    --text-dark: #1e293b;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Poppins', sans-serif; background: var(--bg-light); color: var(--text-dark); min-height: 100vh; }

/* ==============================================================
   2. NAVBAR
============================================================== */
.navbar {
    width: 100%; background: linear-gradient(135deg, , );
    padding: 14px 5%; display: flex; justify-content: space-between; align-items: center;
    position: sticky; top: 0; z-index: 999; box-shadow: 0 4px 15px rgba(0,0,0,0.15);
}
.logo { color: #fff; font-size: 28px; font-weight: 700; letter-spacing: 1px; }
.logo span { color: var(--accent-color); }

.nav-links { display: flex; gap: 25px; list-style: none; align-items: center; }
.nav-links li a { color: #fff; text-decoration: none; font-size: 16px; font-weight: 500; transition: 0.3s; }
.nav-links li a:hover { color: var(--accent-color); }

.login-btn {
    background: var(--accent-color); color: #fff; border: none; padding: 10px 20px;
    border-radius: 30px; cursor: pointer; font-weight: 600; transition: 0.3s;
}
.login-btn:hover { background: #0ea5e9; transform: translateY(-2px); }
.logout-btn { background: #ef4444; }
.logout-btn:hover { background: #dc2626; }

.menu-toggle { display: none; flex-direction: column; cursor: pointer; }
.menu-toggle span { width: 28px; height: 3px; background: #fff; margin: 4px 0; border-radius: 5px; }

/* ==============================================================
   3. NOTES PAGE (Chapter Premium UI)
============================================================== */
.chapter-container { width: 100%; max-width: 1100px; margin: 25px auto; padding: 10px 20px; }

.chapter-header {
    background: linear-gradient(135deg, #0f172a, #1e293b); color: white;
    padding: 50px 30px; border-radius: 28px; text-align: center; margin-bottom: 30px;
}
.chapter-header h1 { font-size: 42px; margin-bottom: 10px; }

.section {
    background: white; margin-top: 30px; padding: 30px; border-radius: 22px;
    box-shadow: 0 5px 18px rgba(0,0,0,0.08); border-left: 8px solid var(--primary-color);
}
.section h2 { color: #0f172a; margin-bottom: 18px; font-size: 30px; }
.section h3 { color: #1e3a8a; margin: 20px 0 10px 0; font-size: 22px; }

.tag {
    display: inline-block; background: var(--primary-color); color: white;
    padding: 7px 16px; border-radius: 25px; font-size: 14px; margin-bottom: 15px;
}

.section ul { padding-left: 25px; }
.section li { margin-bottom: 14px; font-size: 18px; line-height: 1.8; }
.highlight { color: #dc2626; font-weight: bold; }

.table-container { overflow-x: auto; margin: 20px 0; border: 1px solid #dbeafe; border-radius: 12px;}
table { width: 100%; border-collapse: collapse; }
table th { background: var(--primary-color); color: white; padding: 16px; font-size: 18px; text-align: left; }
table td { border: 1px solid #dbeafe; padding: 15px; font-size: 17px; }
table tr:nth-child(even) { background: #f8fbff; }

.note { background: #fff7d6; border-left: 7px solid #f59e0b; padding: 18px; border-radius: 12px; margin-top: 20px; font-size: 18px; }

/* ==============================================================
   4. MOBILE RESPONSIVE
============================================================== */
@media(max-width:900px){
    .menu-toggle { display: flex; }
    .nav-links {
        position: absolute; top: 78px; left: -100%; width: 100%;
        background: #0f172a; flex-direction: column; text-align: center;
        padding: 25px 0; transition: 0.4s; gap: 22px;
    }
    .nav-links.active { left: 0; }
    .login-btn { display: inline-block; width: 80%; }
}

@media(max-width:600px){
    .chapter-header h1 { font-size: 30px; }
    .section h2 { font-size: 24px; }
    .section li { font-size: 16px; }
    table th, table td { font-size: 15px; padding: 10px; }
}



.site-footer { background: #1f2937; color: white; text-align: center; padding: 30px 20px; margin-top: 50px; }
        .whatsapp-contact { margin-bottom: 15px; }
        .whatsapp-link { 
            display: inline-flex; align-items: center; gap: 8px; 
            color: #25D366; font-weight: bold; text-decoration: none; 
            font-size: 1.2rem; transition: 0.3s; 
        }
        .whatsapp-link:hover { color: #fff; transform: scale(1.05); }
        .footer-copyright { font-size: 0.9rem; color: #9ca3af; border-top: 1px solid #374151; padding-top: 15px; }
        
        /* 💡 प्राइवेसी लिंक के लिए लो-हाइलाइट स्टाइल */
        .footer-privacy-link { margin-top: 8px; font-size: 0.75rem; }
        .footer-privacy-link a { 
            color: #6b7280; /* हल्का ग्रे */
            text-decoration: none; 
            opacity: 0.8; 
            transition: 0.3s;
        }
        .footer-privacy-link a:hover { 
            color: #ffffff; /* होवर पर थोड़ा सा हाईलाइट */
            text-decoration: underline; 
        }