/* EdukaTest design system tokens. Loaded last so it wins over Tabler (CDN)
   and vendored Bootstrap without needing !important. */
:root {
  --eduka-primary: #1a56db;
  --eduka-primary-rgb: 26, 86, 219;
  --eduka-primary-dark: #1e3a8a;
  --eduka-primary-dark-rgb: 30, 58, 138;
  --eduka-ink: #0f1c3f;
  --eduka-gold: #ffd43b;

  /* Vendored Bootstrap reads --bs-primary*; Tabler reads --tblr-primary*.
     Both need the override, independently of Bootstrap/Tabler load order. */
  --bs-primary: var(--eduka-primary);
  --bs-primary-rgb: 26, 86, 219;
  --tblr-primary: var(--eduka-primary);
  --tblr-primary-rgb: 26, 86, 219;
}

/* DataTables padding fix — shared across every admin table (id="xxxTable").
   .card-table is deliberately edge-to-edge inside its card, but DataTables'
   own controls (search, length, info, pagination) are not table cells and
   stick to the card edges without this. Applies to any table whose id ends
   in "Table" so new admin tables get it automatically. */
[id$="Table_wrapper"] { padding: 1rem 1.25rem; }
[id$="Table_wrapper"] .row:first-child { margin-bottom: .75rem; }
[id$="Table_wrapper"] .row:last-child { margin-top: .75rem; }
table[id$="Table"] > thead > tr > th,
table[id$="Table"] > tbody > tr > td { padding: .75rem 1rem; }

/* take_exam.php answer options: cursor:pointer with no hover feedback today
   (class referenced but never defined anywhere in the codebase). */
.hover-bg-light:hover { background-color: var(--tblr-bg-surface-secondary, #f4f6fa); }

/* ── Score/progress ring — signature component ──
   Circular score indicator with the brand's graduation-cap glyph at its
   center. Replaces plain .progress bars / bare percentages wherever a
   result (quiz, exam, dashboard stat) is shown. Rendered via
   usersc/views/_partials/progress_ring.php, animated by progress-ring.js. */
.eduka-progress-ring {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--eduka-ring-size, 96px);
  height: var(--eduka-ring-size, 96px);
  flex-shrink: 0;
}
.eduka-progress-ring svg {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}
.eduka-progress-ring__track {
  fill: none;
  stroke: var(--tblr-border-color, #e6e8ec);
  stroke-width: 8;
}
.eduka-progress-ring__fill {
  fill: none;
  stroke: var(--eduka-ring-color, var(--eduka-primary));
  stroke-width: 8;
  stroke-linecap: round;
  stroke-dasharray: 263.9;
  stroke-dashoffset: 263.9;
  transition: stroke-dashoffset .6s ease;
}
.eduka-progress-ring__center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1.1;
  text-align: center;
}
.eduka-progress-ring__glyph {
  font-size: .8rem;
  color: var(--eduka-ring-color, var(--eduka-primary));
  opacity: .7;
  margin-bottom: 3px;
}
.eduka-progress-ring__value {
  font-family: 'Lexend', 'Inter', sans-serif;
  font-weight: 600;
  font-size: 1.05rem;
  color: var(--eduka-ink);
}
.eduka-progress-ring--sm { --eduka-ring-size: 56px; }
.eduka-progress-ring--sm .eduka-progress-ring__glyph { display: none; }
.eduka-progress-ring--sm .eduka-progress-ring__value { font-size: .8rem; }

/* ── Display type (Lexend) — headlines/hero/signature moments only, never
   applied wholesale (Inter remains the body/UI face). ── */
.eduka-display {
  font-family: 'Lexend', 'Inter', sans-serif;
}