/* UX.3 - Pages and flows. Additive layer: no business rules. */
:root{--ux3-content-max:1440px;--ux3-section-gap:1.25rem;--ux3-empty-min:150px}
.tf-page,.tutor-groups-page,.calendar-page,.fu-page,.li-page,.messages-page,.ux3-page{width:min(100%,var(--ux3-content-max));margin-inline:auto}
.tf-hero,.tg-head,.calendar-head,.fu-page-head,.li-head,.messages-head{margin-bottom:var(--space-5,1.25rem)}
.tf-top-actions,.tg-actions,.pf-actions{display:flex;flex-wrap:wrap;gap:.625rem;align-items:center}
.tf-panel,.tg-card,.calendar-upcoming,.fu-toolbar,.li-toolbar{scroll-margin-top:5rem}
.ux3-empty,.tg-empty,.calendar-empty,.li-empty,.messages-empty,.tf-empty{min-height:var(--ux3-empty-min);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.45rem;padding:1.5rem;border:1px dashed var(--color-border,#dfe7ef);border-radius:var(--radius-lg,14px);background:var(--color-surface-muted,#f7f9fb);color:var(--color-muted,#60758a)}
.ux3-empty strong,.tg-empty strong,.calendar-empty strong,.li-empty strong,.messages-empty strong{color:var(--color-text,#17324d);font-size:1rem}
.ux3-empty p{margin:0;max-width:44rem}.ux3-empty .button{margin-top:.35rem}
.ux3-section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem}.ux3-section-head h2{margin:0}.ux3-section-head p{margin:.3rem 0 0;color:var(--color-muted,#60758a)}
.ux3-table-wrap,.tf-table-wrap,.tg-table-wrap{overflow:auto;max-width:100%;-webkit-overflow-scrolling:touch}
.ux3-form-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.625rem;margin-top:1rem}
.ux3-flow-note{padding:.85rem 1rem;border-radius:var(--radius-md,10px);background:var(--color-info-soft,#eef6fc);color:var(--color-text,#17324d);font-size:.875rem}
.ux3-status{display:inline-flex;align-items:center;gap:.35rem;min-height:1.7rem;padding:.2rem .55rem;border-radius:999px;font-size:.75rem;font-weight:700;background:var(--color-surface-muted,#f1f5f8)}
.ux3-status::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:currentColor}
.ux3-status.success{color:var(--color-success,#18794e)}.ux3-status.warning{color:var(--color-warning,#9a6700)}.ux3-status.danger{color:var(--color-danger,#b42318)}.ux3-status.info{color:var(--color-primary,#245987)}
/* Student groups: replace the compressed legacy table flow with a responsive page. */
.student-groups-ux3 .ux3-group-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}.student-groups-ux3 .ux3-group-card{padding:1rem;border:1px solid var(--color-border,#dfe7ef);border-radius:var(--radius-lg,14px);background:var(--color-surface,#fff)}.student-groups-ux3 .ux3-group-card h3{margin:.2rem 0}.student-groups-ux3 .ux3-group-meta{display:grid;gap:.25rem;color:var(--color-muted,#60758a);font-size:.875rem;margin:.65rem 0 1rem}
@media(max-width:768px){.tf-summary,.tf-account-summary,.tg-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tf-top-actions,.pf-actions,.tg-actions,.ux3-form-actions{align-items:stretch}.tf-top-actions .button,.pf-actions .button,.tg-actions .button,.ux3-form-actions .button{justify-content:center}.calendar-head,.messages-head,.tg-head{align-items:flex-start}.ux3-empty,.tg-empty,.calendar-empty,.li-empty,.messages-empty,.tf-empty{min-height:120px;padding:1.15rem}}
@media(max-width:576px){.tf-summary,.tf-account-summary,.tg-summary-grid{grid-template-columns:1fr}.student-groups-ux3 .ux3-group-grid{grid-template-columns:1fr}.ux3-section-head{display:block}}