/* View: Uczniowie (js/views/students.js).
   Toolbar: search on its own line, then filters (scrolling segmented) + sort. List = rows with a thin rule
   (monogram, name, balance on the right, subject, one line of facts, goal); desktop = auto-fill grid of the same rows. */
@layer views {
.stu-toolbar { flex-direction: column; flex-wrap: nowrap; align-items: stretch; gap: var(--sp-2); margin-bottom: 6px; }
.stu-toolbar .search { max-width: none; }
.stu-line { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); min-width: 0; }
.stu-line .segmented { flex: 0 1 auto; min-width: 0; }
.stu-line .select-inline { flex: none; margin-left: auto; font-size: var(--fs-caption); color: var(--ink-2); }
.stu-line .select-inline .input {
  width: auto; max-width: 150px; min-height: 40px; padding-top: 6px; padding-bottom: 6px;
  font-size: var(--fs-caption); font-weight: 600; color: var(--ink); border-radius: var(--r-pill);
}

.student-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--widget-gap); margin-top: 6px; }
.student-card {
  display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 2px 14px; align-items: center; align-content: start;
  padding: 14px var(--widget-pad-x); color: inherit; text-decoration: none; box-shadow: inset 4px 0 0 var(--hue);   /* tile box: components/widget.css */
}
.student-card > .avatar { grid-row: 1 / span 2; align-self: center; }
.sc-name { grid-column: 2; grid-row: 1; min-width: 0; font-weight: 600; font-size: var(--fs-lead); line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink); }
.sc-bal { grid-column: 3; grid-row: 1; display: flex; align-items: center; justify-content: flex-end; gap: 8px; white-space: nowrap; }
.sc-bal .amt { font-size: var(--fs-body); }
.sc-sub { grid-column: 2 / -1; grid-row: 2; min-width: 0; font-size: var(--fs-caption); color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-meta {
  grid-column: 2 / -1; grid-row: 3; display: grid; grid-template-columns: repeat(3, minmax(0, max-content)); justify-content: start;
  gap: 0 18px; margin-top: 8px; font-size: var(--fs-caption); line-height: 1.3; min-width: 0;
}
.sc-meta span { display: flex; flex-direction: column; min-width: 0; }
.sc-meta i { font-style: normal; color: var(--ink-3); font-size: 12px; }
.sc-meta b { color: var(--ink); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-goal { grid-column: 2 / -1; grid-row: 4; display: flex; align-items: center; gap: 6px; min-width: 0; margin-top: 6px; font-size: var(--fs-caption); color: var(--ink-3); }
.sc-goal span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-goal .ico { flex: none; }


@media (max-width: 760px) {
  .stu-line .select-inline .input { min-height: 44px; max-width: 132px; }
  .stu-line .segmented button { min-height: 44px; }
}
@media (max-width: 380px) {
  .student-card { grid-template-columns: 48px minmax(0, 1fr) auto; column-gap: 12px; }
  .sc-meta { grid-column: 1 / -1; gap: 0 16px; }
  .sc-goal { grid-column: 1 / -1; }
}
@media (min-width: 761px) {
  .stu-toolbar { flex-direction: row; align-items: center; gap: var(--sp-3); margin-bottom: 10px; }
  .stu-toolbar .search { flex: 1 1 auto; max-width: 420px; }
  .stu-line { flex: 1 1 auto; }
  .stu-line .select-inline .input { max-width: 240px; }
  .student-grid { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
}
@media (min-width: 1800px) {
  .student-grid { grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
}
}