/* Кастомные стили для логотипа */

/* Стили для десктопной версии логотипа (в верхнем хедере) */
.logo_widget {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.logo_1 {
  background-color: #FFFFFF;
  border-radius: 4px;
  padding: 15px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.logo_1 img {
  /* Применяем фильтр для получения золотистого цвета #B69D74 (как у кнопки) */
  filter: brightness(0) saturate(100%) invert(77%) sepia(13%) saturate(697%) hue-rotate(356deg) brightness(91%) contrast(87%);
}

/* Мобильная версия - убираем только подложку, цвет остается золотистым */
@media (max-width: 1199px) {
  /* Скрываем десктопную версию логотипа с подложкой */
  .logo_widget {
    display: none !important;
  }
  
  /* Переопределяем контейнер, чтобы логотип был по центру */
  .main_menu_widget .row > div {
    justify-content: center !important;
  }
  
  .logo {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    order: -1 !important; /* Размещаем логотип первым */
    margin-bottom: 15px !important;
  }
  
  /* В мобильной версии логотип без подложки, но с золотистым цветом */
  .logo a {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    /* Убираем любую подложку */
    background: none !important;
    padding: 0 !important;
    box-shadow: none !important;
  }
  
  .logo img {
    /* Применяем тот же золотистый цвет, что и в десктопной версии */
    filter: brightness(0) saturate(100%) invert(77%) sepia(13%) saturate(697%) hue-rotate(356deg) brightness(91%) contrast(87%) !important;
  }
}

/* Для очень маленьких экранов */
@media (max-width: 576px) {
  .logo_1 {
    padding: 10px;
  }
}