/* Connections launchpad (launchpad.js): the strip under a customer or billing-contact header, and the connection icons on the Customers table.
   Every logo sits in the shared square chip (icons.css, docs/BRANDS.md). Colours come from the app tokens, so both themes work. */
.lp{margin:14px 0 2px;padding-top:12px;border-top:1px solid var(--bd)}
.lp-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.lp-head h3{margin:0;font:600 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.lp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.lp-card{display:flex;flex-direction:column;gap:8px;min-width:0;padding:10px 12px;border:1px solid var(--bd);border-radius:var(--r);background:var(--sf2)}
.lp-card:hover{border-color:var(--bd2)}
.lp-top{display:flex;align-items:center;gap:10px;min-width:0}
.lp-top .lp-chip{margin:0;--chip:32px}
.lp-id{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.lp-t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}
.lp-state{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.lp-inet{min-height:20px;overflow:hidden}
.lp-acts{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:auto}
.lp-acts .btn{display:inline-flex;align-items:center;gap:4px;text-decoration:none}
.lp-note{font-size:12px}
.lp-edit{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.lp-grip{cursor:grab;color:var(--ink3);font-size:18px;line-height:1;padding:0 2px;user-select:none}
.lp-card[draggable="true"]{cursor:grab}
.lp-card.lp-dragging{opacity:.45}
.lp-card.lp-over{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc)}
.lp-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lp-open .sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* a missing connection: one click fills it in */
.lp-fill{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 12px;border:1px dashed var(--bd2);border-radius:var(--r);background:transparent;color:var(--ink3);font:inherit;text-align:left;cursor:pointer}
.lp-fill:hover,.lp-fill:focus-visible{color:var(--ink);border-color:var(--acc);background:var(--sf2)}
.lp-fill .lp-chip{margin:0;--chip:32px;opacity:.7}
.lp-fill span:nth-child(2){flex:1;min-width:0}
.lp-plus{font:600 18px var(--mono);color:var(--acc)}
.lp-more{margin-top:8px}
.lp-none{margin:0}
/* the add / edit form and the site picker */
.lp-form,.lp-pick{margin-top:12px;padding:12px;border:1px solid var(--bd2);border-radius:var(--r);background:var(--sf2)}
.lp-presets{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.lp-preset{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:3px 10px 3px 4px;border:1px solid var(--bd2);border-radius:var(--r);background:var(--sf);color:var(--ink2);font:inherit;font-size:12.5px;cursor:pointer}
.lp-preset .lp-chip{margin:0;--chip:26px;--chip-pad:3px}
.lp-preset:hover{border-color:var(--acc);color:var(--ink)}
.lp-preset.on{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc);color:var(--ink)}
.lp-fields{display:grid;grid-template-columns:90px minmax(0,1fr);gap:8px 12px;align-items:center;max-width:640px}
.lp-fields label{color:var(--ink3);font-size:12px}
.lp-err{min-height:18px;margin:6px 0;font-size:12.5px}
.lp-form .acts{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.lp-ph{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.lp-pick .sel{width:100%;max-width:420px}
.lp-pl{display:flex;flex-direction:column;gap:6px;margin-top:8px;max-height:280px;overflow:auto}
.lp-site{display:flex;align-items:center;gap:10px;min-height:44px;padding:6px 8px;border:1px solid var(--bd);border-radius:var(--r);background:var(--sf);color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.lp-site:hover,.lp-site:focus-visible{border-color:var(--acc)}
.lp-site .lp-chip{margin:0;--chip:30px}
/* Customers table */
.lp-inds{display:inline-flex;align-items:center;gap:4px}
.lp-ind{position:relative;display:inline-flex;padding:0;border:0;background:none;color:inherit;cursor:pointer;border-radius:var(--chip-r)}
.lp-ind .lp-chip{margin:0;--chip:24px;--chip-pad:3px;--chip-r:5px}
.lp-ind:hover .lp-chip,.lp-ind:focus-visible .lp-chip{border-color:var(--acc)}
.lp-n{position:absolute;right:-4px;top:-5px;min-width:14px;height:14px;padding:0 3px;border-radius:7px;background:var(--acc);color:var(--accInk);font:600 9.5px/14px var(--mono);text-align:center}
@media (max-width:719px){
  .lp-grid{grid-template-columns:minmax(0,1fr)}
  .lp-acts .btn,.lp-more,.lp-fill,.lp-preset,.lp-form .btn,.lp-pick .btn{min-height:44px}
  .lp-acts .btn.sm{padding-left:14px;padding-right:14px}
  .lp-fields{grid-template-columns:minmax(0,1fr)}
  .lp-fields label{margin-bottom:-4px}
  .lp-head .btn{min-height:44px}
  .lp-ind{min-width:44px;min-height:44px;align-items:center;justify-content:center}
}