/* Comments translated in english on 21/03/2026 */
/* ---------------------------- */
/* Price calculation form */
/* ---------------------------- */
#ar-sr-ck-check-container {
    display: flex;
    flex-direction: row; /* organized in a row */
    justify-content: space-around; /* space between container blocks + 1/2 space at ends */
    flex-wrap: wrap; /* Allows blocks to wrap if space is insufficient (e.g. smartphone)*/
    align-items: flex-start; /* Aligns blocks to the top if their total heights differ */ 
    width: 100%; /* forces container occupation to all available space */
    box-sizing: border-box;
}


#ar-sr-ck-check-container .ar-sr-ck-col-1 {
    width: 97%; /* 1 element */
}

#ar-sr-ck-check-container .ar-sr-ck-col-2 {
    width: 47%; /* 2 elements */
}

#ar-sr-ck-check-container label { 
    display:block; 
    margin-top:8px; 
    text-align: left;
}

#ar-sr-ck-check-container input[type="date"] { 
    width:100%; 
    padding:6px; 
    box-sizing:border-box; 
}

#ar-sr-ck-check-container button { 
    width:100%;
    text-align: center !important;
    display: block; 
    padding:8px 12px; 
    background:#0073aa; 
    color:white; 
    text-decoration:none; 
    border-radius:4px; 
    border:none; 
    cursor:pointer;
}

#ar-sr-ck-check-container table { 
    width:100%;
    border:1px solid #ddd; 
    padding:12px; 
    border-radius:6px; 
    table-layout: auto;
}

#ar-sr-ck-check-container #ar-sr-ck-button-reserve {
    display: none;
}

 #ar-sr-ck-check-container #ar-sr-ck-result{
    width:100%;
    text-align:center; 
 }

/* ------------------------- */
/* rate detail display    */
/* ------------------------- */
.ar-sr-price-description {
    text-align: left;
}

.ar-sr-price-amount {
    text-align: right;
}

/* ------------------------- */
/* Booking form */
/* ------------------------- */

#ar-sr-re-reserve-container {
    display: flex;
    flex-direction: row; /* organized in a row */
    justify-content: space-around; /* space between container blocks + 1/2 space at ends */
    flex-wrap: wrap; /* Allows blocks to wrap if space is insufficient (e.g. smartphone)*/
    align-items: flex-start; /* Aligns blocks to the top if their total heights differ */ 
}


/* on small screen: 1 field per line */
#ar-sr-re-reserve-container .ar-sr-re-col-1,
#ar-sr-re-reserve-container .ar-sr-re-col-2,
#ar-sr-re-reserve-container .ar-sr-re-col-3,
#ar-sr-re-reserve-container .ar-sr-re-col-4 {
    width: 100%; /* 3 elements */
    text-align: center;
}

/* on large screen: distribute fields */
@media (min-width: 768px) {
    #ar-sr-re-reserve-container .ar-sr-re-col-1 {
        width: 97%; /* 1 element */
        text-align: left;
    }

    #ar-sr-re-reserve-container .ar-sr-re-col-2 {
        width: 47%; /* 2 elements */
        text-align: left;
    }

    #ar-sr-re-reserve-container .ar-sr-re-col-3 {
        width: 30%; /* 3 elements */
        text-align: left;
    }
    
    #ar-sr-re-reserve-container .ar-sr-re-col-4 {
        width: 23%; /* 4 elements */
        text-align: left;
    }
}

#ar-sr-re-reserve-container label { 
    font-size:medium;
    text-align: left;
}

#ar-sr-re-reserve-container table { 
    border:1px solid #ddd; 
    border-color: darkgrey;
    padding:12px; 
    border-radius:6px; 
}

.ar-sr-re-reserve-total-price {
    width: 100%; 
    text-align: center;
    font-weight: bold;
}

.ar-sr-re-reserve-detail-price {
    width: 100%; 
    text-align: center;
    font-size: medium;
}

/* on large screen: switch to 50% */
@media (min-width: 768px) {
    .ar-sr-re-reserve-total-price {
        width: 50%; 
        text-align: center;
        font-weight: bold;
    }
    .ar-sr-re-reserve-detail-price {
    width: 50%; 
    text-align: center;
    font-size: medium;
    }
}

#ar-sr-re-reserve-container input[type="text"],
#ar-sr-re-reserve-container input[type="date"],
#ar-sr-re-reserve-container input[type="country"],
#ar-sr-re-reserve-container input[type="email"], 
#ar-sr-re-reserve-container input[type="number"], 
#ar-sr-re-reserve-container input[type="tel"], 
#ar-sr-re-reserve-container select,
#ar-sr-re-reserve-container textarea { 
    width:100%; 
    padding:6px; 
    box-sizing:border-box; 
}

#ar-sr-re-reserve-container button { 
    width:100%;
    display:inline-block; 
    padding:8px 12px; 
    background:#0073aa; 
    color:white; 
    text-decoration:none; 
    border-radius:4px; 
    border:none; 
    cursor:pointer;     
}

#ar-sr-re-reserve-messages {
    width: 100%; 
    text-align: center;
    color: red;
    font-weight: bold;
}

/* highlight fields in error */
#ar-sr-re-reserve-form .ar-sr-re-fields-in-error {
    border-width: 1px;
    border-color: red;
}

/* --------------------------- */
/* Booking confirmation */
/* --------------------------- */

.ar-sr-co-confirm-container {
    display: flex;
    flex-direction: row; /* organized in a row */
    justify-content: space-around; /* space between container blocks + 1/2 space at ends */
    flex-wrap: wrap; /* Allows blocks to wrap if space is insufficient (e.g. smartphone)*/
    align-items: flex-start; /* Aligns blocks to the top if their total heights differ */ 
}

.ar-sr-co-confirm-container .ar-sr-co-col-1,
.ar-sr-co-confirm-container .ar-sr-co-col-2,
.ar-sr-co-confirm-container .ar-sr-co-col-3,
.ar-sr-co-confirm-container .ar-sr-co-col-4 {
    width: 100%; /* 3 elements */
    text-align: center;
}

/* on large screen: distribute fields */
@media (min-width: 768px) {
    .ar-sr-co-confirm-container .ar-sr-co-col-1 {
        width: 97%; /* 1 element */
        text-align: left;
    }

    .ar-sr-co-confirm-container .ar-sr-co-col-2 {
        width: 47%; /* 2 elements */
        text-align: left;
    }

    .ar-sr-co-confirm-container .ar-sr-co-col-3 {
        width: 31%; /* 3 elements */
        text-align: left;
    }

    .ar-sr-co-confirm-container .ar-sr-co-col-4 {
        width: 23%; /* 4 elements */
        text-align: left;
    }
}


.ar-sr-co-confirm-container table { 
    border:1px solid #ddd; 
    border-color: darkgrey;
    padding:12px; 
    border-radius:6px; 
}


.ar-sr-co-confirm-detail_price {
    width: 100%; 
}


.ar-sr-co-confirm-container #ar-sr-co-create-booking-button { 
    width: 100%;
    display:inline-block; 
    padding:8px 12px; 
    background:#0073aa; 
    color:white; 
    text-decoration:none; 
    border-radius:4px; 
    border:none; 
    cursor:pointer;   
    text-align: center;  
}


.ar-sr-co-confirm-container #ar-sr-co-edit-details-button { 
    width: 100%;
    display:inline-block; 
    padding:8px 12px; 
    background:lightgrey; 
    color:black; 
    text-decoration:none; 
    border-radius:4px; 
    border: 1px solid black;
    cursor:pointer;   
    text-align: center;    
}

#ar-sr-co-confirm-messages {
    width: 100%; 
    text-align: center;
    font-weight: bold;
    color: red;
}

/* hiding areas for front/back exchanges */
#ar-sr-co-hidden-date-from,
#ar-sr-co-hidden-date-to,
#ar-sr-co-hidden-unit-id,
#ar-sr-co-hidden-salutation,
#ar-sr-co-hidden-forenames,
#ar-sr-co-hidden-surname,
#ar-sr-co-hidden-email,
#ar-sr-co-hidden-phone-home,
#ar-sr-co-hidden-phone-mobile,
#ar-sr-co-hidden-address1,
#ar-sr-co-hidden-address2,
#ar-sr-co-hidden-city,
#ar-sr-co-hidden-county,
#ar-sr-co-hidden-postcode,
#ar-sr-co-hidden-country,
#ar-sr-co-hidden-requests,
#ar-sr-co-hidden-num-adults,
#ar-sr-co-hidden-num-children,
#ar-sr-co-hidden-num-babies,
#ar-sr-co-hidden-detail-price,
#ar-sr-co-hidden-total-price {
    display: none;
}
    