/* Outil · Nettoyer un lien (Link cleaner) : seulement ce qui lui est propre (le reste vient de app/kit.css).
   Préfixe des classes : nl-
   Deux colonnes : à gauche le résultat (cadre de hauteur fixe qui défile : chaque lien propre en mono, ce qui a été retiré
   dessous ; toucher un lien le copie), une ligne d'info (2 lignes fixes), Copier et Ouvrir le lien ; à droite la saisie
   (hauteur fixe), Coller et Effacer, les options. Au téléphone, la saisie remonte en premier (order). */
.nl .outil-fixe { align-items: stretch; }
.nl-resultat { flex: none; height: 300px; overflow-y: auto; overscroll-behavior: contain; padding: 8px; border-radius: 14px;
  background: rgba(242, 240, 235, .025); box-shadow: inset 0 0 0 1px var(--filet-doux); display: flex; flex-direction: column; gap: 4px; }
.nl-resultat.nl-vide { justify-content: center; align-items: center; }
.nl-attente { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.nl-attente svg.grand { width: 36px; height: 36px; fill: none; stroke: var(--texte2); stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.nl-attente p { margin: 0; font: var(--valeur); letter-spacing: .06em; color: var(--texte2); }

/* Un lien : propre en blanc, les notes dessous en petit */
.nl-lien { flex: none; padding: 10px 12px; border-radius: 10px; cursor: copy; transition: background .2s var(--courbe); }
.nl-lien:hover { background: rgba(242, 240, 235, .05); }
.nl-lien b { display: block; font: 500 13.5px/1.45 var(--mono); letter-spacing: .01em; color: var(--papier); overflow-wrap: anywhere; }
.nl-notes { display: flex; flex-wrap: wrap; gap: 2px 12px; margin-top: 5px; font: 400 11.5px/1.4 var(--mono); letter-spacing: .02em; color: var(--texte2); }
.nl-notes span { overflow-wrap: anywhere; }
.nl-retire { opacity: .75; }
.nl-court { color: var(--orange); }

.nl-info { flex: none; height: 2lh; margin: 0; overflow: hidden; }
.nl-actions, .nl-boutons { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.nl-boutons { justify-content: flex-start; gap: 8px; }
.nl-actions .pastille, .nl-boutons .pastille { cursor: pointer; }
.nl-actions .pastille:hover, .nl-boutons .pastille:hover { translate: none; }
.nl-actions .pastille:disabled, .nl-boutons .pastille:disabled { opacity: .3; cursor: default; }

.nl-saisie { display: flex; flex-direction: column; gap: 10px; }
.nl .nl-zone { height: 140px; min-height: 140px; resize: none; font: 400 13.5px/1.45 var(--mono); overflow-wrap: anywhere; }
.nl-options { display: flex; flex-direction: column; gap: 6px; }
.nl-options .groupe { margin-bottom: 4px; }

/* Téléphone : la saisie d'abord, puis le résultat, puis les options */
@media (max-width: 959px) {
  .nl-saisie { order: -1; }
  .nl-resultat { height: 240px; }
}
