﻿/* убираем большой отступ между шапкой (лого + меню) и содержимым страницы */
#sp-main-body {
  padding-top: 25px !important;      /* было около 100px; меняйте по вкусу */
  padding-bottom: 40px !important;
}

/* !!!!! */

#sp-top-bar .social-icons {
    display: flex !important;
    padding: 0 !important;
    margin: 0 !important;
}

#sp-top-bar .social-icons li {
    margin: 0 2px !important;
    padding: 0 !important;
}
#sp-top-bar .social-icons a {
    padding: 0 !important;
}

/* TOP BAR FINAL STABLE VERSION */

/* контейнер строки */
#sp-top-bar .row {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    margin: 0 !important;
    min-width: 0 !important;
}
/* убираем bootstrap ширины колонок */
#sp-top-bar #sp-top1,
#sp-top-bar #sp-top2 {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    min-width: min-content !important;
    float: none !important;
    box-sizing: border-box !important;
}
/* внутренняя структура */
#sp-top-bar .sp-column {
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
    white-space: nowrap !important;
}
/* левый блок */
#sp-top1 .sp-column {
    justify-content: flex-start !important;
}
/* правый блок */
#sp-top2 .sp-column {
    justify-content: flex-end !important;
}
/* языки и соцсети */
#sp-top-bar .mod-languages__list,
#sp-top-bar .menu-mowa {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
}
#sp-top-bar .social-icons {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-wrap: nowrap !important;
}
/* чистка Joomla */
#sp-top-bar .sp-module,
#sp-top-bar .sp-module-content,
#sp-top-bar #mod-custom122,
#sp-top-bar #mod-custom122 p {
    margin: 0 !important;
    padding: 0 !important;
}

/* =====================================
   OFFCANVAS — COMPACT SOCIAL ICONS
===================================== */

/* контейнер */
.offcanvas-menu .social-icons {
    display: flex !important;
    flex-wrap: wrap;
    gap: 0 !important;

    margin: 0 !important;
    padding: 0 !important;
}

/* расстояние между кнопками */
.offcanvas-menu .social-icons li {
    margin-right: 10px !important;
    margin-left: 0 !important;
}

/* последний элемент */
.offcanvas-menu .social-icons li:last-child {
    margin-right: 0 !important;
}

/* уменьшаем внутренние отступы ссылок */
.offcanvas-menu .social-icons li a {
    padding: 3px !important;
}

/* =====================================
   HELIX OFFCANVAS — REPLACE LOGO
===================================== */

/* скрываем оригинальный логотип */
.offcanvas-menu .logo-image {
    opacity: 0 !important;
}

/* подставляем новый */
.offcanvas-menu .logo a {
    position: relative;
    display: inline-block;
}

.offcanvas-menu .logo a::after {
    content: "";
    
    display: block;
    width: 100%;
    height: 36px;

    background: url("/images/logo-swiatlica-sprawa.png") no-repeat left center;
    background-size: contain;

    position: absolute;
    top: 0;
    left: 0;
}

/* строка навигации */

.mod-breadcrumbs__divider {
    display: none !important;
}

ol.breadcrumb li:nth-child(2) .pathway span {
    font-size: 0 !important;
    visibility: hidden !important;
}

ol.breadcrumb li:nth-child(2) .pathway::before {
    content: "\2738" !important;
    font-size: 16px !important;
    visibility: visible !important;
    display: inline-block !important;
}

ol.breadcrumb li.mod-breadcrumbs__divider {
    display: none !important;
}

ol.breadcrumb {
    display: flex !important;
    flex-wrap: wrap !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
    align-items: baseline !important;
    width: 100% !important;
}

ol.breadcrumb li {
    white-space: nowrap !important;
    flex: 0 0 auto !important;
}

ol.breadcrumb li:last-child {
    white-space: normal !important;
    word-break: break-word !important;
    flex: 1 1 0 !important;
    min-width: 0 !important;
    overflow-wrap: break-word !important;
}

/* Пространство лого и меню на телефонах */

@media (max-width: 991px) {

    /* весь header */
    #sp-header {
        min-height: 66px !important;
    }

    /* контейнер header */
    #sp-header .container,
    #sp-header .container-inner,
    #sp-header .row {
        min-height: 66px !important;
        align-items: center !important;
    }

    /* логотип */
    #sp-logo {
        display: flex !important;
        align-items: center !important;
    }

    /* бургер-кнопка */
    #offcanvas-toggler {
        display: flex !important;
        align-items: center !important;
        min-height: 66px !important;
    }

    /* убираем уменьшение внутренних отступов шаблоном */
    #sp-header .sp-column {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}

/* ПЕРЕНОС — когда реально не вмещается.
   Два порога: 560px (мобильный/400%+)
   и 767px (300%) — только центрирование,
   без принудительного 100% ширины блоков
===================================== */

/* 300% zoom: блоки уже могут переноситься,
   центрируем строку но не ломаем ширины */
   
@media (max-width: 767px) {
    #sp-top-bar .row {
        justify-content: center !important;
        gap: 3px !important; /* между блоками мовы и сац */
    }

    #sp-top-bar #sp-top1 .sp-column,
    #sp-top-bar #sp-top2 .sp-column {
        justify-content: center !important;
    }
}

/* 400%+ zoom и реальный мобильный:
   блоки в полную ширину, один под другим 
   max-width: = ширина 2 блоков*/
@media (max-width: 560px) {
    #sp-top-bar #sp-top1,
    #sp-top-bar #sp-top2 {
        flex: 0 0 100% !important;
        width: 100% !important;
        text-align: center !important;
    }

    #sp-top-bar #sp-top1 .sp-column,
    #sp-top-bar #sp-top2 .sp-column {
        justify-content: center !important;
        width: 100% !important;
        white-space: normal !important;
    }

    #sp-top1 {
        margin-bottom: 8px !important;
    }
}

@media(max-width: 575px){:root{--header_height: $header_height_xs}.sp-megamenu-parent>li>a,.sp-megamenu-parent>li>span{line-height:50px !important}#sp-header{height:50px !important}#sp-header .logo{height:50px !important}#sp-header-topbar .container-inner>.row{min-height:50px !important}}

