/*
 * Restaurant R21 (0330): «دوامي», the team now, the PIN pad, the roster grid and the attendance office. Every colour,
 * size, radius and shadow is a token of tokens.css (dark values there); every direction is LOGICAL (inline/block,
 * start/end); touch targets are at least 44 px (tests/architecture/restaurant-r21-rules.test.ts).
 */

.shift-btn,
.shift-cell,
.shift-pin input,
.shift-pin select,
.shift-template input,
.shift-add select,
.shift-add input,
.shift-correct input,
.shift-setting input {
  min-block-size: 44px;
}
.shift-card {
  border: 1px solid var(--line);
  border-radius: var(--r-card);
  padding: var(--s-3);
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
  background: var(--surface);
}
.shift-state {
  font-size: var(--t-title);
  margin: 0;
}
.shift-state--on {
  color: var(--good-ink);
}
.shift-state--break {
  color: var(--warn);
}
.shift-state--off {
  color: var(--muted);
}
.shift-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-2);
}
.shift-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--s-1);
}
.shift-person--on,
.shift-person--break {
  font-weight: 600;
}
.shift-pin,
.shift-template,
.shift-add,
.shift-correct,
.shift-setting {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-2);
  padding-block: var(--s-2);
  border-block-start: 1px solid var(--line);
}
.shift-grid-wrap {
  overflow-x: auto;
}
.shift-grid,
.shift-table {
  border-collapse: collapse;
  inline-size: 100%;
}
.shift-grid th,
.shift-grid td,
.shift-table th,
.shift-table td {
  border: 1px solid var(--line);
  padding: var(--s-1);
  text-align: start;
  vertical-align: top;
}
.shift-cell {
  inline-size: 100%;
  min-inline-size: 88px;
  background: var(--surface-2);
  border: 1px dashed var(--line-strong);
  border-radius: var(--r-control);
  display: flex;
  flex-direction: column;
  gap: var(--s-1);
  align-items: stretch;
}
.shift-cell-panel {
  border: 1px solid var(--line-strong);
  border-radius: var(--r-card);
  padding: var(--s-2);
  margin-block: var(--s-2);
}
.shift-flag {
  background: var(--warn-bg);
  color: var(--ink);
  margin-inline-end: var(--s-1);
}

/* Browser drive defect 9: the shift home's buttons are one height — «دوامي», the floor, the pickups and «صندوق آخر»
   were shorter than their neighbours; «بيع» stays the big one */
.home-actions {
  align-items: center;
}
.home-actions .btn:not(.btn--huge) {
  min-block-size: var(--tap-pay);
  font-size: 1.2rem;
}