/* Copie de qevyo-app d09118f : app/components/manager/team-cockpit.css (source de vérité, ne pas modifier ici). */
/* « Mon équipe » as a factual manager cockpit (team-cockpit.tsx). Design System tokens only, every selector scoped
   under .q-tc / q-tc-* (no global token touched). Premium pass (Alex, 29/09/2026 — the ambition of the former
   Manager, never its dashboard): four levels with a strong hierarchy —
   1. the team, the focal forest panel with the Lisière engraved in light (grand figures, fine bars réalisé / engagé,
      the coverage said);
   2. « Qui aider, et sur quoi ? » — person cards (initials medallion, the request as QEVYO's quote on the gold
      rule, the manager's action as a secondary button);
   3. KPI par membre — one row per person, one fine bar per SHARED KPI (the figures in words stay), « non partagé »
      said with a lock and a dashed track, never a zero;
   4. the details, folded.
   No rank, no score, no global label on a person: every mark reads a shared figure. */

.q-tc p{margin:0}
.q-tc{gap:var(--q-space-3)}
.q-tc>.q-space-head{margin-block-end:var(--q-space-2)}
.q-tc-avatar{display:grid;place-items:center;flex:none;inline-size:44px;block-size:44px;border-radius:50%;background:var(--q-medal-sage);font:var(--q-weight-strong) var(--q-body-small)/1 var(--q-font-body);letter-spacing:.02em;color:var(--q-brand)}
.q-tc-title{margin:0;font:var(--q-weight-strong) clamp(1.5rem,1.25rem + 1vw,2rem)/1.1 var(--q-font-display);letter-spacing:-.018em;font-variant-numeric:lining-nums}
.q-tc-period{margin:0;font-size:var(--q-body-small);line-height:1.4;color:var(--q-text-secondary)}
.q-tc-bar{position:relative;display:block;inline-size:100%;max-inline-size:220px;block-size:4px;border-radius:var(--q-radius-pill);background:var(--q-ring-track);overflow:hidden}
.q-tc-bar>span{position:absolute;inset-block:0;inset-inline-start:0;border-radius:inherit;background:var(--q-brand-vivid)}
.q-tc-bar--none{background:repeating-linear-gradient(90deg,var(--q-border) 0 4px,transparent 4px 8px)}

/* 1 · The team: the focal forest panel. */
.q-tc-goals{position:relative;isolation:isolate;overflow:hidden;display:grid;gap:var(--q-space-2);padding:var(--q-space-5) var(--q-space-4) calc(var(--q-space-7) + var(--q-space-3));border-radius:var(--q-radius-large);background:var(--q-deep-wash);color:var(--q-on-dark);box-shadow:var(--q-shadow-float)}
.q-tc-goals::after{content:"";position:absolute;z-index:-1;inset:auto 0 0 auto;inline-size:min(100%,720px);aspect-ratio:600 / 160;background:var(--q-ivory);opacity:.13;-webkit-mask:url(brand/illustrations/lisiere.svg) no-repeat right bottom / 100% auto;mask:url(brand/illustrations/lisiere.svg) no-repeat right bottom / 100% auto;pointer-events:none}
.q-tc-goals__title{margin:0;font:var(--q-weight-strong) var(--q-title-card)/1.15 var(--q-font-display);letter-spacing:-.012em;font-variant-numeric:lining-nums;color:var(--q-on-dark)}
.q-tc-goals__annual{font:var(--q-weight-strong) var(--q-body)/1.4 var(--q-font-body);font-variant-numeric:lining-nums tabular-nums;color:var(--q-gold)}
.q-tc-goals__period{margin-block-start:var(--q-space-2);font:var(--q-weight-strong) var(--q-label)/1.4 var(--q-font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--q-on-dark-secondary)}
.q-tc-goals__primary{display:grid;gap:var(--q-space-2);font-variant-numeric:lining-nums tabular-nums}
.q-tc-goals__primary strong{font:var(--q-weight-strong) clamp(1.75rem,1.45rem + 1.1vw,2.25rem)/1.1 var(--q-font-body);letter-spacing:-.02em;color:var(--q-on-dark)}
.q-tc-goals__primary .q-tc-bar{max-inline-size:360px;block-size:5px}
.q-tc-goals .q-tc-bar{background:var(--q-on-dark-track)}
.q-tc-goals .q-tc-bar>span{background:var(--q-brand-vivid-on-dark)}
.q-tc-goals__primary--none{color:var(--q-on-dark-secondary)}
.q-tc-goals__pace{justify-self:start;padding:2px var(--q-space-3);border-radius:var(--q-radius-pill);background:var(--q-on-dark-track);font:var(--q-weight-strong) var(--q-caption)/1.6 var(--q-font-body);color:var(--q-on-dark)}
.q-tc-goals__primary[data-status="retard"] .q-tc-goals__pace{background:var(--q-state-late-bg);color:var(--q-state-late)}
.q-tc-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:var(--q-space-3) 0 0;padding:0;list-style:none;border-block:1px solid var(--q-on-dark-line)}
.q-tc-kpi{display:grid;align-content:start;gap:var(--q-space-1);padding:var(--q-space-3) var(--q-space-2) var(--q-space-3) 0}
.q-tc-kpi+.q-tc-kpi{border-inline-start:1px solid var(--q-on-dark-line);padding-inline-start:var(--q-space-3)}
.q-tc-kpi__label{font-size:var(--q-caption);line-height:1.3;color:var(--q-on-dark-secondary)}
.q-tc-kpi__value{font:var(--q-weight-strong) 1.375rem/1.2 var(--q-font-body);font-variant-numeric:lining-nums tabular-nums;color:var(--q-on-dark)}
.q-tc-kpi__status{font:var(--q-weight-strong) var(--q-caption)/1.3 var(--q-font-body);color:var(--q-on-dark)}
.q-tc-kpi[data-status="retard"] .q-tc-kpi__status{justify-self:start;padding:0 var(--q-space-2);border-radius:var(--q-radius-pill);background:var(--q-state-late-bg);color:var(--q-state-late)}
.q-tc-goals__coverage{display:flex;align-items:baseline;gap:var(--q-space-1);margin-block-start:var(--q-space-2);font-size:var(--q-body-small);line-height:1.4;color:var(--q-on-dark)}
.q-tc-goals .q-c-caption{color:var(--q-on-dark-secondary)}

/* 2 · Qui aider: person cards. */
.q-tc-helps{display:grid;gap:var(--q-space-3);margin:var(--q-space-2) 0 0;padding:0;list-style:none}
.q-tc-help.q-panel{display:flex;align-items:flex-start;gap:var(--q-space-3);padding:var(--q-space-4)}
.q-tc-help[data-kind="request"]{background:var(--q-surface-paper);border-color:var(--q-sand-line);box-shadow:none}
.q-tc-help[data-kind="request"] .q-tc-avatar{background:var(--q-card);box-shadow:inset 0 0 0 1.5px var(--q-gold-ink);color:var(--q-gold-ink)}
.q-tc-help[data-kind="calm"]{background:var(--q-surface-mist);border-color:var(--q-sage-line);box-shadow:none}
.q-tc-help__main{display:grid;gap:var(--q-space-1);min-inline-size:0;flex:1}
.q-tc-help__who{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--q-space-1) var(--q-space-2)}
.q-tc-help__who strong{font:var(--q-weight-strong) var(--q-title-card)/1.15 var(--q-font-display);letter-spacing:-.01em;font-variant-numeric:lining-nums}
.q-tc-help__label{padding:0 var(--q-space-2);border-radius:var(--q-radius-pill);background:var(--q-tint-sage);font:var(--q-weight-strong) var(--q-caption)/1.6 var(--q-font-body);color:var(--q-lichen)}
.q-tc-help[data-kind="request"] .q-tc-help__label{background:var(--q-medal-sand);color:var(--q-gold-ink)}
.q-tc-help[data-kind="signal"] .q-tc-help__label{background:var(--q-state-late-bg);color:var(--q-state-late)}
.q-tc-help__about{margin-block-start:var(--q-space-1);font-size:var(--q-body);font-weight:var(--q-weight-strong)}
.q-tc-help[data-kind="calm"] .q-tc-help__about{font-weight:var(--q-weight-regular);color:var(--q-text-secondary)}
.q-tc-help__detail{font-size:var(--q-body-small);line-height:1.45;color:var(--q-text-secondary)}
/* The request, in the agent's own words: the quote grammar (serif on the gold rule). */
.q-tc-help[data-kind="request"] .q-tc-help__detail{position:relative;margin-block:var(--q-space-1);padding-inline-start:var(--q-space-3);font:var(--q-weight-medium) 1.1875rem/1.3 var(--q-font-display);color:var(--q-text);font-variant-numeric:lining-nums}
.q-tc-help__action{justify-self:start;margin-block-start:var(--q-space-2);gap:var(--q-space-1)}
/* Phone: the medallion beside the name, the rest across the card (the action keeps one line). */
@media (max-width:767px){
 .q-tc-help.q-panel{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;column-gap:var(--q-space-3);row-gap:var(--q-space-1)}
 .q-tc-help__main{display:contents}
 .q-tc-help__main>:not(.q-tc-help__who){grid-column:1 / -1}
 .q-tc-help__action{justify-self:stretch}
}

/* 3 · KPI par membre: one row per person, one fine bar per shared KPI. */
.q-tc-members.q-panel{display:grid;gap:0;margin:var(--q-space-2) 0 0;padding:var(--q-space-1) 0;list-style:none;overflow:hidden}
.q-tc-members>li+li{border-block-start:1px solid var(--q-hairline)}
.q-tc-member__row{display:flex;align-items:center;gap:var(--q-space-3);min-block-size:var(--q-tap);padding:var(--q-space-4);background:none;color:var(--q-text);text-decoration:none;transition:background-color var(--q-duration-fast) var(--q-ease)}
a.q-tc-member__row:hover{background:var(--q-tint-sage)}
a.q-tc-member__row:focus-visible,.q-tc-help__action:focus-visible{outline:3px solid var(--q-focus);outline-offset:-3px}
a.q-tc-member__row>svg{flex:none;color:var(--q-brand)}
.q-tc-member__main{display:grid;gap:var(--q-space-2);flex:1;min-inline-size:0}
.q-tc-member__top{display:flex;flex-wrap:wrap;align-items:center;gap:var(--q-space-1) var(--q-space-2)}
.q-tc-member__top strong{font:var(--q-weight-strong) 1.25rem/1.15 var(--q-font-display);letter-spacing:-.01em;font-variant-numeric:lining-nums}
/* The factual summary of the shared KPI (never a label on the person) and the help-request marker. */
.q-tc-member__summary{display:inline-flex;align-items:center;gap:var(--q-space-1);font:var(--q-weight-strong) var(--q-body-small)/1.4 var(--q-font-body);color:var(--q-text)}
.q-tc-member:is([data-attention="non_partage"],[data-attention="sans_donnee"],[data-attention="invite"]) .q-tc-member__summary{font-weight:var(--q-weight-medium);color:var(--q-text-secondary)}
.q-tc-member:is([data-attention="non_partage"],[data-attention="invite"]) .q-tc-avatar{background:none;box-shadow:inset 0 0 0 1px var(--q-border-strong);color:var(--q-text-secondary)}
.q-tc-member__flag{padding:1px var(--q-space-2);border-radius:var(--q-radius-pill);background:var(--q-medal-sand);font:var(--q-weight-strong) var(--q-caption)/1.5 var(--q-font-body);color:var(--q-gold-ink)}
.q-tc-member__kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--q-space-3) var(--q-space-4)}
.q-tc-cell{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;gap:var(--q-space-1) var(--q-space-2);white-space:nowrap;font-variant-numeric:lining-nums tabular-nums}
.q-tc-cell>.q-tc-bar{grid-column:1 / -1}
.q-tc-cell__label{font-size:var(--q-caption);line-height:1.4;color:var(--q-text-secondary)}
.q-tc-cell__value{justify-self:end;font:var(--q-weight-strong) var(--q-body-small)/1.3 var(--q-font-body)}
.q-tc-cell[data-status="retard"] .q-tc-cell__value{color:var(--q-state-late)}
.q-tc-cell[data-status="retard"] .q-tc-bar>span{background:var(--q-state-late-mark)}
.q-tc-cell:not([data-shared]) .q-tc-cell__value{font-weight:var(--q-weight-medium);color:var(--q-text-secondary)}
.q-tc-member__coverage{font-size:var(--q-caption);line-height:1.4;color:var(--q-text-secondary)}

/* 4 · Details, folded. */
.q-tc>.q-c-fold{margin-block-start:var(--q-space-3)}
.q-tc>.q-c-section{margin-block-start:var(--q-space-4)}

@media (forced-colors:active){
 .q-tc-goals,.q-tc-help,.q-tc-members{border:1px solid CanvasText}
 .q-tc-goals::after{display:none}
}
@media (min-width:1024px){
 .q-tc-goals{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:var(--q-space-7);align-items:start;padding:var(--q-space-6) var(--q-space-6) calc(var(--q-space-7) + var(--q-space-2))}
 .q-tc-goals>h2,.q-tc-goals>.q-tc-goals__annual{grid-column:1 / -1}
 .q-tc-goals>.q-tc-kpis{grid-column:2;grid-row:3 / span 4;margin:0}
 .q-tc-helps{grid-template-columns:repeat(2,minmax(0,1fr))}
 .q-tc-member__kpis{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--q-space-6)}
 .q-tc-member__row{padding:var(--q-space-4) var(--q-space-5)}
}
/* Very narrow phones (< 360 px): the team's 3 KPI stacked, each name and figure on one line. */
@media (max-width:359px){
 .q-tc-kpis{grid-template-columns:minmax(0,1fr)}
 .q-tc-kpi+.q-tc-kpi{border-inline-start:0;border-block-start:1px solid var(--q-on-dark-line);padding-inline-start:0}
}