/* ==========================================================
   NESA CMS 2.3.1
   LANGUAGE + SOCIAL ICON REGRESSION FIX
========================================================== */

/* Social icons */

.social-icons,
.footer-social {
    display: flex;
    align-items: center;
    gap: 10px;
}

.social-icons a,
.footer-social a {
    display: grid;
    place-items: center;

    width: 34px;
    height: 34px;
    margin: 0;

    color: currentColor;

    border: 1px solid var(--line);
    border-radius: 50%;

    transition:
        color var(--transition-speed, 180ms) ease,
        background var(--transition-speed, 180ms) ease,
        border-color var(--transition-speed, 180ms) ease,
        transform var(--transition-speed, 180ms) ease;
}

.footer-social a {
    width: 42px;
    height: 42px;

    color: #ffffff;

    border-color: rgba(255, 255, 255, 0.16);
}

.social-icons a:hover,
.footer-social a:hover {
    background: var(--primary);
    color: #ffffff;

    border-color: var(--primary);

    transform: translateY(-2px);
}

.social-icons svg,
.footer-social svg {
    width: 17px;
    height: 17px;

    overflow: visible;

    fill: currentColor;
    stroke: none;
}

.social-icons svg rect,
.social-icons svg circle,
.footer-social svg rect,
.footer-social svg circle {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
}

.social-icons .icon-cutout,
.footer-social .icon-cutout {
    fill: var(--surface, #ffffff);
    stroke: none;
}

.footer-social .icon-cutout {
    fill: var(--dark, #11151b);
}

.footer-social a:hover .icon-cutout {
    fill: var(--primary);
}


/* Language switcher */

.language-switch {
    display: flex;
    align-items: center;
    gap: 6px;
}

.language-switch button {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    min-height: 31px;
    padding: 4px 7px;

    background: transparent;
    color: var(--ink);

    border: 1px solid transparent;
    border-radius: 8px;

    font: inherit;
    font-size: 11px;
    font-weight: 800;

    cursor: pointer;

    transition:
        background 0.16s ease,
        border-color 0.16s ease,
        color 0.16s ease;
}

.language-switch button:hover {
    background: #f2f4f7;
}

.language-switch button.is-active {
    background: #fff0f1;
    color: var(--primary);

    border-color: rgba(223, 23, 40, 0.28);
}

.language-switch img {
    width: 24px;
    height: 16px;

    object-fit: cover;

    border-radius: 2px;
}

.language-switch button.is-active img {
    box-shadow: 0 0 0 2px rgba(223, 23, 40, 0.22);
}


/* Hidden Google Translate infrastructure */

.google-translate-element,
#google_translate_element {
    position: absolute !important;
    left: -9999px !important;
    top: auto !important;

    width: 1px !important;
    height: 1px !important;

    overflow: hidden !important;

    opacity: 0 !important;

    pointer-events: none !important;
}

#google_translate_element select,
.goog-te-combo {
    position: absolute !important;
    left: -9999px !important;

    width: 1px !important;
    height: 1px !important;

    opacity: 0 !important;

    pointer-events: none !important;
}

.goog-te-banner-frame,
.goog-te-banner-frame.skiptranslate,
.goog-te-balloon-frame,
.goog-tooltip,
.goog-tooltip:hover,
#goog-gt-tt,
.goog-te-spinner-pos,
.goog-te-spinner,
.goog-te-gadget-icon,
.goog-logo-link {
    display: none !important;
    visibility: hidden !important;
}

.goog-te-gadget {
    height: 0 !important;

    overflow: hidden !important;

    color: transparent !important;

    font-size: 0 !important;
}

body {
    top: 0 !important;
    margin-top: 0 !important;
}

.goog-text-highlight {
    background: transparent !important;

    box-shadow: none !important;
}


/* Mobile language controls */

.mobile-header-actions {
    display: none;
    align-items: center;
    gap: 8px;
}

.mobile-language-switch button span {
    display: none;
}

.mobile-language-switch img {
    width: 23px;
    height: 15px;
}

.mobile-contact-actions {
    display: none;
}

@media (max-width: 1100px) {
    .mobile-header-actions {
        display: flex;
    }

    .mainbar-inner > .mobile-toggle {
        display: none;
    }

    .mobile-nav .site-menu .site-menu {
        display: none;
    }

    .mobile-nav .has-children.expanded > .site-menu {
        display: block;
    }

    .mobile-nav .has-children {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 46px;
    }

    .mobile-nav .has-children > a {
        grid-column: 1;
    }

    .mobile-nav .has-children > .submenu-toggle {
        grid-column: 2;

        display: grid;
        place-items: center;

        background: transparent;
        color: var(--ink);

        border: 0;

        cursor: pointer;
    }

    .mobile-nav .has-children > .site-menu {
        grid-column: 1 / -1;
    }

    .mobile-contact-actions {
        display: grid;
        gap: 8px;

        margin-top: 14px;
        padding-top: 14px;

        border-top: 1px solid var(--line);
    }

    .mobile-contact-actions a {
        display: flex;
        align-items: center;
        gap: 9px;

        padding: 10px 12px;

        background: #f7f8fa;

        border-radius: 9px;

        font-size: 12px;
        font-weight: 700;
    }
}

@media (max-width: 700px) {
    .topbar {
        display: none;
    }

    .mobile-language-switch {
        display: flex;
    }

    .mobile-language-switch button {
        padding: 3px;
    }
}


/* NESA CMS 2.7.5 — Dynamic Language Manager */

.language-switch {
    flex-wrap: wrap;
}

.language-switch img {
    box-shadow: 0 2px 5px rgba(14, 20, 29, 0.12);
}

.language-manager-head,
.language-list-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.language-manager-head {
    margin-bottom: 18px;
}

.language-manager-head > div > span,
.language-editor-panel > span {
    color: var(--primary);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.language-manager-head h2 {
    margin: 6px 0 5px;
}

.language-manager-head p,
.language-list-head p {
    margin: 0;
    color: var(--muted);
    font-size: 10px;
}

.language-manager-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 390px;
    gap: 18px;
    align-items: start;
}

.language-manager-grid > .panel {
    margin: 0;
}

.language-list-head {
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px solid var(--line);
}

.language-list-head h3 {
    margin: 0 0 4px;
}

.language-card-grid {
    display: grid;
    gap: 10px;
}

.language-card {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 13px;
    background: #fafbfc;
    border: 1px solid var(--line);
    border-radius: 12px;
}

.language-card-flag,
.language-flag-preview img {
    overflow: hidden;
    background: #fff;
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(20, 28, 40, 0.07);
}

.language-card-flag {
    width: 62px;
    height: 44px;
}

.language-card-flag img,
.language-flag-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.language-card-title {
    display: flex;
    align-items: center;
    gap: 8px;
}

.language-card-title h3 {
    margin: 0;
    font-size: 14px;
}

.language-card-title b,
.language-card-badges em,
.language-card-badges i {
    padding: 4px 7px;
    border-radius: 999px;
    font-size: 8px;
    font-style: normal;
}

.language-card-title b {
    background: #fff0f1;
    color: var(--primary);
}

.language-card-copy > span {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 9px;
}

.language-card-badges {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.language-card-badges em,
.language-card-badges i {
    background: #eef1f5;
    color: #687383;
}

.language-card-badges i.is-active {
    background: #eaf8f0;
    color: #187343;
}

.language-editor-panel {
    position: sticky;
    top: 92px;
}

.language-editor-panel h3 {
    margin: 6px 0 14px;
}

.language-flag-preview {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 11px;
    background: #f7f8fa;
    border: 1px solid #e1e5ea;
    border-radius: 10px;
}

.language-flag-preview img {
    width: 72px;
    height: 46px;
}

.language-flag-preview strong,
.language-flag-preview span {
    display: block;
}

.language-flag-preview strong {
    font-size: 10px;
}

.language-flag-preview span {
    margin-top: 3px;
    color: var(--muted);
    font-size: 9px;
}

.language-checks,
.language-editor-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.language-checks .check {
    padding: 10px;
    background: #f7f8fa;
    border: 1px solid #e1e5ea;
    border-radius: 9px;
}

.language-editor-actions .btn.primary {
    width: 100%;
}

@media (max-width: 1100px) {
    .language-manager-grid {
        grid-template-columns: 1fr;
    }

    .language-editor-panel {
        position: static;
    }
}

@media (max-width: 700px) {
    .language-manager-head,
    .language-list-head {
        align-items: stretch;
        flex-direction: column;
    }

    .language-card {
        grid-template-columns: 54px minmax(0, 1fr);
    }

    .language-card > .btn {
        grid-column: 2;
        justify-self: start;
    }

    .language-checks,
    .language-editor-actions {
        grid-template-columns: 1fr;
    }
}

/* NESA CMS Language Layout Fix v0.2
   Google Translate's current widget can inject a top-level skiptranslate/banner
   node after the page content. Hiding only the legacy iframe leaves its wrapper
   in document flow on some Chrome builds, which can create empty space below
   the footer. Keep the internal translation engine available, but collapse all
   injected UI chrome completely. */
body > .skiptranslate:not(#google_translate_element),
body > iframe.skiptranslate,
body > .VIpgJd-ZVi9od-ORHb-OEVmcd,
body > iframe.VIpgJd-ZVi9od-ORHb-OEVmcd,
body > .VIpgJd-ZVi9od-aZ2wEe-wOHMyf,
body > .VIpgJd-ZVi9od-aZ2wEe-OiiCO {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
}

html,
body {
    top: 0 !important;
    margin-top: 0 !important;
}

/* NESA CMS 2.1.36 — language selector standard
   The selector is rendered only when 2+ languages are active.
   On mobile it belongs inside the opened navigation, not in the header row. */
.mobile-nav-language-switch{display:none}
@media (max-width:1100px){
    .mobile-header-actions{margin-left:auto;flex:0 0 auto}
    .mobile-nav-language-switch{
        display:flex;
        align-items:center;
        flex-wrap:wrap;
        gap:8px;
        margin-top:16px;
        padding-top:16px;
        border-top:1px solid var(--line);
    }
    .mobile-nav-language-switch button{
        min-height:38px;
        padding:7px 10px;
        border:1px solid var(--line);
        border-radius:9px;
    }
    .mobile-nav-language-switch button span{display:inline}
}

@media (max-width:1100px){
    /* Once burger navigation is active, the language control lives only inside it. */
    .topbar .language-switch,
    .header-main-actions > .language-switch,
    .header-centered-actions > .language-switch,
    .header-shop-actions > .language-switch{
        display:none !important;
    }
}
