/* ========== History Page Styles ========== */
.hist-container {
    width: 100%;
    padding: 0.25rem 0 2rem;
}

/* ট্যাব বাটন */
.tab-bar {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0 16px;
    margin-bottom: 0.25rem;
}

.tab-btn {
    flex: 1;
    text-align: center;
    padding: 0.45rem 0.2rem;
    border-radius: 20px;
    border: 1px solid #d1d5db;
    background: white;
    font-weight: 600;
    font-size: 0.82rem;
    cursor: pointer;
    transition: 0.2s;
}

.tab-btn.active-tab {
    background: #007a41;
    color: white;
    border-color: #007a41;
}

/* সাবজেক্ট ফিল্টার – ছোট, স্ক্রলযোগ্য */
.filter-row {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 0.3rem;
    margin-bottom: 0.75rem;
    padding: 0 16px;
    white-space: nowrap;
    scrollbar-width: none;
}
.filter-row::-webkit-scrollbar {
    display: none;
}

.filter-pill {
    flex-shrink: 0;
    padding: 0.28rem 0.65rem;
    border-radius: 16px;
    border: 1px solid #d1d5db;
    background: white;
    font-size: 0.72rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.filter-pill.active {
    background: #007a41;
    color: white;
    border-color: #007a41;
}

/* পরীক্ষার তালিকা (পূর্ণ প্রস্থ) */
.hist-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0;
}

.hist-card {
    background: white;
    border-radius: 1rem;
    padding: 1.1rem 1.2rem;
    box-shadow: 0 2px 10px rgba(0,0,0,0.03);
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.hist-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.06);
}

.hist-icon {
    width: 46px;
    height: 46px;
    background: #f0fdf4;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    color: #007a41;
}

.hist-info {
    flex: 1;
}

.hist-info h5 {
    font-size: 1.05rem;
    font-weight: 700;
    color: #111827;
    margin-bottom: 0.2rem;
}

.hist-meta {
    font-size: 0.8rem;
    color: #6b7280;
}

.hist-score-badge {
    font-weight: 700;
    font-size: 1rem;
    padding: 0.25rem 0.8rem;
    border-radius: 20px;
    color: white;
}

.score-high { background: #16a34a; }
.score-mid { background: #f59e0b; }
.score-low { background: #ef4444; }

/* MCQ প্রশ্ন কার্ড (পূর্ণ প্রস্থ) */
.question-card {
    background: #fafbfc;
    border-radius: 0;
    padding: 16px 0;                /* উপরে-নিচে 16px, ডান-বাম 0 */
    margin-bottom: 1px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.02);
    border: none;
    border-bottom: 1px solid #e2e8f0;
    position: relative;
}

.question-header {
    font-size: 1.05rem;
    font-weight: 600;
    margin-bottom: 10px;
    line-height: 1.5;
    color: #0f172a;
    padding-left: 14px;
    padding-right: 14px;
}
.question-num { font-weight: 700; color: #2563eb; display: inline; margin-right: 3px; }
.question-text { font-weight: 600; color: #0f172a; display: inline; }

.options-list { list-style: none; margin: 0; padding: 0 14px; }
.option-item {
    background-color: #f4f7fc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 10px 12px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    font-size: 0.95rem;
}
.option-item.correct-option {
    background-color: #a8f0d4 !important;
    border-color: #4fd1a5 !important;
}
.option-item.selected .option-index {
    background: #1e293b !important;
    color: white;
    border-color: #1e293b;
}
.option-index {
    width: 28px; height: 28px;
    border: 1px solid #cbd5e0;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    font-size: 0.9rem;
    background: white;
    flex-shrink: 0;
}
.option-text { flex: 1; color: #1e293b; }
.option-icon { margin-left: 8px; font-size: 1.1rem; }
.icon-correct { color: #27ae60; }
.icon-wrong { color: #e74c3c; }

.explanation-box {
    background-color: #f0f7ff;
    border: 1px solid #d1e9ff;
    border-radius: 10px;
    padding: 14px;
    margin-top: 15px;
    font-size: 0.95rem;
    margin-left: 14px;
    margin-right: 14px;
}
.exp-label { font-weight: 700; color: #3182ce; display: flex; align-items: center; gap: 6px; margin-bottom: 5px; }
.exp-text { color: #1e293b; }

.action-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 15px;
    padding-top: 12px;
    border-top: 1px solid #edf2f7;
    gap: 6px;
    position: relative;
    padding-left: 14px;
    padding-right: 14px;
}
.source-box-inline {
    flex: 1;
    background-color: #f0f3f7;
    border: 1px solid #dde3ed;
    border-radius: 7px;
    padding: 6px 8px;
    font-size: 0.75rem;
    max-width: 140px;
    white-space: nowrap;
    overflow-x: auto;
    color: #4a5568;
}
.action-btn {
    width: 34px; height: 34px;
    background: #eef2f6;
    border: none;
    border-radius: 8px;
    color: #4a5568;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s;
    flex-shrink: 0;
}
.action-btn:hover { background: #dee5ed; }
.ai-btn { color: #9b8bb8; background: #ede8f9; }
.ai-btn:hover { background: #e0d9ed; color: #7b5cb8; }

.delete-history-btn { color: #ef4444; }
.delete-history-btn:hover { background: #fee2e2; }

.more-panel {
    position: absolute;
    right: 0;
    bottom: 50px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    border: 1px solid #e2e8f0;
    padding: 8px;
    display: flex;
    gap: 6px;
    opacity: 0;
    transform: scale(0.9) translateX(10px);
    transition: opacity 0.25s ease, transform 0.25s ease;
    pointer-events: none;
    z-index: 10;
}
.more-panel.show {
    opacity: 1;
    transform: scale(1) translateX(0);
    pointer-events: auto;
}
.panel-btn {
    width: 38px; height: 38px;
    background: #f1f5f9;
    border: none;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #4a5568;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}
.panel-btn:hover { background: #e2e8f0; }
.priority-digit { font-family: 'Inter', sans-serif; font-weight: 700; font-size: 1.2rem; }
.comment-btn { color: #7b5cb8; }

/* মোডাল ওভারলে */
.hist-detail-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.4);
    justify-content: center;
    align-items: center;
    z-index: 1000;
}
.hist-detail-overlay.open {
    display: flex;
}

.hist-detail-card {
    background: white;
    border-radius: 1.2rem;
    width: 90%;
    max-width: 520px;
    max-height: 85vh;
    overflow-y: auto;
    padding: 1.8rem 1.4rem;
    box-shadow: 0 20px 50px rgba(0,0,0,0.15);
    position: relative;
}

/* লোডিং / খালি / এরর */
.loading, .empty, .error-msg {
    text-align: center;
    padding: 2rem;
    color: #6b7280;
}
.error-msg { color: #ef4444; }