.pager.pagination {
  margin: 20px 0;
  text-align: center;
  font-size: 14px;       /* общий размер текста */
}

.pager.pagination a,
.pager.pagination span {
  display: inline-block;
  padding: 8px 14px;     /* больше отступы */
  margin: 0 4px;
  border-radius: 6px;
  font-size: 14px;       /* сделать крупнее */
  text-decoration: none;
}

.pager.pagination a {
  background: #007bff;
  color: #fff;
}

.pager.pagination a:hover {
  background: #0056b3;
}

.pager.pagination span.disabled {
  background: #ddd;
  color: #888;
  cursor: not-allowed;
}

/* ---------- VIDEO PAGE ---------- */

/* Вкладки */
.home-tabs{
  margin-bottom:0;           /* вплотную к панели */
  border-bottom:none;        /* убираем серую линию */
}
.home-tabs ul{display:flex; margin:0; padding:0; list-style:none;}
.home-tabs ul li{margin-right:20px;}
.home-tabs ul li a{
  display:block;
  text-align:center;
  color:#252525;
  font-size:1.8rem;
  line-height:1.77;
  text-decoration:none;
  font-weight:bold;
  border-top:3px solid transparent;
  border-radius:.6rem .6rem 0 0;
  padding:1.2rem 2rem;
  background:#f9f9f9;
  transition:.2s;
}
.home-tabs ul li a:hover{color:#000;}

/* Активная вкладка "садится" на панель и рисует её верх */
.home-tabs ul li.active a{
  background:#fff;
  color:#000;
  border-top:3px solid #FB3C6C;
  border-left:1px solid #ddd;
  border-right:1px solid #ddd;
  border-bottom:0;           /* нижней границы у вкладки нет */
  position:relative;
  z-index:2;                 /* поверх панели */
}

/* Панель фильтра — без верхней границы, чтобы стыковаться с вкладкой */
.filter-bar{
  background:#fff;
  border:1px solid #ddd;
  border-top:none;                 /* важно */
  border-radius:0 8px 8px 8px;     /* скругление только снизу и справа */
  padding:12px;
  margin-top:0;                    /* вплотную к вкладке */
  margin-bottom:20px;
}

/* Остальной стиль фильтра */
.filter-form .row{display:flex; flex-wrap:wrap; margin:-8px;}
.filter-form .col{flex:1; min-width:160px; padding:8px;}
.filter-form label{font-size:13px; color:#555; display:block; margin-bottom:4px;}
.filter-form input,
.filter-form select{width:100%; padding:6px 8px; border:1px solid #ccc; border-radius:4px; font-size:14px;}
.filter-form .btn.show{background:#FB3C6C; color:#fff; padding:8px 12px; border-radius:6px; border:none; cursor:pointer; font-weight:600;}


/* Галерея видео */
.video-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
}
.video-container {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 8px;
  padding: 8px;
  display: flex;
  flex-direction: column;
}
.video-container img {
  width: 100%;
  border-radius: 6px;
}
.video-container .meta {
  margin-top: 6px;
  font-size: 13px;
  color: #555;
}
.video-container button {
  margin-top: 8px;
  padding: 6px;
  border: none;
  border-radius: 4px;
  background: #FB3C6C;
  color: #fff;
  cursor: pointer;
  font-weight: 600;
}

/* Пагинация */
.pagination {
  margin: 20px 0;
  text-align: center;
}
.pagination a,
.pagination span {
  display: inline-block;
  margin: 0 6px;
  padding: 6px 12px;
  border: 1px solid #ddd;
  border-radius: 4px;
  text-decoration: none;
  color: #333;
  font-size: 14px;
}
.pagination a:hover { background: #f0f0f0; }
.pagination .disabled { color: #aaa; border-color: #eee; }

/* Модалки */
.modal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.7);
  z-index: 1000;
  justify-content: center;
  align-items: center;
}
.modal-content {
  background: #fff;
  border-radius: 10px;
  max-width: 960px;
  max-height: 90vh;
  overflow: auto;
  padding: 16px;
  position: relative;
}
.modal-close {
  position: absolute;
  right: 10px;
  top: 10px;
  font-size: 20px;
  cursor: pointer;
}

/* ---------- VIDEO PAGE END ---------- */


/* ---------- VIDEO MODAL ---------- */

/* Базовая модалка */
#video-modal{
  position:fixed; inset:0; display:none;
  align-items:center; justify-content:center;
  background:rgba(0,0,0,.75); z-index:9999;
}

/* Контент модалки */
#video-modal .modal-content{
  width:min(100vw, 1100px);
  max-height:90vh;
  background:#111; color:#fff;
  border-radius:12px; overflow:hidden; position:relative;

  display: grid;
  grid-template-columns: 1fr; /* всегда одна колонка */
}

/* Левая колонка с видео: держим 16:9 */
#vm-wrap{
  background:#000; position:relative;
  aspect-ratio:16/9; /* держим высоту */
  width:100%;
}
#vm-player{
  position:absolute; inset:0;
  width:100%; height:100%;
  display:block; object-fit:contain; background:#000;
}

/* Правая колонка */
#vm-side{ padding:14px; background:#1a1a1a; overflow:auto; }

#video-modal .modal-close{
  position:absolute; right:10px; top:10px;
  background:#000; color:#fff; border:0; border-radius:6px;
  padding:6px 10px; cursor:pointer; z-index:2;
}

/* Узкие экраны – складываем в колонку
 @media (max-width: 860px){
 #video-modal .modal-content{ grid-template-columns: 1fr; }
  #vm-wrap{ aspect-ratio:16/9; }
}
*/

/* ---------- VIDEO MODAL END ---------- */