/* Oqora CRM · styles du lot P : pipeline (.s-pipe), contacts (.s-contacts), fiche et panneaux d'action (.s-fiche),
   panneau « Résultat de l'appel » (.s-appel). Toutes les règles sont préfixées par la classe racine de leur section ;
   seule crm.css (lot 0) définit des jetons :root et des règles globales (contrat H.2). Téléphone (< 900 px) : une colonne,
   boutons de 44 px de haut, aucune barre de défilement horizontale de la page. */

/* ---------------------------------------------------------------- Pipeline : barre, vues, sélecteur */
.s-pipe{ display:block; min-width:0; }
.s-pipe .sp{ display:flex; flex-direction:column; gap:var(--sp-4); min-width:0; }
.s-pipe .sp-barre{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-3); }
.s-pipe .sp-vues{ display:flex; flex-wrap:wrap; gap:var(--sp-2); }
.s-pipe .sp-vues .num{ opacity:.75; margin-left:2px; }
.s-pipe .sp-chercher{ flex:1 1 220px; max-width:360px; }
.s-pipe .sp-selecteur{ display:none; }
.s-pipe .sf-etiquette{ display:block; font-size:var(--fs-xs); font-weight:700; color:var(--ink-faint); margin-bottom:4px; }

/* ---------------------------------------------------------------- Pipeline : kanban */
.s-pipe .sp-colonnes{ display:flex; gap:var(--sp-3); overflow-x:auto; padding-bottom:var(--sp-3); align-items:flex-start;
  scroll-snap-type:x proximity; }
.s-pipe .sp-colonne{ flex:0 0 264px; background:var(--bande); border-radius:var(--r-md); padding:var(--sp-3);
  display:flex; flex-direction:column; gap:var(--sp-2); min-height:120px; scroll-snap-align:start;
  box-shadow:inset 0 0 0 1px var(--rule-soft); transition:box-shadow .15s var(--ease); }
.s-pipe .sp-colonne--cible{ box-shadow:inset 0 0 0 2px var(--bleu); background:var(--bleu-tint); }
.s-pipe .sp-colonne-tete{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-2); }
.s-pipe .sp-colonne-tete h3{ font-size:var(--fs-sm); font-weight:750; }
.s-pipe .sp-total{ font-size:var(--fs-xs); font-weight:750; color:var(--ink-soft); background:var(--surface);
  border-radius:var(--r-full); padding:2px 9px; box-shadow:inset 0 0 0 1px var(--rule); }
.s-pipe .sp-anciens{ border:0; background:transparent; color:var(--bleu); font-weight:650; font-size:var(--fs-sm);
  text-align:left; cursor:pointer; padding:6px 0; min-height:32px; }
.s-pipe .sp-anciens:hover{ text-decoration:underline; }
.s-pipe .sp-cartes{ display:flex; flex-direction:column; gap:var(--sp-2); }
.s-pipe .sp-vide{ font-size:var(--fs-sm); padding:var(--sp-2) 0; }
.s-pipe .sp-carte{ background:var(--surface); border-radius:var(--r-sm); padding:var(--sp-3); box-shadow:var(--sh-1);
  display:flex; flex-direction:column; gap:6px; cursor:pointer; outline:none; min-width:0; }
.s-pipe .sp-carte:hover, .s-pipe .sp-carte:focus-visible{ box-shadow:inset 0 0 0 1px var(--bleu), var(--sh-1); }
.s-pipe .sp-carte--ancien{ opacity:.85; }
.s-pipe .sp-carte--glissee{ opacity:.45; }
.s-pipe .sp-nom{ font-weight:750; overflow-wrap:anywhere; }
.s-pipe .sp-meta{ font-size:var(--fs-xs); display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.s-pipe .sp-prochaine{ font-size:var(--fs-sm); color:var(--ink-soft); display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.s-pipe .sp-valeur{ font-weight:700; color:var(--vert); font-size:var(--fs-sm); }
.s-pipe .sp-actions{ display:flex; flex-wrap:wrap; gap:4px; margin-top:4px; }
.s-pipe .sp-actions .btn{ min-height:32px; padding:0 10px; font-size:var(--fs-xs); }

/* ---------------------------------------------------------------- Contacts */
.s-contacts{ display:block; min-width:0; }
.s-contacts .sc{ display:flex; flex-direction:column; gap:var(--sp-4); }
.s-contacts .sc-barre{ display:flex; flex-wrap:wrap; gap:var(--sp-3); align-items:center; }
.s-contacts .sc-chercher{ flex:1 1 260px; }
.s-contacts .sc-filtres{ display:flex; flex-wrap:wrap; gap:var(--sp-2); }
.s-contacts .sc-nombre{ font-size:var(--fs-sm); }
.s-contacts .sc-liste{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--sp-2); }
.s-contacts .sc-bouton{ width:100%; text-align:left; border:0; background:var(--surface); border-radius:var(--r-sm);
  padding:var(--sp-3) var(--sp-4); box-shadow:var(--sh-1); cursor:pointer; display:grid; gap:2px 12px;
  grid-template-columns:minmax(0, 1.4fr) minmax(0, 1fr) auto; align-items:center; min-height:var(--tap); color:var(--ink); }
.s-contacts .sc-bouton:hover{ box-shadow:inset 0 0 0 1px var(--bleu), var(--sh-1); }
.s-contacts .sc-nom{ font-weight:700; overflow-wrap:anywhere; }
.s-contacts .sc-details, .s-contacts .sc-activite{ font-size:var(--fs-xs); }
.s-contacts .sc-meta{ font-size:var(--fs-sm); display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.s-contacts .sc-activite{ text-align:right; }
.s-contacts .sf-actions{ display:flex; }
.s-contacts .sf-etiquette{ display:block; font-size:var(--fs-xs); font-weight:700; color:var(--ink-faint); }

/* ---------------------------------------------------------------- Fiche contact et panneaux d'action */
.s-fiche{ display:block; min-width:0; }
.s-fiche .sf{ display:flex; flex-direction:column; gap:var(--sp-3); }
.s-fiche .sf-bloc{ background:var(--surface); border-radius:var(--r-md); padding:var(--sp-4); box-shadow:var(--sh-1);
  display:flex; flex-direction:column; gap:var(--sp-2); min-width:0; }
.s-fiche .sf-titre{ font-size:var(--fs-sm); font-weight:750; letter-spacing:.01em; color:var(--ink-soft); }
.s-fiche .sf-nom{ font-size:var(--fs-xl); font-weight:800; overflow-wrap:anywhere; }
.s-fiche .sf-pied{ font-size:var(--fs-sm); }
.s-fiche .sf-relies{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.s-fiche .sf-relies li{ display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; }
.s-fiche .sf-lien{ border:0; background:transparent; color:var(--bleu); font-weight:650; cursor:pointer; padding:4px 0;
  text-align:left; min-height:32px; }
.s-fiche .sf-lien:hover{ text-decoration:underline; }
.s-fiche .sf-dl{ margin:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:var(--sp-2) var(--sp-4); }
.s-fiche .sf-dl dt{ font-size:var(--fs-xs); color:var(--ink-faint); font-weight:650; }
.s-fiche .sf-dl dd{ margin:0; font-weight:600; overflow-wrap:anywhere; }
.s-fiche .sf-ligne{ display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; overflow-wrap:anywhere; }
.s-fiche .sf-tel{ font-size:var(--fs-lg); font-weight:750; font-variant-numeric:tabular-nums; }
.s-fiche .sf-boutons, .s-fiche .sf-actions-ligne{ display:flex; flex-wrap:wrap; gap:var(--sp-2); }
.s-fiche .sf-liste{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.s-fiche .sf-tache, .s-fiche .sf-prevu{ display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; overflow-wrap:anywhere; }
.s-fiche .sf-ancien{ display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; margin-top:var(--sp-2); }
.s-fiche .sf-chrono{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.s-fiche .sf-evt{ padding:var(--sp-2) 0; border-top:1px solid var(--rule-soft); display:flex; flex-direction:column; gap:2px; }
.s-fiche .sf-evt:first-child{ border-top:0; }
.s-fiche .sf-evt-tete{ display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; font-size:var(--fs-sm); }
.s-fiche .sf-evt-quand{ margin-left:auto; font-size:var(--fs-xs); }
.s-fiche .sf-evt-texte{ font-size:var(--fs-sm); color:var(--ink-soft); white-space:pre-line; overflow-wrap:anywhere; }
.s-fiche .sf-evt audio{ width:100%; margin-top:4px; }
.s-fiche .sf-aide{ font-size:var(--fs-sm); }
.s-fiche .sf-chargement{ padding:var(--sp-4) 0; }
.s-fiche .sf-champ{ display:block; flex:1 1 160px; min-width:0; }
.s-fiche .sf-etiquette{ display:block; font-size:var(--fs-xs); font-weight:700; color:var(--ink-faint); margin-bottom:4px; }
.s-fiche .sf-rangee{ display:flex; gap:var(--sp-3); flex-wrap:wrap; }
.s-fiche .sf-case{ display:flex; align-items:center; gap:var(--sp-2); min-height:var(--tap); cursor:pointer; }
.s-fiche .sf-case input{ width:20px; height:20px; flex:none; }
.s-fiche .sf-texte{ min-height:120px; resize:vertical; }
.s-fiche .sf-etapes{ display:flex; flex-direction:column; gap:6px; }
.s-fiche .sf-etape[aria-pressed="true"]{ background:var(--bleu); color:#fff; box-shadow:var(--sh-bleu); }
/* Bouton à cadenas (droit du jeton manquant, F.4, arbitrage C1) : gris, mais cliquable (le clic explique). */
.s-fiche .btn[data-droit], .s-appel .btn[data-droit]{ opacity:.6; box-shadow:none; }
.s-fiche .sf-sous-titre{ font-weight:700; margin:var(--sp-2) 0; }
.s-fiche .sf-date{ display:flex; flex-direction:column; gap:var(--sp-2); }
.s-fiche .sf-actions{ display:flex; gap:var(--sp-2); margin-top:var(--sp-3); }
.s-fiche .sf-apercu{ margin-top:var(--sp-3); }
.s-fiche.sf-panneau{ display:flex; flex-direction:column; gap:var(--sp-3); }

/* ---------------------------------------------------------------- Panneau « Résultat de l'appel » */
.s-appel{ display:flex; flex-direction:column; gap:var(--sp-3); min-width:0; }
.s-appel .sa-tete{ background:var(--bande); border-radius:var(--r-md); padding:var(--sp-4); display:flex; flex-direction:column;
  gap:6px; align-items:flex-start; }
.s-appel .sa-numero{ font-size:var(--fs-2xl); font-weight:800; letter-spacing:.02em; font-variant-numeric:tabular-nums; }
.s-appel .sa-cherche{ font-weight:650; }
.s-appel .sa-tentative{ font-size:var(--fs-sm); color:var(--ink-soft); }
.s-appel .sa-centre{ font-size:var(--fs-sm); }
.s-appel .sa-fermee{ background:var(--ambre-tint); color:var(--ambre); border-radius:var(--r-md); padding:var(--sp-3);
  display:flex; flex-direction:column; gap:var(--sp-2); font-weight:650; }
.s-appel .sf-rangee{ display:flex; gap:var(--sp-2); flex-wrap:wrap; }
.s-appel .sa-question{ font-weight:750; }
.s-appel .sa-choix-liste{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:var(--sp-2); }
.s-appel .sa-choix{ display:flex; flex-direction:column; gap:4px; }
.s-appel .sa-consequence{ font-size:var(--fs-xs); line-height:1.35; }
.s-appel .sa-petit{ font-size:var(--fs-sm); }
.s-appel .sf-lien{ border:0; background:transparent; color:var(--ink-soft); cursor:pointer; padding:4px 0; min-height:32px;
  text-decoration:underline; }
.s-appel .sa-suite{ display:flex; flex-direction:column; gap:var(--sp-2); }
.s-appel .sa-jour-titre{ font-weight:700; font-size:var(--fs-sm); margin-top:var(--sp-2); }
.s-appel .sa-creneaux{ display:flex; flex-wrap:wrap; gap:6px; }
.s-appel .sf-champ{ display:block; flex:1 1 140px; min-width:0; }
.s-appel .sf-etiquette{ display:block; font-size:var(--fs-xs); font-weight:700; color:var(--ink-faint); margin-bottom:4px; }
.s-appel .sf-case{ display:flex; align-items:center; gap:var(--sp-2); min-height:var(--tap); cursor:pointer; }
.s-appel .sf-case input{ width:20px; height:20px; flex:none; }
.s-appel .sf-sous-titre{ font-weight:700; }
.s-appel .sf-actions{ display:flex; gap:var(--sp-2); }
.s-appel .sf-apercu{ margin-top:var(--sp-2); }

/* ---------------------------------------------------------------- Téléphone */
@media (max-width: 899px){
  .s-pipe .sp-selecteur{ display:block; }
  .s-pipe .sp-colonnes{ display:block; overflow:visible; }
  .s-pipe .sp-colonne{ display:none; }
  .s-pipe .sp-colonne[data-visible="oui"]{ display:flex; }
  .s-pipe .sp-chercher{ max-width:none; }
  .s-pipe .btn, .s-contacts .btn, .s-fiche .btn, .s-appel .btn{ min-height:var(--tap); }
  .s-pipe .sp-actions .btn{ min-height:var(--tap); font-size:var(--fs-sm); padding:0 12px; }
  .s-pipe .sp-anciens, .s-fiche .sf-lien, .s-appel .sf-lien{ min-height:var(--tap); }
  .s-contacts .sc-bouton{ grid-template-columns:minmax(0, 1fr); }
  .s-contacts .sc-activite{ text-align:left; }
  .s-appel .sa-choix-liste{ grid-template-columns:minmax(0, 1fr); }
}
@media (max-width: 639px){
  .s-fiche .sf-boutons .btn{ flex:1 1 calc(50% - var(--sp-2)); }
  .s-fiche .sf-rangee{ flex-direction:column; }
}
