/* flaticon.css - готово к использованию на сайте */

@font-face {
    font-family: "Flaticon";
    src: url("Flaticon.eot");
    src: url("Flaticon.eot?#iefix") format("embedded-opentype"), url("Flaticon.woff2") format("woff2"), url("Flaticon.woff") format("woff"), url("Flaticon.ttf") format("truetype"), url("Flaticon.svg#Flaticon") format("svg");
    font-weight: normal;
    font-style: normal;
}

[class^="flaticon-"]:before,
[class*=" flaticon-"]:before {
    font-family: "Flaticon";
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    speak: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 20px !important; /* базовый размер, можно менять */
    color: #000 !important; /* базовый цвет, можно менять */
    margin-left: 0;
}

/* === Твои 7 иконок === */
.flaticon-017-toy-car:before {
    content: "\f110";
    font-size: 40px !important;
    color: #ff6600 !important;
}

.flaticon-022-drum:before {
    content: "\f115";
    font-size: 40px !important;
    color: #00ccff !important;
}

.flaticon-025-sandwich:before {
    content: "\f118";
    font-size: 40px !important;
    color: #33cc33 !important;
}

.flaticon-030-crayons:before {
    content: "\f11d";
    font-size: 40px !important;
    color: #ff33cc !important;
}

.flaticon-043-teddy-bear:before {
    content: "\f12a";
    font-size: 80px !important;
    color: #00ccff !important;
    vertical-align: middle;
}

.flaticon-047-backpack:before {
    content: "\f12e";
    font-size: 40px !important;
    color: #6666ff !important;
}

.flaticon-050-fence:before {
    content: "\f131";
    font-size: 40px !important;
    color: #cc3333 !important;
}

/* === Стили для языкового меню с плавной анимацией === */
.lang-menu {
    position: absolute;
    top: 55px;
    left: 50%;
    transform: translateX(-50%);
    flex-direction: column;
    align-items: center;
    gap: 8px;
    z-index: 9999;

    opacity: 0;
    pointer-events: none;
}

.lang-menu.show {
    opacity: 1;
    pointer-events: auto;
}

.lang-btn {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    color: #fff;
    font-weight: bold;
    cursor: pointer;
    transform: translateY(-20px);
    opacity: 0;
    transition: all 0.3s ease;
}

.lang-btn.en { background: #0d6efd; }
.lang-btn.es { background: #dc3545; }
.lang-btn.fr { background: #ffc107; color: #000; }
.lang-btn.de { background: #198754; }
.lang-btn.pl { background: #0dcaf0; }

.lang-menu.show .lang-btn:nth-child(1) { transition-delay: 0.05s; transform: translateY(0); opacity: 1; }
.lang-menu.show .lang-btn:nth-child(2) { transition-delay: 0.1s;  transform: translateY(0); opacity: 1; }
.lang-menu.show .lang-btn:nth-child(3) { transition-delay: 0.15s; transform: translateY(0); opacity: 1; }
.lang-menu.show .lang-btn:nth-child(4) { transition-delay: 0.2s;  transform: translateY(0); opacity: 1; }
.lang-menu.show .lang-btn:nth-child(5) { transition-delay: 0.25s; transform: translateY(0); opacity: 1; }

.lang-menu a.lang-btn {
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-decoration: none !important;
    width: 50px !important;
    height: 50px !important;
    border-radius: 50% !important;
    border: none !important;
    font-weight: bold !important;
}
