/* SchoolDay v270.11: Clubs, compact for an iPad or larger, plus the summary,
   the ratio, the assessments switch, the folded editor sections, full screen
   and the Staff Rota.

   Loaded before admin-function-shell-v2365.css, which stays last. Where the
   sweep says !important, this says it too with an ID more (#tab-clubs), so
   specificity decides and this wins; it never relies on order.

   SMALLER TEXT. Every size in admin-clubs-v2690.css is in rem, and rem is
   the ROOT's size, so a smaller font-size on the panel changes nothing. zoom
   scales the type and the spacing together, which is what "fit more on the
   screen" means. It is on the panels and the dialog card, NOT on the fixed
   dialog backdrop: a zoomed fixed layer stops covering the screen. */

/* ------------------------------------------------- the title bar: "Clubs" + version */
.admin-body #adminApp #tab-clubs > .section-heading.admin-title-frame-v2365 {
  grid-template-areas: "title help" !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: .5rem !important;
  /* v270.16: margin and padding are every function's (admin-frames-v27016.css). */
}
.admin-body #adminApp #tab-clubs > .section-heading .admin-title-main-v2365 h2,
.admin-body #adminApp #tab-clubs > .section-heading h2 {
  margin: 0 !important;
  font-size: 1.1rem !important;
}
/* "How this page works" is not on Clubs; the version stays. The button is the
   one shared row the shell moves between panels, so it is hidden here rather
   than removed: the next panel still has it. */
.admin-body #adminApp #tab-clubs .admin-page-help-row > button { display: none !important; }
.admin-body #adminApp #tab-clubs .admin-page-help-row { align-self: center; }

/* ------------------------------------------------- smaller everything */
#tab-clubs > [data-clubs-panel-v2690],
#tab-clubs > #clubsTabsV2690,
#tab-clubs .clubs-dialog-card-v2690 {
  zoom: .9;
}
/* The tab strip a little tighter. */
.admin-body #adminApp #tab-clubs #clubsTabsV2690 > button {
  padding: .4rem .8rem !important;
}
#tab-clubs .clubs-toolbar-v2690 { margin: .45rem 0; }
#tab-clubs .clubs-dashboard-row-v2690,
#tab-clubs .clubs-manage-row-v2690 { padding: .5rem .75rem; gap: .6rem; }
#tab-clubs .clubs-dashboard-row-v2690 .clubs-swatch-v2690 { height: 1.8rem; }
#tab-clubs .clubs-dashboard-list-v2690,
#tab-clubs .clubs-manage-list-v2690,
#tab-clubs .clubs-date-list-v2690,
#tab-clubs .clubs-owner-list-v2690 { gap: .35rem; }
#tab-clubs .clubs-reg-row-v2690 { padding: .4rem .6rem; }
#tab-clubs .clubs-editor-v2690 section,
#tab-clubs .clubs-editor-v2690 details { margin-bottom: .6rem; }

/* ------------------------------------------------- full screen */
#tab-clubs .clubs-dash-tools-v27011 { display: flex; justify-content: flex-end; margin: 0 0 .35rem; }
#tab-clubs:fullscreen { background: #fff; overflow-y: auto; padding: 1rem 1.25rem; }
#tab-clubs:-webkit-full-screen { background: #fff; overflow-y: auto; padding: 1rem 1.25rem; }
/* Where the browser has no full screen: a fixed layer over the page. */
#tab-clubs.is-fullscreen-v27011 {
  position: fixed !important; inset: 0; z-index: 3900; margin: 0 !important;
  display: block !important; background: #fff; overflow-y: auto; padding: 1rem 1.25rem; border-radius: 0;
}

/* ------------------------------------------------- the Dashboard summary and ratio */
#tab-clubs .clubs-dash-item-v27011 { border-radius: .7rem; }
#tab-clubs .clubs-dash-extra-v27011 {
  display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem;
  margin: -.15rem .2rem .1rem 1.4rem; padding: .3rem 0 .1rem;
}
/* Over the ratio: the whole club turns red. Red and green differ in lightness
   and carry a word and a mark as well, so colour is never the only signal. */
#tab-clubs .clubs-dash-item-v27011.is-ratio-over > .clubs-dashboard-row-v2690 {
  border-color: #dc2626; border-left: .4rem solid #b91c1c; background: #fef2f2;
}
#tab-clubs .clubs-dash-item-v27011.is-ratio-ok > .clubs-dashboard-row-v2690 { border-left: .4rem solid #15803d; }
#tab-clubs .clubs-ratio-v27011 {
  display: inline-flex; align-items: center; gap: .3rem; padding: .15rem .55rem; border-radius: 999px;
  font-size: .85rem; font-weight: 800;
}
#tab-clubs .clubs-ratio-v27011.is-ok { background: #dcfce7; color: #14532d; border: 1px solid #86efac; }
#tab-clubs .clubs-ratio-v27011.is-over { background: #b91c1c; color: #fff; border: 1px solid #7f1d1d; }
#tab-clubs .clubs-sum-v27011 { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .3rem .45rem; }
#tab-clubs .clubs-sum-group-v27011 { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .25rem; }
#tab-clubs .clubs-sum-label-v27011 { font-size: .82rem; font-weight: 800; color: #334155; }
#tab-clubs .clubs-sum-chip-v27011 {
  padding: .12rem .55rem; border-radius: 999px; font-size: .82rem; font-weight: 700; min-height: 0;
  background: #eef6ff; color: #0f3d6b; border: 1px solid #b8d4ef; cursor: pointer;
}
#tab-clubs button.clubs-sum-chip-v27011:hover { background: #dceffc; color: #0f3d6b; }
#tab-clubs .clubs-sum-chip-v27011.is-none { background: #f8fafc; color: #64748b; border-color: #e2e8f0; cursor: default; }
#tab-clubs .clubs-sum-list-v27011 { margin: .5rem 0 0 1.4rem; padding: 0; columns: 2 14rem; }

/* ------------------------------------------------- the assessments switch */
#tab-clubs .clubs-switch-v27011 {
  display: inline-flex; align-items: center; gap: .45rem; padding: .3rem .7rem; font-size: .85rem;
  background: #f1f5f9; color: #334155; border: 1px solid #cbd5e1;
}
#tab-clubs .clubs-switch-v27011:hover { background: #e2e8f0; color: #0f172a; }
#tab-clubs .clubs-switch-track-v27011 {
  position: relative; width: 2.1rem; height: 1.15rem; border-radius: 999px; background: #94a3b8; flex: 0 0 auto;
}
#tab-clubs .clubs-switch-track-v27011::after {
  content: ""; position: absolute; top: .15rem; left: .15rem; width: .85rem; height: .85rem; border-radius: 50%; background: #fff;
}
#tab-clubs .clubs-switch-v27011.is-on { background: #ecfdf5; color: #14532d; border-color: #86efac; }
#tab-clubs .clubs-switch-v27011.is-on .clubs-switch-track-v27011 { background: #15803d; }
#tab-clubs .clubs-switch-v27011.is-on .clubs-switch-track-v27011::after { left: 1.1rem; }

/* The register without the Assessments column. */
#tab-clubs .clubs-reg-head-v2690.is-no-assess-v27011,
#tab-clubs .clubs-reg-list-v2690.is-no-assess-v27011 .clubs-reg-row-v2690 {
  grid-template-columns: minmax(12rem, 1.4fr) minmax(9rem, 1.3fr) minmax(14rem, 1.3fr) auto;
}

/* ------------------------------------------------- the editor's folded sections */
#tab-clubs .clubs-fold-v27011 { border: 1px solid var(--club-line); border-radius: .7rem; padding: .2rem .8rem; background: #fff; }
#tab-clubs .clubs-fold-v27011 > summary {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .7rem; cursor: pointer; padding: .4rem 0; list-style: none;
}
#tab-clubs .clubs-fold-v27011 > summary::-webkit-details-marker { display: none; }
#tab-clubs .clubs-fold-v27011 > summary::before { content: "\25B8"; color: #475569; transition: transform .15s; }
#tab-clubs .clubs-fold-v27011[open] > summary::before { transform: rotate(90deg); }
#tab-clubs .clubs-fold-v27011 > summary h4 { margin: 0; display: inline; }
#tab-clubs .clubs-fold-v27011[open] { padding-bottom: .7rem; }
#tab-clubs .clubs-req-view-v27011 { display: grid; gap: .2rem; margin: .2rem 0 .6rem !important; }
#tab-clubs .clubs-req-view-v27011 li { padding: .25rem 0; border-bottom: 1px solid #f1f5f9; }
#tab-clubs .clubs-badge-v2690.is-summary-v27011 { background: #e0f2fe; color: #0c4a6e; }
#tab-clubs .clubs-req-actions-v27011 { margin-top: .6rem; }
/* Six things on a field row now: name, type, choices, Required, Appear on
   summary, and the order buttons. */
#tab-clubs .clubs-field-row-v2690 { grid-template-columns: minmax(9rem, 1.2fr) minmax(7rem, .8fr) minmax(8rem, 1.2fr) auto auto auto; }

/* ------------------------------------------------- the ratio editor */
#tab-clubs .clubs-ratio-section-v27011 { border: 1px solid var(--club-line); border-radius: .7rem; padding: .5rem .8rem .7rem; background: #fff; }
#tab-clubs .clubs-ratio-section-v27011 h4 { margin: .2rem 0; }
#tab-clubs .clubs-ratio-section-v27011 input[type="number"] { width: 5rem; }
#tab-clubs .clubs-levels-v27011 { display: grid; gap: .3rem; margin: .4rem 0 !important; }
#tab-clubs .clubs-levels-v27011 li { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
#tab-clubs .clubs-ratio-preview-v27011 { margin: .3rem 0 0; }

/* ------------------------------------------------- the Staff Rota */
#tab-clubs .clubs-rota-wrap-v27011 { overflow: auto; max-height: calc(100dvh - 14rem); border: 1px solid var(--club-line); border-radius: .6rem; }
#tab-clubs .clubs-rota-v27011 { border-collapse: separate; border-spacing: 0; width: 100%; font-size: .88rem; }
#tab-clubs .clubs-rota-v27011 th,
#tab-clubs .clubs-rota-v27011 td { padding: .3rem .45rem; border-bottom: 1px solid #eef2f7; border-right: 1px solid #f1f5f9; vertical-align: top; text-align: left; }
#tab-clubs .clubs-rota-v27011 thead th {
  position: sticky; top: 0; z-index: 2; background: #f4f8fb; border-bottom: 2px solid #cbd9e5; font-weight: 800; white-space: nowrap;
}
#tab-clubs .clubs-rota-v27011 tbody th { position: sticky; left: 0; z-index: 1; background: #fff; white-space: nowrap; font-weight: 700; }
#tab-clubs .clubs-rota-person-v27011 > span:first-child { display: block; }
#tab-clubs .clubs-rota-days-v27011 { display: block; font-weight: 700; font-size: .8rem; color: #0f3d6b; }
#tab-clubs .clubs-rota-label-v27011 {
  display: inline-block; margin: .05rem 0; padding: .08rem .45rem; border-radius: .35rem; font-size: .8rem; font-weight: 700;
  white-space: nowrap; border: 1px solid rgba(0, 0, 0, .15);
}
#tab-clubs .clubs-rota-v27011 td.is-working { background: #fbfdff; }

@media (max-width: 700px) {
  #tab-clubs .clubs-dash-extra-v27011 { margin-left: .2rem; }
  #tab-clubs .clubs-reg-head-v2690.is-no-assess-v27011 { display: none; }
  #tab-clubs .clubs-reg-list-v2690.is-no-assess-v27011 .clubs-reg-row-v2690 { grid-template-columns: 1fr; }
}
