/* ── Search — clear button ── */
.search-bar-wrap .verb-input { padding-right: 44px; }
.search-clear {
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  width: 28px; height: 28px; border: none; background: none; cursor: pointer;
  color: var(--text-ghost); display: none; align-items: center; justify-content: center;
  border-radius: 50%; transition: color var(--trans-fast), background var(--trans-fast);
}
.search-clear:hover { color: var(--accent); background: var(--bg-input); }
.search-clear.visible { display: flex; }

/* ── Result cards ── */
.results-count {
  font-family: var(--font-mono); font-size: .72rem;
  color: var(--text-ghost); margin-bottom: var(--space-4);
}
.results-count strong { color: var(--accent); }

.results-list { display: flex; flex-direction: column; gap: var(--space-4); }
.result-card {
  background: var(--bg-panel); border: 1px solid var(--border);
  border-radius: var(--radius-md); padding: var(--space-5);
  transition: border-color var(--trans-fast), transform var(--trans-fast), box-shadow var(--trans-fast);
  animation: fadeUp .18s ease both;
}
.result-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: var(--ink-ghost); }
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.result-head {
  display: flex; align-items: center; gap: var(--space-3);
  margin-bottom: var(--space-4);
}
.result-word {
  font-family: var(--font-display); font-size: 1.5rem; font-weight: 600;
  font-style: italic; color: var(--accent); line-height: 1;
}
.pos-badge {
  font-family: var(--font-mono); font-size: .6rem; letter-spacing: .08em;
  text-transform: uppercase; padding: 2px 8px; border: 1px solid var(--border);
  border-radius: var(--radius-sm); font-weight: 500; flex-shrink: 0;
  color: var(--text-muted); background: var(--bg-panel);
}
.pos-verbe    { border-color: var(--bleu);   color: var(--bleu);   background: rgba(44,95,138,.08); }
.pos-adjectif { border-color: var(--vert);   color: var(--vert);   background: rgba(45,138,95,.08); }
.pos-nom      { border-color: var(--or);     color: var(--or);     background: rgba(201,168,76,.08); }
.pos-adverbe  { border-color: var(--accent); color: var(--accent); background: rgba(192,57,43,.08); }

.result-section-label {
  font-family: var(--font-mono); font-size: .6rem; letter-spacing: .1em;
  text-transform: uppercase; color: var(--text-ghost);
  margin-bottom: var(--space-3); display: block;
}

/* Synonym chips */
.syn-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: var(--space-5); }
.syn-chip {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--font-display); font-size: .88rem; font-style: italic;
  padding: 6px 12px; border: 1px solid var(--border); border-radius: 20px;
  background: var(--bg); color: var(--text-soft); cursor: pointer;
  transition: all var(--trans-fast);
}
.syn-chip:hover { border-color: var(--accent); color: var(--accent); background: rgba(192,57,43,.05); }
.syn-chip .copy-icon { opacity: 0; color: var(--text-ghost); transition: opacity var(--trans-fast); flex-shrink: 0; }
.syn-chip:hover .copy-icon { opacity: 1; }
.syn-chip.copied { border-color: var(--success); color: var(--success); background: rgba(45,138,95,.08); }

/* Examples */
.examples-list { display: flex; flex-direction: column; gap: var(--space-2); }
.example-item {
  font-family: var(--font-body); font-size: .9rem; color: var(--text-muted);
  line-height: 1.7; padding-left: var(--space-4); border-left: 2px solid var(--border);
  font-style: italic;
}

@media (max-width: 640px) {
  .result-word { font-size: 1.25rem; }
}
