/* ------------------------------------------------------------
   quota.css — badge de formule, carte de quota, jauge (lot 01)
   Référence : handoffs/01-composants/screenshots/05-quota.png
   ------------------------------------------------------------ */

.plan-badge {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 14px;
  border-radius: var(--r-pill);
  background: var(--surface);
  box-shadow: 0 0 0 1px var(--line);
  color: var(--ink);
  font-size: 13px;
  font-weight: 600;
}
.plan-badge--active {
  background: var(--tint);
  box-shadow: none;
}
.plan-badge--full {
  background: var(--error-bg);
  color: var(--error);
  box-shadow: none;
}

.quota-card {
  background: var(--surface);
  border-radius: var(--r-xl);
  box-shadow: 0 0 0 1px var(--line);
  padding: var(--sp-4);
  display: grid;
  gap: var(--sp-2);
}
.quota-card h3 {
  font-family: var(--font-display);
  font-size: 19px;
}
.quota-card__label { font-size: 13px; color: var(--muted); }
.quota-card__count { font-size: 15px; }
.quota-card__count b { font-weight: 600; }

.quota-gauge {
  height: 6px;
  border-radius: var(--r-pill);
  background: var(--surface-2);
  overflow: hidden;
}
.quota-gauge__fill {
  height: 100%;
  background: var(--accent);
  border-radius: inherit;
}

.quota-card__help { font-size: 13px; color: var(--muted); }

/* Quota atteint : contour d'erreur, pas de fond. */
.quota-card--full {
  box-shadow: inset 0 0 0 1.5px var(--error);
}
.quota-card--full .quota-card__icon { color: var(--error); }
.quota-card--full h3 { color: var(--error); }

.quota-card__external-note {
  font-size: 12px;
  color: var(--muted);
}

.quota-card__head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-2); }

/* ---------- Outils de la formule (lot 06) ---------- */
.plan-tools { list-style: none; margin: 0; padding: 0; }
.plan-tools__item {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  min-height: 52px;
  padding: var(--sp-2) 0;
  border-bottom: 1px solid var(--line);
  font-size: 15px;
  color: var(--ink);
  font-weight: 600;
}
.plan-tools__item:last-child { border-bottom: 0; }
.plan-tools__item .icon:first-child { width: 20px; height: 20px; flex: none; }
.plan-tools__item > span:nth-child(2) { flex: 1; }
.plan-tools__check {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--accent);
  color: var(--on-accent);
  display: grid;
  place-items: center;
  flex: none;
}
.plan-tools__check .icon { width: 14px; height: 14px; }
.plan-tools__badge {
  height: 22px;
  padding: 0 10px;
  border-radius: var(--r-pill);
  box-shadow: inset 0 0 0 1px var(--line);
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  flex: none;
}
.plan-tools__item--soon { color: var(--muted); font-weight: 500; }
.plan-tools__item--soon .icon:first-child { color: var(--muted); }

.plan-note { font-size: 12px; color: var(--muted); text-align: center; }