/* ===== Табличная сетка для уже сгенерированного списка ===== */
:root{
  --ep-bg: #1e1e2d; --ep-head:#2a2637; --ep-text:#eef0f6;
  --ep-fade:#9aa0a6; --ep-accent:#3699ff; --ep-warn:#ffa800; --ep-ok:#1bc5bd;
  --ep-bdc: rgba(255,255,255,.08); --ep-radius:12px;
}

/* Контейнер сезона (твои <details>) */
.episodes-season{ margin:16px 0; border:1px solid var(--ep-bdc); border-radius:var(--ep-radius); overflow:hidden; background:var(--ep-bg); }
.episodes-season summary.sum{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; background:var(--ep-head); cursor:pointer; }
.episodes-season summary.sum .text{ color:var(--ep-text); font-weight:700; font-size:18px; }
.episodes-panel{ padding:0; }

/* Шапка таблицы */
.ep-head{ display:grid; grid-template-columns:88px 1fr 170px 90px; gap:12px;
  padding:10px 14px; position:sticky; top:0; z-index:1;
  background:var(--ep-head); color:var(--ep-text); border-top:1px solid var(--ep-bdc); border-bottom:1px solid var(--ep-bdc);
}
.ep-head > div{ font-weight:700; }

/* КАЖДАЯ СЕРИЯ — одна строка-грid с 4 колонками */
.eplist_dream, .eplist_soon{
  display:grid; grid-template-columns:88px 1fr 170px 90px; gap:12px; align-items:center;
  padding:12px 14px; margin:0; background:var(--ep-bg); border-bottom:1px solid var(--ep-bdc);
  border-left:none; border-right:none; border-top:none; box-shadow:none;
}
.eplist_dream:nth-of-type(even), .eplist_soon:nth-of-type(even){ background:rgba(255,255,255,.02); }

/* Внутренний контейнер с текстом должен «распасться» на ячейки грида */
/* Внутренний контейнер серий — сразу 4 колонки: № | Название | Дата | Статус */
.eplist_dream .sesel, .eplist_soon .sesel{
  display:grid;
  grid-template-columns: 88px 1fr 170px 90px; /* подгони числа при желании */
  gap:12px;
  align-items:center;
}

/* Модуль часто ставит <br> между кусками — убираем их */
.eplist_dream .sesel br, .eplist_soon .sesel br{ display:none; }

/* № — «1x» и «1» складываем в первую колонку */
.sesel .seasonshow, .sesel .epshow{
  grid-column:1;
  display:inline;
  color: var(--ep-accent);
  font-weight:700;
  font-size:14px;
}

/* Название серии — 2-я колонка */
.sesel .nameseries{
  grid-column:2;
  color:#fff;
  font-weight:600;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* Дата + «5д» — 3-я колонка */
.sesel .date{ grid-column:3; color:var(--ep-fade); }
.sesel .vday{ grid-column:3; margin-left:8px; color:#7dd57f; font-weight:700; }

/* Статус (глаз/галка) — 4-я колонка */
.sesel .fa, .sesel .fas, .sesel .far,
.sesel [onclick*="handleClickCookie"]{
  grid-column:4; justify-self:center; font-size:16px;
}
.fa-check-circle{ color: var(--ep-ok); }
.fa-eye{ color: var(--ep-warn); }

/* Чередование фона оставить можно на родителе строки */
.eplist_dream, .eplist_soon{
  padding:12px 14px; margin:0; background:var(--ep-bg);
  border-bottom:1px solid var(--ep-bdc); box-shadow:none; border-left:none; border-right:none; border-top:none;
}
.eplist_dream:nth-of-type(even), .eplist_soon:nth-of-type(even){ background:rgba(255,255,255,.02); }

/* Мобильный вид — две строки */
@media (max-width:700px){
  .ep-head{ display:none; }
  .eplist_dream .sesel, .eplist_soon .sesel{
    grid-template-columns: 1fr auto;
    gap:8px 12px;
  }
  .sesel .seasonshow, .sesel .epshow{ grid-column:1; order:1; opacity:.85; }
  .sesel .fa, .sesel .fas, .sesel .far, .sesel [onclick*="handleClickCookie"]{ grid-column:2; order:2; }
  .sesel .nameseries{ grid-column:1 / -1; order:3; white-space:normal; }
  .sesel .date, .sesel .vday{ grid-column:1 / -1; order:4; }
}

/* №  (из seasonshow + epshow) — кладём обе метки в 1-ю колонку подряд */
.sesel .seasonshow, .sesel .epshow{
  grid-column:1; color:var(--ep-accent); font-weight:700; font-size:14px; display:inline;
}

/* Название */
.sesel .nameseries{ grid-column:2; color:#fff; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Дата и «Xd» в одной 3-й колонке */
.sesel .date{ grid-column:3; color:var(--ep-fade); }
.sesel .vday{ grid-column:3; margin-left:8px; color:#7dd57f; font-weight:700; }

/* Статус (иконка «глаз/галка») — 4-я колонка */
.eplist_dream > .fa, .eplist_dream > .fas, .eplist_dream > .far,
.eplist_soon  > .fa, .eplist_soon  > .fas, .eplist_soon  > .far,
.eplist_dream [onclick*="handleClickCookie"], .eplist_soon [onclick*="handleClickCookie"]{
  grid-column:4; justify-self:center; font-size:16px;
}
.fa-check-circle{ color:var(--ep-ok); }
.fa-eye{ color:var(--ep-warn); }

/* Лишние декоративные элементы можно скрыть */
.eplist_dream .icondate, .eplist_soon .icondate{ display:none; }

/* Адаптив: на мобильном две строки */
@media (max-width:700px){
  .ep-head{ display:none; }
  .eplist_dream, .eplist_soon{ grid-template-columns:1fr auto; gap:8px 12px; }
  .sesel .seasonshow, .sesel .epshow{ grid-column:1; order:1; opacity:.85; }
  .eplist_dream > .fa, .eplist_dream > .fas, .eplist_soon > .fa, .eplist_soon > .fas{ order:2; }
  .sesel .nameseries{ grid-column:1 / -1; order:3; white-space:normal; }
  .sesel .date, .sesel .vday{ grid-column:1 / -1; order:4; }
}