/*  AMANTI сдвигаю сообщение о отправке письма всплывающее вправо */
.sppb-ajax-contact-status {
    margin-left: 25px !important;
    margin-bottom: 15px !important;
}

/*  AMANTI Тень для верхнего меню */
#sp-header.shad {
  box-shadow: 0 2px 6px rgba(0,0,0,0.1) !important;
}
/*  AMANTI Тень для sticky-меню при прокрутке */
.sticky.shad .sticky__wrapper {
  box-shadow: 0 2px 6px rgba(0,0,0,0.1) !important;
}


/* AMANTI переопределяю отступ от шапки 
/* Для всех обычных Joomla-страниц */
#sp-main-body {
  padding: 70px 0 50px 0 !important;
}

/* AMANTI Патч с правым выравниванием в шаблоне в Футере копирайт на мобильном */
.pull-right {float: right !important;}
/* Отключаем стиль при ширине экрана меньше 700px */
@media (max-width: 780px) {
	.pull-right {
        float: none !important;
    }
}

/* Responsive Grid for Articles — Joomla 5
   принудительно убираем подчеркивание у всех элементов списка */
ul.mix-grid > li.mix,
ul.mix-grid > li {
    border-bottom: none !important;
}
/* переопределяю прячу линию внизу всех материалов */
/* Joomla 5 — убираем линию внизу материалов */
article.item.item-page hr,
.com-content-article__body hr,
#sp-page-builder hr,
.sppb-addon-content hr {
    display: none !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Уменьшаем заголовки материалов Joomla на 30% */
.entry-header h2 {
    font-size: 26px !important;
    line-height: 2em !important;
}

/* пач для кнопки класа sppb-btn-flex при наведении */
.sppb-btn-flex {
  position: relative;
  overflow: hidden;
  transition: background-color 0.4s ease;
}
.sppb-btn-flex::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.4), transparent);
  transform: skewX(-25deg);
}
.sppb-btn-flex:hover::after {
  animation: shimmer 0.8s forwards;
}
@keyframes shimmer {
  100% { left: 125%; }
}
.sppb-btn-flex:hover,
.sppb-btn-flex:focus {
  background-color: #77511E !important; /* только фон */
}



/* новый дополнительный класс flex-light для кнопок как sppb-btn-flex но осветленный */
/* базовое состояние для flex-light */
.flex-light {
  position: relative;
  overflow: hidden;
  transition: background-color 0.4s ease, color 0.4s ease;
  color: #8e6836 !important;        /* текст */
  border-color: #8e6836 !important; /* рамка */
  background-color: rgba(255,255,255,0.5) !important; /* белый фон с прозрачностью */
}
/* shimmer-блик */
.flex-light::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.4), transparent);
  transform: skewX(-25deg);
}
/* запуск анимации блика */
.flex-light:hover::after {
  animation: shimmer 0.8s forwards;
}
@keyframes shimmer {
  100% { left: 125%; }
}
/* при наведении — фон и текст */
.flex-light:hover,
.flex-light:focus {
  background-color: #77511E !important; /* цельный фон */
  color: #fff !important;               /* белый текст */
}




/* Для страниц SP Page Builder — оставить как было */
.com-sppagebuilder #sp-main-body {
  padding: 0 !important;
}

/* AMANTI переопределяю принудительно ширину сайта тело на больших пк */
/* custom.css */
@media (min-width:1200px){
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl {
    max-width:1680px !important;
	  padding-left:2rem !important;  /* переопределяю отступы с краев было 0.75rem */
  padding-right:2rem !important; /* переопределяю отступы с краев симметрично */
  }
}
@media (min-width:1400px){
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width:1760px !important;
	  padding-left:2rem !important;  /* переопределяю отступы с краев было 0.75rem */
  padding-right:2rem !important; /* переопределяю отступы с краев симметрично */
  }
}

/* AMANTI переопределяю принудительно ширину секций SP Page Builder на больших ПК */
.sppb-section .sppb-row-container,
.sppb-row-container {
  box-sizing: border-box !important;
  width: 100% !important;        
  margin-left: auto !important;    
  margin-right: auto !important;
  padding-left: 2rem !important;   
  padding-right: 2rem !important;
}
@media (min-width: 1200px) {
  .sppb-section .sppb-row-container,
  .sppb-row-container {
    max-width: 1680px !important;
  }
}
@media (min-width: 1400px) {
  .sppb-section .sppb-row-container,
  .sppb-row-container {
    max-width: 1760px !important;
  }
}





/* AMANTI пач для страниц буилдера на малых экранах все сложить в одну колонку если секции присвоено клас row-in1*/
/* Базовый стиль (две колонки рядом) — только внутри row-in1 */
.row-in1 .sppb-row {
  display: flex;
  flex-wrap: wrap;
}
/* При экране меньше 1200px — только для секции row-in1 */
@media (max-width: 1200px) {
  .row-in1 .sppb-row {
    flex-direction: column;
  }
  .row-in1 .sppb-row-column {
    width: 100% !important;   /* каждая колонка занимает всю ширину */
    max-width: 100% !important;
  }
}



/* AMANTI  эффект картинки материала джумла токо там где в материале стоит класс effpic !!"*/
.entry-image.intro-image {
  position: relative;
  overflow: hidden; /* скрывает всё, что выходит за рамку */
}
.entry-image.intro-image img.effpic {
  transition: transform 0.3s ease;
  display: block; /* убирает лишние отступы */
}
.entry-image.intro-image img.effpic:hover {
  transform: scale(1.3) rotate(-10deg);
}


/* Эффект наведения для картинок внутри effpic-home */
.effpic-home .entry-image.intro-image {
  position: relative;
  overflow: hidden; /* скрывает выходящие за рамку части */
}
.effpic-home .entry-image.intro-image img.post-img {
  transition: transform 0.2s ease;
  display: block; /* убирает лишние отступы */
}
.effpic-home .entry-image.intro-image img.post-img:hover {
  transform: scale(1.3) rotate(-8deg);
}


/* AMANTI исправляем баг в липком меню чтоб показать уменьшеный логотип */
.sticky .sticky__wrapper .sp-sticky-logo {
    height: 60px !important;
position: relative !important;}


/* AMANTI эффект картинки модуля вывода материалов конфет в брендах 
.hover-image-gallery a img {
  transition: transform 0.5s ease, filter 0.5s ease;
}
.hover-image-gallery a:hover img {
  transform: rotate(5deg) scale(1.1);
  filter: saturate(1.4) contrast(1.2);
}
.mix:hover .upper-mix img {
  transform: rotate(5deg) scale(1.1);
  filter: saturate(1.4) contrast(1.2);
}*/

/* для модуля превью материалов в каталоге modul-effhover-pic-item-1 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/
/* Карточка превью */
.modul-effhover-pic-item-1 .mix {
  display: block;
  overflow: hidden;
  box-sizing: border-box;
  padding: 30px 10px;
}
/* Картинка */
.modul-effhover-pic-item-1 .mix img {
  width: 100%;
  height: auto;
  display: block;
  transform: scale(1) rotate(0deg);
  filter: saturate(1) contrast(1);
  transition: .5s ease;
  will-change: transform, filter;
}
/* Эффект при наведении на конкретную карточку */
.modul-effhover-pic-item-1 .mix:hover img {
  transform: scale(1.1) rotate(5deg);
  filter: saturate(1.4) contrast(1.2);
}
/* Заголовок */
.modul-effhover-pic-item-1 .mix-title {
  color: #222 !important;
  position: relative;
  display: inline-block;
  transition: color .3s ease;
}
/* Подчёркивание с градиентом */
.modul-effhover-pic-item-1 .mix-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 0;
  height: 2px;
  background: linear-gradient(to right, #B8884A, #ffffff);
  transition: width .3s ease;
}
/* Эффект на заголовок при наведении на карточку */
.modul-effhover-pic-item-1 .mix:hover .mix-title {
  color: #B48548 !important;
}
.modul-effhover-pic-item-1 .mix:hover .mix-title::after {
  width: 100%;
}
/* размер описнаия товара */
.modul-effhover-pic-item-1 .mix-introtext p {
  font-size: 16px !important;
  font-weight: 500 !important;
}



/* для модуля превью материалов в карточке товара modul-effhover-pic-item-2 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!*/
.modul-effhover-pic-item-2 .hover-image-gallery a,
.modul-effhover-pic-item-2 .mix .upper-mix {
  padding: 30px 10px;       /* сверху/снизу 40px, слева/справа 20px */
  margin: 1px;
  display: block;
  overflow: hidden;
  box-sizing: border-box;
}
.modul-effhover-pic-item-2 img {
  display: block;
  width: 100%;
  height: auto;
  transform: rotate(0) scale(1);
  filter: saturate(1) contrast(1);
  transition: transform 0.5s ease, filter 0.5s ease;
  will-change: transform, filter;
}
.modul-effhover-pic-item-2 a:hover img,
.modul-effhover-pic-item-2 .mix:hover .upper-mix img {
  transform: rotate(5deg) scale(1.1);
  filter: saturate(1.4) contrast(1.2);
}	
.modul-effhover-pic-item-2 .mix-title {
    font-size: 15px !important;
    color: #222222 !important;
    transition: color 0.3s ease; /* плавный переход */
}
.modul-effhover-pic-item-2 .mix-title:hover,
.modul-effhover-pic-item-2 .mix-title:focus {
    color: #8e6836 !important;
}
/* Заголовок меняет цвет не только при наведении на себя,
   но и при наведении на картинку/контейнер */
.modul-effhover-pic-item-2 .mix:hover .mix-title,
.modul-effhover-pic-item-2 a:hover .mix-title {
    color: #8e6836 !important;
}
/* размер описнаия товара */
.modul-effhover-pic-item-2 .mix-introtext p {
  font-size: 14px !important;
  font-weight: 400 !important;
}



/* AMANTI переопределяю убераю подчеркивание h3 заголовков по сайту */
/* везде Убираем серую линию (box-shadow) */
.sppb-addon h3.sppb-addon-title {
  box-shadow: none !important;
}
/* везде Убираем цветную декоративную линию (::after) */
.sppb-addon h3.sppb-addon-title:after {
  content: none !important;
  display: none !important;
  background: none !important;
}
/* Убираем серую линию у заголовков модулей */
.sp-module .sp-module-title,
.sppb-addon-module .sp-module-title {
  box-shadow: none !important;
  border: none !important;
}
/* Убираем цветную декоративную линию у заголовков модулей (::after) */
.sp-module .sp-module-title:after,
.sppb-addon-module .sp-module-title:after {
  content: none !important;
  display: none !important;
  background: none !important;
}
/* Убираем серую линию у заголовков блога/материалов */
.entry-header h1,
.entry-header h2 {
  box-shadow: none !important;
  border: none !important;
}
/* Убираем цветную декоративную линию у заголовков блога/материалов (::after) */
.entry-header h1:after,
.entry-header h2:after {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* AMANTI переопределяю прячу линию внизу всех материалов */
hr {
  border: 0 !important;                     /* убираем стандартную границу */
  border-top: 1px solid #fff !important;    /* белая линия */
  opacity: 1 !important;                    /* убираем прозрачность Bootstrap */
  margin: 1.5rem 0 !important;              /* отступы сверху и снизу */
}


/* AMANTI переопределяю вывод результатов поиска на странице */
.result__item {
    overflow: hidden; /* чтобы каждый блок очищал float */
    margin-bottom: 20px;
}
.result__image {
    float: left;              /* картинка слева */
    max-width: 250px;
    margin: 0 20px 15px 0;    /* отступ справа от картинки */
}
@media (max-width: 768px) {
    .result__image {
        float: none;
        display: block;
        max-width: 100%;
        margin: 0 0 15px 0;
    }
}



/* AMANTI переопределяю стиль выпадающего списка языков */
/* === Выпадающее меню языков === */
.sp-module-content .mod-languages ul.lang-block.dropdown-menu {
  background-color: rgba(255, 255, 255, 0.8) !important; /* фон */
  border: 1px solid #F6F6F6 !important;                  /* рамка */
  border-radius: 0 0 3px 3px !important;                 /* скругление нижних углов */
  width: 70px !important;                                /* фиксированная ширина */
  min-width: 70px !important;                            /* перебиваем bootstrap min-width */
  text-align: center;
 padding: 10px !important;     /* сверху справа снизу слева*/
  margin-top: 18px !important;                           /* сдвигаем вниз */
  box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.2) !important; /* лёгкая тень */
}
/* общий цвет текста и ссылок */
.sp-module-content .mod-languages ul.lang-block.dropdown-menu a,
.sp-module-content .mod-languages ul.lang-block.dropdown-menu span.lang {
  color: #353535 !important;
  text-decoration: none;
}
/* делаем ссылки блочными, чтобы фон занимал всю ширину */
.sp-module-content .mod-languages ul.lang-block.dropdown-menu li a {
  display: block !important;
  width: 100% !important;
  padding: 0.1rem 0.3rem !important; /* чуть меньше отступы, квадрат компактнее */
  transition: background-color 300ms ease, color 300ms ease, border-radius 300ms ease;
}
/* активный пункт языка — только цвет, без фона и без жирности */
.sp-module-content .mod-languages ul.lang-block li.lang-active,
.sp-module-content .mod-languages ul.lang-block li.lang-active a,
.sp-module-content .mod-languages ul.lang-block li.lang-active span.lang {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #8e6836 !important;
  font-weight: normal !important;
}
/* ховер-эффект для пунктов списка языков */
.sp-module-content .mod-languages ul.lang-block.dropdown-menu li a:hover,
.sp-module-content .mod-languages ul.lang-block.dropdown-menu li a:focus {
  background-color: #8e6836 !important; /* фон при наведении */
  color: #ffffff !important;            /* белый текст */
  text-decoration: none !important;
  border-radius: 3px !important;        /* скругление углов при наведении */
}
/* перекрашиваем вложенный span при наведении */
.sp-module-content .mod-languages ul.lang-block.dropdown-menu li a:hover span.lang,
.sp-module-content .mod-languages ul.lang-block.dropdown-menu li a:focus span.lang {
  color: #ffffff !important;
}





/* AMANTI переопределяю всплывающий стиль поиска */
/* === Поле поиска в шапке === */
#sp-header .top-search-wrapper .searchwrapper {
  box-shadow: none !important;              /* убираем жирную рамку */
  border: 1px solid #DEDEDE !important;     /* тонкая рамка */
/*   border-radius: 0 !important;              убираем скругления */
  box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.2) !important;
}
/* само поле ввода */
#sp-header .top-search-wrapper .searchwrapper input.inputbox.search-query {
  border: none !important;                  /* убираем внутреннюю рамку Bootstrap */
  /* outline: none !important;                убираем подсветку при фокусе */
  font-weight: normal !important;           /* обычный текст внутри */
 /* color: #353535 !important;                 цвет текста */
}
/* текст placeholder */
#sp-header .top-search-wrapper .searchwrapper input.inputbox.search-query::placeholder {
  font-weight: normal !important;           /* убираем жирность у "Пошук..." */
 /*  color: #353535 !important;                цвет placeholder */
}





