/* Breakpoints:
* Mobile: 320px - 480px
* Tablet Portrait: 481px - 768px
* Tablet Landscape: 769px - 1024px
* Desktop: 1025px+
*/

/* Base (Desktop first) */
/*
#rz-main-custom-jb-form-container {
    width: 40vw;
    padding: 35px;
    max-height: 80vh;
}
*/

.rz_form_calendar_type_btn {
    font-size: var(--eBikeTextSize);
    padding: 25px;
}

/* Tablet Landscape */
@media (max-width: 1024px) {
    #rz-main-custom-jb-form-container {
        width: 60vw;
        padding: 25px;
    }

    .rz_form_calendar_type_btn {
        font-size: calc(var(--eBikeTextSize) * 0.9);
        padding: 20px;
    }

    .rz_form_step_text,
    .rz_form_step_title {
        font-size: calc(var(--eBikeTextSize) * 0.9);
    }

    .rz_jet_fb_calendar_container {
        padding: 25px !important;
    }

    .rz_jet_fb_calendar_container .month-wrapper {
        height: 350px;
    }
}

/* Tablet Portrait */
@media (max-width: 768px) {
    #rz-main-custom-jb-form-container {
        width: 80vw;
        padding: 20px;
        border-width: 10px;
    }

    #rz-time-and-days-selectiors-container {
        flex-direction: column;
        gap: 15px;
    }

    .rz_form_calendar_type_btn {
        width: 100%;
        font-size: calc(var(--eBikeTextSize) * 0.8);
        padding: 15px;
    }

    .rz_form_step_text {
        font-size: calc(var(--eBikeTextSize) * 0.8);
        margin-right: 15px;
    }

    .rz_form_step_title {
        font-size: calc(var(--eBikeTextSize) * 0.8);
    }

    .rz_jet_fb_calendar_container {
        padding: 20px !important;
    }

    .rz_jet_fb_calendar_container .month-wrapper {
        height: 300px;
    }

    /* Selezione orari */
    #rz-slots-radio-container {
        gap: 15px;
    }

    .rz_select_orario_fascia {
        font-size: calc(var(--eBikeTextSize) * 0.8);
    }

    .rz_select_orario label {
        font-size: 18px;
    }

    /* Extra */
    .rz_extra_raw {
        flex-direction: row;
        height: 50px;
    }

    .rz_item_list_info_container {
        flex-direction: row;
        width: 50%;
        align-items: center;
        gap: 0px;
        display: flex;
        flex-wrap: wrap;
        align-content: center;
        justify-content: flex-start;
    }

    .rz_list_item_img img {
        display: none !important
    }

    .rz_list_item_title {
        font-size: 16px;
    }

    .rz_extra_qty_btn {
        padding: 0;
    }

    .rz_item_qty_btn, .rz_extra_qty_btn {
        font-size: unset !important;
    }
    .rz_item_input {
        font-size: unset !important;
        line-height: 50px !important;
        padding: 0 !important;
    }
}

/* Mobile */
@media (max-width: 480px) {
    #rz-form-popup-container {
        padding: 0;
    }

    #rz-main-custom-jb-form-container {
        width: 100vw;
        padding: 50px 10px;
        border-width: 5px;
        max-height: 100vh;
        border-radius: 0;
    }

    .rz_form_calendar_type_btn {
        font-size: calc(var(--eBikeTextSize) * 0.7);
        padding: 12px;
    }

    .rz_form_step_text {
        font-size: calc(var(--eBikeTextSize) * 0.7);
        margin-right: 10px;
    }

    .rz_form_step_title {
        font-size: calc(var(--eBikeTextSize) * 0.7);
    }

    .rz_jet_fb_calendar_container {
        padding: 15px !important;
    }

    .rz_jet_fb_calendar_container .month-wrapper {
        height: 250px;
    }

    .rz_jet_fb_calendar_container .day {
        font-size: calc(var(--eBikeTextSize3) * 0.9);
    }

    /* Selezione orari */
    #rz-slots-radio-container {
        gap: 10px;
    }

    .rz_select_orario_fascia {
        font-size: calc(var(--eBikeTextSize) * 0.7);
    }

    .rz_select_orario label {
        padding: 10px 5px;
        font-size: calc(var(--eBikeTextSize) * 0.7);
    }

    /* Modelli */
    .rz_selezione_modello {
        gap: 0;
    }

    .rz_selezione_modello label {
        font-size: 18px;
        max-width: 60%;
    }

    .rz_modello_disponibilita_record {
        flex-direction: column;
        gap: 10px;
    }

    .rz_selez_qty_container {
        max-width: 40%;
    }

    /* Riepilogo */
    #rz-jb-form-inner-summary-container button[type="submit"] {
        font-size: calc(var(--eBikeTextSize) * 0.8);
        padding: 8px;
    }
}