:root{
  --qz-g900:#0b5d2a; --qz-g800:#0e6e33; --qz-g700:#107a38; --qz-g600:#138a40; --qz-g400:#22c55e;
  --qz-amber:#f59e0b; --qz-amber-dark:#d97706; --qz-amber-darker:#b45309;
  --qz-red:#b91c1c; --qz-red-dark:#991b1b; --qz-red-darker:#7f1d1d;
}

html, body{
  min-height: 100%;
  background: radial-gradient(1200px 600px at 20% -10%, var(--qz-g600), transparent 60%),
              radial-gradient(1200px 600px at 120% 20%, var(--qz-g700), transparent 55%),
              linear-gradient(180deg, var(--qz-g700), var(--qz-g900));
  color: #eafbea;
}

/* Container spacing and headings */
.container{ max-width: 960px; }
h1, h3{ text-shadow: 0 2px 8px rgba(0,0,0,0.3); }

/* Steps */
.step{ display: none; }
.step.active{ display: block; }

/* Cards adapted to green theme */
.card{
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.02)), var(--qz-g800);
  border: 1px solid rgba(255,255,255,0.14);
  color: #f0fff4;
  box-shadow: 0 8px 24px rgba(0,0,0,0.25);
}
.card-title{ color:#fff; }

/* Inputs and selects on dark background */
.form-control, .form-select{
  background-color: rgba(0,0,0,0.15);
  border-color: rgba(255,255,255,0.25);
  color: #f0fff4;
}
.form-control::placeholder{ color: rgba(255,255,255,0.7); }
.form-control:focus, .form-select:focus{
  border-color: var(--qz-g400);
  box-shadow: 0 0 0 .2rem rgba(34,197,94,.25);
}
.form-select option{
  background-color: var(--qz-g800);
  color: #f0fff4;
}
.form-select option:checked,
.form-select option:hover{
  background-color: var(--qz-g600);
  color: #ffffff;
}

/* (reverted) keep native dropdown rendering for better OS contrast */

/* List options */
.list-group-item{
  cursor: pointer;
  background: rgba(0,0,0,0.12);
  color: #eafbea;
  border: 1px solid rgba(255,255,255,0.12);
}
.list-group-item:hover{
  background: rgba(13,110,253,0.12);
  border-color: rgba(13,110,253,0.25);
}

/* Answer feedback */
.list-group-item.answer-correct{
  background: #e7f7ea; /* light mint for high contrast */
  color: #14532d;      /* deep green text */
  border-color: rgba(34,197,94,0.45);
  font-weight: 700;
}
.list-group-item.answer-wrong{
  color: #ef4444; /* vivid red text */
  border-color: rgba(239,68,68,0.45);
  font-weight: 700;
}
.list-group-item.disabled{ opacity: .7; pointer-events: none; }

/* Helper texts */
.text-muted{ color:#ffe08a !important; }

/* Primary green button matching others */
.btn-verde{
  background-color: var(--qz-g600) !important;
  border-color: var(--qz-g600) !important;
  color: #ffffff !important;
}
.btn-verde:hover, .btn-verde:focus{
  background-color: var(--qz-g700) !important;
  border-color: var(--qz-g700) !important;
}

/* Secondary action examples (if used) */
.btn-amber{ background-color: var(--qz-amber); border-color: var(--qz-amber-dark); color:#111827; }
.btn-amber:hover, .btn-amber:focus{ background: var(--qz-amber-dark); border-color: var(--qz-amber-darker); color:#fff; }
.btn-danger-strong{ background: var(--qz-red); border-color: var(--qz-red-dark); color:#fff; }
.btn-danger-strong:hover, .btn-danger-strong:focus{ background: var(--qz-red-dark); border-color: var(--qz-red-darker); }