/* ══════════ «Новая сделка» (js/newdeal.js, A5DealNew; the owner's pick «Свойства», 2026-10-20, DESIGN-CALM §11) ══════════
   [M Attio «Add to list», Rox «New opportunity»] a borderless title, then rows icon · label · value split by hairlines,
   48 px a row; values fill on hover and ring on focus. The popover, the month and «Создать ещё» reuse .tnm-* of the
   «Новая задача» window (tasks.css, loaded before this file). */

/* «Закрытие» popover: a caption head, the choices / the month (.tnm-due) */
.ndx-ph{margin:0;padding:10px 12px 4px;font:var(--t-caption-strong);color:var(--text-3)}
.ndx-due .tnm-db{padding-top:0}
.ndx-due .tnm-dc.on > span{color:var(--accent-text);font-weight:600}
.ndx-due .tnm-dc:focus-visible{outline:0;box-shadow:none}   /* the keyboard row is the .act fill, as in menus */

/* the window */
.ndp-modal .modal-b{padding:4px 12px 4px}
.ndp-title{display:block;width:100%;height:auto;margin:0 0 12px;padding:6px 8px;border:0;border-radius:var(--radius-s);outline:0;background:transparent;box-shadow:none;
  font:600 18px/26px var(--font-sans);color:var(--text-strong);transition:background-color var(--dur-1) linear}
.ndp-title::placeholder{color:var(--text-3)}
.ndp-title:hover{background:var(--surface-hover-raised)}
.ndp-title:focus{background:transparent;box-shadow:var(--focus-ring)}
/* rows: a hairline above the first and between the rows (none under the last: the footer has its own), 6 px air
   above and below a 36 px value */
.ndp-rows{display:grid;box-shadow:inset 0 1px 0 var(--border-soft)}
.ndp-r{display:grid;grid-template-columns:160px minmax(0,1fr);align-items:start;padding:6px 0;box-shadow:inset 0 -1px 0 var(--border-soft)}
.ndp-r:last-child{box-shadow:none}
.ndp-k{display:flex;align-items:center;gap:10px;height:36px;padding:0 8px;font:var(--t-body);color:var(--text-2);white-space:nowrap}
.ndp-k .ic{flex:none;width:14px;height:14px;stroke-width:2;color:var(--icon)}
.ndp-r.is-client .ndp-k > span::after{content:"*";margin-left:2px;color:var(--text-3)}
.ndp-v{position:relative;min-width:0}
.ndp-b{display:flex;align-items:center;gap:8px;width:100%;height:36px;padding:0 8px;border-radius:var(--radius-s);text-align:left;font:var(--t-body);color:var(--text-strong);transition:background-color var(--dur-1) linear}
.ndp-b > span{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ndp-b small{margin-left:auto;flex:none;font:var(--t-caption);color:var(--text-3);font-variant-numeric:tabular-nums}
.ndp-b.is-empty > span{color:var(--text-3)}
.ndp-b:hover{background:var(--surface-hover-raised)}
.ndp-b[aria-expanded="true"]{background:var(--surface-pressed)}
.ndp-b:focus-visible{box-shadow:var(--focus-ring)}
.ndp-fx{display:flex;align-items:center;gap:6px;height:36px;padding:0 8px;border-radius:var(--radius-s);cursor:text;transition:background-color var(--dur-1) linear}
.ndp-fx > span{font:var(--t-body);color:var(--text-3)}
.ndp-fx input{flex:1;min-width:0;height:34px;padding:0;border:0;outline:0;background:transparent;box-shadow:none;font:var(--t-body);color:var(--text-strong);font-variant-numeric:tabular-nums}
.ndp-fx input::placeholder{color:var(--text-3)}
.ndp-fx:hover{background:var(--surface-hover-raised)}
.ndp-fx:focus-within{background:transparent;box-shadow:var(--focus-ring)}
.ndp-r.is-bad .ndp-fx{box-shadow:0 0 0 1px var(--danger)}
.ndp-eq{flex:none;font:var(--t-caption);color:var(--text-3);font-variant-numeric:tabular-nums}
.ndp-r.is-bad .ndp-eq{color:var(--danger)}
.ndp-seg{display:flex;align-items:center;gap:4px;height:36px;padding:0 4px}
.ndp-seg button{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:var(--radius-s);font:var(--t-body-medium);color:var(--text-2);transition:background-color var(--dur-1) linear,color var(--dur-1) linear}
.ndp-seg button .ic{width:14px;height:14px}
.ndp-seg button:hover{background:var(--surface-hover-raised);color:var(--text-strong)}
.ndp-seg button.on{background:var(--surface-pressed);color:var(--text-strong);box-shadow:inset 0 0 0 1px var(--border)}
.ndp-seg button:focus-visible{box-shadow:var(--focus-ring)}
.ndp-note{display:block;width:100%;min-height:36px;padding:8px;border:0;border-radius:var(--radius-s);outline:0;background:transparent;box-shadow:none;resize:none;overflow:auto;
  font:var(--t-body);color:var(--text-strong);transition:background-color var(--dur-1) linear}
.ndp-note::placeholder{color:var(--text-3)}
.ndp-note:hover{background:var(--surface-hover-raised)}
.ndp-note:focus{background:transparent;box-shadow:var(--focus-ring)}

/* the client cell: the search (a dashed person glyph, the dropdown under it), the picked client, a new contact */
.ndp-cl :is(.ndx-q,.ndx-sel,.ndx-new){display:flex;align-items:center;gap:8px;min-width:0;min-height:36px;padding:0 4px 0 8px;border-radius:var(--radius-s);transition:background-color var(--dur-1) linear}
.ndp-cl input{flex:1 1 0;min-width:0;height:34px;padding:0;border:0;border-radius:0;outline:0;background:transparent;box-shadow:none;font:var(--t-body);color:var(--text-strong)}
.ndp-cl input::placeholder{color:var(--text-3)}
.ndp-cl :is(.ndx-q,.ndx-sel):hover{background:var(--surface-hover-raised)}
.ndp-cl :is(.ndx-q,.ndx-new):focus-within{background:transparent;box-shadow:var(--focus-ring)}
.ndp-cl .ndx-new input + input{padding-left:10px;box-shadow:inset 1px 0 0 var(--border-soft)}
.ndp-r.is-err .ndp-cl :is(.ndx-q,.ndx-new){box-shadow:0 0 0 1px var(--danger)}
.ndx-nav{flex:none;width:20px;height:20px;display:grid;place-items:center;border-radius:50%;border:1px dashed var(--border-strong);color:var(--text-3)}
.ndx-nav .ic{width:12px;height:12px;stroke-width:2}
.ndx-newbtn,.ndx-back{flex:none;display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 8px;border-radius:var(--radius-s);font:var(--t-caption-strong);color:var(--text-2);transition:background-color var(--dur-1) linear,color var(--dur-1) linear}
.ndx-newbtn .ic{width:12px;height:12px;stroke-width:2.4}
.ndx-newbtn:hover,.ndx-back:hover{background:var(--surface-hover-raised);color:var(--text-strong)}
.ndx-newbtn:focus-visible,.ndx-back:focus-visible{box-shadow:var(--focus-ring)}
.ndp-cl .ndx-sel{padding-top:6px;padding-bottom:6px}
.ndp-cl .av.md{width:24px;height:24px;font-size:10px}
.ndx-sel .tt{flex:1;min-width:0}
.ndx-sel .tt b{display:block;font:var(--t-body-strong);color:var(--text-strong);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ndx-sel .tt small{display:block;font:var(--t-caption);color:var(--text-3);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ndx-clear{flex:none;width:24px;height:24px}
.ndx-clear .ic{width:12px;height:12px;stroke-width:2.4;color:var(--icon-strong)}
/* under the client: a clash with an open deal (warning) or what is missing (error) */
.ndp-msg{display:flex;align-items:flex-start;gap:6px;margin:4px 8px 2px;font:var(--t-caption);color:var(--text-2)}
.ndp-msg[hidden]{display:none}
.ndp-msg .ic{flex:none;width:12px;height:12px;margin-top:2px;stroke-width:2.4;color:var(--warning)}
.ndp-msg.is-err,.ndp-msg.is-err .ic{color:var(--danger)}

@media (max-width:560px){ .ndp-r{grid-template-columns:120px minmax(0,1fr)} }