/* @AI_CRITICAL_GUARD v3.0: UNTOUCHABLE ZONE — MACE APPROVAL REQUIRED.
   Protects: Enterprise UI/UX · Realtime Sync Logic · Core State Management.
   DO NOT modify without a RISK IMPACT REPORT cleared by MACE. */

/**
 * @file my_schedule_v2.css
 * @description My Schedule (msx rebuild) — additive component layer for the
 *              NEW elements introduced by the 2026-07-18 rebuild: live-sync
 *              rail, rest-day/leave banners, day-tab flags, Daily context
 *              panel v2, team on-duty chips.
 *              SELF-DUAL-THEME: every rule consumes the local --msx-* tokens
 *              declared below; dark values are the defaults and the
 *              :where(html[data-mode="light"]) block swaps ONLY tokens, so
 *              tools/theme-main regeneration is NOT required for this file
 *              (same contract as css/reminders.css).
 *              Loaded BEFORE main_theme.css (which must stay the LAST sheet).
 *              Legacy .schx/.tsg/.mysx rules stay in enterprise_ux.css —
 *              this file only ADDS the msx-* layer on top.
 *              QA: npm run test:schedule · /_schedule_harness.html
 *              Skill: .claude/skills/schedule-workspace-qa/SKILL.md
 * @module MUMS/Styles
 * @version msx-1
 */

/* ── Tokens ─────────────────────────────────────────────────────────────── */
.schx{
  --msx-card:       rgba(255,255,255,.03);
  --msx-card-2:     rgba(255,255,255,.06);
  --msx-line:       rgba(148,163,184,.18);
  --msx-line-2:     rgba(148,163,184,.32);
  --msx-ink:        var(--text, #e8eeff);
  --msx-dim:        rgba(148,163,184,.92);
  --msx-live:       #22c55e;
  --msx-live-bg:    rgba(34,197,94,.12);
  --msx-rest:       #38bdf8;
  --msx-rest-bg:    rgba(56,189,248,.12);
  --msx-leave:      #f59e0b;
  --msx-leave-bg:   rgba(245,158,11,.14);
  --msx-warn:       #ef4444;
  --msx-warn-bg:    rgba(239,68,68,.12);
  --msx-prog-track: rgba(148,163,184,.18);
  --msx-me-bg:      rgba(59,130,246,.14);
  --msx-me-ink:     #93c5fd;
}
:where(html[data-mode="light"]) .schx{
  --msx-card:       rgba(15,23,42,.03);
  --msx-card-2:     rgba(15,23,42,.055);
  --msx-line:       rgba(15,23,42,.14);
  --msx-line-2:     rgba(15,23,42,.24);
  --msx-ink:        var(--text, #0f172a);
  --msx-dim:        rgba(71,85,105,.92);
  --msx-live:       #16a34a;
  --msx-live-bg:    rgba(22,163,74,.10);
  --msx-rest:       #0284c7;
  --msx-rest-bg:    rgba(2,132,199,.10);
  --msx-leave:      #b45309;
  --msx-leave-bg:   rgba(180,83,9,.12);
  --msx-warn:       #dc2626;
  --msx-warn-bg:    rgba(220,38,38,.10);
  --msx-prog-track: rgba(15,23,42,.12);
  --msx-me-bg:      rgba(37,99,235,.10);
  --msx-me-ink:     #1d4ed8;
}

/* ── Live-sync rail (Members ▸ paints → mirrors here) ───────────────────── */
.msx-liverail{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  margin-top:10px;
  border:1px solid var(--msx-line);
  border-radius:10px;
  background:var(--msx-card);
  color:var(--msx-dim);
  font-size:12px;
  line-height:1.35;
  flex-wrap:wrap;
}
.msx-liverail b{ color:var(--msx-ink); font-weight:600; }
.msx-live-pip{
  width:8px; height:8px;
  border-radius:50%;
  background:var(--msx-dim);
  flex:0 0 auto;
}
.msx-live-pip.is-on{
  background:var(--msx-live);
  box-shadow:0 0 0 0 var(--msx-live-bg);
  animation:msxPulse 2.2s ease-out infinite;
}
.msx-live-label{
  font-weight:700;
  letter-spacing:.14em;
  font-size:10px;
  color:var(--msx-ink);
}
.msx-live-text{ flex:1 1 240px; min-width:0; }
.msx-live-stamp{
  margin-left:auto;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.msx-liverail.msx-flash{ border-color:var(--msx-live); background:var(--msx-live-bg); }
@keyframes msxPulse{
  0%   { box-shadow:0 0 0 0 var(--msx-live-bg); }
  70%  { box-shadow:0 0 0 7px rgba(34,197,94,0); }
  100% { box-shadow:0 0 0 0 rgba(34,197,94,0); }
}

/* ── Day-tab rest/leave flags ───────────────────────────────────────────── */
.msx-daytab-flag{
  display:inline-block;
  width:7px; height:7px;
  border-radius:50%;
  margin-left:5px;
  vertical-align:middle;
}
.msx-daytab-flag.is-rest{ background:var(--msx-rest); }
.msx-daytab-flag.is-leave{ background:var(--msx-leave); }

/* ── Rest-day / leave banners on the personal grid ──────────────────────── */
.schx-day.msx-off .schx-daybody{ position:relative; }
.msx-dayoff{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  z-index:3;
  pointer-events:none;
  text-align:center;
  padding:10px;
}
.msx-dayoff.is-rest{ background:linear-gradient(180deg, transparent, var(--msx-rest-bg)); }
.msx-dayoff.is-leave{ background:linear-gradient(180deg, transparent, var(--msx-leave-bg)); }
.msx-dayoff-badge{
  padding:6px 12px;
  border-radius:999px;
  border:1px solid var(--msx-line-2);
  background:var(--msx-card-2);
  color:var(--msx-ink);
  font-size:11px;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  backdrop-filter:blur(2px);
}
.msx-dayoff.is-rest .msx-dayoff-badge{ color:var(--msx-rest); border-color:var(--msx-rest); }
.msx-dayoff.is-leave .msx-dayoff-badge{ color:var(--msx-leave); border-color:var(--msx-leave); }
.msx-dayoff-warn{
  font-size:10px;
  color:var(--msx-warn);
  background:var(--msx-warn-bg);
  border:1px solid var(--msx-warn);
  border-radius:999px;
  padding:2px 8px;
}

/* ── Daily context panel v2 ─────────────────────────────────────────────── */
.msx-ctx{ display:flex; flex-direction:column; gap:10px; }
.msx-ctx-summary{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:8px;
}
.msx-ctx-sumrow{
  border:1px solid var(--msx-line);
  border-radius:10px;
  background:var(--msx-card);
  padding:8px 10px;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.msx-ctx-sumrow span{ font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--msx-dim); }
.msx-ctx-sumrow b{ font-size:15px; color:var(--msx-ink); font-variant-numeric:tabular-nums; }

.msx-ctx-card{
  border:1px solid var(--msx-line);
  border-left:3px solid var(--msx-task, var(--msx-line-2));
  border-radius:12px;
  background:var(--msx-card);
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.msx-ctx-taskline{ display:flex; align-items:center; gap:8px; min-width:0; }
.msx-ctx-dot{
  width:10px; height:10px;
  border-radius:50%;
  background:var(--msx-task, var(--msx-dim));
  flex:0 0 auto;
}
.msx-ctx-title{
  font-weight:700;
  color:var(--msx-ink);
  font-size:14px;
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.msx-ctx-status{
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:3px 8px;
  border-radius:999px;
  border:1px solid var(--msx-line-2);
  color:var(--msx-dim);
  white-space:nowrap;
}
.msx-ctx-status.is-in-progress{ color:var(--msx-live); border-color:var(--msx-live); background:var(--msx-live-bg); }
.msx-ctx-status.is-completed{ opacity:.75; }
.msx-ctx-rows{ display:flex; flex-direction:column; gap:6px; }
.msx-ctx-row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  font-size:12px;
}
.msx-ctx-row span{ color:var(--msx-dim); flex:0 0 auto; }
.msx-ctx-row b{ color:var(--msx-ink); font-weight:600; text-align:right; font-variant-numeric:tabular-nums; }
.msx-ctx-progress{
  height:6px;
  border-radius:999px;
  background:var(--msx-prog-track);
  overflow:hidden;
}
.msx-ctx-progress-fill{
  height:100%;
  border-radius:999px;
  background:var(--msx-task, var(--msx-live));
  transition:width .6s ease;
}
.msx-ctx-progress-label{ margin-top:-4px; }
.msx-ctx-notes{
  border-top:1px dashed var(--msx-line);
  padding-top:8px;
  font-size:12px;
  color:var(--msx-ink);
  white-space:pre-wrap;
  word-break:break-word;
}
.msx-ctx-warn{
  font-size:11px;
  color:var(--msx-warn);
  background:var(--msx-warn-bg);
  border:1px solid var(--msx-warn);
  border-radius:8px;
  padding:6px 8px;
}
.msx-ctx-hint{ text-align:center; }

/* ── Team view extras ───────────────────────────────────────────────────── */
.msx-team-loading{
  padding:16px;
  border:1px solid var(--msx-line);
  border-radius:14px;
  display:flex;
  align-items:center;
  gap:10px;
}
.msx-spin{
  display:inline-block;
  width:14px; height:14px;
  border:2px solid var(--msx-line-2);
  border-top-color:var(--msx-rest);
  border-radius:50%;
  animation:msxSpin .8s linear infinite;
}
@keyframes msxSpin{ to{ transform:rotate(360deg); } }

.msx-onduty-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 10px;
  border-radius:999px;
  border:1px solid var(--msx-line);
  background:var(--msx-card);
  color:var(--msx-dim);
  font-size:11px;
  white-space:nowrap;
}
.msx-onduty-chip b{ color:var(--msx-ink); font-variant-numeric:tabular-nums; }
.team-schedule-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }

.msx-member-now{
  display:inline-flex;
  align-items:center;
  gap:5px;
  margin-left:8px;
  padding:2px 8px;
  border-radius:999px;
  font-size:10px;
  font-weight:600;
  color:var(--msx-ink);
  border:1px solid var(--msx-task, var(--msx-line-2));
  background:var(--msx-card-2);
  white-space:nowrap;
  max-width:140px;
  overflow:hidden;
  text-overflow:ellipsis;
}
.msx-member-now-dot{
  width:6px; height:6px;
  border-radius:50%;
  background:var(--msx-task, var(--msx-live));
  flex:0 0 auto;
  animation:msxPulse 2.2s ease-out infinite;
}
.msx-row-me .tsg-name{ position:relative; }
.msx-me-tag{
  display:inline-block;
  margin-left:6px;
  padding:1px 6px;
  border-radius:999px;
  font-size:9px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  background:var(--msx-me-bg);
  color:var(--msx-me-ink);
  vertical-align:middle;
}

/* Narrow screens: context panel stacks under the canvas (matches the
   existing .schx-day-layout collapse) and the summary grid stays readable. */
@media (max-width: 980px){
  .msx-ctx-summary{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .msx-live-stamp{ margin-left:0; }
}