.calendar button {
    color: #fff;
    background: #8b9bac;
    font-weight: 700;
    transition: background-color .18s ease, transform .18s ease;
}

.calendar .is-available {
    color: #fff;
    background: var(--teal);
}

.calendar .is-available:hover {
    background: #187f7d;
    transform: translateY(-1px);
}

.calendar .is-available::after {
    display: none;
}

.calendar .is-unavailable {
    color: #fff;
    background: #aab5c0;
    opacity: .72;
}

.calendar .is-today {
    color: #fff;
    background: var(--navy);
    box-shadow: 0 0 0 3px rgba(36,154,152,.32);
}

.calendar .is-selected {
    color: #fff;
    background: var(--blue);
    box-shadow: 0 0 0 3px rgba(18,104,189,.24);
}

.preferred-time-label {
    display: block;
    color: var(--navy);
    font-weight: 700;
    text-align: left;
}

.preferred-time-input {
    min-height: 52px;
    border: 2px solid var(--teal);
    color: var(--navy);
    background: #f4fbfa;
    font-size: 1.15rem;
    font-weight: 700;
    cursor: pointer;
}