/* ===========================================================
   MAX3 Momentum OS — Staff profile lens styles (.staffp)
   Builds on profile.css; adds clock card, role chips, permission
   toggles, timesheet. Tokens from tokens.css.
   =========================================================== */
/* availability editor (v4 §5 — shared records with the unified calendar) */
.sav-note{font-size:11px;color:var(--m3-text-3);font-weight:600;margin:2px 0 8px;text-wrap:pretty}
.sav-list{display:flex;flex-direction:column;gap:6px}
.sav-row{display:flex;align-items:center;gap:8px;background:var(--m3-surface-3);border:1px solid var(--m3-line);border-radius:9px;padding:7px 10px}
.sav-in{
  height:28px;background:var(--m3-bg);border:1px solid var(--m3-line);border-radius:7px;color:var(--m3-text);
  font-family:var(--ff);font-size:12px;font-weight:600;padding:0 8px
}
.sav-in.mono{font-family:var(--mono);font-size:11.5px}
.sav-suf{font-size:11px;color:var(--m3-text-3);font-weight:600}
.sav-acts{display:flex;align-items:center;gap:8px;margin-top:9px}
.profile.staffp .pname{align-items:center}
.profile .role-chip{font-size:10px;font-weight:800;letter-spacing:.3px;padding:3px 9px;border-radius:5px;
  background:rgba(59,158,232,.16);color:var(--m3-blue);border:1px solid rgba(59,158,232,.4);text-transform:uppercase}
.profile .own-lock{font-size:9px;font-weight:800;letter-spacing:.2px;color:var(--m3-amber);background:rgba(245,166,35,.14);
  border:1px solid rgba(245,166,35,.4);border-radius:4px;padding:1px 6px;text-transform:uppercase;margin-left:8px}
.profile .own-lock.sm{margin-left:auto;background:none;border:0;padding:0;color:var(--m3-text-3)}
.profile .stafflens{display:flex;align-items:center;gap:9px;flex-wrap:wrap;background:rgba(59,158,232,.08);border:1px solid rgba(59,158,232,.3);
  border-radius:8px;padding:9px 13px;margin-bottom:12px;font-size:12px;color:var(--m3-text-2)}
.profile .view-as select{background:var(--m3-surface-2);border:1px solid var(--m3-line);color:var(--m3-text);border-radius:6px;padding:3px 7px;font-family:var(--ff);font-size:11.5px;font-weight:700;cursor:pointer;outline:none}
.profile .view-as{margin-left:auto}

/* live clock card in hero */
.profile .clockcard{margin-left:auto;flex:0 0 auto;background:var(--m3-bg);border:1px solid var(--m3-line);
  border-radius:11px;padding:12px 15px;min-width:190px;text-align:right}
.profile .cc-state{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.3px;color:var(--m3-text-3)}
.profile .cc-state .d{width:8px;height:8px;border-radius:50%;background:var(--m3-text-3)}
.profile .cc-state.on{color:var(--m3-lime)}
.profile .cc-state.on .d{background:var(--m3-lime);box-shadow:0 0 0 3px rgba(170,221,68,.16)}
.profile .cc-elapsed{font-size:26px;font-weight:800;font-family:var(--mono);letter-spacing:-1px;margin-top:3px}
.profile .cc-since{font-size:10.5px;color:var(--m3-text-3);margin-top:2px}
.profile .cc-remind{font-size:10px;font-weight:700;color:var(--m3-amber);background:rgba(245,166,35,.12);
  border:1px solid rgba(245,166,35,.35);border-radius:6px;padding:3px 7px;margin-top:7px;display:inline-block}

/* role assignment row */
.profile .role-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.profile .role-select{background:var(--m3-bg);border:1px solid var(--m3-line);color:var(--m3-text);border-radius:8px;
  padding:9px 12px;font-family:var(--ff);font-size:13px;font-weight:700;cursor:pointer;outline:none}
.profile .role-select:disabled{opacity:.6;cursor:not-allowed}
.profile .dual-note{font-size:11px;color:var(--m3-blue);font-weight:600}
.profile .settings-link{margin-left:auto;font-size:11.5px;color:var(--m3-blue);font-weight:700;cursor:pointer;white-space:nowrap}
.profile .settings-link:hover{text-decoration:underline}

/* location access */
.profile .loc-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.profile .loc-pill{font-size:11px;font-weight:700;padding:5px 11px;border-radius:7px;border:1px solid var(--m3-line);background:var(--m3-surface-3);color:var(--m3-text-2)}
.profile .loc-pill.full{border-color:rgba(170,221,68,.4);color:var(--m3-lime);background:rgba(170,221,68,.08)}

/* permissions */
.profile .ov-key{font-size:9px;font-weight:600;color:var(--m3-text-3);text-transform:none;letter-spacing:0;margin-left:8px}
.profile .perm-gate{font-size:11.5px;color:var(--m3-amber);background:rgba(245,166,35,.1);border:1px solid rgba(245,166,35,.35);
  border-radius:8px;padding:9px 12px;margin-bottom:10px;line-height:1.45}
.profile .perm-gate b{color:var(--m3-text)}
.profile .perm-group{margin-bottom:12px}
.profile .perm-glabel{font-size:9.5px;letter-spacing:.5px;text-transform:uppercase;color:var(--m3-text-3);font-weight:700;margin:10px 0 6px;display:flex;align-items:center}
.profile .perm-toggle{display:flex;align-items:center;gap:11px;width:100%;background:var(--m3-bg);border:1px solid var(--m3-line);
  border-radius:8px;padding:9px 12px;margin-bottom:6px;cursor:pointer;font-family:var(--ff);text-align:left}
.profile .perm-toggle:hover{border-color:var(--m3-gray)}
.profile .perm-toggle.locked{opacity:.55;cursor:not-allowed}
.profile .perm-toggle.override{border-color:rgba(245,166,35,.5);background:rgba(245,166,35,.06)}
.profile .perm-sw{width:34px;height:19px;border-radius:10px;background:var(--m3-surface-3);border:1px solid var(--m3-line);position:relative;flex:0 0 auto;transition:.12s}
.profile .perm-sw .knob{position:absolute;top:1px;left:1px;width:15px;height:15px;border-radius:50%;background:var(--m3-text-3);transition:.12s}
.profile .perm-sw.on{background:rgba(170,221,68,.3);border-color:var(--m3-lime)}
.profile .perm-sw.on .knob{left:16px;background:var(--m3-lime)}
.profile .perm-lbl{font-size:12.5px;font-weight:600;color:var(--m3-text);display:flex;align-items:center;gap:8px}
.profile .grant-tag{font-size:8.5px;font-weight:800;text-transform:uppercase;letter-spacing:.3px;color:var(--m3-blue);background:rgba(59,158,232,.14);border:1px solid rgba(59,158,232,.35);border-radius:4px;padding:1px 5px}
.profile .over-tag{margin-left:auto;font-size:8.5px;font-weight:800;text-transform:uppercase;letter-spacing:.3px;color:var(--m3-amber);background:rgba(245,166,35,.16);border:1px solid rgba(245,166,35,.4);border-radius:4px;padding:1px 6px}

/* timesheet */
.profile .ts-top{display:flex;align-items:center;gap:14px;margin-bottom:13px}
.profile .ts-total{display:flex;align-items:baseline;gap:8px}
.profile .ts-total .n{font-size:26px;font-weight:800;font-family:var(--mono);letter-spacing:-1px}
.profile .ts-total .l{font-size:11px;color:var(--m3-text-3);font-weight:600}
.profile .btn.sm{padding:7px 12px;font-size:11.5px}
.profile .hrow.ts{grid-template-columns:1.6fr 1fr 1fr 0.7fr}
.profile .hrow.ts.open{background:rgba(170,221,68,.05)}
.profile .edited-tag{font-size:8.5px;font-weight:800;text-transform:uppercase;color:var(--m3-amber);background:rgba(245,166,35,.14);border-radius:4px;padding:1px 5px;margin-left:7px}
.profile .live-tag{font-size:8.5px;font-weight:800;text-transform:uppercase;color:var(--m3-lime);background:rgba(170,221,68,.14);border-radius:4px;padding:1px 5px;margin-left:7px}
.profile .ts-note{font-size:11px;color:var(--m3-text-3);margin-top:11px;line-height:1.45}
.profile .ts-note b{color:var(--m3-text-2)}

/* schedule */
.profile .sched-block{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--m3-line);font-size:12.5px;color:var(--m3-text)}
.profile .sched-block:last-of-type{border-bottom:0}
.profile .sb-dot{width:6px;height:6px;border-radius:50%;background:var(--m3-blue);flex:0 0 auto}

.profile .locked-note{font-size:12px;color:var(--m3-text-3);background:var(--m3-bg);border:1px solid var(--m3-line);border-radius:8px;padding:12px 14px;line-height:1.5}

/* compensation ledger */
.profile .comp-list{display:flex;flex-direction:column;border:1px solid var(--m3-line);border-radius:9px;overflow:hidden}
.profile .comp-row{display:flex;align-items:center;gap:12px;padding:11px 13px;border-bottom:1px solid var(--m3-line)}
.profile .comp-row:last-child{border-bottom:0}
.profile .comp-type{flex:0 0 auto;font-size:9px;font-weight:800;letter-spacing:.3px;text-transform:uppercase;padding:3px 8px;border-radius:5px;min-width:74px;text-align:center}
.profile .comp-type.t-commission{background:rgba(59,158,232,.16);color:var(--m3-blue);border:1px solid rgba(59,158,232,.4)}
.profile .comp-type.t-bonus{background:rgba(170,221,68,.16);color:var(--m3-lime);border:1px solid rgba(170,221,68,.4)}
.profile .comp-type.t-stipend{background:rgba(245,166,35,.16);color:var(--m3-amber);border:1px solid rgba(245,166,35,.4)}
.profile .comp-type.t-other{background:var(--m3-surface-3);color:var(--m3-text-2);border:1px solid var(--m3-line)}
.profile .comp-main{flex:1;min-width:0}
.profile .comp-lbl{font-size:13px;font-weight:700}
.profile .comp-note{font-size:11px;color:var(--m3-text-3);margin-top:1px}
.profile .comp-amt{flex:0 0 auto;text-align:right}
.profile .comp-amt .ca{display:block;font-size:14px;font-weight:800;font-family:var(--mono)}
.profile .comp-amt .cc{display:block;font-size:10px;color:var(--m3-text-3)}
.profile .comp-edit{flex:0 0 auto;background:none;border:0;color:var(--m3-blue);font-family:var(--ff);font-size:10.5px;font-weight:700;cursor:pointer}
.profile .comp-empty{font-size:12px;color:var(--m3-text-3);font-style:italic;padding:8px 0}
.profile .comp-add{margin-top:10px}

@media (max-width:760px){ .profile .clockcard{margin-left:0;width:100%;text-align:left;margin-top:12px} .profile .phead{flex-wrap:wrap} }