/**
 * Header-feed — top contact strip above the main nav.
 * Ported from the legacy kafis theme. Colour values flattened to v2.x
 * brand palette (var(--c-brand) brand replaces kafis red #B1040E).
 */

.header-feed {
    width: 100%;
    background-color: var(--c-surface);
    color: var(--c-text);
    font-family: "Avenir Next Cyr", sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
}

@media (max-width: 991px) {
    .header-feed {
        font-size: 14px;
        line-height: 20px;
    }
}

.header-feed a {
    text-decoration: none;
    color: var(--c-text);
    transition: color 0.4s ease;
}

.header-feed a:hover {
    color: var(--c-brand);
}

.header-feed__container {
    height: 94px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background-color: var(--c-surface);
}

@media (max-width: 991px) {
    .header-feed__container {
        height: 70px;
    }
}

/* Logo column flexes into whatever space the right side leaves for it. */
.header-feed__left {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
}

/* Right side (contacts + socials) keeps its natural width — logo bends, not it.
   gap handles the spacing between contacts and socials so it disappears
   automatically when one of them is hidden via theme options or media query. */
.header-feed__right {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 20px;
}

.header-feed__logo {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    max-width: 100%;
}

.header-feed__logo img {
    max-width: 100%;
    max-height: 60px;
    width: auto;
    height: auto;
    object-fit: contain;
}

@media (max-width: 991px) {
    .header-feed__logo img {
        max-height: 50px;
    }
}

.header-feed__icon {
    height: 18px;
    width: 18px;
}

@media (max-width: 991px) {
    .header-feed__icon {
        height: 16px;
        width: 16px;
    }
}

.header-feed__contacts {
    display: flex;
    gap: 20px;
}

@media (max-width: 767px) {
    .header-feed__contacts {
        display: none;
    }
}

.header-feed__contacts-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

@media (max-width: 991px) {
    .header-feed__contacts-item {
        gap: 4px;
    }
}

.header-feed__social ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 12px;
}

.header-feed__social li a {
    display: flex;
    align-items: center;
}

.header-feed__social li a img {
    height: 20px;
    width: 20px;
    object-fit: contain;
}

@media (max-width: 991px) {
    .header-feed__social li a img {
        height: 18px;
        width: 18px;
    }
}

/* Visibility on small screens is now controlled per-feed via the theme
   options (crb_show_header_socials / -logo / -phone / -email), not via
   blanket media queries. Keep a last-ditch hide for very narrow phones. */
@media (max-width: 374px) {
    .header-feed__social {
        display: none;
    }
}