/* Kit d'interface — composants repris de la PWA metier (v6.10 du 22.09.2026)
 * Reçu de Hector le 23.09.2026, puis CORRIGÉ ici (à réappliquer si on régénère) :
 *   1. pastilles --paid / --pending / --sent : teintes en dur remplacées par des
 *      color-mix sur les jetons du thème — elles ne suivaient aucun style ;
 *   2. « .kit-tab__close:hover » était écrit DEUX fois, la seconde étant une règle
 *      de thème sombre sortie de son @media : le survol n'avait plus de fond.
 * Generé le 22.09.2026. Code propriete HectoFlex (contrat de prestations).
 * Aucune donnee, marque, couleur ni logo client. Aucune couleur en dur : tout vient des
 * variables du theme Adjoint via pont-variables.css.
 *
 * PREFIXE `kit-` et non `adj-` : Adjoint utilise deja .adj-btn, .adj-card et .adj-cli.
 * Renommer en `adj-` ecrasait ses propres composants (constate le 22.09.2026).
 *
 * Composants : boutons, liste de fiches (recherche + filtre A-Z + grille + avatar),
 * cartes, messages fugaces, boites de dialogue, onglets, pastilles d'etat.
 */

.kit-toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--adj-ink);color:var(--adj-on-accent);padding:12px 24px;border-radius:12px;font-size:.85rem;z-index:9999;opacity:0;transition:opacity .3s;pointer-events:none;max-width:90%;text-align:center}
.kit-toast.show{opacity:1}
.kit-toast.success{background:var(--adj-ok)}
.kit-toast.error{background:var(--adj-danger)}
.kit-toast.warning{background:var(--adj-warn);color:var(--adj-ink)}
.kit-card--admin,
.kit-settings__grid > .kit-card--system{grid-column:span 2}
.kit-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:14px;
  padding:22px 24px;
  display:flex;flex-direction:column;gap:16px;
  transition:border-color 200ms ease,transform 200ms ease;
}
.kit-card:hover{border-color:var(--border-strong)}
.kit-card__head{
  display:flex;justify-content:space-between;align-items:flex-start;gap:14px;
  padding-bottom:14px;border-bottom:1px solid var(--border);
}
.kit-card__head-left{display:flex;align-items:flex-start;gap:12px;flex:1;min-width:0}
.kit-card__icon{
  flex-shrink:0;
  width:34px;height:34px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  background:var(--surface2);
  color:var(--text2);
  border:1px solid var(--border);
  transition:all 160ms ease;
}
.kit-card:hover .kit-card__icon{background:var(--accent-soft);color:var(--accent-ink);border-color:transparent}
.kit-card__title{
  font-family:'Geist','Inter';font-weight:600;font-size:1rem;
  letter-spacing:-.02em;margin:0 0 4px;color:var(--text);
}
.kit-card__desc{font-size:.82rem;color:var(--text2);margin:0;letter-spacing:-.005em;line-height:1.4}
.kit-btn-primary{background:var(--accent);color:var(--on-accent);border:1px solid var(--accent)}
.kit-btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--accent) 35%,transparent)}
.kit-btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.kit-btn-ghost{background:transparent;color:var(--text2);border:1px solid var(--border)}
.kit-btn-ghost:hover{background:var(--surface2);color:var(--text)}
.kit-card.kit-card--collapsible .kit-card__head{cursor:pointer;user-select:none}
.kit-card.kit-card--collapsible .kit-card__head::after{content:'';width:9px;height:9px;border-right:1.5px solid var(--text2);border-bottom:1.5px solid var(--text2);transform:rotate(45deg);transition:transform 180ms ease;margin-left:6px;flex-shrink:0}
.kit-card.kit-card--collapsible.kit-collapsed .kit-card__head::after{transform:rotate(-45deg);margin-top:5px}
.kit-card.kit-card--collapsible.kit-collapsed > :not(.kit-card__head){display:none!important}
.kit-card.kit-card--collapsible:not(.kit-collapsed){box-shadow:var(--shadow-sm,0 4px 12px rgba(0,0,0,.06))}
.kit-card__body{font-size:.875rem;color:var(--text2);line-height:1.6}
.kit-card__body strong{color:var(--text);font-weight:600}
.kit-card__foot{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}
.kit-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:8px 14px;border-radius:8px;font-size:.825rem;font-weight:500;letter-spacing:-.005em;
  font-family:'Inter';cursor:pointer;border:1px solid transparent;
  transition:all 160ms cubic-bezier(.16,1,.3,1);
}
.kit-btn--primary{
  background:var(--accent);color:var(--on-accent);border-color:var(--accent);
  box-shadow:0 1px 2px rgba(163,205,26,.18);
}
.kit-btn--primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);transform:translateY(-1px);box-shadow:0 4px 10px rgba(163,205,26,.26)}
.kit-btn--ghost{background:var(--surface);color:var(--text);border-color:var(--border)}
.kit-btn--ghost:hover{background:var(--surface2);border-color:var(--border-strong)}
.kit-btn--danger{background:var(--adj-danger);color:var(--adj-on-accent);border-color:var(--adj-danger)}
.kit-btn--danger:hover{background:var(--adj-danger);border-color:var(--adj-danger)}
.kit-btn--danger-ghost{background:transparent;color:var(--adj-danger);border-color:color-mix(in srgb, var(--adj-danger) 30%, transparent)}
.kit-btn--danger-ghost:hover{background:color-mix(in srgb, var(--adj-danger) 8%, transparent);border-color:var(--adj-danger)}
.kit-status{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;color:var(--text2);font-weight:500}
.kit-status.is-on .kit-dot{background:var(--green)}
.kit-status.is-off .kit-dot{background:var(--red)}
.kit-btn--primary{padding:8px 14px}
.kit-status-badge{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border-radius:6px;
  font-size:.7rem;font-weight:600;letter-spacing:-.005em;
  text-transform:uppercase;
}
.kit-status-badge--paid{background:color-mix(in srgb, var(--adj-ok) 12%, transparent);color:var(--adj-ok)}
.kit-status-badge--pending{background:color-mix(in srgb, var(--adj-warn) 12%, transparent);color:var(--adj-warn)}
.kit-status-badge--draft{background:var(--surface2);color:var(--text2)}
.kit-status-badge--overdue{background:color-mix(in srgb, var(--adj-danger) 10%, transparent);color:var(--adj-danger)}
.kit-status-badge--sent{background:color-mix(in srgb, var(--adj-accent) 12%, transparent);color:var(--adj-accent)}
.kit-dlg{position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;padding:16px}
.kit-dlg__box{background:var(--surface);color:var(--text);border-radius:18px;padding:20px 22px;max-width:560px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.35);max-height:90vh;overflow:auto}
.kit-dlg__box h3{margin:0 0 4px!important;font-size:1.1rem}
.kit-dlg__box p.sub{margin:0 0 14px;color:var(--text3);font-size:.8rem}
.kit-dlg__box label.lbl{display:block;font-size:.75rem;color:var(--text3);margin:12px 0 5px}
.kit-dlg__box input.inp,.kit-dlg__box select.inp{width:100%;box-sizing:border-box;padding:9px 11px;border:1px solid transparent;border-radius:10px;background:var(--surface2);color:var(--text);font-size:.9rem;font-family:inherit}
.kit-dlg__foot{display:flex;gap:8px;justify-content:flex-end;margin-top:18px}
.kit-dlg__merge{display:flex;gap:8px;flex-direction:column;margin-top:6px}
.kit-dlg__merge label{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;border:1px solid var(--border);border-radius:10px;cursor:pointer;font-size:.82rem}
.kit-dlg__merge label.on{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.kit-cli{max-width:1200px}
.kit-cli__head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:6px 0 14px}
.kit-cli__head h3{margin:0!important;font-size:1.05rem;font-weight:800;letter-spacing:-.01em}
.kit-cli__count{font-size:.72rem;color:var(--text3);background:var(--surface2);border-radius:999px;padding:3px 9px;font-weight:600}
.kit-cli__search{position:relative;margin-bottom:12px}
.kit-cli__search svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--text3);pointer-events:none}
.kit-cli__search input{width:100%!important;box-sizing:border-box;padding:14px 44px 14px 46px!important;border:1px solid transparent!important;border-radius:16px!important;background:var(--surface2)!important;color:var(--text);font-size:1rem!important;font-family:inherit;outline:none;margin:0!important;transition:box-shadow .15s,border-color .15s}
.kit-cli__search input::-webkit-search-cancel-button{-webkit-appearance:none}
.kit-cli__search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.kit-cli__clear{position:absolute;right:10px;top:50%;transform:translateY(-50%);border:none!important;background:var(--surface)!important;color:var(--text3)!important;width:28px;height:28px;padding:0!important;border-radius:50%!important;cursor:pointer;font-size:.9rem;display:none!important;align-items:center;justify-content:center}
.kit-cli__search.has-q .kit-cli__clear{display:inline-flex!important}
.kit-cli__bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.kit-cli__abc{display:flex;flex-wrap:wrap;gap:3px}
.kit-cli__abc button{min-width:28px;height:28px;border-radius:8px;border:1px solid transparent;background:transparent;color:var(--text2);font-size:.74rem;font-weight:600;cursor:pointer;font-family:inherit}
.kit-cli__abc button:hover{background:var(--surface2)}
.kit-cli__abc button.active{background:var(--accent);color:var(--on-accent)}
.kit-cli__abc button:disabled{opacity:.3;cursor:default}
.kit-cli__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.kit-cli__card{position:relative;display:flex;gap:12px;padding:14px 14px 12px;border:1px solid var(--border);border-radius:16px;background:var(--surface);cursor:pointer;transition:all 200ms cubic-bezier(.16,1,.3,1)}
.kit-cli__card:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm);border-color:var(--border-strong)}
.kit-cli__avatar{flex:0 0 44px;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.95rem;color:var(--adj-on-accent);letter-spacing:.02em}
.kit-cli__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.kit-cli__name{font-weight:700;font-size:.95rem;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.01em}
.kit-cli__sub{font-size:.76rem;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit-cli__line{display:flex;align-items:center;gap:6px;font-size:.78rem;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit-cli__line svg{width:13px;height:13px;flex-shrink:0;color:var(--text3)}
.kit-cli__line a{color:inherit;text-decoration:none}
.kit-cli__line a:hover{color:var(--accent-ink);text-decoration:underline}
.kit-cli__acts{display:flex;gap:6px;margin-top:6px}
.kit-cli__acts button{padding:4px 10px;border-radius:999px;border:1px solid var(--border);background:transparent;color:var(--text2);font-size:.72rem;cursor:pointer;font-family:inherit}
.kit-cli__acts button:hover{background:var(--surface2);color:var(--text)}
.kit-cli__acts button.danger:hover{color:var(--red);border-color:var(--red)}
.kit-cli__empty{text-align:center;color:var(--text3);padding:50px 20px;font-size:.9rem}
.kit-cli__more{display:flex;justify-content:center;margin:16px 0 30px}
.kit-tabs-bar{
  display:flex;align-items:flex-end;gap:1px;
  background:var(--surface);
  border-bottom:1px solid var(--border);
  padding:6px 16px 0;
  overflow-x:auto;scrollbar-width:none;
  position:sticky;top:0;z-index:90;
  min-height:40px;
}
.kit-tabs-bar.kit-hidden{display:none!important}
.kit-tabs-bar::-webkit-scrollbar{display:none}
.kit-tab{
  display:flex;align-items:center;gap:6px;
  padding:7px 10px 7px 14px;
  font-family:'Inter';font-size:.78rem;font-weight:500;color:var(--text2);
  border:1px solid transparent;border-bottom:none;
  border-radius:8px 8px 0 0;
  cursor:pointer;
  transition:all 120ms cubic-bezier(.16,1,.3,1);
  white-space:nowrap;
  letter-spacing:-.005em;
  margin-bottom:-1px;
  background:transparent;
}
.kit-tab:hover{background:var(--surface2);color:var(--text)}
.kit-tab.active{
  background:var(--bg);
  color:var(--text);font-weight:600;
  border-color:var(--border);
}
.kit-tab__close{
  background:transparent;border:none;
  width:18px;height:18px;border-radius:5px;
  color:var(--text3);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all 120ms ease;
  padding:0;
}
.kit-tab__close:hover{background:color-mix(in srgb, var(--text) 10%, transparent);color:var(--red)}
.kit-status-pop{
  position:absolute;
  z-index:9999;
  background:var(--surface);
  border:1px solid var(--border-strong,var(--border));
  border-radius:10px;
  padding:6px;
  box-shadow:0 8px 24px rgba(0,0,0,.35);
  display:flex;flex-direction:column;gap:3px;
  min-width:140px;
}
.kit-status-pop button{
  display:flex;align-items:center;gap:8px;
  background:transparent;
  border:none;
  border-radius:6px;
  padding:7px 10px;
  cursor:pointer;
  font-size:.78rem;
  color:var(--text);
  text-align:left;
  transition:background 100ms ease;
}
.kit-status-pop button:hover{
  background:var(--surface2);
}
.kit-status-pop button .dot{
  width:9px;height:9px;border-radius:50%;
  flex-shrink:0;
}
.kit-status-pop button.active{
  font-weight:700;
}

@media (min-width:768px) and (max-width:1023px){
  .kit-tabs-bar{padding-left:14px!important}
}

@media(max-width:767px){
  .kit-card--admin,
  .kit-settings__grid > .kit-card--system{grid-column:auto}
  .kit-tabs-bar{padding:6px 10px 0;min-height:36px;}
  .kit-tab{font-size:.72rem;padding:6px 8px 6px 11px;}
}

@media(max-width:600px){
  .kit-cli__grid{grid-template-columns:1fr}
  .kit-cli__abc{display:none}
}

@media(min-width:1024px){
  .kit-tabs-bar{padding-left:224px}
  .kit-tabs-bar{
    padding-left:14px!important;
  }
}

@media(min-width:1440px){
  .kit-tabs-bar{padding-left:256px}
}