/* m-brand.css (L122) — brand colours + space fixes for Home and My day. Loaded last, after m-corp.css. Tokens only (no hex / rgb literals).
   Brand: Starlight navy #162D4C · Sand #CEA577 · Blue #6483AA · Metallic #C0C0C0.
   Rule of thumb used here: navy = surface and structure, sand = the one thing to press / the highlight, blue = information,
   green / red are kept ONLY where they carry meaning (done, overdue). */

/* ============================== HOME ============================== */

/* 1 — The "Leads received" card carries class "mo" (month). The More-sheet rule `.mo` (m-shell.css: absolute, centred, max-width 560)
   was applying to it too, which shrank it to its content and centred it with empty space on both sides. Undo every part of that rule. */
.cm-ks .cm-k.mo{position:relative;inset:auto;bottom:auto;margin:0;max-width:none;max-height:none;overflow:visible;animation:none;
  grid-column:1/-1;padding:var(--sp-3);border-radius:var(--rd-md);background:var(--bg-surface);box-shadow:var(--sh-1)}

/* 2 — phone: use the full width of that card — the number sits left, "This month · 15 today" sits right on the same row */
@media (max-width:699px){
  .cm-ks .cm-k.mo{grid-template-areas:"i l c" "n s s";align-items:center}
  .cm-ks .cm-k.mo b{margin:0}
  .cm-ks .cm-k.mo small{align-self:center;text-align:end}
  .cm-ks .cm-k.mo .cm-kc{align-self:start}
}

/* 3 — Home number colours: navy numbers, sand rule on top; red only for "not contacted" (it needs action), brown amber retired */
.cm-k{border-top-color:var(--c-sand)}
.cm-k.mo b,.cm-k.a b{color:var(--c-starlight)}
.cm-k.a{border-top-color:var(--c-sand-dark)}
.cm-ki{background:rgba(var(--c-sand-rgb),.22);color:var(--c-starlight)}

/* 4 — main action: navy card, sand button, a thin sand rule on the start edge (inset shadow so the rounded corners stay clean) */
.cm-act{background:linear-gradient(135deg,var(--c-starlight),var(--c-starlight-dark));box-shadow:inset 3px 0 0 var(--c-sand),var(--sh-2)}
.cm-ai{background:rgba(var(--c-sand-rgb),.18)}
.cm-act.r .cm-ai{color:var(--c-sand-light)}
.cm-go{background:var(--c-sand);color:var(--c-starlight)}
.cm-go:hover{background:var(--c-sand-light)}

/* 5 — team table: header strip in sand wash, avatars navy with a sand ring */
.cm-th{color:var(--c-sand-dark);font-weight:var(--fw-bold)}
.cm-team{border-top:3px solid var(--c-sand)}

/* ============================== MY DAY ============================== */

/* 6 — greeting bar: pure brand navy (was navy → bright blue) and a sand progress ring */
.td:has(.md) .td-hero{background:linear-gradient(135deg,var(--c-starlight-dark),var(--c-starlight));box-shadow:var(--sh-2)}
.td:has(.md) .td-ring i{background:conic-gradient(var(--c-sand) calc(var(--p)*1%),rgba(var(--c-white-rgb),.24) 0)}
.td:has(.md) .td-tab.on{background:var(--c-starlight)}

/* 7 — pipeline strip inside the bar: the "Lost" chip spans two cells instead of wrapping letter by letter */
.stg-mini .stg-lostchip{white-space:nowrap}
@media (max-width:699px){.stg-mini .stg-lostchip{grid-column:span 2;justify-self:center}}

/* 8 — "Do this next": navy with sand highlights (was a washed-out blue). Late = deep red, due today = bronze keep their meaning. */
.md-next.new{--a:var(--c-x-1f3b63);--b:var(--c-starlight-dark);--g:var(--c-starlight-rgb)}
.md-next::before{background:radial-gradient(circle,rgba(var(--c-sand-rgb),.2),transparent 68%)}
.md-next::after{background:linear-gradient(110deg,transparent 35%,rgba(var(--c-sand-rgb),.16) 50%,transparent 65%)}
.md-next .md-why{color:var(--c-sand-light)}
.md-next .md-av{background:rgba(var(--c-sand-rgb),.16);box-shadow:inset 0 0 0 2px rgba(var(--c-sand-rgb),.75);color:var(--c-sand-light)}
.md-next .md-stage{background:rgba(var(--c-sand-rgb),.2);color:var(--c-sand-light)}
.md-next .md-reason{color:var(--c-white)}
/* the one thing to press = sand; WhatsApp = outlined; the arrow = quiet */
.md-next .md-cta.call{background:var(--c-sand);color:var(--c-starlight);box-shadow:var(--sh-2)}
.md-next .md-cta.call .td-i{color:var(--c-starlight)}
.md-next .md-cta.wa{background:rgba(var(--c-white-rgb),.08);color:var(--c-white);box-shadow:inset 0 0 0 1.5px rgba(var(--c-sand-rgb),.7)}
.md-next .md-cta.open{background:rgba(var(--c-white-rgb),.08);box-shadow:inset 0 0 0 1.5px rgba(var(--c-white-rgb),.28)}
.md-next .md-q{background:rgba(var(--c-white-rgb),.1);box-shadow:inset 0 0 0 1px rgba(var(--c-white-rgb),.18)}
.md-next .md-q:hover{background:rgba(var(--c-white-rgb),.18)}
.md-next .md-q.ok{background:var(--c-white);color:var(--c-starlight);box-shadow:none}
.md-next .md-q.mv{background:rgba(var(--c-black-rgb),.18)}
.md-steps li.on i{background:var(--c-sand);color:var(--c-starlight)}

/* 9 — "N new leads today" banner: sand (it is the thing to tap), so it no longer repeats the navy card right below it */
.md-fresh{--a:var(--c-sand-light);--b:var(--c-sand);--g:var(--c-sand-dark-rgb);color:var(--c-starlight)}
.md-fresh::after{background:linear-gradient(110deg,transparent 35%,rgba(var(--c-white-rgb),.4) 50%,transparent 65%)}
.mf-ic{background:rgba(var(--c-starlight-rgb),.12)}
.mf-go{background:var(--c-starlight);color:var(--c-white)}

/* 10 — four number-filters: new = brand blue, plan = navy, today = sand, late = deep red (the colour still tells you what it is) */
.md-k.new{--a:var(--c-blue)}

/* 11 — rows: one navy call button, WhatsApp outlined in sand, done stays the only green on the page */
.md .td-ib.call{background:var(--c-starlight);border-color:var(--c-starlight);box-shadow:none}
.md .td-ib[data-act=wa]{color:var(--c-starlight);border-color:rgba(var(--c-sand-dark-rgb),.65);background:rgba(var(--c-sand-rgb),.14)}
.md .td-ib.date{color:var(--c-starlight);background:rgba(var(--c-sand-rgb),.22)}
.md-row{box-shadow:inset 3px 0 0 rgba(var(--g),.85),var(--sh-1)}

/* 12 — day-end summary bar: sand */
.md-bar i{background:linear-gradient(90deg,var(--c-sand-dark),var(--c-sand))}
.md-sum{border-top:3px solid var(--c-sand)}

/* 13 — wide screens: next card on the start side, the four filters + list on the other, instead of one long column with empty sides */
@media (min-width:900px){
  .md:has(>.md-next){max-width:1180px;grid-template-columns:minmax(340px,5fr) minmax(0,7fr);column-gap:var(--sp-4);align-items:start}
  .md:has(>.md-next)>:is(.md-hrs,.md-fresh,.md-goal,.md-sum,.md-empty){grid-column:1/-1}
  .md:has(>.md-next)>.md-next{grid-column:1;grid-row:span 2}
  .md:has(>.md-next)>:is(.md-ks,.md-then){grid-column:2}
  .md:has(>.md-next) .md-list{grid-template-columns:minmax(0,1fr)}
}

/* ===== L124 — Manager Home: compact, no dead space. Order: hello+month · 3 numbers · 3 chips · main action · team (last, fills the rest). ===== */
.h3.cm2{gap:var(--sp-2);padding-bottom:var(--sp-3)}
/* hello row: greeting + date left; month pill + two small buttons right */
.cm .h3-hello{align-items:center;gap:var(--sp-2)}
.cm .h3-hello>div:first-child{min-width:0;flex:1 1 auto}
.cm .h3-hello h1{font-size:var(--fs-lg);line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm .h3-hello p{margin:0;font-size:var(--fs-xs)}
.cm .h3-hr{flex:none;gap:var(--sp-1)}
.cm .h3-hr .h3-sb{width:36px;height:36px}
.cm .h3-hr .h3-sb .hx-i{width:16px;height:16px}
.cm .h3-hr .cm-mo{display:block;flex:none}
.cm .h3-hr .cm-mo .lf-top.mo-solo{margin:0!important}
/* three numbers in ONE row */
.cm-ks{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-2)}
.cm-ks .cm-k.mo,.cm-k.mo{grid-column:auto}
.cm-ks .cm-k,.cm-ks .cm-k.mo{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"l l" "n i" "s s";padding:var(--sp-2) var(--sp-3);row-gap:0;column-gap:var(--sp-1);align-items:center}
.cm-ks .cm-k.mo b,.cm-ks .cm-k b{margin:0;font-size:var(--fs-display);line-height:1.1}
.cm-ks .cm-k .cm-kl{font-size:var(--fs-xs);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cm-ks .cm-k .cm-ki{width:24px;height:24px}
.cm-ks .cm-k .cm-ki .hx-i{width:14px;height:14px}
.cm-ks .cm-k .cm-kc{display:none}
.cm-ks .cm-k small,.cm-ks .cm-k.mo small{font-size:11px;line-height:1.25;text-align:start;align-self:start;white-space:normal}
/* three small chips (follow-ups / viewings / hot) as one slim row */
.cm-more{gap:var(--sp-2)}
.cm-m{flex-direction:row;align-items:center;justify-content:center;gap:var(--sp-1);min-height:40px;padding:var(--sp-1) var(--sp-2)}
.cm-m b{font-size:var(--fs-md)}
.cm-m span{font-size:11px;line-height:1.15}
/* main action: icon | text | round button (no tall block) */
.cm-act{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--sp-2) var(--sp-3);padding:var(--sp-3)}
.cm-ai{width:32px;height:32px;align-self:start}
.cm-ai .hx-i{width:18px;height:18px}
.cm-act small{font-size:11px}
.cm-act b{font-size:var(--fs-md);line-height:1.2}
.cm-act p{margin:2px 0 0;font-size:var(--fs-xs);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cm-go{grid-column:auto;width:44px;min-height:44px;height:44px;padding:0;border-radius:50%}
.cm-go .cm-gt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cm-go .hx-i{width:20px;height:20px}
/* team table: tighter rows */
.cm-team{padding:var(--sp-2) var(--sp-3)}
.cm-team>header{margin-bottom:0}
.cm-team>header .h3-link{min-height:36px;margin-block:-4px}
.cm-th,.cm-row{grid-template-columns:minmax(0,1fr) 36px 36px 36px 36px}
.cm-row{padding:2px 0}
.cm-who{min-height:42px;gap:var(--sp-2)}
.cm-who .dz-av{width:30px;height:30px;font-size:11px;flex:none}
.cm-nm b{font-size:var(--fs-md);line-height:1.2}
.cm-nm small{font-size:11px;line-height:1.2}
.cm-n{min-height:42px;font-size:var(--fs-md)}
.cm-nudge{width:32px;height:32px}
@media (min-width:700px){
  .cm-act{grid-template-columns:auto minmax(0,1fr) auto}
  .cm-go{width:auto;height:auto;min-height:44px;padding:0 var(--sp-4);border-radius:var(--rd-pill)}
  .cm-go .cm-gt{position:static;width:auto;height:auto;clip:auto;overflow:visible;margin-inline-end:var(--sp-1)}
  .cm-ks .cm-k b{font-size:var(--fs-display)}
}

/* L125 — Home: "Add lead" sits in the hello row (replaces export/search); the top-bar + is hidden only while this Home is on screen */
.cm .h3-hr .cm-add{width:36px;height:36px;background:var(--c-sand);border-color:var(--c-sand);color:var(--c-starlight)}
.cm .h3-hr .cm-add:hover{background:var(--c-sand-light)}
.cm .h3-hr .cm-add .hx-i{width:18px;height:18px}
html body:has(.cm[data-h3="mgr"]) header.top .bh-add,html body:has(.cm[data-h3="mgr"]) header.top>.bh-i.bh-add{display:none}

/* L126 — Team row with leads waiting for the first call: red name + "N pending" flag + red line "Oldest waiting … since assignment" */
.cm-l1{display:flex;align-items:center;gap:var(--sp-1);min-width:0}
.cm-l1 b{min-width:0;flex:0 1 auto}
.cm-flag{flex:none;display:inline-flex;align-items:center;gap:4px;padding:1px 7px;border-radius:var(--rd-pill);background:var(--tx-danger);color:#fff;font-style:normal;font-size:11px;font-weight:var(--fw-bold);line-height:1.5;letter-spacing:.01em}
.cm-flag::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.9}
.cm-row.red .cm-nm b{color:var(--tx-danger)}
.cm-row.red{box-shadow:inset 3px 0 0 var(--tx-danger);padding-inline-start:var(--sp-2)}
.cm-row.red .cm-nm small{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-weight:var(--fw-med)}
.cm-row.red .cm-who .dz-av{box-shadow:0 0 0 2px var(--tx-danger)}

/* L128 — lead card: "Waiting 3h 25m since assigned" for assigned leads with no contact yet */
.lx-wait{color:var(--tx-danger);font-weight:var(--fw-med);white-space:nowrap}
.lx-wait b{font-weight:var(--fw-bold);font-variant-numeric:tabular-nums}
.lead.lx .ph-as:has(.lx-wait){min-width:0;overflow:hidden;text-overflow:ellipsis}
.lx-wc::before{content:"\00b7";margin-inline:5px;color:var(--tx-muted);font-weight:var(--fw-bold)}
.lead.lx .lx-top .lx-wait{padding:1px 8px;border-radius:var(--rd-pill);font-size:var(--fs-xs);background:color-mix(in srgb,var(--tx-danger) 10%,transparent)}