/* The Register panel. Builds on kiosk-admin.css (.kiosk, .pairing, .kdev,
 * .ksettings) and adds only the staff and timesheet rows. */
.register .rpeople { display: flex; flex-direction: column; gap: 6px; }
.register .rperson {
  display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
  padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--ground);
}
.register .rperson.off { opacity: .55; }
.register .rperson .pname { font-weight: 600; font-size: 14px; min-width: 110px; }
.register .rperson .pmeta { color: var(--faint); font-size: 12.5px; flex: 1; min-width: 140px; }
.register .rperson button { padding: 5px 10px; font-size: 12.5px; }
.register .ksettings label input[type="password"] { margin-top: 4px; width: 100%; }

/* Pairing QR beside the code: the tablet scans this instead of typing. */
.register .pairing { display: flex; gap: 18px; align-items: center; }
.register .rqr { flex: none; width: 150px; height: 150px; background: #fff; border-radius: 10px; padding: 4px; }
.register .rqr svg { width: 100%; height: 100%; display: block; }


/* Customer display: the idle slideshow's pictures in order, and the logo. */
.register .rslides { display: flex; flex-direction: column; gap: 6px; margin: 10px 0; }
.register .rslide {
  display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
  padding: 6px 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--ground);
}
.register .rslide img { width: 96px; height: 54px; object-fit: cover; border-radius: 6px; background: #000; flex: none; }
.register .rslide .rnum { color: var(--faint); font-size: 12.5px; flex: 1; min-width: 20px; }
.register .rslide .rtools { display: flex; gap: 6px; }
.register .rslide button { padding: 5px 10px; font-size: 12.5px; }
.register .rsecs { display: inline-flex; gap: 8px; align-items: center; margin-left: auto; }
.register .rsecs input { width: 72px; }
.register .rlogo { display: flex; gap: 14px; align-items: center; margin-top: 14px; flex-wrap: wrap; }
.register .rlogoimg {
  width: 96px; height: 96px; flex: none; display: grid; place-items: center;
  border: 1px dashed var(--line); border-radius: 10px; background: var(--ground);
}
.register .rlogoimg img { max-width: 88px; max-height: 88px; object-fit: contain; }

/* Where a person works: every venue, or any mix. */
.rwhere { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 6px; }
.rwhere .check { display: inline-flex; align-items: center; gap: 6px; }
.rwhere-edit { padding: 8px 0 12px; border-bottom: 1px solid var(--line, rgba(0,0,0,.08)); }