/* Adminsidans läge Efterutvärdering (js/admin/review.js): ljust INCA-tema i
   samma formspråk som läget Övning (admin-exercise.css, "Sidans upplägg"):
   två valkort överst, kort med blå vänsterkant för det som är avslutat.
   Prefix rva-. */
#finished-section.rva-hidden { display: none !important; }

.rva-section { margin-bottom: 28px; }
.rva-title {
    font-size: 13px; font-weight: 800; color: var(--blue, #015e9f); text-transform: uppercase;
    letter-spacing: 0.06em; margin: 0 0 6px;
}
.rva-hint { margin: 0 0 14px; color: var(--text-secondary, #666); font-size: 14px; line-height: 1.45; }

/* ── Valkorten ───────────────────────────────────────────────────────────── */
.rva-tabs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; margin-bottom: 16px; }
.rva-tab {
    display: flex; gap: 12px; align-items: flex-start; min-width: 0; text-align: left; cursor: pointer;
    padding: 16px; background: #fff; color: #000; font: inherit;
    border: 2px solid var(--border-color, #d8dbe0); border-radius: 14px;
    -webkit-tap-highlight-color: transparent;
}
.rva-tab:hover { border-color: #b9c0ca; }
.rva-tab.on { border-color: var(--accent, #f0833d); background: #fff8f2; box-shadow: 0 2px 10px rgba(240,131,61,0.16); cursor: default; }
.rva-tab:focus-visible { outline: 3px solid var(--accent, #f0833d); outline-offset: 2px; }
.rva-tab-icon {
    flex-shrink: 0; width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
    background: var(--bg-primary, #f0f2f5); color: var(--blue, #015e9f);
}
.rva-tab-icon svg { width: 22px; height: 22px; }
.rva-tab.on .rva-tab-icon { background: var(--accent, #f0833d); color: #fff; }
.rva-tab-text { min-width: 0; display: block; }
.rva-tab-title { display: block; font-size: 17px; font-weight: 800; line-height: 1.25; }
.rva-tab-count {
    display: inline-block; margin-left: 6px; vertical-align: 2px; line-height: 1.5;
    min-width: 22px; padding: 0 7px; box-sizing: border-box; border-radius: 999px; text-align: center;
    background: var(--bg-primary, #f0f2f5); color: #333; font-size: 12px; font-weight: 800;
}
.rva-tab-count:empty { display: none; }
.rva-tab.on .rva-tab-count { background: #fff; color: #000; }
.rva-tab-sub { display: block; margin-top: 4px; font-size: 13px; line-height: 1.35; color: var(--text-secondary, #666); }

/* ── Listan ──────────────────────────────────────────────────────────────── */
.rva-search {
    width: 100%; box-sizing: border-box; margin: 0 0 12px; padding: 12px 14px; font: inherit; font-size: 16px;
    background: #fff; border: 2px solid var(--border-color, #d8dbe0); border-radius: 10px; color: #000; outline: none;
}
.rva-search:focus { border-color: var(--accent, #f0833d); }
.rva-run-list { display: flex; flex-direction: column; gap: 10px; }
.rva-run {
    background: #fff; border: 1px solid var(--border-color, #d8dbe0); border-left: 4px solid var(--blue, #015e9f);
    border-radius: 14px; padding: 14px 16px; display: flex; flex-direction: column; gap: 12px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.rva-run-main { min-width: 0; }
.rva-run-name { display: inline-block; font-size: 18px; font-weight: 800; color: #000; overflow-wrap: anywhere; text-decoration: none; }
.rva-run-name:hover { text-decoration: underline; }
.rva-run-sub { font-size: 14px; color: var(--text-secondary, #666); margin-top: 2px; }
.rva-run-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 8px; min-height: 22px; }
.rva-run-time { font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; margin-right: 2px; }
.rva-chip {
    padding: 3px 9px; border-radius: 999px; background: var(--bg-primary, #f0f2f5);
    font-size: 12px; font-weight: 700; color: #333; white-space: nowrap; font-variant-numeric: tabular-nums;
}
.rva-run-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.rva-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 42px; padding: 9px 16px; box-sizing: border-box;
    border-radius: 10px; border: 1px solid var(--border-color, #d8dbe0); background: #fff; color: #000;
    font: inherit; font-weight: 700; font-size: 14px; text-decoration: none; cursor: pointer;
}
.rva-btn:hover { border-color: #b8bcc3; }
.rva-btn-cta { background: var(--accent, #f0833d); border-color: var(--accent, #f0833d); color: #fff; }
.rva-btn-cta:hover { background: #e2742e; border-color: #e2742e; }
.rva-btn-del { margin-left: auto; color: var(--danger, #d32f2f); border-color: rgba(211,47,47,0.35); }
.rva-btn-del svg { width: 16px; height: 16px; }
.rva-btn-del:hover, .rva-btn-del:active { border-color: var(--danger, #d32f2f); background: #fff5f5; }
.rva-btn-danger { background: var(--danger, #d32f2f); border-color: var(--danger, #d32f2f); color: #fff; }
.rva-btn-danger:hover { background: #b71c1c; border-color: #b71c1c; }
.rva-empty {
    margin: 0 0 12px; padding: 16px; font-size: 15px; line-height: 1.45; color: var(--text-secondary, #666);
    background: #fff; border: 1px solid var(--border-color, #d8dbe0); border-radius: 12px;
}
.rva-more {
    display: block; margin: 10px auto 0; padding: 8px 12px; background: none; border: none;
    color: var(--blue, #015e9f); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer;
}

/* ── Bekräftelsen ────────────────────────────────────────────────────────── */
.rva-overlay { position: fixed; inset: 0; z-index: 400; background: rgba(0, 0, 0, 0.45); display: flex; align-items: center; justify-content: center; padding: 16px; }
.rva-dialog { background: #fff; border-radius: 14px; padding: 22px; width: min(420px, 100%); box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25); }
.rva-dialog h3 { margin: 0 0 8px; font-size: 18px; color: var(--danger, #d32f2f); overflow-wrap: anywhere; }
.rva-dialog p { margin: 0 0 12px; color: #333; font-size: 15px; line-height: 1.45; }
.rva-warn { background: #fff7f0; border: 1px solid var(--accent, #f0833d); border-radius: 8px; padding: 10px 12px; color: #000 !important; }
.rva-dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 6px; }

@media (max-width: 600px) {
    .rva-tab { flex-direction: column; gap: 8px; padding: 12px; }
    .rva-tab-title { font-size: 16px; }
    .rva-run-actions .rva-btn { flex: 1; }
    .rva-run-actions .rva-btn-del { margin-left: 0; flex: 1 1 100%; }
}
