
.b-none {
    border: none;
}
.cursor {
    cursor: pointer;
}
.pb-4rem {
    padding-bottom: 4rem !important;
}
.justify-content-space-between {
    justify-content: space-between;
}
.bg-yellow {
    background-color: #fab42d;
}
.border-right {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}
.border-left {
    border-top-left-radius: 20px !important;
    border-bottom-left-radius: 20px !important;
}
.border-radius-theme {
    border-radius: 20px;
}
.alinear-verticalmente {
    vertical-align: middle;
    align-items: center;
    height: 100vh;
    display: flex;

}
.header-reservacion {
    display: flex;
    justify-content: space-between;
}
.cal-month-view .cal-open-day-events {
    background-color: #ffffff;
    -webkit-box-shadow: unset;
    color: #6c6a6a;
    box-shadow: unset;
}
.total-reservas {
    background: #7e7979;
    border-radius: 22px;
    font-size: 13px;
}
.bg-card-dates {
    background-color: #1E1932;
    padding: 25px;
}
.disabled_btn {
    color: #bdbdbd;
    background-color: #616161;
}
.allow_btn {
    color: #000000;
    background-color: #ffffff;
}
.col-date {
    flex: 1 0 13.57%;
    max-width: 13.57%;
    box-sizing: border-box;
}
.centrar-verticalmente {
    vertical-align: middle;
    align-items: center;
    display: flex;
    margin-top: 0;
}
.text-32 {
    font-size: 32px !important;
}
label {
    color: #1e1932 !important;
}
a {
    color: #1e1932 !important;
}
input {
    border-radius: 20px !important;
    border: none !important;
    color: #1e1932 !important;
}
input[type=color] {
    padding: 0px !important;
}
form input {
    border: 1px solid #ccc !important;
}
app-login, app-registro {
    .text-secondary {
        color: #1e1932 !important;
    }
    .link-secondary {
        color: #1e1932 !important;
    }
}
.btn-dark {
    background-color: #1e1932 !important;
}
.form-check-input:checked {
    background-color: #1e1932;
    border-color: #1e1932;
}



/*
 *  Estilos diseño
*/
.border-contenedor {
    /* border: 1px solid #ccc; */
    border-radius: 3rem;
    padding: 6rem 6rem 3rem 6rem;
}
.not-month {
    color: #DBDBDB !important;
}
.theme-title-1 {
    text-align: center;
    padding: 2px;
    border: 1px solid #1e1932;
    width: 24rem;
    border-radius: 20px;
    text-transform: uppercase;
    margin: 0 auto;
    font-weight: 400;
    font-size: 12px;
}
.theme-content-blue, .theme-content-gray {
    background: #1e1932;
    padding: 10px;
    border-radius: 5px;
    color: #fff;
}
.theme-content-gray {
    background: #F0F0F0;
    color: #1e1932;
}
.blue {
    color: #1e1932;
}
.green {
    color: #78BC0B;
}
.d-contents {
    display: contents;
}
.p-datepicker:not(.p-datepicker-inline) {
    box-shadow: unset;
}
.theme-border, #pn_id_1_panel {
    border: 1px solid #DBDBDB;
    border-radius: 5px;
    padding: 22px 13px !important;
}
.theme-item-gray, .theme-item-green {
    border: 1px solid #DBDBDB;
    border-radius: 6px;
}

.theme-item-gray .theme-horario, .theme-item-gray .theme-user, .theme-item-gray .theme-button,
.theme-item-green .theme-horario, .theme-item-green .theme-user, .theme-item-green .theme-button {
    padding: 15px;
    font-weight: 700;
    font-size: 12px;
    line-height: 12px;
}

.theme-item-gray .theme-horario {
    background: #DBDBDB;
    border-radius: 4px 0 0 4px;
    color: #999999;
}

.theme-item-green {
    border: 1px solid #B5DAB5;
}

.theme-item-green .theme-horario {
    background: #B5DAB5;
    border-radius: 4px 0 0 4px;
}

.theme-item-green .theme-horario, .theme-item-green .theme-user, .theme-item-green .theme-button {
    color: #4D8A4E;
}



.days,
.week {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    margin: auto;
    padding: 0 20px;
    justify-content: space-between;
}
.week div,
.days div {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    width: 40px;
    border-radius: 4px;
    color: #4D8A4E;
    font-weight: 400;
}
.days div:hover {
    background: #1e1932;
    color: #FFFFFF;
    cursor: pointer;
}
.week {
    border-top: 1px solid #DBDBDB;
    padding-top: 30px;
}
.week div, .font-weight-700 {
    font-weight: 700 !important;
}
.days {
    padding-bottom: 30px;
}
.theme-calendar {
    border: 1px solid #DBDBDB;
    border-radius: 4px;
}
.current-date {
    background-color: #1e1932 !important;
    color: #fff !important;
}
.display-selected {
    margin-bottom: 10px;
    padding: 20px 20px;
    text-align: center;
}
.calendar__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
}
.header-display {
    display: flex;
    align-items: center;
}

.header-display p {
    color: #4D8A4E;
    margin: 5px;
    font-size: 16px;
    font-weight: 700;
    word-spacing: 0.5rem;
}
pre {
    padding: 0 40px;
    margin: 0;
    cursor: pointer;
    font-size: 16px;
    color: #4D8A4E;
}
.min-h-395px {
    min-height: 395px;
}
.theme-border.p-3.min-h-395px {
    max-height: 395px;
    overflow-x: auto;
}
.p-3rem {
    padding: 3rem !important;
}
.size-14 {
    font-size: 14px;
}
.color-green-theme {
    color: #4D8A4E !important;
}
.color-danger-theme {
    color: #D94214 !important;
}
body .border-b-gray {
    border-bottom: 1px solid #666666 !important;
}
body .border-b-danger {
    border-bottom: 1px solid #D94214 !important;
}
body .form-group-theme.mb-4.border-b-gray.border-b-danger .label-theme-danger {
    color: #D94214 !important;
}
body .border-b-gray .label-theme {
    color: #666666 !important;
}
.btn-theme-evx-reserva, .btn-theme-evx-reserva-green, .btn-theme-evx-reserva-disabled {
    padding: 1rem 6rem;
    font-weight: 400;
    border-radius: 2px;
    background: #1E1932;
    border-color: #1E1932;
}
.btn-theme-evx-reserva-green {
    background: #4D8A4E !important;
    border-color: #4D8A4E !important;
}
.btn-theme-evx-reserva-disabled {
    background: #D7D6DC !important;
    border-color: #D7D6DC !important;
}
.icon-dni-theme {
    position: relative;
    top: -0.2rem;
    color: #666666;
}
.form-group-theme {
    --pad: .75rem;
    position: relative;
    width: 49%;
    border-bottom: 1px solid #78BC0B !important;
    background: #F0F0F0;
    padding: .90rem 1rem 0;
}
.input-theme {
    padding: var(--pad);
    border-radius: 2px !important;
    color: inherit;
    background: #F0F0F0;
    outline: none;
    width: 90%;
}
.label-theme {
    position: absolute;
    left: var(--pad);
    top: 1.8rem;
    padding-inline: .3em;
    transition: transform 200ms;
    pointer-events: none;
    transform-origin: left;
    translate: 2em;
    font-size: 12px;
    color: #78BC0B !important;
}
.input-theme::placeholder {
    opacity: 0;
}
.input-theme:focus + .label-theme,
.input-theme:not(:placeholder-shown) + .label-theme {
    transform: translateY(calc(-50% - var(--pad))) scale(.8);
}
@media only screen and (max-width: 1151px) {
    .items-header-menu {
        width: 100%;
        padding: 1.2rem;
        padding-bottom: 0;
    }
    .logo-header-menu {
        width: 100%;
        justify-content: center;
    }
    .menu-desktop-theme {
        display: none !important;
    }
    .reservar-scooter {
        padding: 1rem 10rem;
    }
    ul.menu-principal.pb-4rem {
        display: unset;
    }
}
@media only screen and (max-width: 1136px) {
    .type-item-selected {
        width: 100%;
        justify-content: center;
    }
    .items-item-selected {
        margin: 0 auto;
    }
    .horizontal-menu {
        float: unset !important;
    }
    .horizontal-menu {
        flex-wrap: wrap;
        justify-content: center;
        margin-top: 1%;
    }
}
@media only screen and (max-width: 1000px) {
    .form-group-theme, .col-5.content-calendario, .col-7.content-listado {
        width: 100%;
    }
    #resultado_datos_reserva__step_2 label, #resultado_datos_reserva__step_2 span, #step_3_reserva label , #step_3_reserva span {
        font-size: 12px;
    }
    #resultado_datos_reserva__step_2 .col-3, #step_3_reserva .col-3 {
        width: 40%;
    }
    #resultado_datos_reserva__step_2 .col-9, #step_3_reserva .col-9 {
        width: 60%;
    }
    .theme-subtitle-1.row.justify-content-center.mt-4 h3 {
        font-size: 20px !important;
    }
    .theme-subtitle-1.row.justify-content-center.mt-4 p {
        font-size: 11px !important;
    }
}
@media only screen and (max-width: 768px) {
    .theme-item-gray .theme-horario, .theme-item-gray .theme-user, .theme-item-gray .theme-button, .theme-item-green .theme-horario, .theme-item-green .theme-user, .theme-item-green .theme-button {
        padding: 10px;
        font-size: 9px;
    }
    .week div, .days div {
        font-size: 10px;
    }
    .theme-subtitle-1.row.justify-content-center.mt-4 {
        text-align: center;
    }
    #step_2_buscar .col-12 .row .col-6.text-end button, #step_2_buscar .col-12 .row .col-6.text-start button,
    #step_2_reserva .col-12 .row .col-6.text-end button, #step_2_reserva .col-12 .row .col-6.text-start button,
    #step_3_reserva .col-12 .row .col-6 button {
        width: 100%;
    }
    #step_2_buscar .col-12 .row .col-6.text-end, #step_2_buscar .col-12 .row .col-6.text-start,
    #step_2_reserva .col-12 .row .col-6.text-end, #step_2_reserva .col-12 .row .col-6.text-start,
    #step_3_reserva .col-12 .row .col-6 {
        width: 100%;
        padding: 0;
        margin-top: 1rem;
    }
    span.text_alert.color-danger-theme.mb-4.size-14 {
        font-size: 10px;
    }
}
@media only screen and (max-width: 550px) {
    .cargador_name {
        font-size: 14px !important;
    }
    .btn-theme-evx-reserva, .btn-theme-evx-reserva-green, .btn-theme-evx-reserva-disabled {
        padding: 0.7rem 4rem;
        width: 100%;
    }
    .size-14 {
        font-size: 11px;
    }
    .container.border-contenedor.mb-4 .row .col-12 .col-10.m-auto {
        width: 100%;
    }
    .border-contenedor {
        padding: 6rem 2rem 6rem 2rem;
    }
}


