.week-calendar-wrapper {
    width: 370px;
    margin: 0 auto;
    font-size: 14px;
}

.week-calendar-title {
    font-size: 24px;
    padding: 10px;
    text-align: center;
}

.week-calendar-item {
    display: inline-block;
    min-width: 35px;
    text-align: center;
    padding: 5px 0;
    margin: 5px;
}

.week-callendar-body-wrapper > div {
    display: inline-block;
}

.week-calendar-next, .week-calendar-prev {
    width: 20px;
    cursor: pointer;
}

.week-calendar-next {
    margin-left: 5px;
}

.week-callendar-days-body .week-calendar-item {
    border: 1px solid green;
    border-radius: 5px;
    cursor: pointer;
    color: green;
    padding: 7px 0;
    width: 35px;
    height: 35px;
}

.week-callendar-days-title .week-calendar-item {
    text-align: left;
}

.week-callendar-days-body .week-calendar-item.prev, .week-callendar-days-body .week-calendar-item.not-available {
    border: 1px solid red;
    text-decoration: line-through;
    color: red;
    cursor: default;
}

.week-callendar-days-body .week-calendar-item.selected {
    border-radius: 50%;
    background: green;
    color: #fff;
}

.week-calendar-wrapper i {
    border: solid black;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 3px;
}

.week-calendar-wrapper .right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.week-calendar-wrapper .left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}

.week-calendar-wrapper .up {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
}

.week-calendar-wrapper .down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.week-callendar-days-body, .week-callendar-days-title, .week-calendar-title {
    width: 320px;
    margin: 0 auto;
}

.calendar-wrapper .week-calendar-wrapper {
    background: #ffffff;
    width: initial;
    padding: 20px;
    box-shadow: -5px 7px 36px rgba(0, 0, 0, 0.09);
    border-radius: 15px;
    max-width: 480px;
    margin: auto;
}

.calendar-wrapper .week-calendar-title {
    font-size: 22px;
    padding-bottom: 25px;
}


.calendar-wrapper .week-callendar-days-title {
    color: #C4C4C4;
    margin-bottom: 10px;
}

.calendar-wrapper .week-callendar-body-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.calendar-wrapper .week-callendar-days-body {
    margin: 0;
}

.calendar-wrapper .week-calendar-prev {
    width: fit-content;
}

    .calendar-wrapper .week-calendar-prev i,
    .calendar-wrapper .week-calendar-next i {
        background-color: #FFFFFF;
        border-radius: 4px;
        background-repeat: no-repeat;
        background-position: center;
        border: none;
        -webkit-transform: initial;
        width: 30px;
        height: 30px;
    }

    .calendar-wrapper .week-calendar-prev i {
        background-image: url("data:image/svg+xml,%3Csvg width='8' height='16' viewBox='0 0 8 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 1.90735e-06L8 16L-1.20769e-06 7.99686' fill='%23C4C4C4'/%3E%3C/svg%3E%0A");
    }

.calendar-wrapper .week-calendar-next i {
    background-image: url("data:image/svg+xml,%3Csvg width='8' height='16' viewBox='0 0 8 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 16V0L8 8.00314' fill='%23C4C4C4'/%3E%3C/svg%3E%0A");
}

.calendar-wrapper #wish-date {
    position: absolute;
    right: 65px;
    top: 27px;
    width: 50px;
    font-size: 0;
    min-width: auto;
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' x='0px' y='0px' viewBox='0 0 70 70' style='enable-background:new 0 0 70 70;' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23F6F6F6;%7D%0A%3C/style%3E%3Cg%3E%3Cpath class='st0' d='M22.1,46.8c0,0.6,0.5,1.1,1.1,1.1h23.6c0.6,0,1.1-0.5,1.1-1.1V32.9H22.1V46.8z M41.4,35h2.1 c0.6,0,1.1,0.5,1.1,1.1c0,0.6-0.5,1.1-1.1,1.1h-2.1c-0.6,0-1.1-0.5-1.1-1.1C40.4,35.5,40.8,35,41.4,35z M41.4,39.3h2.1 c0.6,0,1.1,0.5,1.1,1.1c0,0.6-0.5,1.1-1.1,1.1h-2.1c-0.6,0-1.1-0.5-1.1-1.1C40.4,39.8,40.8,39.3,41.4,39.3z M41.4,43.6h2.1 c0.6,0,1.1,0.5,1.1,1.1s-0.5,1.1-1.1,1.1h-2.1c-0.6,0-1.1-0.5-1.1-1.1S40.8,43.6,41.4,43.6z M33.9,35h2.1c0.6,0,1.1,0.5,1.1,1.1 c0,0.6-0.5,1.1-1.1,1.1h-2.1c-0.6,0-1.1-0.5-1.1-1.1C32.9,35.5,33.3,35,33.9,35z M33.9,39.3h2.1c0.6,0,1.1,0.5,1.1,1.1 c0,0.6-0.5,1.1-1.1,1.1h-2.1c-0.6,0-1.1-0.5-1.1-1.1C32.9,39.8,33.3,39.3,33.9,39.3z M33.9,43.6h2.1c0.6,0,1.1,0.5,1.1,1.1 s-0.5,1.1-1.1,1.1h-2.1c-0.6,0-1.1-0.5-1.1-1.1S33.3,43.6,33.9,43.6z M26.4,35h2.1c0.6,0,1.1,0.5,1.1,1.1c0,0.6-0.5,1.1-1.1,1.1 h-2.1c-0.6,0-1.1-0.5-1.1-1.1C25.4,35.5,25.8,35,26.4,35z M26.4,39.3h2.1c0.6,0,1.1,0.5,1.1,1.1c0,0.6-0.5,1.1-1.1,1.1h-2.1 c-0.6,0-1.1-0.5-1.1-1.1C25.4,39.8,25.8,39.3,26.4,39.3z M26.4,43.6h2.1c0.6,0,1.1,0.5,1.1,1.1s-0.5,1.1-1.1,1.1h-2.1 c-0.6,0-1.1-0.5-1.1-1.1S25.8,43.6,26.4,43.6z' style='fill: rgb(255, 254, 254);'/%3E%3Cpath class='st0' d='M42.5,28.6c0.6,0,1.1-0.5,1.1-1.1v-4.3h-2.1v4.3C41.4,28.1,41.9,28.6,42.5,28.6z' style='fill: rgb(255, 255, 255);'/%3E%3Cpath class='st0' d='M-0.1,0v70h70V0H-0.1z M50,46.8c0,1.8-1.4,3.2-3.2,3.2H23.2c-1.8,0-3.2-1.4-3.2-3.2V26.4 c0-1.8,1.4-3.2,3.2-3.2h3.2v-2.1c0-0.6,0.5-1.1,1.1-1.1c0.6,0,1.1,0.5,1.1,1.1v2.1h-2.1v4.3c0,0.6,0.5,1.1,1.1,1.1 c0.6,0,1.1-0.5,1.1-1.1v-4.3h12.9v-2.1c0-0.6,0.5-1.1,1.1-1.1s1.1,0.5,1.1,1.1v2.1h3.2c1.8,0,3.2,1.4,3.2,3.2V46.8z' style='fill: rgb(255, 255, 255);'/%3E%3C/g%3E%3C/svg%3E");
    border: none;
    background-color: #ff6600;
    background-size: 55px;
    background-position: center;
}

    .calendar-wrapper #wish-date:hover,
    .calendar-wrapper #wish-date:focus {
        cursor: pointer;
        background-color: #B24801;
    }

.calendar-wrapper .week-callendar-days-body .week-calendar-item {
    color: initial;
    background-color: initial;
    border: none;
}

    .calendar-wrapper .week-callendar-days-body .week-calendar-item.selected {
        background: #ff6600;
        min-width: auto;
        width: 30px;
        height: 30px;
        padding: 5px 0;
        color: #ffffff;
    }

    .calendar-wrapper .week-callendar-days-body .week-calendar-item.prev,
    .calendar-wrapper .week-callendar-days-body .week-calendar-item.not-available {
        opacity: 0.4;
        border: none;
        text-decoration: none;
        color: #0E2A49;
    }

.calendar-wrapper {
    position: relative;
}

.overview .week-calendar {
    display: none;
}

#shopping-info .week-calendar {
    /*#7847*/
    display: block;
}

.calendar-wrapper .week-calendar {
    display: initial;
}

@media all and (max-width: 480px) {

    .week-calendar-wrapper {
        width: 100%;
    }

    .week-callendar-body-wrapper > div {
        vertical-align: middle;
    }

    .week-callendar-days-body, .week-callendar-days-title, .week-calendar-title {
        width: 80%;
    }

    .calendar-wrapper #wish-date {
        right: 5px;
    }
}

@media all and (min-width: 720px) {

    .calendar-wrapper .week-calendar-wrapper {
        max-height: 200px;
    }
}
