/* Clientes (0.36.0): the customer book's list and file. The page header, tabs, tables, the file's sections (.ficha .sec,
   .frm, .pf-split) and the chips come from shell.css and screens.css; only what is the book's own is here. */

/* the list: the green dot of a customer with a WhatsApp chat */
.cl-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #25A55F; vertical-align: middle; margin-left: 2px; }
.cl-list td .ppl .tx { overflow-wrap: anywhere; }
.cl-pager { justify-content: flex-end; }

/* the file */
.cl-kv { grid-template-columns: 110px minmax(0, 1fr); }
.cl-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.cl-notes { white-space: pre-wrap; font-weight: 400; }
.cl-acts { display: flex; gap: 8px; margin-top: 16px; }
.cl-addrs { display: flex; flex-direction: column; gap: 12px; }
.cl-addr { border: 1px solid #F0EEE6; border-radius: 10px; padding: 12px 14px; font-size: 13.5px; display: flex; flex-direction: column; gap: 6px; min-width: 0; overflow-wrap: anywhere; }
.cl-addr-h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
.cl-parts { display: grid; grid-template-columns: repeat(2, max-content minmax(0, 1fr)); gap: 4px 12px; margin: 0; font-size: 12.5px; }
.cl-parts dt { color: #8A978F; } .cl-parts dd { margin: 0; min-width: 0; }
.cl-orders { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.cl-order { padding: 10px 0; border-bottom: 1px solid #F0EEE6; min-width: 0; }
.cl-order:last-child { border-bottom: 0; }
.cl-order.off { opacity: .6; }
.cl-order-h { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.cl-order-h .grow { flex: 1; }
.cl-lines { margin: 6px 0 0; padding-left: 18px; font-size: 13px; color: #4A5A52; overflow-wrap: anywhere; }

@media (max-width: 900px) {
  /* the phone list: name, last purchase and total fit the card, no sideways slide */
  table.t.cl-list .ppl .sb { white-space: normal; overflow-wrap: anywhere; }
  .cl-list th, .cl-list td { padding-left: 8px; padding-right: 8px; }
  .cl-list { table-layout: fixed; width: 100%; }
  .cl-list th:nth-child(5) { width: 30%; }
  .cl-list th:nth-child(6) { width: 34%; }
  .cl-list .ppl .nm { overflow-wrap: anywhere; }
  .cl-parts { grid-template-columns: max-content minmax(0, 1fr); }
  .cl-kv { grid-template-columns: 96px minmax(0, 1fr); }
}

/* 0.37.0 (wave 2): the yellow line of a book that stopped updating, the offer chip, Preferencias, Seguimiento, Unir and
   the Bandeja's customer card */
.cl-stuck { margin: 0 0 12px; background: #FFF6DB; color: #7A5300; border: 1px solid #F2DC9B; border-radius: 8px; padding: 8px 12px; font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.cl-offer { white-space: nowrap; }
.cl-offer-link { padding: 0; margin-left: 6px; }
.cl-sub { display: flex; align-items: baseline; gap: 10px; margin: 14px 0 6px; font-size: 13px; color: #4A5A52; }
.cl-sub:first-of-type { margin-top: 4px; }
.cl-sub .link { padding: 0; font-size: 12.5px; }
.cl-pick { border: 0; padding: 0; margin: 0 0 12px; display: flex; flex-wrap: wrap; gap: 6px 14px; min-width: 0; }
.cl-pick legend { font-size: 12.5px; color: #8A978F; margin-bottom: 4px; padding: 0; }
.cl-opt { display: inline-flex; align-items: center; gap: 4px; font-size: 13.5px; }
.cl-fu { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; min-width: 0; }
.cl-quote { max-height: 220px; overflow: auto; font-size: 13.5px; }
.cl-card { display: flex; flex-direction: column; gap: 6px; margin: 6px 0; min-width: 0; overflow-wrap: anywhere; }
.cl-card p { margin: 0; }
.cl-merge-list { list-style: none; margin: 10px 0 0; padding: 0; max-height: 260px; overflow: auto; }
.cl-merge-list li { padding: 6px 0; border-bottom: 1px solid #F0EEE6; overflow-wrap: anywhere; }
.cl-merge-list .link { padding: 0; font-weight: 600; }
#cl-merge-q { width: 100%; }