/* SchoolDay v270.35: Clubs > Staff Rota -- the roles window's arrows and
   "Copy to other days", and the Spreadsheet View. */

/* The roles window: the club's previous and next date, at the top. */
#tab-clubs .clubs-roles-nav-v27035 { display: flex; align-items: center; justify-content: center; gap: .6rem; margin: 0 0 .6rem; }
#tab-clubs .clubs-roles-nav-v27035 > button { margin: 0; min-width: 2.4rem; min-height: 2.2rem; padding: 0 .6rem; font-size: 1.3rem; line-height: 1; font-weight: 800; }
#tab-clubs .clubs-roles-nav-v27035 > button:disabled { opacity: .4; cursor: default; }
#tab-clubs .clubs-roles-nav-date-v27035 { min-width: 12rem; text-align: center; }

/* Copy to other days: the later dates, those with the same staff highlighted. */
#tab-clubs .clubs-roles-copy-v27035 { margin: .9rem 0 .2rem; padding: .7rem .8rem; border: 1px solid #dbe4ee; border-radius: .5rem; background: #f8fafc; }
#tab-clubs .clubs-roles-copy-v27035 > h4 { margin: 0 0 .25rem; font-size: .95rem; }
#tab-clubs .clubs-roles-copy-v27035 > p { margin: 0 0 .4rem; }
#tab-clubs .clubs-roles-copy-list-v27035 { display: grid; gap: .2rem; max-height: 14rem; overflow-y: auto; margin: .35rem 0; padding: 0; list-style: none; }
#tab-clubs .clubs-roles-copy-list-v27035 > li > label { display: flex; align-items: center; gap: .5rem; padding: .2rem .45rem; border-radius: .35rem; border: 1px solid transparent; cursor: pointer; }
#tab-clubs .clubs-roles-copy-list-v27035 > li > label > input { margin: 0; width: auto; }
#tab-clubs .clubs-roles-copy-list-v27035 > li.is-same-staff-v27035 > label { background: #dcfce7; border-color: #86efac; font-weight: 700; }
#tab-clubs .clubs-roles-copy-note-v27035 { margin-left: auto; font-size: .78rem; color: #475569; font-weight: 600; }
#tab-clubs .is-same-staff-v27035 .clubs-roles-copy-note-v27035 { color: #14532d; }

/* The Spreadsheet View: a section for each club, a row for each date. */
#tab-clubs .clubs-sheet-help-v27035 { margin: .2rem 0 .6rem; }
#tab-clubs .clubs-sheet-v27035 { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
#tab-clubs .clubs-sheet-club-v27035 { min-width: 0; }
#tab-clubs .clubs-sheet-club-v27035 { border-top: 3px solid var(--club-colour-v27035, #94a3b8); }
#tab-clubs .clubs-sheet-clubhead-v27035 { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; padding: .45rem 0 .35rem; }
#tab-clubs .clubs-sheet-clubhead-v27035 > h4 { margin: 0; font-size: 1rem; display: inline-flex; align-items: center; gap: .4rem; }
#tab-clubs .clubs-sheet-clubhead-v27035 > button { margin: 0; }
/* v270.36: NOT a .table-wrap. That class (styles.css, admin-shell-v207.css)
   gives a box 72vh high that scrolls on its own and keeps the wheel
   (overscroll-behavior: contain), so a long section trapped the page's
   scrolling. The section is as tall as its dates; only sideways can scroll,
   and only when the columns at their smallest do not fit. */
#tab-clubs .clubs-sheet-wrap-v27035 { overflow-x: auto; overflow-y: hidden; max-height: none; border: 1px solid #dbe4ee; border-radius: .5rem; background: #fff; }
/* The columns share the width there is: the date and "Other staff" columns
   are fixed, the roles split the rest equally, each no narrower than 5.5rem. */
#tab-clubs .clubs-sheet-table-v27035 {
  border-collapse: collapse; table-layout: fixed; width: 100%; font-size: .84rem;
  min-width: calc(6.6rem + var(--clubs-sheet-cols-v27036, 1) * 5.5rem + 9.5rem);
}
#tab-clubs .clubs-sheet-table-v27035 th,
#tab-clubs .clubs-sheet-table-v27035 td { border: 1px solid #dbe4ee; padding: .2rem .3rem; vertical-align: middle; text-align: left; }
#tab-clubs .clubs-sheet-table-v27035 thead th { background: #f1f5f9; font-weight: 800; white-space: normal; overflow-wrap: anywhere; vertical-align: bottom; }
#tab-clubs .clubs-sheet-table-v27035 tbody tr.is-weekend > * { background: #eef1f5; }
#tab-clubs .clubs-sheet-date-v27035 { position: sticky; left: 0; z-index: 1; background: #fff; width: 6.6rem; white-space: nowrap; }
#tab-clubs .clubs-sheet-table-v27035 thead .clubs-sheet-date-v27035 { background: #f1f5f9; }
#tab-clubs .clubs-sheet-day-v27035 { display: flex; align-items: center; gap: .35rem; font-weight: 800; }
#tab-clubs .clubs-sheet-time-v27035 { display: block; font-size: .74rem; color: #64748b; font-weight: 600; }
#tab-clubs .clubs-sheet-rolehead-v27035 { display: flex; align-items: center; justify-content: space-between; gap: .3rem; }
#tab-clubs .clubs-sheet-star-v27035 {
  margin: 0; padding: 0 .2rem; min-height: 0; border: 0; background: none; font-size: 1.1rem; line-height: 1;
  color: #94a3b8; cursor: pointer; font-weight: 400;
}
#tab-clubs span.clubs-sheet-star-v27035 { cursor: help; }
#tab-clubs .clubs-sheet-star-v27035.is-on { color: #ea580c; }
#tab-clubs button.clubs-sheet-star-v27035:hover { color: #c2410c; }
#tab-clubs button.clubs-sheet-star-v27035:focus-visible { outline: 2px solid #2563eb; outline-offset: 1px; }
#tab-clubs .clubs-sheet-cell-v27035.is-mandatory.is-empty { background: #fff7ed; }
#tab-clubs .clubs-sheet-cell-v27035.is-filled { background: #f0fdf4; }
/* v270.36: the "+" sits beside the last list, not under it, so a row is one
   list high; a second list still goes under the first. */
#tab-clubs .clubs-sheet-lists-v27035 { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem; }
#tab-clubs .clubs-sheet-lists-v27035 > .clubs-sheet-select-v27035 { flex: 1 1 calc(100% - 1.9rem); }
#tab-clubs .clubs-sheet-select-v27035 { width: 100%; min-width: 0; max-width: 100%; margin: 0; padding: .15rem .2rem; font-size: .8rem; text-overflow: ellipsis; }
#tab-clubs .clubs-sheet-more-v27035 { flex: none; margin: 0; min-height: 0; padding: 0 .45rem; font-size: .9rem; line-height: 1.4; border-radius: .3rem; }
#tab-clubs .clubs-sheet-name-v27035 { display: block; font-weight: 700; }
#tab-clubs .clubs-sheet-name-v27035.is-other { font-weight: 600; color: #334155; }
#tab-clubs .clubs-sheet-others-v27035 { width: 9.5rem; overflow-wrap: anywhere; }
/* v270.36: Available staff -- the date's staff as names with an x, and a +. */
#tab-clubs .clubs-sheet-chips-v27036 { display: flex; flex-wrap: wrap; align-items: center; gap: .2rem; }
#tab-clubs .clubs-sheet-chip-v27036 {
  display: inline-flex; align-items: center; gap: .15rem; max-width: 100%; padding: 0 0 0 .4rem; border: 1px solid #cbd5e1; border-radius: 999px;
  background: #f8fafc; font-size: .76rem; font-weight: 600; line-height: 1.5; color: #1e293b;
}
#tab-clubs .clubs-sheet-chip-v27036.has-role { background: #f0fdf4; border-color: #86efac; }
#tab-clubs .clubs-sheet-chip-x-v27036 {
  margin: 0; min-height: 0; width: 1.3rem; height: 1.3rem; padding: 0; border: 0; border-radius: 999px; background: none;
  color: #475569; font-size: .95rem; line-height: 1; cursor: pointer; font-weight: 700;
}
#tab-clubs .clubs-sheet-chip-x-v27036:hover { background: #fee2e2; color: #b91c1c; }
#tab-clubs .clubs-sheet-chip-x-v27036:focus-visible { outline: 2px solid #2563eb; outline-offset: 0; }
#tab-clubs .clubs-sheet-pick-v27036 { flex: 1 1 100%; }
/* A date with a Mandatory role nobody has: the Dashboard's small orange square. */
#tab-clubs .clubs-sheet-missing-v27035 { display: inline-block; flex: none; width: 7px; height: 7px; background: #f97316; }
