/**
 * Styles for the "My Tests" Dashboard Tab
 */

/* --- Main Table Styles --- */
.iw-tests-table-wrapper { overflow-x: auto; }
.iw-tests-table { width: 100%; border-collapse: collapse; margin-top: 10px; }
.iw-tests-table th, .iw-tests-table td { padding: 15px; text-align: left; border-bottom: 1px solid #eee; vertical-align: middle; }
.iw-tests-table th { background-color: #f8f9fa; font-weight: 700; color: var(--color-primary-dark); font-size: 14px; text-transform: uppercase; }
.iw-tests-table tbody tr:hover { background-color: #fcfcfc; }
.iw-test-status { padding: 5px 12px; border-radius: 20px; font-size: 13px; font-weight: 700; color: #fff; white-space: nowrap; }
.status-not-taken { background-color: var(--color-text-light); }
.status-passed { background-color: var(--color-quaternary); }
.status-failed { background-color: var(--color-secondary); }
.status-under-review { background-color: var(--color-tertiary); color: var(--color-primary-dark); }
.iw-view-test-btn { background-color: var(--color-primary); color: #fff; border: none; padding: 8px 15px; border-radius: 6px; cursor: pointer; font-weight: 600; transition: var(--transition); font-size: 14px; text-decoration: none; display: inline-block; white-space: nowrap; }
.iw-view-test-btn:hover { background-color: var(--color-primary-dark); }
.iw-view-test-btn:disabled { opacity: 0.7; cursor: wait; }

/* --- No Tests State --- */
.iw-no-tests-content { text-align: center; padding: 40px; }
.iw-no-tests-icon { font-size: 50px; color: var(--color-tertiary); margin-bottom: 20px; }
.iw-no-tests-content h2 { color: var(--color-primary); margin-bottom: 10px; }
.iw-no-tests-content p { color: var(--color-text-light); margin-bottom: 0; max-width: 500px; margin-left: auto; margin-right: auto; }

/* --- NEW: Test Results Modal Styles --- */
.iw-modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); z-index: 2000; display: flex; align-items: center; justify-content: center; padding: 20px; backdrop-filter: blur(4px); }
.iw-test-results-modal { max-width: 800px; width: 100%; background-color: #fff; border-radius: var(--border-radius); box-shadow: var(--shadow-lg); max-height: 90vh; display: flex; flex-direction: column; }
.iw-modal-content .iw-modal-title { padding: 20px; margin: 0; font-size: 24px; border-bottom: 1px solid #eee; }
.iw-modal-close-btn { position: absolute; top: 15px; right: 20px; background: none; border: none; font-size: 28px; cursor: pointer; color: var(--color-text-light); }
.iw-results-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background-color: #eee; padding: 1px; border-bottom: 1px solid #eee; }
.iw-summary-box { background-color: #fff; padding: 15px; text-align: center; }
.iw-summary-box span { display: block; font-size: 14px; color: var(--color-text-light); margin-bottom: 5px; }
.iw-summary-box strong { font-size: 22px; color: var(--color-primary-dark); }
.iw-summary-box strong.is-passed { color: var(--color-quaternary); }
.iw-summary-box strong.is-failed { color: var(--color-secondary); }

.iw-results-details { padding: 20px; overflow-y: auto; flex-grow: 1; }
.iw-result-question { padding: 15px; border-radius: 8px; margin-bottom: 15px; border: 1px solid #eee; border-left-width: 5px; }
.iw-result-question.is-correct { border-left-color: var(--color-quaternary); }
.iw-result-question.is-incorrect { border-left-color: var(--color-secondary); }

.iw-question-header { margin-bottom: 10px; }
.iw-question-answer { font-style: italic; color: var(--color-text-light); }

/* --- Responsive Table --- */
@media (max-width: 768px) { .iw-tests-table thead { display: none; } .iw-tests-table, .iw-tests-table tbody, .iw-tests-table tr, .iw-tests-table td { display: block; width: 100%; } .iw-tests-table tr { margin-bottom: 15px; border: 1px solid #eee; border-radius: 8px; overflow: hidden; } .iw-tests-table td { text-align: right; padding-left: 50%; position: relative; border-bottom: 1px solid #f5f5f5; } .iw-tests-table td:before { content: attr(data-label); position: absolute; left: 15px; width: calc(50% - 30px); text-align: left; font-weight: 700; color: var(--color-primary-dark); text-transform: uppercase; font-size: 12px; } .iw-tests-table tr td:nth-of-type(1):before { content: "Test Title"; } .iw-tests-table tr td:nth-of-type(2):before { content: "Course"; } .iw-tests-table tr td:nth-of-type(3):before { content: "Date & Time"; } .iw-tests-table tr td:nth-of-type(4):before { content: "Status"; } .iw-tests-table tr td:nth-of-type(5):before { content: "Score"; } .iw-tests-table tr td:nth-of-type(6):before { content: "Action"; } .iw-tests-table td:last-child { border-bottom: 0; } }

