/* Jewel Field CRM UI 2026 Phase B2: field screens (Leads, Contacts, Planner, Check-in). Loads after design.css; logical properties only (RTL). */
:root{--pg:14px}@media(max-width:380px){:root{--pg:10px}}
.av{--ab:#0f766e;flex:none;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--ab);color:#fff;font-size:15px;font-weight:650;line-height:1;user-select:none}
.av-xl{width:72px;height:72px;font-size:26px}
.av-1{--ab:#1d4ed8}.av-2{--ab:#6d28d9}.av-3{--ab:#be123c}.av-4{--ab:#b45309}.av-5{--ab:#15803d}.av-6{--ab:#52525b}.av-7{--ab:#c2410c}
.pk-visit{--c:var(--info);--b:var(--info-soft);--t:var(--info-ink)}.pk-opportunity{--c:var(--violet-ink);--b:var(--violet-soft);--t:var(--violet-ink)}.pk-local{--c:var(--muted);--b:var(--neutral-soft);--t:var(--ink-2)}.week-item.overdue{--c:var(--danger);--b:var(--danger-soft);--t:var(--danger-ink)}
.due,.lv-r{--tb:var(--danger-soft);--tt:var(--danger-ink)}.today,.lv-a{--tb:var(--warning-soft);--tt:var(--warning-ink)}.lv-g{--tb:var(--success-soft);--tt:var(--success-ink)}.none,.lv-n{--tt:var(--muted)}
:is(.lead-card,.contact-row,.qa-btn,.pl-row,.week-item,.ds-day,.checkin-pick,.choice-chip,.pw-btns button):active{transform:scale(.98)}
:is(.qa-btn,.pl-row,.week-item,.ds-day,.choice-chip){transition:background-color .15s,transform .12s var(--ease)}
.qa-btn{display:inline-grid;place-items:center;width:44px;height:44px;flex:none;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--surface);box-shadow:var(--sh-1);color:var(--accent-ink);text-decoration:none}
.qa-wa{color:var(--success-ink)}.qa-btn:hover{background:var(--surface-2);border-color:var(--line-strong)}
html:root .empty-state .btn-icon svg{width:18px;height:18px;color:currentColor}
.card:has(>.empty-state:only-child){padding:0;border:0;background:none;box-shadow:none;overflow:visible}
.lead-board,.board-flat{display:grid;gap:12px;align-items:start}
.lead-board{grid-template-columns:repeat(5,minmax(198px,1fr));overflow-x:auto;padding-bottom:8px;margin-top:4px}
.board-flat{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));overflow:visible}.board-flat>.stage{grid-column:1/-1}
html:root .stage{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-xl);padding:6px;min-height:240px}
html:root .stage-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 8px;align-items:center;padding:8px 8px 6px}
.stage-name{font-size:14px;font-weight:650;color:var(--ink);overflow-wrap:anywhere}
.stage-totals{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:0 10px;font-size:13px;font-weight:600;color:var(--muted)}
.stage-empty{margin:0}
.board-ind{display:none}
html:root .lead-card{display:flex;flex-direction:column;gap:2px;margin:6px 0;padding:14px;border-radius:var(--r-lg)}
html:root .deal.deal-hot{border-inline-start:1px solid var(--line)!important}html:root .deal-hot::after{display:none}
.lc-top{display:flex;align-items:center;justify-content:space-between;gap:6px 8px;flex-wrap:wrap}
.lc-top .deal-chips{display:flex;flex-wrap:wrap;gap:4px;margin:0}
html:root .lead-card .deal-title{display:block;margin-top:8px;padding:0;min-height:0;font-size:17px;font-weight:650;letter-spacing:-.01em;color:var(--ink);text-decoration:none;text-align:start}
html:root .lead-card .deal-title:hover{color:var(--accent-ink);text-decoration:underline}
.lc-meta small{display:block;font-size:13px;color:var(--muted);line-height:1.45}.lc-meta .text-link{font-size:13px;color:var(--ink-2);text-underline-offset:3px}
html:root .lead-card .deal-value{margin:8px 0 12px;font-size:22px;font-weight:700;letter-spacing:-.02em;line-height:1.1}
html:root .lead-card .deal-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:12px;border-top:1px solid var(--line)}
html:root .lead-card .next{min-height:36px;padding:0 12px;font-size:13px}
.lc-next{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600;background:var(--tb,var(--neutral-soft));color:var(--tt,var(--ink-2));white-space:nowrap}
html:root .lead-list{padding:0;overflow:clip}
.lead-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:14px 16px;border-top:1px solid var(--line);transition:background-color .15s}
.lead-row:first-child{border-top:0}.lead-row:hover{background:var(--surface-2)}
.lr-main{flex:1 1 0;display:grid;gap:2px;min-width:0}.lr-main small{font-size:13px;color:var(--muted)}
.lr-meta{flex:1 1 100%;order:3;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}.lr-act{margin-inline-start:auto}
.lr-main .text-link{color:var(--ink);font-size:16px;font-weight:650;text-decoration:none}.lr-main .text-link:hover{color:var(--accent-ink);text-decoration:underline}
.lr-value{font-size:15px;font-weight:650}
@media(min-width:761px){.lead-row{flex-wrap:nowrap}.lr-main{flex:1 1 auto}.lr-meta{display:contents}.lr-stage{min-width:96px;justify-content:center}.lr-value{min-width:110px;text-align:end}.lr-next{min-width:140px;display:flex;justify-content:flex-end}.lr-act{margin:0}}
@media(max-width:760px){
.board-ind{display:flex;align-items:center;gap:8px;margin:2px 0 8px;font-size:13px;font-weight:650;color:var(--ink-2)}
.bi-pos{padding:2px 8px;border-radius:999px;background:var(--surface);box-shadow:var(--sh-1);font-size:12px}
.lead-board{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pg);margin-inline:calc(var(--pg)*-1);padding:0 var(--pg) 10px;scrollbar-width:none}
.lead-board::-webkit-scrollbar{display:none}
html:root .lead-board>.stage{flex:0 0 86vw;max-width:420px;scroll-snap-align:center;min-height:260px}
.board-flat{grid-template-columns:1fr}
}
.contact-search{position:relative;max-width:none;margin:0}
.cs-icon{position:absolute;inset-inline-start:14px;top:0;bottom:0;display:grid;place-items:center;color:var(--muted);pointer-events:none;z-index:1}
html:root .contact-search input{min-height:48px;padding-inline-start:44px;border-radius:var(--r);box-shadow:var(--sh-1);width:100%}
.contacts-top{display:grid;gap:10px;margin:8px 0 14px}html:root .contacts-top .contact-type-filters{margin:0;justify-self:start}
@media(max-width:760px){
.contacts-top{position:sticky;top:var(--hdr-h,0);z-index:6;margin-inline:calc(var(--pg)*-1);padding:8px var(--pg) 6px;background:var(--bg)}
html:root .contact-type-filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;max-width:100%}.contact-type-filters::-webkit-scrollbar{display:none}
html:root .contact-type-filters .filter{flex:none;white-space:nowrap}
}
html:root .contacts-directory{padding:0;margin-top:0;overflow:clip}
html:root .contacts-directory .contact-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:12px 16px;border:0;border-top:1px solid var(--line);border-radius:0}
html:root .contacts-directory .contact-row:first-child{border-top:0}
html:root .contact-open{flex:1 1 100%;min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:2px 12px;padding:0;border:0;background:none;color:var(--ink);font:inherit;text-align:start;cursor:pointer}
.contact-open .av{grid-row:1/span 2}
.ci{display:grid;gap:1px;min-width:0}.ci b{display:block;font-size:16px;font-weight:650;overflow-wrap:anywhere}.ci small{display:block;font-size:13px;color:var(--muted);line-height:1.4}
html:root .contact-open .ci-fac{font-size:13px;color:var(--ink-2)}html:root .contact-open .av{font-size:15px;color:#fff}
html:root .contact-open .lv-chip{grid-column:2;justify-self:start;display:inline-flex;padding:2px 9px;margin-top:4px;border-radius:999px;font-size:12px;font-weight:600;background:var(--tb,var(--neutral-soft));color:var(--tt,var(--ink-2))}
.contact-actions{flex:1 1 100%;display:flex;align-items:center;gap:8px}.contact-actions .contact-start{flex:1;width:auto;min-width:0;white-space:nowrap}
/* Keep directory controls at the DESIGN.md 44px target floor on desktop too. */
html:root .contacts-top .contact-type-filters .filter,
html:root .contacts-directory .contact-actions button{min-width:44px;min-height:44px}
@media(min-width:761px){
html:root .contacts-directory .contact-row{flex-wrap:nowrap;padding:12px 20px}
html:root .contact-open{flex:1 1 auto;grid-template-columns:auto minmax(0,1fr) auto}
html:root .contact-open .lv-chip{grid-column:3;grid-row:1/span 2;margin:0}
.contact-actions,.contact-actions .contact-start{flex:none}.qa-btn{width:40px;height:40px}
html:root .contacts-directory .contact-row:hover{background:var(--surface-2)}
}
.profile-summary{display:grid;gap:16px}.ps-id{display:flex;align-items:center;gap:16px;min-width:0}
.ps-name{min-width:0}.ps-name h2{margin:0;font-size:24px;line-height:1.15;overflow-wrap:anywhere}
.ps-chips{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 6px}.ps-fac{margin:0;color:var(--ink-2)}
.contact-phone{display:flex;flex-wrap:wrap;gap:8px;margin:0}
html:root :is(.phone-link,.whatsapp-link){display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--surface);box-shadow:var(--sh-1);color:var(--ink);font-weight:600;text-decoration:none;transition:background-color .15s,transform .12s var(--ease)}
html:root .phone-link svg{color:var(--accent-ink)}
html:root .whatsapp-link{background:var(--success-soft);border-color:transparent;color:var(--success-ink)}
html:root :is(.phone-link,.whatsapp-link):active{transform:scale(.98)}
.profile-actions{display:flex;flex-wrap:wrap;gap:8px}.profile-actions .primary{flex:1 1 100%}.profile-actions .secondary{flex:1 1 calc(50% - 4px);min-width:0}
@media(min-width:761px){.profile-actions .primary,.profile-actions .secondary{flex:0 0 auto}}
html:root .contact-profile.profile-page{row-gap:16px}
.kv{margin:0;display:grid}.kv>div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:10px 0;border-top:1px solid var(--line)}.kv>div:first-child{border-top:0}
.kv dt{color:var(--muted);font-size:13px}.kv dd{margin:0;font-weight:600;text-align:end}
html:root .profile-page .visit-list{position:relative;margin:0;padding:2px 0 14px;padding-inline-start:18px;border:0;border-inline-start:2px solid var(--line);border-radius:0;background:none}
.profile-page .visit-list::before{content:"";position:absolute;inset-inline-start:-6px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--surface)}
.profile-page .visit-list b{font-size:14px}.profile-page .visit-list p{margin:2px 0;color:var(--ink-2)}.profile-page .card h3{margin:0 0 12px;font-size:17px}
html:root .planner-actions{padding:0;overflow:clip;margin-top:16px}
.pg-head{position:sticky;top:var(--hdr-h,0);z-index:3;display:flex;align-items:center;justify-content:space-between;margin:0;padding:8px 16px;background:var(--surface-2);border-bottom:1px solid var(--line);font-size:13px;font-weight:650;color:var(--ink-2)}
.pg-overdue .pg-head{color:var(--danger-ink)}.pg-head .count{box-shadow:none;background:var(--surface)}
.pl-item{display:flex;align-items:center;border-top:1px solid var(--line)}.pg-head+.pl-item{border-top:0}
.pl-row{flex:1;min-width:0;display:grid;grid-template-columns:minmax(48px,max-content) 32px minmax(0,1fr) auto;align-items:center;gap:4px 12px;padding:12px 16px;border:0;background:none;color:inherit;font:inherit;text-align:start;cursor:pointer}
.pl-row:hover{background:var(--surface-2)}
.pl-date{display:grid;justify-items:center;line-height:1.1}.pl-date b{font-size:20px;font-weight:700;letter-spacing:-.02em}.pl-date small{font-size:12px;color:var(--muted)}
.pl-ic{display:grid;place-items:center;width:32px;height:32px;border-radius:var(--r-sm);background:var(--b,var(--accent-soft));color:var(--t,var(--accent-ink))}.pl-ic svg{width:16px;height:16px}
.pl-body{min-width:0;display:grid;gap:1px}.pl-body b{font-size:15px;font-weight:650;overflow-wrap:anywhere}
.pl-body small{font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html:root .pl-done{margin:0;margin-inline:0 12px;width:44px;height:44px;flex:none;border-radius:50%}
@media(max-width:760px){.pl-row{grid-template-columns:minmax(44px,max-content) 32px minmax(0,1fr);padding:12px}.pl-row>.tag{grid-column:3;justify-self:start}}
.pw-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line)}
.pw-range{font-size:17px;font-weight:650}.pw-btns{display:flex;gap:6px}.pw-btns .secondary{min-width:44px;padding:0 12px}
.week-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;padding:12px;overflow:visible}
html:root .week-col{display:flex;flex-direction:column;gap:6px;min-height:260px;padding:8px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r)}
html:root .week-col-today{background:var(--accent-soft);border-color:var(--accent)}
.week-day-label{display:flex;align-items:center;gap:6px;margin:0 0 4px;color:var(--muted);font-size:13px;font-weight:650;text-align:start}
.wd-num{margin-inline-start:auto;display:grid;place-items:center;min-width:28px;height:28px;padding:0 4px;border-radius:999px;font-size:15px;font-weight:700;letter-spacing:0;color:var(--ink)}
.week-col-today .wd-num{background:var(--accent);color:var(--on-accent)}
.week-more{min-height:32px;border:1px dashed var(--danger);border-radius:var(--r-sm);background:none;color:var(--danger-ink);font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.wd-empty{margin:auto;color:var(--muted)}
html:root .week-item{--c:var(--accent);display:grid;gap:1px;width:100%;padding:6px 8px;border:0;border-inline-start:3px solid var(--c);border-radius:var(--r-sm);background:var(--b,var(--accent-soft));color:var(--t,var(--accent-ink));font:inherit;text-align:start;cursor:pointer}
html:root .week-col-today .week-item{background:var(--surface)}
.wi-time{font-size:12px;font-weight:600}.wi-title{font-size:13px;font-weight:600;line-height:1.3;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.day-strip,.day-list{display:none}
@media(max-width:760px){
.week-grid{display:none}.day-list{display:block}.ds-empty{margin:16px}.pw-nav{padding:12px}
.day-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;padding:10px 8px;position:sticky;top:var(--hdr-h,0);z-index:3;background:var(--surface);border-bottom:1px solid var(--line)}
.ds-day{display:grid;justify-items:center;gap:2px;min-height:64px;padding:6px 0;border:0;border-radius:var(--r);background:none;color:var(--ink-2);font:inherit;cursor:pointer}
.ds-day span{font-size:12px;font-weight:600;color:var(--muted)}.ds-day b{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font-size:16px}
.ds-day i{width:5px;height:5px;border-radius:50%}.ds-day i.has{background:var(--accent)}.ds-day.today b{box-shadow:inset 0 0 0 1.5px var(--accent)}
.ds-day.on{background:var(--accent-soft)}.ds-day.on b{background:var(--accent);color:var(--on-accent);box-shadow:none}.ds-day.on span{color:var(--accent-ink)}
}
html:root .visit-steps{display:flex;gap:0;max-width:560px;margin:4px 0 20px;padding:0;list-style:none}
html:root .vstep{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;position:relative;font-size:12px;font-weight:600;color:var(--muted)}
html:root .vstep-num{width:32px;height:32px;font-size:14px;font-weight:700;border-width:2px;transition:background-color .2s,border-color .2s}
html:root .vstep+.vstep::before{content:"";position:absolute;top:15px;left:auto;inset-inline-start:calc(-50% + 20px);width:calc(100% - 40px);height:2px;border-radius:2px;background:var(--line-strong)}
html:root .vstep-done+.vstep::before,html:root .vstep-active::before{background:var(--accent)}
html:root .vstep-active .vstep-num{box-shadow:0 0 0 4px var(--accent-soft)}
html:root .vstep-active{color:var(--ink)}html:root .vstep-label{max-width:104px;line-height:1.25;text-align:center}
@media(max-width:480px){html:root .vstep:not(.vstep-active) .vstep-label{display:none}html:root .vstep-active .vstep-label{display:block;max-width:90px}}
.checkin-flow .contact-search{margin:0 0 12px}html:root .checkin-flow .contact-type-filters{margin:0 0 14px}
html:root :is(#checkin-pick-list,.checkin-flow .contact-list){display:grid;gap:8px}
#checkin-pick-list>h3{grid-column:1/-1;margin:10px 0 0;font-size:13px;font-weight:650;color:var(--muted)}
html:root button.contact-row.checkin-pick{display:flex;align-items:center;gap:12px;min-height:64px;margin:0;padding:10px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);box-shadow:var(--sh-1);transition:box-shadow var(--t),transform .12s var(--ease),border-color var(--t)}
html:root button.contact-row.checkin-pick:hover{background:var(--surface);border-color:var(--accent);box-shadow:var(--sh-2)}
.fac-ic{flex:none;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:var(--r);background:var(--accent-soft);color:var(--accent-ink)}
.checkin-selected-facility{display:flex;align-items:center;gap:12px;margin-bottom:14px;padding:10px 12px;border:1px solid var(--accent);border-radius:var(--r);background:var(--accent-soft)}
.checkin-selected-facility b{flex:1;min-width:0;font-size:16px;overflow-wrap:anywhere}
html:root .choice-chips{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:8px}
html:root .field .choice-chip{position:relative;justify-content:flex-start;gap:10px;min-height:52px;margin:0;padding:0 14px;border-radius:var(--r);box-shadow:var(--sh-1);font-size:15px;line-height:1.25}
html:root .field .choice-chip span{white-space:normal}
html:root .field .choice-chip input{width:22px;height:22px;margin:0;flex:none}
html:root .choice-chip:has(input:checked){box-shadow:0 0 0 1px var(--accent)}
/* Visit form: on desktop the primary action sits after the intro (flex ordering); on phones it is a sticky bar above the bottom nav. */
@media(max-width:960px){html:root .checkin-details{display:flex;flex-direction:column}}
html:root .checkin-details .visit-actionbar{order:1;justify-content:flex-start;margin:12px 0 4px}
html:root .checkin-details .modal-actions.inflow{order:2}
.visited-today-note{margin:8px 0;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--accent-soft);color:var(--accent-ink);font-size:14px}
.tag.visited-today{white-space:nowrap}
@media(max-width:760px){html:root .checkin-flow .modal-actions:not(.inflow),html:root .visit-progress>.modal-actions{position:sticky;bottom:calc(64px + env(safe-area-inset-bottom));z-index:5;margin:16px -16px -16px;padding:12px 16px;border-top:1px solid var(--line);border-radius:0 0 var(--r-lg) var(--r-lg);background:var(--glass);backdrop-filter:saturate(180%) blur(12px)}}
html:root .checkin-flow .modal-actions.visit-actionbar,html:root .visit-progress>.modal-actions{flex-wrap:nowrap}
@media(max-width:760px){html:root .checkin-details .visit-actionbar{order:3;margin:16px -16px -16px}html:root .checkin-flow .modal-actions.visit-actionbar .primary,html:root .visit-progress>.modal-actions .primary{flex:1 1 auto}}

html:root .vp-hero{margin-bottom:18px;padding:16px;border:1px solid var(--accent);border-radius:var(--r-lg);background:var(--accent-soft)}
html:root .vp-hero .row{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:flex-start;gap:8px;margin:0}.vp-hero .row>div{min-width:0}.vp-hero .tag{flex:none}
html:root .vp-hero .visit-timer{display:flex;align-items:center;gap:10px;margin:12px 0 4px;font-size:32px;font-weight:700;letter-spacing:-.02em;line-height:1.1;color:var(--accent-ink)}
.vp-hero .visit-timer::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--success-solid)}
@media(min-width:961px){
html:root .visit-progress{max-width:1100px!important;display:grid;grid-template-columns:minmax(0,1fr) 340px;column-gap:28px;align-items:start}
.visit-progress>*{grid-column:1}.visit-progress>.vp-hero{grid-column:2;grid-row:1/span 30;position:sticky;top:calc(var(--hdr-h,0px) + 12px);margin:0}
}
@media(prefers-reduced-motion:no-preference){
@keyframes pf-up{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes pf-live{50%{opacity:.35}}
.stg:not(.noanim)>:nth-child(-n+8),.planner-action-group>.pl-item:nth-child(-n+5),.lead-board>.stage:nth-child(-n+4)>.deal:nth-of-type(-n+2){animation:pf-up .14s var(--ease) both;animation-delay:calc(var(--n,0)*40ms)}
.stg>:nth-child(2){--n:1}.stg>:nth-child(3){--n:2}.stg>:nth-child(4){--n:3}.stg>:nth-child(5){--n:4}.stg>:nth-child(6){--n:5}.stg>:nth-child(7){--n:6}.stg>:nth-child(8){--n:7}
.planner-action-group>.pl-item:nth-child(3){--n:1}.planner-action-group>.pl-item:nth-child(4){--n:2}.planner-action-group>.pl-item:nth-child(5){--n:3}
.lead-board>.stage:nth-child(2)>.deal{--n:1}.lead-board>.stage:nth-child(3)>.deal{--n:2}.lead-board>.stage:nth-child(4)>.deal{--n:3}
.vp-hero .visit-timer::before{animation:pf-live 1.6s ease-in-out infinite}
}
@media(prefers-reduced-motion:reduce){:is(.lead-card,.contact-row,.qa-btn,.pl-row,.week-item,.ds-day,.checkin-pick,.choice-chip,.pw-btns button):active{transform:none}}
/*Polish: contact names, scrolling chip rows (edge fades), empty Kanban lanes*/
html:root .contacts-directory .contact-open .ci b{color:var(--ink);font-weight:600}
html:root .stage-empty{display:grid;place-items:center;margin:6px 0;padding:22px 10px;border:1.5px dashed var(--line-strong);border-radius:var(--r-lg);background:transparent;color:var(--muted);font-size:13px;font-weight:500;text-align:center;min-height:84px}
@media(max-width:760px){
html:root :is(.contact-type-filters,.controls){display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;max-width:100%;-webkit-overflow-scrolling:touch}
:is(.contact-type-filters,.controls)::-webkit-scrollbar{display:none}
html:root :is(.contact-type-filters,.controls) .filter{flex:none;white-space:nowrap}
html:root :is(.contact-type-filters,.controls).fade-end{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent)}
html:root :is(.contact-type-filters,.controls).fade-start{-webkit-mask-image:linear-gradient(to left,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to left,#000 calc(100% - 28px),transparent)}
html:root.rtl :is(.contact-type-filters,.controls).fade-end,html:root body.rtl :is(.contact-type-filters,.controls).fade-end{-webkit-mask-image:linear-gradient(to left,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to left,#000 calc(100% - 28px),transparent)}
html:root.rtl :is(.contact-type-filters,.controls).fade-start,html:root body.rtl :is(.contact-type-filters,.controls).fade-start{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent)}
html:root body :is(.contact-type-filters,.controls).fade-start.fade-end{-webkit-mask-image:linear-gradient(to right,transparent,#000 28px,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,transparent,#000 28px,#000 calc(100% - 28px),transparent)}
}
/* Voice dictation pill (voiceButton): mic + status/timer + ع / EN language toggle */
.voice-row{display:flex;justify-content:flex-end;margin:0 0 6px}
.voice-pill{--lvl:0;display:inline-flex;align-items:stretch;border:1px solid var(--line);border-radius:999px;background:var(--white);color:var(--ink);overflow:hidden;font-size:12px;font-weight:600;line-height:1}
.voice-pill button{font:inherit;color:inherit;background:transparent;border:0;cursor:pointer;margin:0}
.vp-main{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 10px;white-space:nowrap}
.vp-main:hover,.vp-lang:hover:not(:disabled){background:rgba(14,116,144,.1)}
.vp-icon{position:relative;display:inline-flex;width:15px;height:15px;color:var(--blue)}
.vp-dot,.vp-spin,.vp-meter{display:none}
.vp-label{font-variant-numeric:tabular-nums}
.vp-lang{display:inline-flex;align-items:center;gap:3px;padding:0 9px;min-height:32px;border-inline-start:1px solid var(--line)!important;font-size:11px}
.vp-lang span{padding:3px 5px;border-radius:999px;color:var(--muted)}
.vp-lang span.on{background:var(--blue);color:#fff}
.vp-lang:disabled{opacity:.5;cursor:not-allowed}
.voice-pill[data-state=recording]{border-color:var(--red);background:rgba(239,68,68,.1)}
.voice-pill[data-state=recording] .vp-mic{display:none}
.voice-pill[data-state=recording] .vp-dot{display:block;width:11px;height:11px;margin:2px;border-radius:50%;background:var(--red);animation:vp-pulse 1s ease-in-out infinite}
.voice-pill[data-state=recording] .vp-meter{display:inline-flex;align-items:flex-end;gap:2px;height:14px}
.vp-meter i{display:block;width:3px;border-radius:2px;background:var(--red);height:calc(3px + 11px*var(--lvl));transition:height .1s}
.vp-meter i:nth-child(2){height:calc(3px + 14px*var(--lvl))}
.voice-pill[data-state=transcribing] .vp-mic{display:none}
.voice-pill[data-state=transcribing] .vp-spin{display:block;width:13px;height:13px;margin:1px;border:2px solid var(--line);border-top-color:var(--blue);border-radius:50%;animation:vp-spin .7s linear infinite}
@keyframes vp-pulse{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.55)}60%{box-shadow:0 0 0 6px rgba(239,68,68,0)}}
@keyframes vp-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.vp-dot,.vp-spin{animation:none!important}}
html.dark .voice-pill[data-state=recording]{background:rgba(248,113,113,.14)}
html.dark .vp-lang span.on{color:#052e1f}

/* Kanban drag & drop (pointer events; JS: dd* in app.js) */
.lead-card[data-drag]{cursor:grab}
.dd-handle{display:none;place-items:center;position:relative;width:28px;height:28px;margin-inline-start:auto;color:var(--muted);touch-action:none;cursor:grab}
.dd-handle::after{content:"";position:absolute;inset:-8px}
@media(pointer:coarse){.lead-board .dd-handle{display:inline-grid}}
.dd-press{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
body.dd-on{cursor:grabbing;-webkit-user-select:none;user-select:none}
.lead-board.dd-on{scroll-snap-type:none!important}
.dd-clone{position:fixed!important;top:0!important;left:0!important;z-index:80;margin:0!important;pointer-events:none;will-change:transform;cursor:grabbing;box-shadow:0 18px 40px rgba(16,16,20,.22),0 4px 10px rgba(16,16,20,.12)}
html.dark .dd-clone{box-shadow:var(--hl),0 18px 40px rgba(0,0,0,.6)}
.dd-clone.dd-settle{transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s}
.dd-clone.dd-landed{box-shadow:var(--sh-2);outline:2px dashed var(--accent);outline-offset:2px}
html:root .lead-card.dd-ph{outline:2px dashed var(--line-strong);outline-offset:-2px;border-color:transparent;background:transparent;box-shadow:none}
.dd-ph>*{visibility:hidden}
html:root .stage.dd-next{outline:1.5px dashed var(--accent);outline-offset:-3px}
html:root .stage.dd-over{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 3px var(--accent-soft),0 0 28px var(--accent-soft)}
html:root .stage.dd-over.dd-no{border-color:var(--warning);background:var(--warning-soft);box-shadow:0 0 0 3px var(--warning-soft)}
html:root .lead-card.dd-held{outline:2px solid var(--accent);outline-offset:2px;box-shadow:var(--sh-2)}
.dd-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(prefers-reduced-motion:reduce){.dd-clone.dd-settle{transition:none}}
.visit-note-text{margin:4px 0;white-space:pre-line}
.visit-note-details,.visit-note-next{display:block;margin-top:2px}
.visit-note-next{color:var(--muted,inherit)}
.checkin-now{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:12px 0 4px}
.checkin-now-hint{margin:12px 0 4px}.checkin-now-hint .sub{margin:0}
.visit-details-live{margin:8px 0 4px;padding-top:4px}
fieldset.field-invalid{outline:2px solid var(--red);outline-offset:4px;border-radius:12px}
.modal-inline-alert{margin:8px 0 0;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--red) 12%,transparent);color:var(--red);font-weight:600;font-size:14px}
#rep-coaching-notes .follow-up-row,.coaching-history .follow-up-row{grid-template-columns:minmax(0,1fr) auto}
#rep-coaching-notes .follow-up-row button{white-space:nowrap}
.smartfill-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:-4px 0 14px;padding:10px 12px;border:1px solid var(--line,#d9dee7);border-radius:12px;background:var(--surface-2,rgba(120,140,180,.08))}
.smartfill-chips{display:flex;flex-wrap:wrap;gap:6px;flex:1 1 220px}
.smartfill-actions{display:flex;gap:8px;align-items:center}
.push-prompt{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;border-inline-start:4px solid var(--accent)}
.push-prompt p{margin:2px 0 0}
.push-prompt-actions{display:flex;gap:8px}
.near-me{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin:10px 0 4px;padding:10px 12px;border:1px dashed var(--line);border-radius:12px}
.near-me.found{border:1px solid var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.home-next-wrap{position:relative}
:root .home-next-wrap>.appointment.home-next{width:100%;padding-inline-end:64px}
:root .home-next-wrap>.home-next b{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;white-space:normal;overflow-wrap:anywhere}
.home-next-checkin{position:absolute;inset-inline-end:10px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;padding:0;border-radius:50%;margin:0}
/* Planner "My day" */
.my-day{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin:4px 0 12px;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--accent) 8%,transparent);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent)}
.my-day>div{display:flex;flex-direction:column;gap:2px}
.pl-item{display:flex;align-items:center;gap:6px}
.pl-item>.pl-row{flex:1 1 auto;min-width:0}
.pl-go{flex:0 0 auto;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--accent);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.select-search{width:100%;margin-bottom:6px}
body.no-rep-actions .rep-only{display:none!important}
html:root .home-today .appointment-row{grid-template-columns:minmax(0,1fr) auto auto;column-gap:6px}
html:root .home-today .appointment-row .tag{white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;display:inline-block;vertical-align:bottom}
html:root .home-today .appointment-row .appointment>div{min-width:0}
html:root .home-today .appointment-row b .ttl{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.select-results{display:grid;gap:4px;margin:-2px 0 6px}
.select-results:empty{display:none}
.select-result{min-height:44px;text-align:start;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:inherit;font:inherit;cursor:pointer}
.select-result:hover,.select-result:focus{border-color:var(--accent)}
/* Mixed Arabic/English titles: a one-line ellipsis cuts the start of an English name in RTL, so wrap to two lines instead. */
html:root .rtl .home-next-wrap>.home-next b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
html:root .rtl .pl-body small{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

/* QA 2026-10-06 rep pass */
.smartfill-slot{min-height:0}.smartfill-slot:empty{display:none}
/* The suggestion is one compact row (chips scroll sideways), so it never grows into a tall block that pushes the next-action chips; no height is reserved while there is nothing to suggest. */
.smartfill-slot .smartfill-bar{margin:0 0 12px;flex-wrap:nowrap;padding:6px 10px;min-height:48px;max-height:56px;overflow:hidden}
.smartfill-slot .smartfill-bar>b{flex:none;font-size:13px}
.smartfill-slot .smartfill-chips{flex:1 1 auto;min-width:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.smartfill-slot .smartfill-chips .tag{flex:none;white-space:nowrap}
.smartfill-slot .smartfill-actions{flex:none}
/* Chip labels may wrap to two lines without touching the border ("Book demonstration"). */
html:root .field .choice-chip{height:auto;padding-block:9px}
html:root .field .choice-chip span{overflow-wrap:normal;word-break:normal;hyphens:none;white-space:normal}
/* Settings > Price list rows use the same controls as every other form: 44px touch height, same border, radius and focus ring. */
html:root .price-row :is(input[type=number],input[type=text],select){min-height:44px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--surface);color:var(--ink);font:inherit;font-size:16px}
html:root .price-row :is(input[type=number],input[type=text],select):focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);outline:0}
html:root .price-row input[type=checkbox]{width:20px;height:20px;min-height:0;padding:0;margin:0;flex:none;accent-color:var(--accent)}
html:root .price-row :is(.secondary,.primary){min-height:44px}
/* Deal page: the temperature and stage pills keep their own width instead of stretching across the grid card. */
.profile-summary>.tag{justify-self:start;width:max-content;max-width:100%}
/* Planner tag with "Overdue · Visit follow-up": wraps inside its column instead of being cut off (full text is in the title). */
html:root .appointment-row .appointment>.tag.tag-fit{white-space:normal;max-width:100%;overflow:visible;text-overflow:clip;line-height:1.25;overflow-wrap:normal;text-align:start}
.tag-nobreak{white-space:nowrap}
.visit-device-more{margin:0 0 12px}.visit-device-more>summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-weight:600}
#sr-opp{width:100%;max-width:100%;text-overflow:ellipsis}
.stage-checklist{display:grid;gap:8px;margin:10px 0}.stage-checklist .check{display:flex;align-items:center;gap:8px;min-height:36px}
@media(max-width:760px){.day-strip{padding-inline-end:72px}}

/* Phones: toasts stack at the top, under the header, so they never cover the cards and buttons at the bottom of a screen (e.g. Get reminders). */
@media(max-width:960px){html:root body #toast-root{top:auto;bottom:calc(144px + env(safe-area-inset-bottom))}html:root body:has(#modal-root .modal-back) #toast-root{top:calc(60px + env(safe-area-inset-top));bottom:auto}}

/* ── Rep QA v54 → 9/10 ── */
/* Failed save: the invalid field is flashed so it is obvious which one it was. */
@keyframes field-flash{0%{box-shadow:0 0 0 0 rgba(222,91,97,.55);background-color:rgba(222,91,97,.14)}60%{box-shadow:0 0 0 6px rgba(222,91,97,0);background-color:rgba(222,91,97,.08)}100%{box-shadow:0 0 0 0 rgba(222,91,97,0);background-color:transparent}}
.field-flash{animation:field-flash 1.6s ease-out 1;border-radius:12px}
@media (prefers-reduced-motion:reduce){.field-flash{animation:none;outline:2px solid var(--red,#de5b61);outline-offset:3px}}
/* One-tap note chips under the visit note and the unsuccessful-visit reason. */
.quick-notes{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.quick-notes button{font:inherit;font-size:13px;line-height:1.2;min-height:34px;padding:6px 12px;border-radius:999px;border:1px solid var(--line,#d6dbe3);background:var(--surface,#fff);color:inherit;cursor:pointer}
.quick-notes button:active{transform:scale(.97)}
.same-as-last{margin:0 0 10px}
.same-as-last button{font:inherit;font-size:14px;min-height:40px;padding:8px 14px;border-radius:12px}
/* A dialog whose request is in flight stays in the page (values and handlers intact) but is out of sight. */
#modal-root.modal-parked{display:none}
.pending-send{display:flex;align-items:center;gap:8px;margin:6px 0;padding:8px 12px;border-radius:12px;background:var(--amber-bg,#fff7e0);color:var(--amber-text,#7a5200);font-size:14px;font-weight:600}
.pending-send::before{content:"";width:12px;height:12px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;animation:pending-spin .8s linear infinite;flex:none}
@keyframes pending-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.pending-send::before{animation:none}}

/* Offer replace-warning: the form stays in place (frozen) so the dialog never collapses. */
.offer-frozen{opacity:.55;pointer-events:none}
/* Side drawer: "Clear this device" is a separate, danger-styled action at the bottom, away from the theme switch. */
.nav-danger-zone{margin-top:26px;padding-top:12px;border-top:1px solid var(--side-line,rgba(255,255,255,.14))}
html:root .side .nav-item.nav-item-danger{color:#f59ea1;opacity:1}
html:root .side .nav-item.nav-item-danger:hover{background:rgba(239,68,68,.16);color:#ffc9cb}
/* Check-in: the location chip has its row reserved, so it appearing never shifts the card. */
.vp-hero #visit-gps-chip{display:block;width:fit-content;max-width:100%;vertical-align:top;height:28px;line-height:18px;box-sizing:border-box;margin:8px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.visit-timer{min-height:1.4em}
/* Deal cards: the Next button keeps its words whole; it wraps to its own line instead of breaking mid-word (Arabic included). */
html:root .lead-card .deal-footer .next{white-space:nowrap;word-break:keep-all;overflow-wrap:normal;flex:none;max-width:100%;overflow:hidden;text-overflow:ellipsis}
/* Home KPI with several currencies: one equal line per currency. */
.home-kpis .kpi-value .cur-line,.home-kpis .kpi-value .cur-line.sec{font-size:.8em;font-weight:inherit;color:inherit}
/* Drawer: removing the offline copy is neutral (the danger lives in the confirmation sheet). */
.nav-item.nav-item-offline-copy{align-items:flex-start;text-align:start}
.nav-item.nav-item-offline-copy .nav-item-text{display:flex;flex-direction:column;gap:2px;min-width:0;line-height:1.25}
.nav-item.nav-item-offline-copy small{font-size:12px;opacity:1;color:var(--side-muted,#a8a29e);font-weight:400;white-space:normal}
/* Buttons and amounts never break mid-word / between currency and number (375-1100px, LTR and RTL). */
html:root .lead-row .lr-act,html:root .lead-row .lr-value,html:root .lead-row .lr-stage,html:root .lead-card .deal-value,html:root .lead-card .next,html:root .lead-row .lc-next,html:root .deal-value{white-space:nowrap;word-break:keep-all;overflow-wrap:normal;hyphens:none}
html:root .lead-row .lr-act,html:root .lead-row .lr-value{flex:none}

.pl-date{min-width:44px}.pl-date b,.pl-date small{white-space:nowrap;word-break:keep-all;overflow-wrap:normal}
.rtl .pl-date small{font-size:13px}

/* Arabic/phone text never breaks mid-word in the planner strip, week nav or bottom nav labels. */
html:root .ds-day span,html:root .wd-name,html:root .pw-btns .secondary,html:root .mobile-nav .nav-item{white-space:nowrap}
html:root .pw-btns .secondary{flex:none}.pw-range{min-width:0;overflow-wrap:anywhere}
html:root .mobile-nav .nav-item{overflow:hidden}

.shift-notice{margin:8px 0 0;font-size:13px;color:var(--accent-ink)}
/* Smart-fill suggestion: on phones it overlays the quick-note chip row (same space), so nothing below it ever moves. */
@media(max-width:760px){
  html:root .note-assist{position:relative;min-height:56px}
  html:root .note-assist .smartfill-slot{position:absolute;inset:0 0 auto 0;z-index:2;display:block}
  html:root .note-assist .smartfill-slot:empty{display:none}
  html:root .note-assist .smartfill-slot .smartfill-bar{height:56px;max-height:56px;margin:0;background:var(--surface);box-sizing:border-box}
  html:root .note-assist:has(.smartfill-bar) .quick-notes{visibility:hidden}
}
/* Narrow phones: two rows. Row 1 is the suggested chips (own line, readable), row 2 is Apply + Dismiss, both 44px. The label is kept for screen readers only. The opaque bar covers the quick-phrase row (which stays rendered, not hidden, so nothing leaves a gap) and they come back as soon as it is applied or dismissed. */
@media(max-width:400px){
  html:root .note-assist:has(.smartfill-bar) .quick-notes{visibility:visible}
  html:root .note-assist .smartfill-slot .smartfill-bar{height:auto;max-height:none;min-height:100%;flex-wrap:wrap;row-gap:6px;padding:6px 10px;overflow:visible}
  html:root .note-assist .smartfill-slot .smartfill-bar>b{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  html:root .note-assist .smartfill-slot .smartfill-chips{flex:1 1 100%;min-width:0;flex-wrap:nowrap;overflow-x:auto;gap:6px}
  html:root .note-assist .smartfill-slot .smartfill-chips .tag{flex:0 0 auto;min-width:max-content;max-width:none}
  html:root .note-assist .smartfill-slot .smartfill-actions{flex:1 1 100%;justify-content:space-between;gap:8px}
  html:root .note-assist .smartfill-slot .smartfill-actions :is(.primary,.text-button){min-height:44px;min-width:44px;flex:1 1 0}
}

/* Outcome other than "met": the reason field already has the quick-note chips, so the main note shows none (one chip row, not two). */
body:has(#visit-unsuccessful-fields:not(.hidden)) .quick-notes[data-for="visit-note"]{display:none}
/* Anything scrolled into view (focus, validation jumps) lands above the sticky visit bar, not under it. */
@media(max-width:760px){html:has(.visit-actionbar),html:has(.visit-progress){scroll-padding-bottom:calc(150px + env(safe-area-inset-bottom))}}
/* Phone toasts float over content: taps go through them (only a toast's own button is tappable). */
@media(max-width:960px){html:root body #toast-root .toast{pointer-events:none}html:root body #toast-root .toast button{pointer-events:auto}}
/* With the sticky visit action bar on screen (it can grow to two rows of whole buttons), keep messages clear above it. */
@media(max-width:960px){html:root body:has(.visit-progress > .modal-actions) #toast-root{bottom:calc(168px + env(safe-area-inset-bottom))}html:root body:has(#modal-root .modal-back) #toast-root{top:calc(60px + env(safe-area-inset-top));bottom:auto}}
.follow-none-quiet{order:99;opacity:.7}

/* ── Rep phone QA v64: compact, non-blocking toasts ──
   A toast is a one-line pill under the header (2 lines at most, full text on tap); it moves to the bottom bar only when it would cover the field just used. */
@media(max-width:760px){
  html:root body #toast-root.toast-phone{top:calc(64px + env(safe-area-inset-top));bottom:auto;inset-inline:12px;max-width:none;width:auto;margin-inline:auto}
  html:root body #toast-root.toast-phone.toast-bottom{top:auto;bottom:calc(88px + env(safe-area-inset-bottom))}
  html:root body:has(.visit-progress > .modal-actions) #toast-root.toast-phone.toast-bottom{bottom:calc(168px + env(safe-area-inset-bottom))}
  html:root body:has(#modal-root .modal-back) #toast-root.toast-phone{top:calc(60px + env(safe-area-inset-top));bottom:auto}
  html:root body #toast-root.toast-phone .toast.toast-compact{pointer-events:auto;padding:7px 12px 9px;font-size:13px;line-height:1.35;gap:8px;min-height:0;align-items:center;cursor:pointer;border-radius:999px;width:fit-content;max-width:100%;margin-inline:auto}
  html:root body #toast-root.toast-phone .toast.toast-compact::before{display:none}
  html:root body #toast-root.toast-phone .toast.toast-compact{border-inline-start:4px solid var(--tc,var(--info));position:relative;text-align:start}
  html:root body #toast-root.toast-phone .toast.toast-compact .toast-progress{position:absolute;bottom:0;left:0;right:0;height:2px}
  html:root body #toast-root.toast-phone .toast.toast-compact:not(.toast-expanded){display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;text-overflow:ellipsis}
  html:root body #toast-root.toast-phone .toast.toast-compact.toast-expanded{border-radius:var(--r);cursor:default}
  html:root body #toast-root.toast-phone .toast.toast-compact:has(.toast-action){display:flex}
}
/* Rep phone QA v64: the check-in confirmation ("Just checked in" / elapsed time) is one compact status line, not a 32px headline. */
html:root body .vp-hero .visit-timer{font-size:14px;font-weight:600;letter-spacing:0;line-height:1.3;margin:6px 0 0;min-height:0;gap:8px}
html:root body .vp-hero .visit-timer::before{width:8px;height:8px}
html:root body .vp-hero{padding:12px 14px}

/* Rep phone v75: Quick finish row, "Same as last time", reminder result card, phone date picker. */
.quick-finish{display:grid;gap:6px;margin-top:6px}
.quick-finish .qf-head{display:none;align-items:center;flex-wrap:wrap;gap:6px 10px;font-size:13px}
.quick-finish.qf-on .qf-head{display:flex}
.quick-finish .quick-notes{margin-top:0}
.qf-next{font:inherit;font-size:13px;line-height:1.2;min-height:34px;padding:6px 12px;border-radius:999px;border:1px solid var(--line,#d6dbe3);background:var(--surface,#fff);color:inherit;cursor:pointer;max-width:100%;text-align:start}
.qf-next.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--surface,#fff));font-weight:650}
.qf-next.on::before{content:"✓ "}
.quick-notes .qn-chip{display:inline-flex;max-width:100%}
.quick-notes .qn-chip .qn-fill{text-align:start}
.quick-notes .qn-chip .qn-save{display:none}
.quick-notes[data-ready="1"] .qn-chip .qn-fill{border-start-end-radius:0;border-end-end-radius:0;border-inline-end-width:0}
.quick-notes[data-ready="1"] .qn-chip .qn-save{display:inline-flex;align-items:center;gap:4px;font-weight:700;color:var(--accent);border-start-start-radius:0;border-end-start-radius:0;border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--surface,#fff));min-height:34px}
html:root .visit-progress>.modal-actions .primary[data-ready="1"]{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.visit-progress.qf-saving{opacity:.7}
.checkin-pick-wrap{display:grid;gap:4px}
.checkin-pick-wrap .same-as-last-time{justify-self:start;margin-inline-start:12px;min-height:36px}
.push-steps{margin:6px 0 0;padding-inline-start:18px;font-size:13px;line-height:1.5}
.push-done{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;border-inline-start:4px solid var(--green)}
.push-done p{margin:2px 0 0}
.push-prompt.push-blocked,.push-prompt.push-install,.push-prompt.push-unsupported{border-inline-start-color:var(--amber)}
.dp-trigger{display:none}
@media(max-width:760px){
  .dp-trigger{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:10px 14px;border:1px solid var(--line);border-radius:var(--r,12px);background:var(--surface,#fff);color:inherit;font:inherit;text-align:start;cursor:pointer}
  .dp-trigger.dp-empty .dp-value{color:var(--muted)}
  .dp-trigger.dp-invalid{border-color:var(--red)}
  .dp-trigger .dp-value{flex:1;min-width:0}
  input.dp-native{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;margin:0!important;padding:0!important;border:0!important}
  .field:has(>input.dp-native){position:relative}
  input.dp-native+.date-hint{display:none}
}
.dp-backdrop{position:fixed;inset:0;z-index:300;background:var(--scrim,rgba(0,0,0,.45));display:flex;align-items:flex-end;justify-content:center}
.dp-sheet{width:100%;max-width:480px;max-height:90vh;overflow:auto;background:var(--surface,#fff);color:var(--ink,inherit);border-radius:18px 18px 0 0;padding:14px 14px calc(14px + env(safe-area-inset-bottom));box-shadow:0 -8px 30px rgba(0,0,0,.25)}
.dp-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.dp-chip{font:inherit;font-size:13px;min-height:36px;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface,#fff);color:inherit;cursor:pointer}
.dp-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.dp-nav{width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:inherit;font-size:24px;cursor:pointer}
.dp-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;text-align:center}
.dp-dow{font-size:11px;color:var(--muted);padding:4px 0}
.dp-day{min-height:42px;border:0;border-radius:10px;background:transparent;color:inherit;font:inherit;cursor:pointer}
.dp-day.now{box-shadow:inset 0 0 0 1px var(--accent)}
.dp-day.sel,.dp-month.sel{background:var(--accent);color:#fff}
.dp-months{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.dp-month{min-height:46px;border:1px solid var(--line);border-radius:10px;background:transparent;color:inherit;font:inherit;cursor:pointer}
.dp-time{display:flex;align-items:center;justify-content:center;gap:8px;margin:10px 0 0}
.dp-time label{display:flex;align-items:center;gap:6px;font-size:13px}
.dp-time select{min-height:42px;font:inherit}
.dp-actions{display:flex;gap:8px;margin-top:12px}.dp-actions .primary{flex:1}

html:root .contact-open .ci,html:root .contact-open .ci-fac{text-align:start;justify-self:start}html:root .contact-open .ci-fac{display:block}
.visit-list .visit-by{display:block;color:var(--muted)}

/* 114: flexible stages - stage picker back hint, Lost -> On hold suggestion, stage history with addenda (logical properties for RTL) */
.stage-back-hint{margin:6px 0 0;padding:8px 10px;border-radius:var(--r,9px);background:var(--warning-soft,#fff0d9);color:var(--warning-ink,#8a5a00);font-size:13px}
.lost-hold-suggest{margin-top:8px;padding:10px 12px;border-radius:var(--r,9px);background:var(--warning-soft,#fff0d9);color:var(--warning-ink,#8a5a00)}
.lost-hold-suggest p{margin:0 0 8px;color:inherit}
.lost-hold-suggest[hidden]{display:none}
.stage-history-list{list-style:none;margin:10px 0 12px;padding:0}
.stage-history-item{border-inline-start:3px solid var(--line);padding-inline-start:12px;margin:0 0 12px}
.stage-history-item p{margin:4px 0;color:var(--muted);font-size:13px}
.stage-addendum{margin:6px 0 0;padding-inline-start:10px;border-inline-start:2px dashed var(--line)}
.stage-addendum p{margin:0;color:var(--ink)}
.stage-addendum small{display:block;color:var(--muted)}
.visit-stage-label{font-weight:400;color:var(--muted)}

/* Deal page header: pills share one wrapping row; tight spacing between doctor, product and facility. */
html:root .deal-summary{gap:4px}
html:root .deal-summary>h2{margin:4px 0 0}
html:root .deal-summary>p{margin:0}
html:root .deal-summary>.profile-actions{margin-top:12px}
.deal-pills{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.deal-pills>.tag{width:auto;max-width:100%}
/* Planner / Home rows: a name never wraps mid-way; it ellipsizes inside its own column. */
.appointment-row .appointment{min-width:0}
.appointment-row .appointment>div{min-width:0}
:is(.appointment-row,.pl-item) .ttl bdi{display:inline-block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}
.home-waiting-send{margin:0;min-height:44px;display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-weight:600;flex:1 1 auto;min-width:0}
.home-queue{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;margin:12px 0;padding:6px 12px;border-inline-start:4px solid var(--amber);border-radius:10px;background:var(--surface-2,transparent)}
.home-queue>button{min-height:40px}
.home-queue-card{margin-bottom:16px;padding:10px 14px}
.home-queue-card .home-queue{margin:0;padding:0 0 0 0;padding-inline-start:12px}
/* "Show N more" for long lists (Planner sections, Contacts, Deals) */
.list-more{display:flex;justify-content:center;padding:12px 16px;border-top:1px solid var(--line)}
.list-more-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px}
.board .stage .list-more{padding:8px 0;border-top:0}
/* Likely duplicate doctor, inside the Create contact form */
.dup-warning{border:1px solid #f2dc9e;background:#fff8e6;color:#5c4400;border-radius:10px;padding:12px 14px;margin-top:14px}
html.dark .dup-warning{background:#2a2312;border-color:#5c4a1a;color:#f5deb0}
.dup-warning p{margin:0 0 6px;color:inherit}
.dup-warning .dup-list{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:8px}
.dup-warning .dup-list li{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px}
.dup-warning .dup-list li button{margin-inline-start:auto;min-height:36px}
.dup-warning>button{min-height:40px}