/* calendar-event only: the form in two columns on a wide screen, the dates and the download across the page below it. */
.ce-cols { display: grid; gap: var(--matrix-space-20); }
.ce-form { display: grid; gap: var(--matrix-space-16); min-width: 0; align-items: start; }
.ce-form > * { min-width: 0; }
.ce-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(11em, 1fr)); gap: var(--matrix-space-12); align-items: start; }
.ce-field { display: grid; gap: 4px; min-width: 0; align-content: start; }
.ce-field > label { font-weight: 600; }
.ce-field input, .ce-field select, .ce-field textarea { width: 100%; box-sizing: border-box; min-width: 0; }
.matrix-ui .ce-field textarea { resize: vertical; font-family: inherit; line-height: 1.45; }
.ce-hint { margin: 0; font-size: var(--matrix-type-caption); overflow-wrap: break-word; }
.ce-hint:empty { display: none; }
.ce-check label { flex: 1 1 12em; min-width: 0; }
.ce-bar { display: flex; flex-wrap: wrap; gap: var(--matrix-space-8) var(--matrix-space-12); align-items: center; }
.ce-bar-group { display: grid; gap: var(--matrix-space-8); }
.ce-open-label { display: inline-flex; align-items: center; min-height: var(--matrix-control-min-height); box-sizing: border-box; cursor: pointer; }
#ce-open.visually-hidden { width: 1px; } /* tools.css widens every file input in the options to 100% */
#ce-open:focus-visible + .ce-open-label { outline: 2px solid var(--matrix-focus); outline-offset: 2px; }
.ce-small { padding: 4px 12px; min-height: 32px; font-size: var(--matrix-type-caption); }
.matrix-ui .ce-small.matrix-primary { min-height: 32px; }
.ce-days { border: 0; padding: 0; margin: 0; display: grid; gap: var(--matrix-space-8); min-width: 0; }
.ce-days legend { font-weight: 600; padding: 0; }
.ce-day { flex-wrap: nowrap; gap: 6px; }
.matrix-ui .ce-events { height: auto; min-height: 9.5em; padding: 4px; }
.ce-jump { justify-self: start; font-size: var(--matrix-type-caption); }
.ce-more > summary { font-weight: 600; cursor: pointer; }
.ce-more[open] > summary { margin-bottom: var(--matrix-space-8); }

.ce-aside { display: grid; gap: var(--matrix-space-12); padding: var(--matrix-space-16); border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-panel); background: var(--matrix-surface-subtle); min-width: 0; align-content: start; }
.ce-aside > .ce-field { max-width: 22em; }
.ce-title { margin: 0; font-size: 1.0625rem; }
.ce-title:focus, .ce-sub:focus { outline: none; }
.ce-sub { margin: 0 0 4px; font-size: 0.9375rem; }
.ce-summary { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.ce-checks { border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-control); padding: var(--matrix-space-8) var(--matrix-space-12); background: var(--matrix-surface); min-width: 0; }
.ce-list { margin: 0; padding-left: 1.1em; display: grid; gap: 4px; font-size: var(--matrix-type-caption); overflow-wrap: anywhere; }
.ce-list:empty { display: none; }
.ce-skipped { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: var(--matrix-type-table); }
.ce-skipped li { display: flex; flex-wrap: wrap; gap: var(--matrix-space-8) var(--matrix-space-12); align-items: center; justify-content: space-between; }

.ce-table-box { display: grid; gap: var(--matrix-space-8); min-width: 0; justify-items: start; }
.ce-table { width: 100%; border-collapse: collapse; font-size: var(--matrix-type-table); line-height: var(--matrix-leading-table); background: var(--matrix-surface); border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-control); }
.ce-table th, .ce-table td { text-align: left; vertical-align: top; padding: 8px 10px; border-bottom: 1px solid var(--matrix-border); overflow-wrap: anywhere; }
.ce-table th { font-weight: 600; }
.ce-table tbody tr:last-child td { border-bottom: 0; }
.ce-when { font-weight: 600; }
.ce-offset { white-space: nowrap; }
.ce-tag { margin-left: 6px; }
.ce-title-of, .ce-row-note { display: block; font-size: var(--matrix-type-caption); margin-top: 2px; }
.ce-row-note { color: var(--matrix-warning); }
.ce-changed td:first-child { box-shadow: inset 3px 0 0 var(--matrix-brand); }
.ce-actions .ce-bar { gap: 6px; }
.ce-editor-row > td { background: var(--matrix-surface-subtle); }
.ce-editor { background: var(--matrix-surface); }
.ce-text { margin: 0; font-family: var(--matrix-font-mono); font-size: var(--matrix-type-caption); white-space: pre-wrap; overflow-wrap: anywhere; max-height: 18em; overflow: auto; padding: var(--matrix-space-8); border-radius: var(--matrix-radius-control); background: var(--matrix-surface); border: 1px solid var(--matrix-border); }

@media (min-width: 900px) {
  .ce-jump { display: none; }
  .ce-form { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .ce-form > .ce-bar-group, .ce-form > .ce-wide { grid-column: 1 / -1; }
}
/* a narrow screen: each date is a card, each cell under the name of its column */
@media (max-width: 760px) {
  .ce-table { border: 0; background: none; }
  .ce-table thead { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .ce-table, .ce-table tbody, .ce-table tr, .ce-table td { display: block; }
  .ce-table tr { border: 1px solid var(--matrix-border); border-radius: var(--matrix-radius-control); background: var(--matrix-surface); padding: var(--matrix-space-8) var(--matrix-space-12); margin-bottom: var(--matrix-space-8); }
  .ce-table td { border: 0; padding: 3px 0; }
  .ce-table td[data-label]::before { content: attr(data-label); display: block; font-size: var(--matrix-type-caption); color: var(--matrix-muted); }
  .ce-changed td:first-child { box-shadow: none; }
  .ce-table tr.ce-changed { border-left: 3px solid var(--matrix-brand); }
  .ce-editor-row > td { background: none; }
  .ce-table tr.ce-editor-row { padding: 0; border: 0; }
}
/* the search box above a zone menu (Jack's low point 77a): box, what it found, then the menu */
.ce-find { display: grid; gap: 4px; min-width: 0; }
.ce-find .ce-hint { margin: 0; }