/* c-job — C1 What needs work. Layout only; components are never restyled here. */

.job__title { margin: 0; }
.job__lead { margin-top: var(--space-8); }
.job__grid { margin-top: var(--rhythm-group); }
.job__grid[data-max="true"] .garment-tile:not(.garment-tile--selected) { opacity: 0.45; cursor: not-allowed; }
.job__helper { margin-top: var(--space-8); }

.job__items { margin-top: var(--rhythm-section); }
.job__items-list { gap: var(--rhythm-group); }

/* item card */
.job-item { display: flex; flex-direction: column; gap: var(--space-12); }
.job-item__head .garment-head { margin-bottom: 0; }   /* K-04: icon → name (underlined), the ✕ at the right (D-206, D-208, K-05 / D-220) */
.job-item__remove {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 44px; width: 44px; height: 44px;
  margin-right: calc(-1 * var(--space-8)); border-radius: var(--radius-full);
  font-size: var(--size-16); line-height: var(--lh-16); color: var(--neutral-500-ink);
}
.job-item__remove:active { background: var(--neutral-100); }

.job-item__services {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-12); width: 100%; min-height: 44px;
  padding: var(--space-8) var(--space-12); border-radius: var(--radius-md); background: var(--neutral-50); text-align: left;
  box-shadow: inset 0 0 0 1px var(--neutral-200);
}
.job-item__services:active { background: var(--neutral-100); }
.job-item__services--error { box-shadow: inset 0 0 0 1px var(--error); }
.job-item__services-text { flex: 1 1 0; min-width: 0; }
/* K-26 (H2): one service per line after the K-25 round cognac bullet; 5+ services flow into a strict two-column grid at the same 16 px,
   a long name wrapping inside its column with the bullet hanging */
.job-item__svcs { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }
.job-item__svc { display: block; position: relative; padding-left: var(--space-16); text-wrap: pretty; overflow-wrap: anywhere; }
.job-item__svc::before { content: ''; position: absolute; left: var(--space-2); top: calc(0.5em * var(--lh-16) - var(--space-2) - 1px); width: calc(var(--space-4) + var(--space-2)); height: calc(var(--space-4) + var(--space-2)); border-radius: 50%; background: var(--accent-base); }
.job-item__svcs:has(> .job-item__svc:nth-child(5)) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4) var(--space-12); align-items: start; }
.job-item__chevron { width: 16px; height: 16px; flex-shrink: 0; color: var(--neutral-500); }
.job-item__task { display: flex; flex-direction: column; gap: var(--rhythm-tight); }   /* P2-1: the services field and its error are one sub-group with its own gap (was a -4 margin cancelling the card's 12) */

.job-item__photos { display: flex; align-items: center; gap: var(--space-12); }
.job-item__add { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex-shrink: 0; border-radius: var(--radius-sm); }
.job-item__caption { flex: 1 1 0; min-width: 0; }

/* services sheet */
.job-svc__list { display: flex; flex-direction: column; gap: var(--space-4); max-height: min(360px, 50vh); overflow-y: auto; }
.job-svc__cta { position: sticky; bottom: 0; }
.job-photo__list { display: flex; flex-direction: column; border-radius: var(--radius-md); background: var(--white); padding-inline: var(--space-16); }
.job-photo__cancel { display: flex; justify-content: center; margin-top: var(--rhythm-group); }

/* the sheet header's ✕ / ✓ are tap targets too */
.screen-sheet[data-s^="c-job"] .sheet__cancel,
.screen-sheet[data-s^="c-job"] .sheet__confirm { min-width: 44px; min-height: 44px; }

/* D-168: the active booking leads Home; the wizard follows under a small label */
.c-job__active { margin-top: var(--space-4); }
.c-job__book-else { margin: var(--rhythm-section) 0 var(--rhythm-group); }
.c-job__book-else + .stepper--compact, .c-job__book-else + .booking-steps { margin-top: 0; }
@media (max-width: 18.75em) { .job-item__photos { flex-wrap: wrap; } .job-item__caption { flex-basis: auto; min-width: auto; } }   /* K9-2-02 zoom tier (D-233): "Photo (optional)" drops under the tiles instead of running past the card */
/* Study-1 A4: the review reminder leads Home; a "Book again" draft names its tailor above the title */
.c-job__reminder { margin-bottom: var(--rhythm-block); }
/* DG-2 A (pre-MVP A1): one-time cancellation notices lead Home */
.c-job__notices { display: flex; flex-direction: column; gap: var(--space-12); margin-bottom: var(--rhythm-block); }
.job__again { margin: 0 0 var(--space-4); }