/* ==================================================
 *  NAWIGACJA
 *  ================================================== */


/* ==================================================
 *  WSPÓLNE
 *  ================================================== */

.site-nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
}


.site-nav-icon {
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}


.site-nav-icon svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}


.site-nav-text {
    display: inline;
}


.mobile-floating-nav-text {
    display: inline;
    font-size: clamp(0.58rem, 2.2vw, 0.7rem);
    line-height: 1;
}


/* ==================================================
 *  DESKTOP
 *  ================================================== */


/* Tylko tekst */

html[data-navigation-desktop="text"] .site-nav-icon {
    display: none;
}


/* Tylko ikona */

html[data-navigation-desktop="icon"] .site-nav-text {
    display: none;
}


/* Ikona + tekst */

html[data-navigation-desktop="icon_text"] .site-nav-icon,
html[data-navigation-desktop="icon_text"] .site-nav-text {
    display: inline-flex;
}


/* ==================================================
 *  MOBILE
 *  ================================================== */


/* Tylko tekst */

html[data-navigation-mobile="text"] .mobile-floating-nav-link svg {
    display: none;
}


html[data-navigation-mobile="text"] .mobile-floating-nav-text {
    display: inline;
}


/* Tylko ikona */

html[data-navigation-mobile="icon"] .mobile-floating-nav-text {
    display: none;
}


html[data-navigation-mobile="icon"] .mobile-floating-nav-link svg {
    display: block;
}


/* Ikona + tekst */

html[data-navigation-mobile="icon_text"] .mobile-floating-nav-text {
    display: inline;
}


html[data-navigation-mobile="icon_text"] .mobile-floating-nav-link svg {
    display: block;
}
@media (max-width: 700px) {

    html[data-navigation-mobile="icon_text"]
    .mobile-floating-nav-link {
        flex-direction: column;
        gap: 3px;
    }

    html[data-navigation-mobile="icon_text"]
    .mobile-floating-nav-text {
        font-size: clamp(0.58rem, 2.2vw, 0.7rem);
        line-height: 1;
    }

}