/* Стили для бургер-кнопки */
.navbar-toggler {
    padding: 0.25rem 0.75rem;
    font-size: 1.25rem;
    line-height: 1;
    background-color: pink;
    border: 1px solid pink;
    border-radius: 0.25rem;
    cursor: pointer;
}

.navbar-toggler-icon {
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
}

/* Стили для мобильного меню */
.collapse:not(.show) {
    display: none;
}

.navbar-collapse {
    flex-basis: 100%;
    flex-grow: 1;
    align-items: center;
}

.nav.flex-column {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}

.nav.flex-column .nav-link {
    padding: 0.5rem 1rem;
}

/* Анимация для плавного раскрытия меню */
.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    transition: height 0.35s ease;
}

/* Черная бургер-кнопка */
.custom-toggler {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

.navbar-toggler {
    padding: 0.5rem;
    margin-left: auto;
    outline: none !important;
    box-shadow: none !important;
}

/* Мобильное меню (выезжает справа) */
@media (max-width: 768px) {
    #navbarToggle {
        position: fixed;
        right: 0;
        top: 70px;
        width: 250px;
        background: white;
        box-shadow: -5px 5px 10px rgba(0,0,0,0.1);
        z-index: 1000;
        border-radius: 0 0 0 5px;
    }
    
    .navbar-collapse.collapsing {
        position: fixed;
        right: 0;
        top: 70px;
        width: 250px;
        height: 0;
        transition: height 0.35s ease;
    }
    
    .navbar-collapse.show {
        display: block;
        height: auto;
        overflow: hidden;
    }
    
    .mobile-menu-container {
        padding: 1rem;
    }
}