/*
 * «مراجعة إجاباتك» (4.15.63, design approved 9 Oct 2026). See SEE_Exam_Review.
 * The exam's light palette (cream cards, deep green, gold) inside the dark dashboard shell.
 */
.see-review { box-sizing: border-box; max-width: 960px; margin: 28px auto 60px; padding: 0 16px; color: #173c35; direction: rtl; font-family: Tajawal, Tahoma, "Segoe UI", Arial, sans-serif; }
.see-review *, .see-review *::before, .see-review *::after { box-sizing: border-box; }

.see-review__head { overflow: hidden; border-radius: 24px; background: #fffaf0; box-shadow: 0 24px 60px -30px rgba(0, 0, 0, 0.6); }
.see-review__top { padding: 26px 28px 22px; background: radial-gradient(circle at 15% 0, rgba(255, 255, 255, 0.08), transparent 40%), linear-gradient(135deg, #06372f, #0a6553); color: #fff; text-align: center; }
.see-review__top h1 { margin: 0 !important; color: #fff !important; font-family: inherit !important; font-size: 30px !important; font-weight: 900 !important; line-height: 1.3 !important; }
.see-review__top p { margin: 4px 0 0 !important; color: #f2c85c !important; font-size: 16px !important; font-weight: 800 !important; }
.see-review__stats { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; padding: 20px 22px 6px; }
.see-review__stat { min-width: 150px; padding: 12px 16px; border: 1px solid #ecdcb5; border-radius: 16px; background: #fff; text-align: center; }
.see-review__stat span { display: block; color: #6d7f78; font-size: 13px; font-weight: 700; }
.see-review__stat b { display: block; margin-top: 2px; color: #073e36; font-size: 24px; font-weight: 900; }
.see-review__stat b.is-date { font-size: 18px; }
.see-review__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; padding: 14px 22px 24px; }
.see-review__btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 10px 26px; border-radius: 13px; font-size: 15px; font-weight: 900; text-decoration: none !important; }
.see-review__btn.is-solid { background: linear-gradient(135deg, #06372f, #08705c); color: #fff !important; }
.see-review__btn.is-line { border: 2px solid #0b584d; background: #fffdf7; color: #073e36 !important; }
.see-review__btn:focus-visible { outline: 3px solid #d3a84f; outline-offset: 3px; }

.see-review__tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 12px; }
.see-review__tab { appearance: none; padding: 8px 16px !important; border: 1px solid rgba(255, 255, 255, 0.14) !important; border-radius: 999px !important; background: rgba(255, 255, 255, 0.06) !important; box-shadow: none !important; color: #dfeee7 !important; cursor: pointer; font-family: inherit !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.4 !important; margin: 0 !important; min-height: 0 !important; }
.see-review__tab.is-on { border-color: #f2c85c !important; background: #f2c85c !important; color: #1d1505 !important; }
.see-review__tab:focus-visible { outline: 2px solid #f2c85c; outline-offset: 2px; }

.see-review__q { margin-top: 14px; padding: 22px 24px 20px; border-radius: 22px; background: #fffaf0; box-shadow: 0 18px 40px -26px rgba(0, 0, 0, 0.55); }
.see-review__q[hidden], .see-review__audio[hidden] { display: none !important; }
.see-review__q-top { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.see-review__num { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; flex: none; border-radius: 50%; color: #fff; font-size: 16px; font-weight: 900; }
.see-review__q.is-right .see-review__num { background: #0f7a55; }
.see-review__q.is-wrong .see-review__num { background: #c0392b; }
.see-review__q.is-empty .see-review__num { background: #8a9a94; }
.see-review__q-top b { color: #073e36; font-size: 17px; }
.see-review__pill { margin-right: auto; padding: 5px 14px; border-radius: 999px; font-size: 13px; font-weight: 900; }
.see-review__q.is-right .see-review__pill { background: #e3f4ea; color: #0f6b46; }
.see-review__q.is-wrong .see-review__pill { background: #fbe5e1; color: #a5281b; }
.see-review__q.is-empty .see-review__pill { background: #eceff0; color: #5d6b66; }

.see-review__text { margin: 6px 0 16px; color: #10302a; font-family: Georgia, "Times New Roman", serif !important; font-size: 24px; font-weight: 700; line-height: 1.45; text-align: left; direction: ltr; overflow-wrap: anywhere; }
.see-review__text p { margin: 0 0 8px !important; font-family: inherit !important; }
/* The dashboard shell colours text for its dark cards; the review's cream cards need dark text. */
.see-review__text, .see-review__text p, .see-review__text strong, .see-review__text b, .see-review__text span, .see-review__text li, .see-review__text td, .see-review__text th { color: #10302a !important; }
.see-review__text .prep4step-reading-passage, .see-review__text .prep4step-reading-passage p { color: #27413a !important; font-weight: 400 !important; }
.see-review__text .prep4step-reading-passage strong { color: #8a6a1c !important; font-weight: 800 !important; }
.see-review__opt span, .see-review__opt span p { color: #1d3b34 !important; }
.see-review__explain div, .see-review__explain p, .see-review__explain bdi, .see-review__explain span { color: #173c35 !important; }
.see-review__explain strong { color: #0b4f40 !important; }
.see-review__text--reading, .see-review__text--listening { font-size: 19px; }
.see-review__text .prep4step-reading-passage { margin: 0 0 14px !important; padding: 14px 16px !important; border: 1px solid #ecdcb5 !important; border-radius: 14px !important; background: #fff; color: #27413a; font-size: 17px; font-weight: 400; line-height: 1.7; }
.see-review__text .prep4step-reading-passage strong { color: #8a6a1c; }
.see-review__text img { max-width: 100%; height: auto; }
.see-review__text table { max-width: 100%; border-collapse: collapse; font-size: 15px; }
.see-review__text td, .see-review__text th { padding: 4px 8px; border: 1px solid #e3d6b8; }

.see-review__opts { display: grid; gap: 10px; }
.see-review__opt { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border: 1.5px solid #e7dfcc; border-radius: 14px; background: #fffdf8; color: #1d3b34; font-size: 17px; direction: ltr; }
.see-review__opt i { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; flex: none; border-radius: 10px; background: #efe6d2; color: #7a5a12; font-style: normal; font-weight: 900; }
.see-review__opt span { min-width: 0; overflow-wrap: anywhere; }
.see-review__opt span p { margin: 0 !important; }
.see-review__opt em { margin-left: auto; padding: 4px 10px; border-radius: 999px; direction: rtl; font-family: Tajawal, Tahoma, sans-serif; font-size: 13px; font-style: normal; font-weight: 900; white-space: nowrap; }
.see-review__opt.is-ok { border-color: #2aa36d; background: #eaf7f0; }
.see-review__opt.is-ok i, .see-review__opt.is-ok em { background: #0f7a55; color: #fff; }
.see-review__opt.is-bad { border-color: #d9534f; background: #fdf0ee; }
.see-review__opt.is-bad i, .see-review__opt.is-bad em { background: #c0392b; color: #fff; }

.see-review__explain { margin-top: 14px; padding: 12px 16px; border: 1px solid #e3e3cf; border-radius: 14px; background: linear-gradient(90deg, #eff4e8, #f7f1df); color: #173c35; font-size: 15px; line-height: 1.8; }
.see-review__explain > b { display: block; margin-bottom: 2px; color: #8a6a1c; font-size: 13px; }
.see-review__explain div { overflow-wrap: anywhere; }

.see-review__audio { margin-top: 22px; }
.see-review__audio .prep4step-listening-audio { display: grid; gap: 8px; padding: 14px 16px; border: 1px solid rgba(242, 200, 92, 0.4); border-radius: 18px; background: rgba(255, 255, 255, 0.06); color: #f2c85c; }
.see-review__audio .prep4step-listening-audio strong { font-size: 15px; }
.see-review__audio audio { width: 100%; }

@media (max-width: 640px) {
  .see-review__top h1 { font-size: 24px !important; }
  .see-review__stat { flex: 1 1 40%; min-width: 0; }
  .see-review__actions .see-review__btn { flex: 1 1 100%; }
  .see-review__q { padding: 18px 16px; }
  .see-review__text { font-size: 20px; }
  .see-review__text--reading, .see-review__text--listening { font-size: 17px; }
  .see-review__opt { padding: 10px 12px; font-size: 16px; }
}