@import url("bootstrap.css");

nav {
    display: flex;
    align-items: center;
    justify-content: space-around;
}

nav>* {
    flex: 0 0 auto;
}

.svg-icon {
    opacity: 0.85;
    fill: var(--bs-body-color);
    width: 2rem;
}

.svg-icon:hover {
    color: var(--bs-primary);
    fill: var(--bs-primary);
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 1;
    box-shadow: 1 1 1 1 #fff;

}

.monthgrid {
    display: grid;
    grid-template-columns: repeat(7, minmax(100px, 1fr));
    grid-template-rows: repeat(6, 1fr);
    grid-column-gap: 2px;
    grid-row-gap: 2px;
}

.grid-item  a{
    float: left;
}


.grid-item:nth-child(7n-1) ,
.grid-item:nth-child(7n) {
    background-color: rgba(255, 85, 85, .1);
}



.grid-item a {
    width: 99%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /* margin: 1px 0; */
    float: left;
    text-align: left;
}
.btn.bg-primary:hover {
    --bs-bg-opacity: 0.333;
    /* Изменяем прозрачность при наведении */
}

.date {
    text-decoration: none;
}
.date:hover {
    background-color: var(--bs-gray-200);
}