﻿/*
Theme Name: Reboot Child
Theme URI: https://wpshop.ru/themes/reboot
Author: WPShop.biz
Author URI: http://wpshop.biz/
Template: reboot
Version: 1.0.0
*/

/* Below you can add your CSS styles */
/* Ниже Вы можете добавить свои CSS стили */

/*  Делаем стандартную галлерею WP адаптивной */
/* 1. Стандартные стили галереи */
.gallery {
  display: flex !important;
  flex-wrap: wrap !important;
  margin: 0 -2% 20px !important;
  padding: 0 !important;
}

/* Блокируем скрытые теги переноса строк старого WordPress, которые ломают мобильную сетку */
.gallery br, .gallery-br {
  display: none !important;
}

.gallery-item {
  display: block !important; /* Меняем на block, так как за сетку теперь отвечает flex */
  text-align: center;
  margin-bottom: 20px;
  width: 100%;
  box-sizing: border-box !important;
}

.gallery-item .gallery-caption {
  text-align: center;
  margin: 0;
}

.gallery-item .gallery-icon img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
}

/* Базовые десктопные ограничения */
.gallery-columns-2 .gallery-item { flex: 0 0 50% !important; max-width: 50% !important; }
.gallery-columns-3 .gallery-item { flex: 0 0 33.33% !important; max-width: 33.33% !important; }
.gallery-columns-4 .gallery-item { flex: 0 0 25% !important; max-width: 25% !important; }
.gallery-columns-5 .gallery-item { flex: 0 0 20% !important; max-width: 20% !important; }
.gallery-columns-6 .gallery-item { flex: 0 0 16.66% !important; max-width: 16.66% !important; }
.gallery-columns-7 .gallery-item { flex: 0 0 14.28% !important; max-width: 14.28% !important; }
.gallery-columns-8 .gallery-item { flex: 0 0 12.5% !important; max-width: 12.5% !important; }
.gallery-columns-9 .gallery-item { flex: 0 0 11.11% !important; max-width: 11.11% !important; }

/* 2. Для небольших экранов (4 колонки) */
@media only screen and (max-width: 1024px) {
  .gallery-columns-2 .gallery-item,
  .gallery-columns-3 .gallery-item,
  .gallery-columns-4 .gallery-item,
  .gallery-columns-5 .gallery-item,
  .gallery-columns-6 .gallery-item,
  .gallery-columns-7 .gallery-item,
  .gallery-columns-8 .gallery-item,
  .gallery-columns-9 .gallery-item {
    flex: 0 0 25% !important;
    max-width: 25% !important;
  }
}

/* 3. Для планшетов (3 колонки) */
@media only screen and (max-width: 800px) {
  .gallery-columns-2 .gallery-item,
  .gallery-columns-3 .gallery-item,
  .gallery-columns-4 .gallery-item,
  .gallery-columns-5 .gallery-item,
  .gallery-columns-6 .gallery-item,
  .gallery-columns-7 .gallery-item,
  .gallery-columns-8 .gallery-item,
  .gallery-columns-9 .gallery-item {
    flex: 0 0 33.33% !important;
    max-width: 33.33% !important;
  }
}

/* 4. Для мобильных (2 колонки) */
@media only screen and (max-width: 480px) {
  .gallery-columns-2 .gallery-item,
  .gallery-columns-3 .gallery-item,
  .gallery-columns-4 .gallery-item,
  .gallery-columns-5 .gallery-item,
  .gallery-columns-6 .gallery-item,
  .gallery-columns-7 .gallery-item,
  .gallery-columns-8 .gallery-item,
  .gallery-columns-9 .gallery-item {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
}


