/* andreihorciu.ro — testele de profil. Completează site.css; culorile vin doar din tokens.css (și transparențe ale lor). */

.quiz { scroll-margin-top: 88px; }
.quiz [hidden] { display: none !important; } /* .btn are display:inline-flex, care altfel ar anula atributul hidden */
.quiz-intro p { font-size: 1.04rem; }
.quiz-intro-actions { margin: 1.6em 0 0; }
.quiz-status { margin: 1em 0 0; color: var(--brand-text-muted); }
.quiz-status:empty { margin: 0; }
.quiz-question:focus, .quiz-result-title:focus { outline: none; }
.icon-flip { transform: scaleX(-1); }
.quiz .disclaimer { margin: 26px 0 0; padding-top: 16px; border-top: 1px solid var(--brand-border); }
.quiz noscript .note { margin: 1.4em 0 0; }

/* ---------- Progres ---------- */
.quiz-progress { margin-bottom: 22px; }
.quiz-progress-label { margin: 0 0 8px; font-size: .9rem; color: var(--brand-text-muted); }
.quiz-progress-label strong { font-family: var(--font-display); font-weight: 600; color: var(--brand-primary); }
.quiz-progress-bar { height: 8px; border-radius: var(--r-pill); background: var(--brand-bg-alt); border: 1px solid var(--brand-border); overflow: hidden; }
.quiz-progress-fill { height: 100%; border-radius: inherit; background: linear-gradient(90deg, #A8D8F0 0%, #3B8CB8 55%, #0E5B94 100%); transition: width var(--t-base); }

/* ---------- Întrebare și variante ---------- */
.quiz-fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.quiz-legend { display: block; width: 100%; padding: 0; margin: 0 0 18px; }
.quiz .quiz-question { margin: 0; font-size: clamp(1.15rem, 1.02rem + .55vw, 1.42rem); font-weight: 600; line-height: 1.35; }
.quiz-question-line { display: block; }
.quiz-question-line + .quiz-question-line { margin-top: .4em; font-family: var(--font-body); font-size: .8em; font-weight: 500; color: var(--brand-text-muted); }
.quiz-figure { margin: 0 0 18px; border-radius: var(--r-md); border: 1px solid var(--brand-border); }

.quiz-options { display: grid; gap: 10px; }
.quiz-option {
  display: flex; align-items: flex-start; gap: 14px; min-height: 56px; padding: 15px 18px;
  border: 1.5px solid var(--brand-border); border-radius: var(--r-lg); background: #fff;
  cursor: pointer; line-height: 1.5;
  transition: border-color var(--t-fast), background-color var(--t-fast), box-shadow var(--t-fast);
}
.quiz-option:hover { border-color: var(--brand-accent-light); background: var(--brand-bg-alt); }
.quiz-option input {
  -webkit-appearance: none; appearance: none; flex: none; display: grid; place-content: center;
  width: 22px; height: 22px; margin: 1px 0 0; border: 2px solid rgba(14, 91, 148, .35); border-radius: 50%;
  background: #fff; cursor: pointer; transition: border-color var(--t-fast);
}
.quiz-option input::before {
  content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--brand-primary);
  transform: scale(0); transition: transform var(--t-fast);
}
.quiz-option input:checked { border-color: var(--brand-primary); }
.quiz-option input:checked::before { transform: scale(1); }
.quiz-option input:focus-visible { outline: 3px solid var(--brand-secondary); outline-offset: 3px; }
.quiz-option.is-checked { border-color: var(--brand-primary); background: rgba(168, 216, 240, .18); box-shadow: 0 0 0 3px rgba(59, 140, 184, .15); }
.quiz-option-text { flex: 1; min-width: 0; overflow-wrap: break-word; }
.quiz-option-text .quiz-figure { margin: 10px 0 0; }

.quiz-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 26px; }
.quiz .btn-primary[disabled], .quiz .btn-primary[disabled]:hover {
  opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; background: var(--gradient-signature);
}

/* ---------- Rezultat ---------- */
.quiz-result .eyebrow { margin-bottom: .5rem; }
.quiz .quiz-result-title { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem); margin-bottom: 18px; }
.quiz-result-name { color: var(--brand-primary); }
.quiz-result h3 { margin: 30px 0 12px; font-size: 1.15rem; }
.stat-note { display: block; margin-top: 3px; font-size: .8rem; color: var(--brand-text-muted); }
.stat--hero .stat-note { color: rgba(255, 255, 255, .88); }
.quiz-desc { font-size: 1.02rem; }
.quiz-desc p:last-child { margin-bottom: 0; }
.quiz-desc-lead { margin-bottom: .4em; }
.quiz-desc ul { margin: 0 0 1em; padding-left: 1.2em; }
.quiz-desc li { margin-bottom: .35em; }
.quiz-desc li::marker { color: var(--brand-secondary); }
.quiz-result .note { margin: 22px 0 0; }
.quiz-result .note > div > p + p { margin-top: .7em; }

/* Scala: segmente proporționale cu intervalul de puncte al fiecărui profil, marcaj la scorul obținut */
.quiz-scale { position: relative; padding-top: 40px; }
.quiz-scale-track { display: flex; gap: 3px; height: 16px; }
.quiz-scale-seg { min-width: 4px; border-radius: 4px; }
.quiz-scale-seg:first-child { border-radius: var(--r-pill) 4px 4px var(--r-pill); }
.quiz-scale-seg:last-child { border-radius: 4px var(--r-pill) var(--r-pill) 4px; }
.quiz-scale-seg.is-active { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--brand-primary-dark); }
.quiz-scale-bubble {
  position: absolute; top: 0; transform: translateX(-50%);
  padding: 5px 9px; border-radius: 8px; background: var(--brand-primary-dark); color: #fff;
  font-family: var(--font-display); font-size: .85rem; font-weight: 700; line-height: 1.1; white-space: nowrap;
}
.quiz-scale-pin { position: absolute; top: 24px; width: 2px; height: 38px; margin-left: -1px; border-radius: 2px; background: var(--brand-primary-dark); }
.quiz-scale-ends { display: flex; justify-content: space-between; margin-top: 8px; font-size: .8rem; color: var(--brand-text-muted); font-variant-numeric: tabular-nums; }
.quiz-scale-legend { list-style: none; display: grid; gap: 4px; margin: 14px 0 0; padding: 0; }
.quiz-scale-item {
  display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; align-items: center; gap: 12px;
  padding: 8px 12px; border: 1px solid transparent; border-radius: var(--r-md);
}
.quiz-scale-item.is-active { border-color: var(--brand-accent-light); background: rgba(168, 216, 240, .18); }
.quiz-swatch { width: 14px; height: 14px; border-radius: 4px; }
.quiz-scale-name { font-weight: 500; }
.quiz-scale-item.is-active .quiz-scale-name { font-weight: 700; color: var(--brand-primary); }
.quiz-scale-name .tag { margin: 0 0 0 8px; vertical-align: 1px; }
.quiz-scale-range { font-size: .88rem; color: var(--brand-text-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }

.quiz-result-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.quiz-cta { margin-top: 28px; padding: 32px 30px; }
.quiz-cta h2 { font-size: 1.4rem; }

/* ---------- Coloana laterală ---------- */
.quiz-facts { list-style: none; display: grid; gap: 14px; margin: 0; padding: 0; }
.quiz-facts li { display: flex; align-items: flex-start; gap: 10px; font-size: .95rem; line-height: 1.5; }
.quiz-facts .icon { margin-top: 2px; color: var(--brand-secondary); }

@media (max-width: 600px) {
  .quiz.panel { padding: 20px 16px; }
  .quiz-option { padding: 14px 14px; gap: 12px; }
  .quiz-nav .btn { flex: 1 1 0; padding-inline: 1em; }
  .quiz-cta { padding: 24px 18px; }
  .quiz-scale-item { gap: 10px; padding: 8px 10px; }
  .quiz-scale-name .tag { display: table; margin: 4px 0 0; }
}

@media (prefers-reduced-motion: reduce) {
  .quiz-progress-fill, .quiz-option, .quiz-option input, .quiz-option input::before { transition: none; }
}

@media print {
  .quiz-scale-seg, .quiz-swatch, .quiz-scale-bubble, .quiz-scale-pin, .stat--hero { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}