/* QuizTem-specific overrides intentionally stay minimal; generic UI is owned by WebBlocks UI primitives. */
.wb-auth-brand { display: inline-flex; align-items: center; justify-content: center; gap: var(--wb-s3); }
.wb-auth-brand-mark,
.wb-sidebar-brand-logo { display: inline-block; flex: 0 0 auto; }
.quiztem-logo-primary { stroke: currentColor; }
.quiztem-logo-accent { stroke: var(--wb-accent, #10b981); }
.wb-auth-brand-mark { width: 2rem; height: 2rem; }
.wb-auth-panel .wb-auth-brand {
    color: var(--wb-accent-on);
}
.wb-auth-panel .wb-auth-brand-mark { width: 3rem; height: 3rem; }
.wb-auth-card .wb-auth-brand { color: var(--wb-accent); }
.wb-navbar-breadcrumb-wrap,
.wb-navbar-breadcrumb { min-width: 0; }
.wb-navbar-breadcrumb .wb-breadcrumb-list { flex-wrap: wrap; row-gap: var(--wb-s1); }
.wb-navbar-breadcrumb .wb-breadcrumb-current,
.wb-navbar-breadcrumb .wb-breadcrumb-link { overflow-wrap: anywhere; }
.wb-form-narrow { max-width: 35rem; }
.wb-nowrap { white-space: nowrap; }
.wb-ml-auto { margin-left: auto; }
.wb-table-actions { text-align: left; white-space: nowrap; }
.wb-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.wb-card-compact .wb-card-header,
.wb-card-compact .wb-card-body { padding-block: 0.875rem; }
.wb-table-compact th,
.wb-table-compact td { padding-block: 0.5rem; }
[data-student-exam-surface] [data-exam-card] { border-color: color-mix(in srgb, var(--wb-border, #d8dee8) 82%, var(--wb-accent, #10b981)); }
[data-exam-card="status"] .wb-card-body { padding-block: 1rem; }
[data-exam-card="question"] .wb-card-body { padding-block: 1.5rem; }
[data-exam-options] { gap: var(--wb-s3); }
[data-exam-option] { border: 1px solid var(--wb-border, #d8dee8); border-radius: 0.75rem; }
[data-exam-option].is-selected { border-color: var(--wb-accent, #10b981); }
[data-exam-question-map] .wb-btn { min-width: 3.25rem; }
[data-quiztem-updates-layout="designed"] { --wb-updates-ok-bg: color-mix(in srgb, #22c55e 13%, var(--wb-surface)); --wb-updates-ok-border: color-mix(in srgb, #22c55e 24%, var(--wb-border)); --wb-updates-info-bg: color-mix(in srgb, var(--wb-accent) 12%, var(--wb-surface)); --wb-updates-info-border: color-mix(in srgb, var(--wb-accent) 28%, var(--wb-border)); --wb-updates-warning-bg: color-mix(in srgb, #f59e0b 14%, var(--wb-surface)); --wb-updates-warning-border: color-mix(in srgb, #f59e0b 28%, var(--wb-border)); }
[data-quiztem-updates-card="summary"] { overflow: hidden; border-color: color-mix(in srgb, var(--wb-accent) 18%, var(--wb-border)); } [data-quiztem-updates-card="summary"] > .wb-card-header { align-items: center; background: linear-gradient(90deg, color-mix(in srgb, var(--wb-accent) 9%, transparent), transparent 62%), color-mix(in srgb, var(--wb-surface-2) 78%, transparent); }
[data-quiztem-updates-hero] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 20rem); gap: var(--wb-s5); align-items: stretch; padding: clamp(var(--wb-s4), 3vw, var(--wb-s6)); border: 1px solid var(--wb-updates-ok-border); border-radius: var(--wb-radius-lg); background: radial-gradient(circle at 0 0, color-mix(in srgb, #22c55e 22%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, #22c55e 16%, transparent), transparent 62%), var(--wb-updates-ok-bg); }
[data-quiztem-updates-state="update_available"] [data-quiztem-updates-hero] { border-color: var(--wb-updates-info-border); background: radial-gradient(circle at 0 0, color-mix(in srgb, var(--wb-accent) 24%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--wb-accent) 16%, transparent), transparent 62%), var(--wb-updates-info-bg); } [data-quiztem-updates-state="local_newer"] [data-quiztem-updates-hero], [data-quiztem-updates-state="incompatible"] [data-quiztem-updates-hero], [data-quiztem-updates-state="server_unreachable"] [data-quiztem-updates-hero], [data-quiztem-updates-state="server_error"] [data-quiztem-updates-hero], [data-quiztem-updates-state="invalid_configuration"] [data-quiztem-updates-hero], [data-quiztem-updates-state="invalid_response"] [data-quiztem-updates-hero], [data-quiztem-updates-state="client_disabled"] [data-quiztem-updates-hero] { border-color: var(--wb-updates-warning-border); background: radial-gradient(circle at 0 0, color-mix(in srgb, #f59e0b 24%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, #f59e0b 16%, transparent), transparent 62%), var(--wb-updates-warning-bg); }
[data-quiztem-updates-hero-main] { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--wb-s4); align-items: center; min-inline-size: 0; } [data-quiztem-updates-hero-main] p, [data-quiztem-updates-release-notes] p { margin: var(--wb-s1) 0 0; } [data-quiztem-updates-version-path] strong { display: block; margin-block-start: var(--wb-s1); font-size: 1.25rem; }
[data-quiztem-updates-hero-icon], [data-quiztem-updates-card-icon], [data-quiztem-updates-check-icon] { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; border-radius: 9999px; color: var(--wb-accent-text); background: color-mix(in srgb, var(--wb-surface) 72%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--wb-border) 70%, transparent); } [data-quiztem-updates-hero-icon] { inline-size: 3.25rem; block-size: 3.25rem; font-size: 1.35rem; background: color-mix(in srgb, var(--wb-surface) 82%, transparent); } [data-quiztem-updates-card-icon] { inline-size: 2.5rem; block-size: 2.5rem; } [data-quiztem-updates-check-icon] { inline-size: 1.75rem; block-size: 1.75rem; color: var(--wb-success, #16a34a); }
[data-quiztem-updates-hero-aside] { display: grid; align-content: space-between; gap: var(--wb-s3); min-inline-size: 0; padding: var(--wb-s4); border: 1px solid color-mix(in srgb, var(--wb-border) 64%, transparent); border-radius: var(--wb-radius-lg); background: color-mix(in srgb, var(--wb-surface) 82%, transparent); } [data-quiztem-updates-hero-aside] strong { display: block; margin-block: var(--wb-s1); font-size: 1.35rem; }
[data-quiztem-updates-metrics], [data-quiztem-updates-release-meta] { display: grid; gap: var(--wb-s3); } [data-quiztem-updates-metrics] { grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); } [data-quiztem-updates-release-meta] { grid-template-columns: repeat(2, minmax(0, 1fr)); } [data-quiztem-updates-metrics] > div, [data-quiztem-updates-release-meta] > div { min-inline-size: 0; padding: var(--wb-s3); border: 1px solid color-mix(in srgb, var(--wb-border) 72%, transparent); border-radius: var(--wb-radius-md); background: color-mix(in srgb, var(--wb-surface-2) 64%, transparent); } [data-quiztem-updates-metrics] strong, [data-quiztem-updates-release-meta] strong, [data-quiztem-updates-release-meta] code { display: block; margin-block-start: var(--wb-s1); overflow-wrap: anywhere; } [data-quiztem-updates-release-meta] code { font-size: 0.85rem; white-space: normal; }
[data-quiztem-updates-card="safety-summary"] .wb-card-body { padding: var(--wb-s4); } [data-quiztem-updates-card="safety-summary"] .wb-card { position: relative; overflow: hidden; } [data-quiztem-updates-card="safety-summary"] .wb-card::before { content: ""; position: absolute; inset-block-start: 0; inset-inline: 0; block-size: 3px; background: color-mix(in srgb, var(--wb-accent) 52%, transparent); } [data-quiztem-updates-safety-card] { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--wb-s3); align-items: start; } [data-quiztem-updates-safety-card] .wb-cluster { margin-block-end: var(--wb-s1); }
[data-quiztem-updates-card="details"] { grid-template-columns: minmax(0, 1fr) minmax(20rem, 1fr); align-items: start; } [data-quiztem-updates-check] { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--wb-s3); align-items: center; min-inline-size: 0; padding: var(--wb-s3); border: 1px solid color-mix(in srgb, var(--wb-border) 70%, transparent); border-radius: var(--wb-radius-md); background: color-mix(in srgb, var(--wb-surface-2) 46%, transparent); } [data-quiztem-updates-check] .wb-list-item-sub { margin-block-start: 0.125rem; }
@media (max-width: 72rem) {
    .wb-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    [data-exam-layout] { grid-template-columns: 1fr; }
    [data-quiztem-updates-hero], [data-quiztem-updates-card="details"], [data-quiztem-updates-release-meta] { grid-template-columns: 1fr; }
}
@media (max-width: 42rem) {
    .wb-grid-4 { grid-template-columns: 1fr; }
    [data-quiztem-updates-hero] { padding: var(--wb-s4); }
    [data-quiztem-updates-hero-main], [data-quiztem-updates-safety-card], [data-quiztem-updates-check] { grid-template-columns: 1fr; }
    [data-quiztem-updates-check] .wb-status-pill { justify-self: start; }
    [data-student-exams-table] { overflow-x: visible; }
    [data-student-exams-table] table, [data-student-exams-table] tbody, [data-student-exams-table] tr, [data-student-exams-table] td { display: block; inline-size: 100%; }
    [data-student-exams-table] thead { display: none; }
    [data-student-exams-table] tbody { display: grid; gap: var(--wb-s3); }
    [data-student-exams-table] tr { padding: var(--wb-s3); border: 1px solid var(--wb-border, #d8dee8); border-radius: var(--wb-radius-md); background: var(--wb-surface, #fff); }
    [data-student-exams-table] td { padding: var(--wb-s2) 0; border-block-start: 1px solid color-mix(in srgb, var(--wb-border, #d8dee8) 70%, transparent); white-space: normal; }
    [data-student-exams-table] td:first-child { padding-block-start: 0; border-block-start: 0; }
    [data-student-exams-table] td::before { content: attr(data-label); display: block; margin-block-end: 0.25rem; color: var(--wb-text-muted, #64748b); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; }
    [data-student-exams-table] .wb-table-actions { text-align: left; }
    [data-student-exams-table] .wb-table-actions .wb-action-group { flex-wrap: wrap; }
}