/* Sacred Command Center · Content. Semantic tokens only: no hex, no rgba (tests/static.mjs S-a2). The Posts list and Kanban reuse the kit
   and the board classes in css/modules/leads.css. A calendar event differs by icon and weight, never by color. Class prefix ct- and pe-. */

/* ── Cells ────────────────────────────────────────────────────────────────────────────── */
.ct-post { display: flex; align-items: center; gap: var(--s-2); min-width: 0; }
.ct-post-t { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.ct-thumb { width: 28px; height: 28px; flex: none; border-radius: var(--r-button); object-fit: cover; background: var(--surface-2); border: 1px solid var(--line); }
.ct-thumb--none { display: grid; place-items: center; color: var(--text-3); }
.table .chip { margin-left: var(--s-2); }
.ct-page { display: flex; flex-direction: column; gap: var(--s-3); min-width: 0; }
.ct-notice .state, .ct-lib-note .state { flex-wrap: wrap; white-space: normal; }
.ct-notice { padding: var(--s-2) var(--s-3); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); }
.ct-foot { margin: 0; max-width: var(--measure); }
.ct-client { display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; }
.ct-lib { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; gap: var(--s-2); }
.ct-lib-note { padding: var(--s-2) var(--s-3); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); }

/* ── Calendar ─────────────────────────────────────────────────────────────────────────── */
.ct-plat { width: 14rem; }
.ct-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); background: var(--surface); border-radius: var(--r-card); }
.ct-dow { padding: var(--s-1) var(--s-2); font-size: var(--fs-caption); font-weight: 600; letter-spacing: var(--caption-ls); color: var(--text-3); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--surface-2); }
.ct-day { display: flex; flex-direction: column; gap: 4px; min-height: 108px; padding: var(--s-1) var(--s-2) var(--s-2); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); min-width: 0; }
.ct-grid--week .ct-day { min-height: 220px; }
.ct-day.is-out { background: var(--bg); }
.ct-day.is-out .ct-day-n { color: var(--text-3); font-weight: 500; }
.ct-day-n { align-self: flex-start; font-size: var(--fs-cell); font-weight: 700; color: var(--text); min-width: 1.75rem; padding: 0 4px; border-radius: var(--r-button); text-align: center; }
.ct-day.is-today .ct-day-n { background: var(--text); color: var(--bg); }
.ct-more { align-self: flex-start; padding-left: 4px; font-size: var(--fs-caption); }
.ct-ev { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "i t" ". s"; column-gap: 4px; align-items: center; width: 100%; padding: 4px 6px; text-align: left; border: 1px solid var(--line); border-radius: var(--r-button); background: var(--surface); color: var(--text); font-size: var(--fs-caption); font-weight: 500; }
.ct-ev .i { grid-area: i; color: var(--text-3); }
.ct-ev-t { grid-area: t; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ct-ev-s { grid-area: s; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-3); font-weight: 500; }
@media (hover: hover) { .ct-ev:hover { background: var(--hover); border-color: var(--line-strong); } }
.ct-ev--needs_edits, .ct-ev--pending { font-weight: 700; border-color: var(--line-strong); }
.ct-ev--needs_edits .i { color: var(--accent-mark); }
.ct-ev--published { color: var(--text-2); }
.ct-ev--draft { border-style: dashed; }
@media (max-width: 719px) {
  .ct-grid { grid-template-columns: minmax(0, 1fr); border-left: 0; }
  .ct-dow { display: none; }
  .ct-day { min-height: 0; flex-direction: row; flex-wrap: wrap; align-items: flex-start; border-right: 0; }
  .ct-day:not(:has(.ct-ev)) { display: none; }
  .ct-day-n { min-width: 2.25rem; }
  .ct-day .ct-ev { width: calc(100% - 3rem); margin-left: auto; }
  .ct-day .ct-more { width: 100%; }
}

/* ── The post editor sheet (in the layer, so no module scope) ─────────────────────────── */
.pe-vis { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); margin: 0 0 var(--s-3); }
.pe-photo { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-2); }
.pe-thumb { width: 96px; height: 96px; border-radius: var(--r-button); object-fit: cover; background: var(--surface-2); border: 1px solid var(--line); }
.pe-thumb--none { display: grid; place-items: center; font-size: var(--fs-caption); }
.pe-pool { display: flex; flex-direction: column; gap: var(--s-2); align-self: stretch; }
.pe-pool-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: var(--s-2); }
.pe-cell { position: relative; aspect-ratio: 1; padding: 0; border: 1px solid var(--line); border-radius: var(--r-button); overflow: hidden; background: var(--surface-2); cursor: pointer; }
.pe-cell img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pe-cell[aria-pressed="true"] { border-color: var(--text); outline: 2px solid var(--text); outline-offset: 1px; }
.pe-cell:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.pe-note { margin: 0; }
.pe-date .input { max-width: 12rem; }
.sheet .notice + .pe-vis, .sheet .notice + .field { margin-top: var(--s-3); }

.module--content a.tbtn, .module--content a.tbtn:hover { text-decoration: none; }

/* ── M7: what is off, the platform table, and Photo intake ────────────────────────────── */
.ct-notice--stack { display: flex; flex-direction: column; gap: var(--s-2); }
.ct-off { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); min-width: 0; }
.ct-off-why { min-width: 0; flex: 1 1 18rem; font-size: var(--fs-caption); line-height: 1.5; color: var(--text-2); }
.ct-off-why b { color: var(--text); font-weight: 700; }
.ct-count { margin: 0; }
.ct-plat-body { display: flex; flex-direction: column; gap: var(--s-2); padding: var(--s-2) var(--s-3) var(--s-3); min-width: 0; }
.ct-plat-body .cell-link[aria-pressed="true"] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.ct-steps { grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); gap: var(--s-2); }
.ct-step { min-height: 92px; }
.ct-step .stat-v { margin-top: auto; }
.ct-step .stat-v.is-none { font-size: var(--fs-cell); min-height: 1.75rem; }
.ct-step .stat-meta { line-height: 1.4; }
.ct-intake { flex: 1 1 auto; min-height: 0; }
.ct-photo { display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; }
.ct-photo-img { width: 100%; max-height: 18rem; object-fit: contain; border-radius: var(--r-card); background: var(--surface-2); border: 1px solid var(--line); }
.ct-cands { display: flex; flex-direction: column; gap: var(--s-2); margin: 0; }
.ct-cands li { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 0; }
.ct-cands .btn { max-width: 100%; height: auto; min-height: 32px; white-space: normal; text-align: left; }

/* containers: the dense Home head (14 px title), as in Client work */
.module--content .ctr-title { font-size: var(--fs-body); }
.module--content .ctr-sum { font-size: var(--fs-cell); }
.module--content .ctr-head { --ctr-act-w: 0px; padding: var(--s-2) var(--s-3); min-height: 56px; }

/* on a phone the five steps are rows (label and value on a line, the note under), not five tall cards */
@media (max-width: 719px) {
  .ct-steps { grid-template-columns: minmax(0, 1fr); gap: var(--s-1); }
  .ct-step { min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "l v" "m m"; align-items: baseline; column-gap: var(--s-3); row-gap: 0; padding: var(--s-2) var(--s-3); }
  .ct-step .stat-l { grid-area: l; margin: 0; }
  .ct-step .stat-v { grid-area: v; margin: 0; font-size: var(--fs-h3); text-align: right; }
  .ct-step .stat-v.is-none { min-height: 0; }
  .ct-step .stat-meta { grid-area: m; }
}

/* the week has room for the whole line: the title and the client, state and platform wrap instead of being cut */
.ct-grid--week .ct-ev-t, .ct-grid--week .ct-ev-s { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }

/* A post that is an email, a website look or the Shop app: the platform chip with its icon, and an email's subject line under the title */
.ct-post-w { display: flex; flex-direction: column; min-width: 0; }
.ct-post-s { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-3); font-size: var(--fs-caption); }
.ct-plat { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; padding-inline: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-plat .i { color: var(--text-2); }
.pe-kind { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-2) var(--s-3); margin: 0; min-width: 0; }
.pe-subject { min-width: 0; overflow-wrap: anywhere; font-weight: 600; }
.pe-facts { margin: 0; }