/* admin/attendance.css — только матрица посещаемости */

/* ===== Шапка (замена инлайн-стилей) ===== */
.att-title { margin: 0 0 .2rem 0; }

.att-head{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:flex-start;
  flex-wrap:wrap;
}

.att-meta{ font-size:0.95em; color:#333; }
.att-meta-line{ margin-bottom:0.25rem; }
.att-meta-value{ margin-left:0.4rem; }

.att-month-nav{ display:inline-flex; align-items:center; gap:0.25rem; }
.att-month-label{ margin:0 0.35rem; }
.att-head-right{ align-self:flex-start; }

.att-tariff{ margin-top:0.45rem; font-size:0.9em; color:#444; }
.att-tariff-sub{ margin-top:0.15rem; color:#555; }
.att-tariff-warning{ color:#b00; }

.att-legend{ font-size:0.9em; margin: 0 0 0.4rem 0; }

/* фильтр: оставляем в одну линию, как было в инлайне */
.att-filter{
  margin:0.5rem 0 0.8rem 0;
  display:flex;
  align-items:center;
  gap:0.5rem;
  flex-wrap:wrap;
}
.att-filter label{ margin:0; font-size:0.9em; color:#555; }
.att-filter-input{ width:100%; max-width:260px; }

/* компактные контролы внутри матрицы */
.att-mini-control{
  padding: .22rem .35rem;
  border-radius: .6rem;
  font-size: .85em;
  box-shadow: none;
}

.btn.btn-xs{ padding:0.1rem 0.45rem; font-size:0.75em; }
.att-dash{ color:#bbb; }

/* ===== Таблица матрицы ===== */
table.att-matrix{
  border-collapse: collapse;
  width: 100%;
  font-size: 0.85em;
  table-layout: fixed;            /* чтобы таблица ужималась в экран */
}

table.att-matrix th,
table.att-matrix td{
  border: 1px solid var(--border, #ddd);
  padding: 0.2rem 0.25rem;
  vertical-align: top;
  text-align: center;
}

/* липкая шапка */
table.att-matrix th{
  background: #f8f9fa;
  position: sticky;
  top: 0;
  z-index: 3;
}

/* 1-я колонка (ученик) — фиксируем ширину, чтобы не раздувала таблицу */
table.att-matrix th:first-child,
table.att-matrix td:first-child{
  width: clamp(170px, 18vw, 230px);
  text-align: left;
}

table.att-matrix th:first-child{
  left: 0;
  z-index: 4;
  background: #f8f9fa;
}

table.att-matrix td:first-child{
  position: sticky;
  left: 0;
  background: #fff;
  z-index: 2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

table.att-matrix td:first-child a{ display:block; }

/* колонка "Списание" — тоже фиксируем, остальным отдаем остаток ширины */
table.att-matrix th.att-col-charge,
table.att-matrix td.att-col-charge{
  width: clamp(150px, 16vw, 190px);
}

/* заголовок "Списание" + кнопка "Подставить всё" */
.att-charge-head{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0.25rem;
}

/* заголовки занятий */
.att-lesson-link{
  display:block;
  text-decoration:none;
  color:inherit;
}
.att-lesson-date{ display:block; font-weight:600; line-height:1.1; }
.att-lesson-time{ display:block; font-size:0.78em; line-height:1.1; opacity:0.9; }

/* ===== Ячейки посещаемости ===== */
.att-cell{ text-align: center; padding: 0; }
.att-toggle{
  display:block;
  width: 100%;
  height: 100%;
  min-height: 28px;
  min-width: 0;             /* важно: иначе появится горизонтальный скролл */
  padding: 0.1rem 0;
  border: none;
  background: none;
  cursor: pointer;
  font-weight: 700;
}

.att-cell.st-NONE    { background: #ffffff; }
.att-cell.st-ABSENT  { background: #ffffff; }
.att-cell.st-PRESENT { background: #d4edda; }
.att-cell.st-TRIAL   { background: #d1ecf1; }
.att-cell.st-SICK    { background: #fff3cd; }
.att-cell.st-FREE    { background: #e2d9f3; }

.att-cell-disabled{ background: #f5f5f5; }

/* ===== Блок списаний ===== */
.charge-box{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0.2rem;
}

.charge-row{
  display:flex;
  gap:0.25rem;
  align-items:center;
  justify-content:center;
}

.charge-input{ width:90px; }

.reco{
  font-size:0.8em;
  color:#666;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0.25rem;
  margin-top:0.15rem;
}

.billing-mode{ width:110px; }
.extra-discount{ width:55px; }

/* подсветка несостыковки: красним только поле суммы списания */
.charge-mismatch input.charge-input { border: 2px solid #ef4444 !important; }

/* (необязательно) гарантированно не красним скидку */
.charge-mismatch input.extra-discount { border-color: var(--border, #ddd) !important; }

/* ===== Действия (кнопки внизу) ===== */
.att-actions{
  margin-top:0.8rem;
  display:flex;
  gap:0.5rem;
  flex-wrap:wrap;
}

/* новая колонка Баланс */
table.att-matrix th.att-col-balance,
table.att-matrix td.att-col-balance{
  width: clamp(110px, 10vw, 140px);
}

.att-balance-box{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0.35rem;
  white-space:nowrap;
}

.att-balance-value{
  text-decoration:none;
  font-weight:600;
}

.att-badges{
  display:inline-flex;
  gap:0.25rem;
  margin-left:0.35rem;
  vertical-align:middle;
}

.att-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 0.55rem;
  border: 2px solid var(--border, #ddd);
  font-size: 0.95em;
  line-height: 1;
  background: #fff;
}

.att-badge.is-ok{
  border-color: #22c55e; /* зелёный */
}

.att-badge.is-bad{
  border-color: #ef4444; /* красный */
}

/* отклонения в шапке урока */
table.att-matrix th.att-lesson-warn{
  outline: 2px solid #f59e0b;
  outline-offset: -2px;
}

table.att-matrix th.att-lesson-bad{
  outline: 2px solid #ef4444;
  outline-offset: -2px;
}
