/* teach area, webinars, instructors, credit notes (WEBINAR builder) – tokens only */
.cell-2 { display: grid; gap: 1px; min-width: 0; line-height: 1.3; }
@media (max-width: 760px) { .hide-sm { display: none; } }
.bad-text { color: var(--color-danger-text); }
.table tr.muted-row td { opacity: .6; }
.table tr.current-row td { background: var(--color-success-subtle); }
.table tfoot td { border-top: 1px solid var(--color-border); padding-top: var(--space-2); }
.table tfoot tr.total td { font-size: var(--font-size-lg); }
.plain-list { margin: 0; padding-left: 18px; }

/* attention items (home) */
.wb-att-list { display: grid; gap: var(--space-2); }
.wb-att { display: flex; gap: var(--space-3); align-items: center; padding: var(--space-3) var(--space-4); border-radius: var(--radius-lg); border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); text-decoration: none; }
.wb-att:hover { border-color: var(--color-primary); box-shadow: var(--shadow-2); }
.wb-att .grow { display: grid; gap: 2px; min-width: 0; }
.wb-att-ic { width: 36px; height: 36px; border-radius: var(--radius-md); display: grid; place-items: center; flex: none; background: var(--color-info-subtle); color: var(--color-info-text); }
.wb-att.warning .wb-att-ic { background: var(--color-warning-subtle); color: var(--color-warning-text); }
.wb-att.danger .wb-att-ic { background: var(--color-danger-subtle); color: var(--color-danger-text); }
.wb-att-count { margin-left: var(--space-2); background: var(--color-surface-secondary); border-radius: var(--radius-full); padding: 0 8px; font-size: var(--font-size-xs); }
.wb-att-action { display: inline-flex; gap: 4px; align-items: center; color: var(--color-primary-text); font-size: var(--font-size-sm); font-weight: 600; white-space: nowrap; }
@media (max-width: 640px) { .wb-att-action { display: none; } }
.wb-date-chip { display: grid; place-items: center; width: 48px; height: 48px; flex: none; border-radius: var(--radius-md); background: var(--color-primary-subtle); color: var(--color-primary-text); line-height: 1.1; }
.wb-date-chip b { font-size: var(--font-size-xl); }

/* webinar detail */
.wb-image { width: 100%; max-height: 220px; object-fit: cover; border-radius: var(--radius-lg); margin-bottom: var(--space-3); }
.wb-summary { font-weight: 500; margin-top: 0; }
.wb-image-prev { width: 120px; height: 68px; border-radius: var(--radius-md); background: var(--color-surface-secondary); display: grid; place-items: center; overflow: hidden; }
.wb-image-prev img { width: 100%; height: 100%; object-fit: cover; }
.rich-text { line-height: 1.6; }
.rich-text p { margin: 0 0 var(--space-2); }
.rich-text ul, .rich-text ol { margin: 0 0 var(--space-2); padding-left: 22px; }
.rich-wrap { display: grid; gap: 4px; }
.rich-bar { display: flex; gap: 2px; }
.rich-bar .rich-b { font-weight: 700; } .rich-bar .rich-i { font-style: italic; }
.rich-edit { min-height: 120px; height: auto; padding: var(--space-3); line-height: 1.55; overflow: auto; }
.rich-edit:focus { outline: 2px solid var(--color-focus-ring); }
.rich-edit p { margin: 0 0 var(--space-2); }

.slot-list { display: grid; }
.slot-row { display: grid; gap: var(--space-2) var(--space-4); grid-template-columns: minmax(150px, 1.2fr) minmax(140px, 1fr) minmax(120px, 1fr) auto; align-items: center;
  padding: var(--space-3) 0; border-bottom: 1px solid var(--color-divider); }
.slot-row:last-child { border-bottom: 0; }
.slot-row.cancelled { opacity: .6; }
.slot-day { font-weight: 600; }
.slot-seats { display: grid; gap: 4px; }
.slot-status { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.slot-actions { justify-content: flex-end; }
.slot-msg { grid-column: 1 / -1; }
.progress .bar.warn { background: var(--color-warning); }
@media (max-width: 760px) { .slot-row { grid-template-columns: 1fr 1fr; } .slot-actions { grid-column: 1 / -1; justify-content: flex-start; } }
.slot-check { display: flex; gap: 6px; align-items: center; min-height: 20px; }
.slot-check.ok { color: var(--color-success-text); }
.slot-check.bad { color: var(--color-danger-text); }
.slot-times { gap: var(--space-3); align-items: flex-start; flex-wrap: nowrap; }
.slot-times .field { flex: 1; }
.chip-grid { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.chip-check { display: inline-flex; gap: 6px; align-items: center; padding: 6px 12px; border-radius: var(--radius-full); border: 1px solid var(--color-border-strong); cursor: pointer; font-size: var(--font-size-sm); }
.chip-check.sel { background: var(--color-primary-subtle); border-color: var(--color-primary); color: var(--color-primary-text); }
.check-list { display: grid; gap: 4px; max-height: 280px; overflow: auto; padding: var(--space-2); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.wiz-date-grid { display: grid; gap: var(--space-3); grid-template-columns: 1.4fr 1fr 1fr .8fr 1fr auto; align-items: end; }
@media (max-width: 760px) { .wiz-date-grid { grid-template-columns: 1fr 1fr; } }
.att-table td { vertical-align: top; }

/* calendar (colour per instructor) */
.cal-c1 { --cal: var(--chart-1); } .cal-c2 { --cal: var(--chart-2); } .cal-c3 { --cal: var(--chart-3); }
.cal-c4 { --cal: var(--chart-4); } .cal-c5 { --cal: var(--chart-5); } .cal-c6 { --cal: var(--chart-6); }
.cal-toolbar { display: flex; gap: var(--space-3); align-items: center; flex-wrap: wrap; }
.cal-title { margin: 0 0 0 var(--space-2); font-size: var(--font-size-xl); }
.cal-legend { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.cal-key { display: inline-flex; gap: 6px; align-items: center; }
.cal-key .dot, .cal-lrow .dot { width: 10px; height: 10px; border-radius: 50%; background: var(--cal); flex: none; }
.cal-key.own { font-weight: 700; color: var(--color-text); }
.cal-month { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; }
.cal-dow { padding: var(--space-2); font-size: var(--font-size-xs); font-weight: 600; color: var(--color-text-muted); text-transform: uppercase; background: var(--color-surface-secondary); }
.cal-day { min-height: 104px; padding: 4px; border-top: 1px solid var(--color-divider); border-left: 1px solid var(--color-divider); display: grid; align-content: start; gap: 3px; min-width: 0; }
.cal-day:nth-child(7n + 1) { border-left: 0; }
.cal-day.other { background: var(--color-surface-secondary); }
.cal-day.other .cal-num { color: var(--color-text-muted); }
.cal-day.today .cal-num { background: var(--color-primary); color: var(--color-text-on-primary); border-radius: var(--radius-full); width: 24px; text-align: center; }
.cal-num { font-size: var(--font-size-sm); font-weight: 600; padding: 2px 4px; }
.cal-ev { display: flex; gap: 4px; align-items: center; width: 100%; min-width: 0; border: 0; border-left: 3px solid var(--cal); border-radius: var(--radius-xs); padding: 2px 4px;
  background: var(--color-surface-secondary); color: var(--color-text); font: inherit; font-size: var(--font-size-xs); cursor: pointer; text-align: left; }
.cal-ev:hover { background: var(--color-primary-subtle); }
.cal-ev.own { background: var(--color-primary-subtle); font-weight: 600; box-shadow: inset 0 0 0 1px var(--color-primary); }
.cal-ev.draft { opacity: .7; border-left-style: dashed; }
.cal-ev.past { opacity: .75; }
.cal-ev-time { color: var(--color-text-secondary); flex: none; }
.cal-ev-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-more { border: 0; background: none; color: var(--color-primary-text); font: inherit; font-size: var(--font-size-xs); cursor: pointer; text-align: left; padding: 0 4px; }
.cal-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--space-2); }
.cal-wcol { display: grid; align-content: start; gap: var(--space-2); padding: var(--space-2); border-radius: var(--radius-md); background: var(--color-surface-secondary); min-height: 160px; min-width: 0; }
.cal-wcol.today { box-shadow: inset 0 0 0 2px var(--color-primary); }
.cal-whead { font-size: var(--font-size-sm); }
.cal-card { display: grid; gap: 2px; text-align: left; padding: var(--space-2); border: 0; border-left: 4px solid var(--cal); border-radius: var(--radius-sm); background: var(--color-surface);
  color: var(--color-text); font: inherit; font-size: var(--font-size-sm); cursor: pointer; min-width: 0; overflow-wrap: anywhere; }
.cal-card.own { box-shadow: inset 0 0 0 1px var(--color-primary); background: var(--color-primary-subtle); }
.cal-card.draft { opacity: .75; }
.cal-free { padding: var(--space-2) 0; }
@media (max-width: 900px) { .cal-week { grid-template-columns: 1fr; } .cal-wcol { min-height: 0; } }
@media (max-width: 640px) { .cal-day { min-height: 64px; } .cal-ev-time { display: none; } .cal-ev { font-size: 10px; } }
.cal-list { display: grid; gap: var(--space-4); }
.cal-lday { display: grid; gap: var(--space-2); }
.cal-lhead { font-weight: 700; font-size: var(--font-size-sm); color: var(--color-text-secondary); text-transform: uppercase; letter-spacing: .02em; }
.cal-lrow { display: flex; gap: var(--space-3); align-items: center; padding: var(--space-3); border: 1px solid var(--color-border); border-left: 4px solid var(--cal);
  border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-text); font: inherit; text-align: left; cursor: pointer; flex-wrap: wrap; }
.cal-lrow.own { background: var(--color-primary-subtle); }
.cal-lrow:hover { border-color: var(--color-primary); }