/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1. Fonts, Icons and Other Styles Import
2. Reset
2-1. Body, Font, Container, Space
2-2. Placeholder Customize
2-3. Social Icons Color
2-4. Input, Textarea (All forms field) customization
2-5. Button Styling
-----------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700&display=swap');
@import url("bootstrap-icons.css");
@import url("bootstrap.min.css");
@import url("ui-helper.css");
@import url("animation.css");
@import url("animate.css");
@import url("swiper-bundle.min.css");
@import url("odometer-theme-default.css");
@import url("jquery.fancybox.css");
@import url("fullcalendar.min.css");
@import url("flatpickr.css");
@import url("nice-select.css");
@import url("global.css");
@import url("header.css");
@import url("footer.css");
@import url("preloader.css");
@import url("shop.css");
@import url("components.css");
@import url("contact.css");
@import url("blog.css");
@import url("sidebar.css");
@import url("portfolio.css");
@import url("style.css");
@import url("responsive.css");
@import url("light.css");

.btn-without-bg {
    background: none;
    color: #353433;
    padding: 0;
    height: 40px;
    min-width: 40px;
    box-shadow: none;
}
.p-relative {
    position: relative;
}
.header__btn-theme, .header__btn-lang, .header__btn-comments, .header__btn-search {
    font-size: 24px;
    color: #717a85;
    border: none;
}
.header__btn-lang {
    margin-right: 30px;
}
.header__btn-lang[data-lang]::after {
    content: attr(data-lang);
    width: 25px;
    text-align: center;
    height: 22px;
    border-radius: 3px;
    background-color: #2196f3;
    position: absolute;
    right: -5px;
    top: 0px;
    color: #fff;
    font-size: 12px;
}
.header__lp, .header__lang-list {
    position: absolute;
    right: 0;
    top: 100%;
    background-color: #110e10;
    box-shadow: 0 0 65px #212529;
    border-radius: 10px;
    width: 360px;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    transform: translateY(30px);
}

.header__lang-list {
    width: 150px;
    padding: 15px;
}
.header__lang-list-item {
    align-items: center;
    gap: 10px;
    padding: 10px 15px;
    cursor: pointer;
    position: relative;
    border-radius: 4px;
    flex-wrap: wrap;
    flex-direction: row;
}
.header__lang-list-item.is-active, .header__lang-list-item:hover {
    background-color: #4c4c4c;
}
.header__lang-list-item img {
    display: block;
    width: 30px;
    flex-shrink: 0;
}
.is-active .header__lp, .is-active .header__lang-list {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}