/* Phone, tablet and computer. Phone under 768 uses the phone markup with stage tabs and a bottom tab bar.
   app.js adds body.rs.tabl (768 to 1199) or body.rs.desk (1200 and up). Pipeline and dashboard then use
   Lumi's wide markup (wide.css). The other screens keep the phone markup inside .main, wider, with the
   side nav (computer) or top tabs (tablet) in place of the phone bar and bottom tab bar. */
.rs #app{display:contents}
.rs .app.wide{position:relative;z-index:2;max-width:1080px;min-height:0;margin:0 auto;background:transparent;overflow:visible;padding-top:0}
.rs .app.wide .wrap{padding:6px 0 40px}
.rs .app.wide .bar{display:none}
.rs .app.wide h1{padding-top:22px}
.rs .rhero{transition:none}
.rs .toast{bottom:24px;width:auto;min-width:320px;max-width:520px}
.desk .toast{left:calc(50% + 118px)}
.rs .sheet{max-width:600px;border-radius:28px 28px 0 0}
.desk .scrim{background:rgba(4,12,32,.35)}
.desk .sheet{top:50%;bottom:auto;left:calc(50% + 118px);transform:translate(-50%,-50%);max-width:560px;max-height:84vh;border-radius:24px;padding-bottom:0}
.desk .sheet .grab{display:none}
/* wide pipeline and dashboard extras */
.rs .rsearch input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:inherit;color:var(--text-strong)}
.rs .rsearch input::placeholder{color:var(--text-subtle)}
.rs .rfbtn{font-family:inherit;cursor:pointer}
.rs .rfbtn .fcnt{background:#fff;color:var(--prism-navy-900);border-radius:999px;font-size:11px;padding:1px 7px}
.rs .rtr .me,.rs .tnav .me{border:0;cursor:pointer;font-family:inherit}
.rs .usr{background:none;border:0;border-top:1px solid rgba(255,255,255,.08);text-align:left;font-family:inherit;cursor:pointer;width:100%}
.rs a.si,.rs a.ttab{text-decoration:none}
.rs .rsel{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:18px}
.rs .rsel>*{margin:0!important}
.rs .rsel .repsel{flex:1;min-width:0}
.rs .rmgr{display:grid;grid-template-columns:1.4fr 1fr;gap:14px;margin-top:16px;align-items:start}
.rs .rmgr>*,.rs .rmgr2>*{margin:0!important}
.rs .rmgr2{display:flex;flex-direction:column;gap:14px}
.rs .rfil{margin-top:18px;display:flex;flex-direction:column;gap:10px}
.rs .rfil>*{margin:0!important}
.rs a.wc,.rs a.nrow{display:block;text-decoration:none;color:inherit}
.rs a.nrow{display:flex}
.rs .wwho{display:flex;align-items:center;gap:6px;margin-top:4px}
.rs .wwho .avatar{width:20px;height:20px;font-size:9px}
.rs .bempty{margin-top:22px;background:#fff;border-radius:18px;padding:28px;text-align:center;color:var(--text-muted);box-shadow:var(--shadow-card)}
.rs .rpipe .legal,.rs .rdash .legal{margin-top:28px}
.tabl .rmgr{grid-template-columns:1fr}
/* phone markup on wider screens */
@media (min-width:768px){
  .rs .app.wide .kpis.my .kpi .n{font-size:24px}
  .plist{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
  .plist>.addco-b,.plist>.rneed,.plist>.relbox{grid-column:1/-1}
  .team{margin-left:16px;margin-right:16px}
  .addbtn{max-width:420px;margin-left:auto!important;margin-right:auto!important;width:calc(100% - 32px)}
  .acct{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;align-items:start}
  .acct .acard:first-child{grid-column:1/-1}
  .dash{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;padding:0 16px;align-items:start}
  .dash .dcard.lines{grid-column:1/-1}
  .detail .body{display:grid;grid-template-columns:1.1fr 1fr;gap:0 16px;align-items:start}
  .detail .body .col1>:first-child,.detail .body .col2>:first-child{margin-top:0}
}
@media (min-width:1200px){
  .plist{grid-template-columns:1fr 1fr 1fr}
}
/* tablet: board scrolls sideways so cards keep a readable width; top nav fits the Example data pill */
.tabl .kb{grid-template-columns:repeat(var(--kc,5),minmax(196px,1fr));overflow-x:auto;padding-bottom:8px;margin-left:-4px;margin-right:-4px;padding-left:4px;padding-right:4px;scroll-snap-type:x proximity}
.tabl .kcol{scroll-snap-align:start}
.tabl .tnav{gap:10px;padding:0 16px}
.tabl .ttabs{margin-left:0;gap:2px}
.tabl .ttab{padding:0 10px;font-size:13px}
@media (max-width:1000px){.tabl .tnav .brand b{display:none}}
/* commission lines in the wide dashboard card */
.dcard.lines .ln{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:10px 0;border-top:1px solid #EEF1F6}
.dcard.lines .ln:first-of-type{border-top:none}
.dcard.lines .ln .a a{color:inherit;text-decoration:none}

/* Open Prospects with the real prospect list: count line and Show more pager */
.ptot{margin-top:-4px}
.plist>.pmore,.plist>.pcount{grid-column:1/-1}
.pcount{font-size:13px;color:var(--muted,#5b6472);margin:4px 2px 10px}
.pmore{display:flex;flex-direction:column;align-items:center;gap:8px;margin:14px 0 6px;font-size:13px;color:var(--muted,#5b6472)}
.pmore .btn3{min-width:180px}

/* v11 every rep reachable (Billy feedback, Oct 28)
   1. Claim or assign picker on Open Prospects: chips wrap to as many rows as needed, nothing clipped.
   2. Rep selector on Pipeline and Dashboard: scrolls sideways with a visible scrollbar; the first option stays pinned. */
.pick{display:flex!important;flex-wrap:wrap!important;overflow:visible!important;align-items:center;gap:6px!important;padding:8px!important}
.pick .pk{flex:0 0 100%;margin:0 0 1px 2px!important}
.pick span:not(.pk):not(.avatar){flex:0 1 auto;max-width:100%;min-width:0;justify-content:flex-start;padding:0 10px 0 4px!important;white-space:nowrap;cursor:pointer}
.repsel{display:flex!important;overflow-x:auto!important;overflow-y:hidden;-webkit-mask-image:none!important;mask-image:none!important;scrollbar-width:thin;scrollbar-color:#B9C2D3 transparent;-webkit-overflow-scrolling:touch;padding-bottom:4px!important}
.repsel::-webkit-scrollbar{display:block!important;height:6px}
.repsel::-webkit-scrollbar-thumb{background:#B9C2D3;border-radius:6px}
.repsel::-webkit-scrollbar-track{background:transparent}
.repsel>span{flex:0 0 auto!important;padding:0 12px!important}
.repsel>span:first-child{position:sticky;left:0;z-index:2;background:#fff;box-shadow:6px 0 8px -6px rgba(16,24,40,.25)}
.repsel>span:first-child.on{background:var(--prism-blue-700,#1E3A8A)}

/* v12 Next step and App Notes editing */
.detail .ns-box .k{display:flex;justify-content:space-between;align-items:center;gap:8px}
.detail .ns-box .act2,.detail .notes .act2{display:inline-flex;align-items:center;gap:4px;font:inherit;font-size:12.5px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--prism-blue-700);background:#fff;border:0;border-radius:8px;padding:5px 10px;min-height:30px;cursor:pointer}
.detail .notes .act2{background:var(--surface-tint)}
.detail .ns-box .act2 svg,.detail .notes .act2 svg,.detail .ns-box .nsadd svg{width:13px;height:13px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.detail .ns-box .t{white-space:pre-wrap;overflow-wrap:anywhere}
.detail .ns-box.late{background:#FDECEC}
.detail .ns-box .d.late,.detail .ns-box .d.late b{color:var(--late)}
.detail .ns-box .d.today b{color:#9A5B00}
.detail .ns-box .nsadd{display:inline-flex;align-items:center;gap:6px;margin-top:10px;height:38px;padding:0 14px;border:0;border-radius:11px;background:var(--prism-blue-700);color:#fff;font:700 13.5px/1 var(--font-sans);cursor:pointer}
.detail .notes .n{white-space:pre-wrap;overflow-wrap:anywhere}
.detail .notes .nhint{margin-top:7px;font-size:11.5px;line-height:16px;color:var(--text-subtle)}
.sheet.log .nsclr{display:block;margin-top:14px;padding:8px 0;border:0;background:none;font:700 13px/1 var(--font-sans);color:var(--late);cursor:pointer}
.sheet.log .warnk{color:#7A4B00;background:#FFF4E0}
.sheet.log .warnk svg{fill:none;stroke:currentColor;stroke-width:2.2;flex:0 0 auto}
.sheet.log .hint2{margin-top:8px;font-size:12px;color:var(--text-subtle)}
.sheet.notessh textarea{min-height:170px}
.sheet.log .lnsbox{margin-top:14px;padding:12px;border-radius:13px;background:var(--surface-tint)}
.sheet.log .lnsh{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--text-muted);margin-bottom:8px}
.sheet.log .lnsh .ic{width:14px;height:14px}
.sheet.log .lnsbox input.in+input.in{margin-top:8px}
.tabl .sheet.log .lnsbox,.desk .sheet.log .lnsbox{display:grid;grid-template-columns:1fr 170px;gap:8px}
.tabl .sheet.log .lnsbox .lnsh,.desk .sheet.log .lnsbox .lnsh{grid-column:1/-1;margin-bottom:0}
.tabl .sheet.log .lnsbox input.in+input.in,.desk .sheet.log .lnsbox input.in+input.in{margin-top:0}
