/* SchoolDay v270.21: Clubs > MagicBooking (Riley's only) -- the extension's
   download and steps, the review list, the remembered club names and the log.
   Loaded after admin-clubs-v27020.css and before admin-function-shell-v2365.css.
   No !important. */
#tab-clubs .clubs-mb-install-v27021 p { max-width: 62rem; }
#tab-clubs .clubs-mb-download-v27021 { display: inline-block; padding: .5rem 1rem; border-radius: .5rem; background: #6d28d9; color: #fff; font-weight: 700; text-decoration: none; }
#tab-clubs .clubs-mb-download-v27021:hover, #tab-clubs .clubs-mb-download-v27021:focus-visible { background: #5b21b6; }
#tab-clubs .clubs-mb-steps-v27021 { margin: .4rem 0 .6rem 1.2rem; padding: 0; max-width: 62rem; }
#tab-clubs .clubs-mb-steps-v27021 li { margin: .25rem 0; }
#tab-clubs .clubs-mb-review-list-v27021 { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
#tab-clubs .clubs-mb-review-v27021 { display: block; border-left: 5px solid #d97706; }
#tab-clubs .clubs-mb-review-v27021.is-error { border-left-color: #dc2626; }
#tab-clubs .clubs-mb-head-v27021 { margin-bottom: .2rem; }
#tab-clubs .clubs-mb-children-v27021 { border: 0; margin: .4rem 0; padding: 0; }
#tab-clubs .clubs-mb-children-v27021 legend { font-weight: 700; padding: 0; }
#tab-clubs .clubs-mb-review-v27021 .clubs-field-v2690 { display: flex; flex-wrap: wrap; gap: .45rem; align-items: baseline; margin: .3rem 0; max-width: 46rem; }
#tab-clubs .clubs-mb-review-v27021 .clubs-field-v2690 > input { width: auto; margin: 0; }
#tab-clubs .clubs-mb-review-v27021 select { width: auto; min-width: 16rem; max-width: 100%; }
#tab-clubs .clubs-mb-review-v27021 .clubs-toolbar-v2690 { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; margin-top: .5rem; }
#tab-clubs .clubs-mb-table-v27021 { width: 100%; }
#tab-clubs .clubs-mb-table-v27021 td, #tab-clubs .clubs-mb-table-v27021 th { vertical-align: top; text-align: left; }
#tab-clubs .clubs-mb-table-v27021 select { width: auto; min-width: 14rem; max-width: 100%; }
#tab-clubs .clubs-mb-status-v27021 { font-weight: 700; white-space: nowrap; }
#tab-clubs .clubs-mb-status-v27021.is-booked { color: #166534; }
#tab-clubs .clubs-mb-status-v27021.is-review_child, #tab-clubs .clubs-mb-status-v27021.is-review_club { color: #92400e; }
#tab-clubs .clubs-mb-status-v27021.is-error { color: #991b1b; }
#tab-clubs .clubs-mb-status-v27021.is-skipped { color: #475569; }
#tab-clubs .clubs-mb-status-v27021.is-undone { color: #6d28d9; }
#tab-clubs .clubs-mb-actions-v27022 { white-space: nowrap; }
#tab-clubs .clubs-mb-actions-v27022 button + button { margin-left: 10px; }

/* v270.25: a CSV over 10,000 rows, offered as parts to download. */
.clubs-import-parts-v27025 { margin: 12px 0; padding: 12px 14px; border: 1px solid #f59e0b; border-left-width: 4px; background: #fffbeb; }
.clubs-import-parts-v27025 p { margin: 0 0 8px; }
.clubs-import-part-list-v27025 { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 16px; }
.clubs-import-part-list-v27025 li { display: flex; align-items: center; gap: 8px; }

/* v270.27: Import Data, a split column ("Dietary Needs: … / Details: …"). */
#tab-clubs .clubs-split-row-v27027 { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; margin-top: .35rem; font-size: .85rem; }
#tab-clubs .clubs-split-row-v27027 label { display: inline-flex; align-items: center; gap: .35rem; margin: 0; font-weight: 400; }
#tab-clubs .clubs-split-row-v27027 input[type="checkbox"] { width: auto; margin: 0; }
#tab-clubs .clubs-split-to-v27027 { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .3rem .4rem; }
#tab-clubs .clubs-split-to-v27027 select { width: auto; margin: 0; }
#tab-clubs .clubs-split-to-v27027 input { width: 14rem; max-width: 100%; }

/* v270.27: a date's Meal plan and Requirements boxes are wider, and each
   widget (still two columns) is wide enough for its whole name ("Medical
   Conditions", "SEN / support needs") instead of cutting it off. On a phone
   a long name wraps. */
#tab-clubs .clubs-sum-grid-v27012 { display: flex; flex-wrap: wrap; align-items: flex-start; }
#tab-clubs .clubs-sum-block-v27012 { flex: 1 1 26rem; max-width: 100%; }
#tab-clubs .clubs-sum-cells-v27012 { grid-template-columns: repeat(2, minmax(max-content, 1fr)); }
#tab-clubs .clubs-sum-cell-v27012 > span { overflow: visible; text-overflow: clip; }
@media (max-width: 700px) {
  #tab-clubs .clubs-sum-cells-v27012 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #tab-clubs .clubs-sum-cell-v27012 > span { white-space: normal; overflow-wrap: anywhere; }
}

/* v270.27: each date in a club's list opens its register: it looks like a
   button now, with "Open register" at its right. */
#tab-clubs .clubs-date-open-v2690 {
  border: 1px solid #b8d4ef; border-radius: .5rem; background: #f5faff; padding: .5rem .75rem .5rem calc(.35rem - 1px); cursor: pointer;
  /* the date stays where it was, in line with the Staff line under it */
}
#tab-clubs .clubs-date-open-v2690::after {
  content: "Open register \203A"; flex: 0 0 auto; margin-left: auto; font-size: .82rem; font-weight: 700; color: #0f3d6b;
}
#tab-clubs .clubs-date-open-v2690:hover { background: #dceffc; border-color: #7fb0dd; color: var(--ink, #0f172a); }
#tab-clubs .clubs-date-open-v2690:focus-visible { outline: 2px solid #0f3d6b; outline-offset: 2px; }
#tab-clubs .clubs-date-row-v2690.is-cancelled .clubs-date-open-v2690 { background: #fafafa; border-color: #e2e8f0; }

/* v270.27: Manage Clubs > Edit > Club requirements: a thin, faint line
   between the fields, so it is clear what is on the same row. */
#tab-clubs .clubs-field-list-v2690 { gap: 0; }
#tab-clubs .clubs-field-row-v2690 { padding: .4rem 0; border-bottom: 1px solid #e5ebf2; }
#tab-clubs .clubs-field-row-v2690:first-child { border-top: 1px solid #e5ebf2; }
#tab-clubs .clubs-req-view-v27011 li { border-bottom-color: #e5ebf2; }

/* v270.28: Import Data, how the file's columns are separated. */
#tab-clubs .clubs-import-delim-v27028 { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; margin: .6rem 0 0; }
#tab-clubs .clubs-import-delim-v27028 select { width: auto; margin: 0; }

/* v270.29: a child's screens from the register are wider, never wider than
   the window; "Meal paid for" in its own column; the Meal Counts row. */
#tab-clubs .clubs-dialog-card-v2690.is-wide-v27029 { width: min(76rem, 100%); }
#tab-clubs .clubs-req-meal-v27029 { white-space: nowrap; font-weight: 700; }
#tab-clubs .clubs-grid-paid-v27029 td { color: #9a3412; }

/* v270.30: ROLES. Manage Clubs: the roles under each club and the editor's
   rows. The register: a frame per role under the staff, orange when a
   Mandatory role has nobody; a dashed outline while somebody is dragged over. */
#tab-clubs .clubs-manage-roles-v27030 { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .2rem; }
#tab-clubs .clubs-role-tag-v27030 { display: inline-block; font-size: .74rem; font-weight: 700; padding: .05rem .45rem; border-radius: 999px; background: #eef2f7; color: #334155; }
#tab-clubs .clubs-role-tag-v27030.is-mandatory { background: #fff7ed; color: #9a3412; border: 1px solid #fdba74; }
#tab-clubs .clubs-role-tag-v27030 abbr { text-decoration: none; }
#tab-clubs .clubs-role-list-v27030 { display: grid; gap: 0; margin: .3rem 0 .5rem; padding: 0; list-style: none; }
#tab-clubs .clubs-role-row-v27030 { display: grid; grid-template-columns: minmax(10rem, 1fr) auto auto; gap: .5rem; align-items: center; padding: .35rem 0; border-bottom: 1px solid #e5ebf2; }
#tab-clubs .clubs-role-row-v27030:first-child { border-top: 1px solid #e5ebf2; }
#tab-clubs .clubs-role-row-v27030 input[data-role-prop-v27030="name"] { margin: 0; }
@media (max-width: 640px) {
  #tab-clubs .clubs-role-row-v27030 { grid-template-columns: 1fr auto; }
  #tab-clubs .clubs-role-row-v27030 .clubs-order-v2690 { grid-column: 1 / -1; }
}

#tab-clubs .clubs-roles-v27030 { margin: .5rem 0 .2rem; }
#tab-clubs .clubs-role-frames-v27030 { display: flex; flex-wrap: wrap; justify-content: center; gap: .45rem; margin: 0; padding: 0; list-style: none; }
#tab-clubs .clubs-role-frame-v27030 {
  display: flex; flex-direction: column; align-items: center; gap: .25rem; min-width: 8.5rem; max-width: 100%;
  padding: .35rem .55rem .45rem; border: 2px solid #cbd5e1; border-radius: .6rem; background: #fff;
}
#tab-clubs .clubs-role-frame-v27030.is-filled { border-color: #86efac; background: #f0fdf4; }
#tab-clubs .clubs-role-frame-v27030.is-mandatory.is-empty { border-color: #f97316; background: #fff7ed; }
#tab-clubs .clubs-role-frame-v27030.is-drop-v27030 { border-style: dashed; border-color: #0f3d6b; background: #e0f2fe; }
#tab-clubs .clubs-role-name-v27030 { font: inherit; font-size: .82rem; font-weight: 800; color: #0f172a; background: none; border: 0; padding: 0; margin: 0; cursor: default; }
#tab-clubs button.clubs-role-name-v27030 { cursor: pointer; text-decoration: underline; text-decoration-style: dotted; text-underline-offset: .15rem; }
#tab-clubs button.clubs-role-name-v27030:hover { color: #0f3d6b; }
#tab-clubs .clubs-role-star-v27030 { text-decoration: none; color: #c2410c; }
#tab-clubs .clubs-role-people-v27030 { display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem; font-size: .82rem; }
#tab-clubs .clubs-role-person-v27030 { display: inline-flex; align-items: center; gap: .15rem; padding: .05rem .2rem .05rem .5rem; border-radius: 999px; background: #dcfce7; color: #14532d; font-weight: 700; }
#tab-clubs .clubs-role-person-v27030 > button { border: 0; background: none; color: inherit; padding: 0 .3rem; margin: 0; min-height: 0; font-size: 1rem; line-height: 1; cursor: pointer; border-radius: 999px; }
#tab-clubs .clubs-role-person-v27030 > button:hover { background: #fee2e2; color: #991b1b; }
#tab-clubs .clubs-role-add-v27030 { width: auto; max-width: 100%; margin: 0; font-size: .82rem; padding: .15rem .3rem; }
#tab-clubs .clubs-roles-missing-v27030 { margin: .35rem 0 0; text-align: center; font-weight: 800; color: #c2410c; }
#tab-clubs [data-staff-drag-v27030] { cursor: grab; }
#tab-clubs .clubs-roles-staff-v27030 { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin: .2rem 0 .6rem; }
#tab-clubs .clubs-date-row-v2690.is-roles-missing-v27030 { outline: 3px solid #f97316; outline-offset: -1px; }
#tab-clubs .clubs-badge-v2690.is-roles-v27030 { background: #ffedd5; color: #9a3412; }

/* v270.30: the Dashboard: a date with a Mandatory role nobody has, and its
   line beside the Staff Ratio one. v270.35 (Sean): a small orange square in
   the date's top corner, not an orange circle round it; the line has the
   same square as its key. */
#tab-clubs .clubs-grid-cell-v27012.is-roles-missing-v27030 > button { position: relative; }
#tab-clubs .clubs-grid-cell-v27012.is-roles-missing-v27030 > button::after,
#tab-clubs .clubs-roles-notice-v27030::before {
  content: ""; box-sizing: border-box; width: 7px; height: 7px; background: #f97316; box-shadow: 0 0 0 1px #fff;
}
#tab-clubs .clubs-grid-cell-v27012.is-roles-missing-v27030 > button::after { position: absolute; top: 2px; right: 2px; }
#tab-clubs .clubs-roles-notice-v27030::before { display: inline-block; margin-right: .4rem; vertical-align: .1em; box-shadow: none; }
#tab-clubs .clubs-grid-notices-v27030 { grid-column: 2; display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
#tab-clubs .clubs-grid-notices-v27030 > .clubs-ratio-notice-v27016 { grid-column: auto; }
#tab-clubs .clubs-roles-notice-v27030 { color: #7c2d12; background: #fff7ed; box-shadow: inset 0 0 0 3px #f97316; }
@media (max-width: 760px) { #tab-clubs .clubs-grid-notices-v27030 { grid-column: 1; } }

/* v270.30: Print to PDF, the CSVs and the banner. */
#tab-clubs .clubs-print-tools-v27030 { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .35rem; }
#tab-clubs .clubs-print-tools-v27030 button { margin: 0; }
#tab-clubs .clubs-print-preview-v27030 { margin: .6rem 0; }
#tab-clubs .clubs-print-banner-v27030 { display: flex; align-items: center; gap: .8rem; padding: .55rem .9rem; border-radius: .5rem; }
#tab-clubs .clubs-print-banner-v27030 img { max-height: 2.6rem; max-width: 9rem; object-fit: contain; background: #fff; border-radius: .3rem; padding: .15rem; }
#tab-clubs .clubs-csv-staff-v27030 { max-height: 50vh; overflow-y: auto; display: grid; gap: .2rem; margin: .5rem 0; }

/* v270.30: the Staff Rota by club: a header row for each club in its colour,
   with a square on each of its dates. */
#tab-clubs .clubs-rota-clubhead-v27030 > th,
#tab-clubs .clubs-rota-clubhead-v27030 > td { background: #f8fafc; border-top: 2px solid var(--club-colour-v27030, #94a3b8); }
#tab-clubs .clubs-rota-clubhead-v27030 > th.clubs-rota-name-v27013 { font-weight: 800; background: #f8fafc; }
#tab-clubs .clubs-rota-clubhead-v27030 > th .clubs-swatch-v2690 { margin-right: .4rem; }
#tab-clubs .clubs-rota-clubhead-v27030.is-none > th,
#tab-clubs .clubs-rota-clubhead-v27030.is-none > td { border-top-color: #cbd5e1; }
#tab-clubs .clubs-rota-clubnote-v27030 { text-align: left; padding: .25rem .6rem; font-size: .8rem; }
#tab-clubs .clubs-rota-square-v27030 {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; width: 1.6rem; height: 1.6rem; margin: .15rem auto; padding: 0;
  border: 0; border-radius: .25rem; font-size: .78rem; font-weight: 800; cursor: pointer; background: #e2e8f0; color: #0f172a; min-height: 0;
}
#tab-clubs .clubs-rota-square-v27030.is-filled { background: #16a34a; color: #fff; }
#tab-clubs .clubs-rota-square-v27030.is-missing { background: #dc2626; color: #fff; }
#tab-clubs .clubs-rota-square-v27030:hover { filter: brightness(.92); }
#tab-clubs .clubs-rota-square-v27030:focus-visible { outline: 3px solid #2563eb; outline-offset: 1px; }
#tab-clubs .clubs-rota-order-v27030 select { width: auto; }