/* Start custom CSS for html, class: .elementor-element-1fc4e93 *//* ==================================================

           YOUR ORIGINAL CSS (BASE DESIGN)

           ================================================== */

        :root {

            --primary: #d32f2f;

            --secondary: #1976d2;

            --bg-color: #f8f9fa;

            --text-color: #2c3e50;

            --box-bg: #ffffff;

            --correct-bg: #e8f5e9;

            --correct-border: #388e3c;

            --wrong-bg: #ffebee;

            --wrong-border: #d32f2f;

            --unans-bg: #f1f5f9;

            --unans-border: #94a3b8;

            --subheading-bg: #263238;

        }



        body { font-family: 'Segoe UI', system-ui, -apple-system, sans-serif; background-color: var(--bg-color); color: var(--text-color); margin: 0; padding: 0; line-height: 1.6; transition: background 0.3s, color 0.3s; }



        header { position: sticky; top: 0; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(8px); box-shadow: 0 4px 12px rgba(0,0,0,0.05); display: flex; justify-content: space-between; align-items: center; padding: 12px 20px; z-index: 1000; border-bottom: 1px solid rgba(0,0,0,0.05); gap: 10px; transition: background 0.3s; }

        .logo { color: var(--primary); font-size: 24px; font-weight: 800; text-decoration: none; letter-spacing: -0.5px; white-space: nowrap; }



        #timer-display { font-weight: 800; color: var(--primary); font-size: 18px; display: none; background: #ffebee; padding: 4px 12px; border-radius: 8px; border: 1px solid var(--primary); white-space: nowrap; }



        .header-actions { display: flex; gap: 10px; align-items: center; }



        .translate-btn { background: linear-gradient(135deg, #1976d2, #1565c0); color: white; border: none; padding: 9px 18px; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 600; box-shadow: 0 2px 8px rgba(25, 118, 210, 0.3); transition: all 0.3s ease; white-space: nowrap; }

        .translate-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(25, 118, 210, 0.4); }

        

        .dark-mode-btn { background: #334155; color: white; border: none; padding: 9px 18px; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 600; transition: all 0.3s ease; white-space: nowrap; }

        .dark-mode-btn:hover { transform: translateY(-1px); }



        .exam-mode-bar { background: #e2e8f0; padding: 10px 20px; text-align: center; border-bottom: 1px solid #cbd5e1; transition: background 0.3s; }

        .exam-mode-btn { background: #0f172a; color: white; border: none; padding: 8px 20px; border-radius: 8px; cursor: pointer; font-weight: bold; font-size: 15px; transition: all 0.3s ease; box-shadow: 0 4px 10px rgba(15, 23, 42, 0.2); }

        .exam-mode-btn:hover { background: #1e293b; transform: translateY(-1px); }



        .container { max-width: 800px; margin: 0 auto; padding: 20px; }

        .quiz-title { text-align: center; font-size: 28px; margin-top: 5px; margin-bottom: 5px; color: #1a1a1a; font-weight: 800; transition: color 0.3s; }

        .sponsor-link { display: block; text-align: center; font-size: 14px; color: var(--secondary); text-decoration: none; margin-bottom: 10px; font-weight: 500; }

        .subtitle { text-align: center; font-size: 16px; color: var(--primary); margin-bottom: 5px; font-weight: 700; transition: color 0.3s; }



        .header-separator { border: 0; border-top: 2px solid #cbd5e1; margin: 10px auto 25px auto; width: 100%; transition: border-color 0.3s; }



        .ad-container { margin: 10px auto 25px auto; text-align: center; background: #f8fafc; padding: 5px; border-radius: 8px; min-height: 60px; border: 1px dashed #cbd5e1; display: flex; justify-content: center; align-items: center; transition: background 0.3s, border-color 0.3s; }



        .question-card { background: var(--box-bg); padding: 25px; border-radius: 16px; box-shadow: 0 8px 24px rgba(149, 157, 165, 0.1); margin-bottom: 30px; border: 1px solid rgba(0,0,0,0.03); transition: transform 0.2s ease, background 0.3s, border-color 0.3s; position: relative; }

        

        .bookmark-btn { position: absolute; top: 20px; right: 20px; background: none; border: none; font-size: 28px; cursor: pointer; color: #cbd5e1; transition: all 0.2s ease; line-height: 1; padding: 0; }

        .bookmark-btn:hover { transform: scale(1.15); color: #94a3b8; }

        .bookmark-btn.active { color: #f59e0b; text-shadow: 0 2px 4px rgba(245, 158, 11, 0.3); }



        .question-text { font-size: 18px; font-weight: 700; margin-bottom: 20px; color: var(--text-color); white-space: pre-wrap; line-height: 1.5; padding-right: 30px; }

        .options-list { list-style: none; padding: 0; margin: 0; }

        

        .option-item { background: var(--box-bg); border: 2px solid #e2e8f0; padding: 13px 18px; margin-bottom: 10px; border-radius: 10px; cursor: pointer; font-size: 16px; color: var(--text-color); transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); position: relative; }

        .option-item:hover:not(.disabled) { transform: translateX(5px); background: #f8fafc; border-color: #cbd5e1; box-shadow: 0 4px 12px rgba(0,0,0,0.04); }

        .option-item.disabled { cursor: not-allowed; }

        .option-item.exam-selected { background-color: #dbeafe !important; border-color: #3b82f6 !important; color: #1e3a8a !important; font-weight: 700; transform: translateX(5px); box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15); }

        .option-item.correct { background: var(--correct-bg) !important; border-color: var(--correct-border) !important; color: #1b5e20 !important; font-weight: 600; }

        .option-item.wrong { background: var(--wrong-bg) !important; border-color: var(--wrong-border) !important; color: #b71c1c !important; font-weight: 600; }

        .option-item.unans-selected { background: var(--unans-bg) !important; border-color: var(--unans-border) !important; color: #334155 !important; font-weight: 600; }



        .card-nav-btns { display: flex; justify-content: space-between; margin-top: 20px; padding-top: 15px; border-top: 1px solid #e2e8f0; transition: border-color 0.3s; }

        .q-nav-btn { background: #f1f5f9; color: #334155; border: 1px solid #cbd5e1; padding: 8px 20px; border-radius: 8px; font-weight: 600; cursor: pointer; transition: all 0.2s; font-size: 14px; }

        .q-nav-btn:hover:not(:disabled) { background: #e2e8f0; color: #0f172a; border-color: #94a3b8; }

        .q-nav-btn:disabled { opacity: 0.5; cursor: not-allowed; }

        .q-nav-btn.submit-nav { background: linear-gradient(135deg, #1976d2, #1565c0); color: white; border: none; box-shadow: 0 4px 10px rgba(25, 118, 210, 0.3); }

        .q-nav-btn.submit-nav:hover { background: linear-gradient(135deg, #1565c0, #0d47a1); transform: translateY(-1px); box-shadow: 0 6px 12px rgba(25, 118, 210, 0.4); }



        .question-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(45px, 1fr)); gap: 10px; margin-top: 25px; margin-bottom: 20px; padding: 20px; background: var(--box-bg); border-radius: 16px; border: 1px solid #e2e8f0; box-shadow: 0 4px 15px rgba(0,0,0,0.03); transition: background 0.3s, border-color 0.3s; }

        .grid-item { display: flex; justify-content: center; align-items: center; height: 45px; background: var(--box-bg); border: 1px solid #cbd5e1; border-radius: 8px; font-size: 15px; font-weight: 700; cursor: pointer; color: var(--text-color); transition: all 0.2s; }

        .grid-item:hover { opacity: 0.8; transform: scale(1.05); }

        .grid-item.active { outline: 3px solid #3b82f6; outline-offset: 2px; }

        .grid-item.nav-attempted { background-color: #4caf50 !important; color: white !important; border-color: #388e3c !important; }

        .grid-item.nav-unans { background-color: #94a3b8 !important; color: white !important; border-color: #64748b !important; }

        .grid-item.rev-correct { background-color: #4caf50 !important; color: white !important; border-color: #388e3c !important; }

        .grid-item.rev-wrong { background-color: #f44336 !important; color: white !important; border-color: #d32f2f !important; }



        /* Review Header & COLORFUL Filters */

        #review-header { display: none; margin-bottom: 30px; }

        .review-filters { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-bottom: 15px; }

        .filter-btn { padding: 8px 18px; border-radius: 50px; border: none; font-weight: 700; font-size: 14px; cursor: pointer; transition: all 0.3s; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }

        .filter-btn.all { background: #334155; color: white; border: 2px solid transparent; }

        .filter-btn.right { background: #e8f5e9; color: #2e7d32; border: 2px solid #4caf50; }

        .filter-btn.wrong { background: #ffebee; color: #c62828; border: 2px solid #ef5350; }

        .filter-btn.unans { background: #f1f5f9; color: #475569; border: 2px solid #94a3b8; }

        .filter-btn.bookmarked { background: #fffbeb; color: #b45309; border: 2px solid #f59e0b; }

        .filter-btn.active { transform: scale(1.05); box-shadow: 0 4px 10px rgba(0,0,0,0.15); border-width: 2px; }



        .review-bkmk-notice, .dash-notice { margin: 15px auto 25px auto; padding: 12px 20px; background: #fffbeb; border: 1px dashed #f59e0b; border-radius: 10px; font-size: 14.5px; font-weight: 600; color: #b45309; line-height: 1.6; text-align: center; transition: background 0.3s, border-color 0.3s;}

        .review-bkmk-notice a, .dash-notice a { display: inline-block; margin-left: 10px; color: #d97706; text-decoration: underline; font-size: 15px; transition: color 0.2s; }

        .review-bkmk-notice a:hover, .dash-notice a:hover { color: #b45309; }



        .dash-notice { background: #eff6ff; border-color: #3b82f6; color: #1e3a8a; }

        .dash-notice a { color: #2563eb; }

        .dash-notice a:hover { color: #1e3a8a; }



        @keyframes slideDownFade { from { opacity: 0; transform: translateY(-15px); } to { opacity: 1; transform: translateY(0); } }

        .explanation { margin-top: 15px; padding: 12px 15px; background: #f0f7ff; border: 1px solid #cce4ff; border-left: 6px solid var(--secondary); border-radius: 10px; display: none; color: #2c3e50; box-shadow: 0 4px 12px rgba(25, 118, 210, 0.08); animation: slideDownFade 0.4s cubic-bezier(0.16, 1, 0.3, 1); transition: background 0.3s, border-color 0.3s; }

        .exp-title { font-size: 15px; font-weight: 700; color: var(--secondary); margin-bottom: 8px; }

        .exp-content { font-size: 14.5px; line-height: 1.7; white-space: pre-wrap; color: var(--text-color); }



        .submit-container { text-align: center; margin: 30px 0 50px 0; }

        .submit-btn { background: linear-gradient(135deg, #4caf50, #43a047); color: white; border: none; padding: 16px 45px; font-size: 18px; font-weight: 700; border-radius: 50px; cursor: pointer; box-shadow: 0 8px 20px rgba(76, 175, 80, 0.3); transition: all 0.3s ease; }

        .submit-btn:hover { transform: translateY(-3px); box-shadow: 0 12px 25px rgba(76, 175, 80, 0.4); }



        .modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(15, 23, 42, 0.7); backdrop-filter: blur(5px); display: none; justify-content: center; align-items: center; z-index: 2000; padding: 20px; overflow-y: auto; }

        .modal-content { background: var(--box-bg); padding: 30px; border-radius: 20px; width: 100%; max-width: 500px; text-align: center; box-shadow: 0 20px 40px rgba(0,0,0,0.2); animation: slideDownFade 0.3s ease-out; margin: auto; transition: background 0.3s; }

        .modal-title { font-size: 24px; margin-bottom: 20px; color: var(--primary); font-weight: 800; }

        .analysis-table { width: 100%; border-collapse: collapse; margin-bottom: 25px; border: 1px solid #e2e8f0; border-radius: 10px; overflow: hidden;}

        .analysis-table th, .analysis-table td { padding: 14px; border-bottom: 1px solid #e2e8f0; font-size: 15px; }

        .analysis-table th { background: #f1f5f9; color: #334155; font-weight: 700; text-align: center;}

        .analysis-table td:first-child { font-weight: 600; text-align: left;}

        .col-count, .col-marks { font-weight: 800; text-align: center !important; }

        

        .row-correct { color: #1b5e20; background: #f8faf8;}

        .row-wrong { color: #b71c1c; background: #fffafb;}

        .row-unans { color: #475569; background: #f8fafc;}

        .row-left { color: #92400e; background: #fffcf0;}

        .row-total { background: #e0f2fe; color: #0369a1; font-weight: 800; font-size: 18px;}

        

        .row-rank { background: #fffbeb; color: #b45309; font-weight: 800; font-size: 16px; }



        .btn-review { background: #d32f2f; color: white; border: none; padding: 14px 20px; border-radius: 10px; cursor: pointer; width: 100%; font-weight: 800; font-size: 16px; margin-bottom: 10px; }

        

        .bkmk-notice { margin: 15px 0; padding: 12px; background: #fffbeb; border: 1px dashed #f59e0b; border-radius: 10px; font-size: 14px; font-weight: 600; color: #b45309; line-height: 1.5; transition: background 0.3s, border-color 0.3s;}

        .bkmk-notice a { display: block; margin-top: 8px; color: #d97706; text-decoration: underline; font-size: 15px; transition: color 0.2s; }

        .bkmk-notice a:hover { color: #b45309; }



        .modal-links a { display: block; margin: 12px 0; padding: 12px; border-radius: 10px; text-decoration: none; font-weight: 700; color: white; }

        .btn-tg { background: linear-gradient(135deg, #0088cc, #0077b5); }

        .btn-other { background: linear-gradient(135deg, #f59e0b, #d97706); }



        /* ==================================================

           DARK MODE COLORS OVERRIDES (Perfect Sync with Bookmarks)

           ================================================== */

        body.dark-mode {

            --bg-color: #0f172a;

            --box-bg: #1e293b;

            --text-color: #cbd5e1;

            --primary: #ef5350;

            --secondary: #42a5f5;

            --correct-bg: rgba(16, 185, 129, 0.15);

            --correct-border: #10b981;

            --wrong-bg: rgba(239, 68, 68, 0.15);

            --wrong-border: #ef4444;

            --unans-bg: rgba(51, 65, 85, 0.5);

            --unans-border: #64748b;

        }



        body.dark-mode header { background: rgba(15, 23, 42, 0.95); border-bottom-color: #334155; }

        body.dark-mode .logo { color: var(--primary); }

        body.dark-mode #timer-display { background: rgba(239, 68, 68, 0.15); color: #f87171; border-color: #ef4444; }

        body.dark-mode .translate-btn { background: var(--secondary); box-shadow: none; color: #ffffff; }

        body.dark-mode .dark-mode-btn { background: #334155; color: #ffffff; }

        

        body.dark-mode .exam-mode-bar { background: #1e293b; border-color: #334155; }

        body.dark-mode .exam-mode-btn { background: var(--secondary); color: #ffffff; }

        

        body.dark-mode .quiz-title { color: #ffffff; }

        body.dark-mode .subtitle { color: var(--primary); } 

        body.dark-mode .header-separator { border-color: #334155; }

        body.dark-mode .ad-container { background: #0f172a; border-color: #334155; }

        body.dark-mode .question-card { background: #1e293b; border-color: #334155; }

        body.dark-mode .question-text { color: #ffffff; }



        body.dark-mode .option-item { border-color: #334155; color: #cbd5e1; background-color: #1e293b; }

        /* Hover effect added to match My Bookmarks */

        body.dark-mode .option-item:hover:not(.disabled) { background-color: #ffffff !important; color: #000000 !important; border-color: #ffffff; box-shadow: 0 4px 12px rgba(0,0,0,0.3); }

        body.dark-mode .option-item.exam-selected { background-color: rgba(66, 165, 245, 0.15) !important; border-color: var(--secondary) !important; color: #90caf9 !important; }

        body.dark-mode .option-item.correct { background-color: var(--correct-bg) !important; border-color: var(--correct-border) !important; color: #34d399 !important; }

        body.dark-mode .option-item.wrong { background-color: var(--wrong-bg) !important; border-color: var(--wrong-border) !important; color: #f87171 !important; }

        body.dark-mode .option-item.unans-selected { background-color: var(--unans-bg) !important; border-color: var(--unans-border) !important; color: #cbd5e1 !important; }



        body.dark-mode .card-nav-btns { border-color: #334155; }

        body.dark-mode .q-nav-btn { background: #0f172a; color: #cbd5e1; border-color: #334155; }

        /* Hover effect added to match My Bookmarks */

        body.dark-mode .q-nav-btn:hover:not(:disabled) { background-color: #ffffff !important; color: #000000 !important; border-color: #ffffff; }



        body.dark-mode .question-grid { border-color: #334155; background: #1e293b;}

        body.dark-mode .grid-item { border-color: #334155; background-color: #1e293b; color: #cbd5e1; }

        body.dark-mode .grid-item.nav-attempted, body.dark-mode .grid-item.rev-correct { background-color: rgba(16, 185, 129, 0.2) !important; border-color: #10b981 !important; color: #34d399 !important; }

        body.dark-mode .grid-item.nav-unans { background-color: #334155 !important; border-color: #64748b !important; color: #cbd5e1 !important; }

        body.dark-mode .grid-item.rev-wrong { background-color: rgba(239, 68, 68, 0.2) !important; border-color: #ef4444 !important; color: #f87171 !important; }



        /* Colorful Filters Dark Mode Overrides */

        body.dark-mode .filter-btn.all { background: #1e293b; color: #f1f5f9; border-color: #475569; }

        body.dark-mode .filter-btn.right { background: rgba(16, 185, 129, 0.15); color: #34d399; border-color: #10b981; }

        body.dark-mode .filter-btn.wrong { background: rgba(239, 68, 68, 0.15); color: #f87171; border-color: #ef4444; }

        body.dark-mode .filter-btn.unans { background: #334155; color: #cbd5e1; border-color: #64748b; }

        body.dark-mode .filter-btn.bookmarked { background: rgba(245, 158, 11, 0.15); color: #fcd34d; border-color: #d97706; }



        body.dark-mode .explanation { background: #0f172a; border-color: #334155; border-left-color: var(--secondary); color: #cbd5e1; }

        body.dark-mode .exp-title { color: var(--secondary); }

        body.dark-mode .exp-content { color: #cbd5e1; }

        

        body.dark-mode .review-bkmk-notice, body.dark-mode .bkmk-notice { background: rgba(245, 158, 11, 0.1); border-color: #d97706; color: #fde68a; }

        body.dark-mode .review-bkmk-notice a, body.dark-mode .bkmk-notice a { color: #fbbf24; }

        body.dark-mode .dash-notice { background: rgba(59, 130, 246, 0.1); border-color: #3b82f6; color: #bfdbfe; }

        body.dark-mode .dash-notice a { color: #60a5fa; }



        body.dark-mode .modal-content { background: #1e293b; }

        body.dark-mode .analysis-table, body.dark-mode .analysis-table th, body.dark-mode .analysis-table td { border-color: #334155; }

        body.dark-mode .analysis-table th { background: #0f172a; color: #cbd5e1; }

        body.dark-mode .row-correct { background: rgba(16, 185, 129, 0.1); color: #34d399; }

        body.dark-mode .row-wrong { background: rgba(239, 68, 68, 0.1); color: #f87171; }

        body.dark-mode .row-unans { background: #0f172a; color: #94a3b8; }

        body.dark-mode .row-left { background: rgba(245, 158, 11, 0.1); color: #fde68a; }

        body.dark-mode .row-total { background: rgba(59, 130, 246, 0.15); color: #7dd3fc; }

        body.dark-mode .row-rank { background: rgba(245, 158, 11, 0.15); color: #fbbf24; }



/* ==================================================
           RESPONSIVE MOBILE SETTINGS (BULLETPROOF MODAL FIX)
           ================================================== */
        @media (max-width: 600px) {
            header { padding: 10px 8px; } 
            .logo { font-size: 18px; }
            .header-actions { gap: 5px; }
            
            #dark-mode-btn .btn-text { display: none; }
            .translate-btn { padding: 6px 12px; font-size: 13px; }
            .dark-mode-btn { padding: 6px 8px; font-size: 14px; }
            
            #timer-display { font-size: 13px; padding: 4px 6px; }
            .filter-btn { padding: 6px 10px; font-size: 12px; }
            
            .container { padding: 10px 6px; }
            .quiz-title { font-size: 20px; }
            .question-card { padding: 15px 12px; margin-bottom: 20px;}
            .question-text { font-size: 15.5px; padding-right: 20px;}
            .option-item { font-size: 14px; padding: 10px 12px; } 
            .bookmark-btn { font-size: 22px; top: 12px; right: 12px;}
            
            /* --- 100% FORCED MODAL FIXES --- */
            .modal-overlay { 
                padding: 4px !important; 
            } 
            .modal-content { 
                padding: 15px 4px !important;  /* अंदर की पैडिंग लगभग 0 कर दी */
                width: 100% !important;         
                max-width: 100% !important;
                margin: 0 auto !important;
                border-radius: 10px !important; 
            }
            .modal-title { font-size: 18px !important; margin-bottom: 12px !important; }
            
            .analysis-table th, .analysis-table td { 
                padding: 8px 2px !important; 
                font-size: 12px !important; 
                letter-spacing: -0.3px !important; 
            }
            .row-total, .row-rank { font-size: 14px !important; }
            
            .btn-review { padding: 12px 10px !important; font-size: 14px !important; }
            
            .review-bkmk-notice, .dash-notice, .bkmk-notice { font-size: 12.5px !important; padding: 8px !important; }
            .review-bkmk-notice a, .dash-notice a, .bkmk-notice a { display: block !important; margin: 5px 0 0 0 !important; }
        }
        

        /* ==================================================

           WORDPRESS THEME DARK MODE FIXES (OVERRIDE)

           ================================================== */

           

        /* 1. पूरे पेज को डार्क करने के लिए (Theme के सफेद बैकग्राउंड को हटाने के लिए) */

        body.dark-mode,

        body.dark-mode #page,

        body.dark-mode #content,

        body.dark-mode #primary,

        body.dark-mode .site-content,

        body.dark-mode .site-main,

        body.dark-mode .entry-content,

        body.dark-mode .post-inner {

            background-color: var(--bg-color) !important;

            background: var(--bg-color) !important;

        }



        /* 2. मेन हेडिंग (Eduteria - 72nd BPSC...) को डार्क मोड में सफेद करने के लिए */

        body.dark-mode .quiz-title,

        body.dark-mode h1.entry-title,

        body.dark-mode h1, 

        body.dark-mode h2, 

        body.dark-mode h3 {

            color: #ffffff !important;

        }



        /* 3. व्याख्या (Explanation) के Bold शब्दों को सफेद करने के लिए */

        body.dark-mode .explanation b,

        body.dark-mode .explanation strong,

        body.dark-mode .exp-content b,

        body.dark-mode .exp-content strong,

        body.dark-mode .question-text b,

        body.dark-mode .question-text strong {

            color: #ffffff !important;

        }/* End custom CSS */