/* ==========================================================
   2. MASQUER LE CONSENTEMENT MARKETING SIMPLYBOOK
   ========================================================== */

#sb-main-container
#main #sb-timeline #steps #details
.detail-step-wrap .detail-step
.license-links-container
.promotions-letter-flag {
    display: none !important;
}

/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/
 #events h3   {
	/* add your css rule here */
}


 #events p.duration, #events div.duration   {
	/* add your css rule here */
}


 #events p.description, #events div.description   {
	/* add your css rule here */
}


 #events .selectedEvent   {
	/* add your css rule here */
}


 #events input.reserve_time_btn   {
	/* add your css rule here */
}


 #events input.select_another_btn   {
	/* add your css rule here */
}


 #eventForm #start_date-block-container h3, #eventForm #timeline-container h3   {
	/* add your css rule here */
}


 #eventForm #save_button   {
	/* add your css rule here */
}


 div.ui-widget-content   {
	/* add your css rule here */
}


 div.ui-widget-header   {
	/* add your css rule here */
}


 #timeline-container table.timeline   {
	/* add your css rule here */
}


 .timeline td.not_worked_time   {
	/* add your css rule here */
}


 .timeline td.free_time   {
	/* add your css rule here */
}


 .timeline td.selected_time   {
	/* add your css rule here */
}


 .timeline td.reserved_time   {
	/* add your css rule here */
}


 div#loading   {
	/* add your css rule here */
}


 #start_date-block-container .zend_form dt, start_date-block-container .zend_form dt b, start_date-block-container .zend_form dd label   {
	/* add your css rule here */
}
/* ==========================================================
   CHRISTOFLE - PRENOM + CIVILITE
   Compactage des champs personnalises
   ========================================================== */


/* Bloc PRENOM */
#sb-main-container #main #sb-timeline #steps #details
.form-group:has(input[placeholder="Prénom"]) {
    width: 480px !important;
    max-width: 480px !important;
    min-height: 0 !important;

    margin-top: 0 !important;
    margin-bottom: 20px !important;

    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#sb-main-container #main #sb-timeline #steps #details
.form-group:has(input[placeholder="nom"]) {
    width: 480px !important;
    max-width: 480px !important;
    min-height: 0 !important;

    margin-top: 0 !important;
    margin-bottom: 20px !important;

    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#sb-main-container #main #sb-timeline #steps #details
.form-group:has(input[placeholder="téléphone"]) {
    width: 480px !important;
    max-width: 480px !important;
    min-height: 0 !important;

    margin-top: 0 !important;
    margin-bottom: 20px !important;

    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Bloc CIVILITE = bloc juste après Prénom */
#sb-main-container #main #sb-timeline #steps #details
.form-group:has(input[placeholder="Prénom"]) + .form-group {
    width: 480px !important;
    max-width: 480px !important;
    min-height: 0 !important;

    margin-top: 0 !important;
    margin-bottom: 20px !important;

    padding-top: 0 !important;
    padding-bottom: 0 !important;
}


/* Largeur des champs */
#sb-main-container #main #sb-timeline #steps #details
.form-group:has(input[placeholder="Prénom"]) input,

#sb-main-container #main #sb-timeline #steps #details
.form-group:has(input[placeholder="Prénom"]) + .form-group input,

#sb-main-container #main #sb-timeline #steps #details
.form-group:has(input[placeholder="Prénom"]) + .form-group select {
    width: 480px !important;
    max-width: 480px !important;
}


/* Réduire l'espace entre le libellé et la barre */
#sb-main-container #main #sb-timeline #steps #details
.form-group:has(input[placeholder="Prénom"]) .control-label,

#sb-main-container #main #sb-timeline #steps #details
.form-group:has(input[placeholder="Prénom"]) + .form-group .control-label {
    margin-top: 0 !important;
    margin-bottom: 5px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}


/* Supprimer les marges internes inutiles */
#sb-main-container #main #sb-timeline #steps #details
.form-group:has(input[placeholder="Prénom"]) .field,

#sb-main-container #main #sb-timeline #steps #details
.form-group:has(input[placeholder="Prénom"]) + .form-group .field {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}


/* Mobile */
@media (max-width: 768px) {

    #sb-main-container #main #sb-timeline #steps #details
    .form-group:has(input[placeholder="Prénom"]),

    #sb-main-container #main #sb-timeline #steps #details
    .form-group:has(input[placeholder="Prénom"]) + .form-group {
        width: 100% !important;
        max-width: 100% !important;
    }

    #sb-main-container #main #sb-timeline #steps #details
    .form-group:has(input[placeholder="Prénom"]) input,

    #sb-main-container #main #sb-timeline #steps #details
    .form-group:has(input[placeholder="Prénom"]) + .form-group input,

    #sb-main-container #main #sb-timeline #steps #details
    .form-group:has(input[placeholder="Prénom"]) + .form-group select {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/*
==========================================================
   CHRISTOFLE - ORDRE DES CHAMPS NATIFS

   Email
   Téléphone
   Nom
   puis les champs personnalisés
   ========================================================== */


/* Conteneur des champs natifs */
#sb-main-container #main #sb-timeline #steps #details
*:has(> .form-group.form-client-phone):has(> .form-group.form-client-email) {
    display: flex !important;
    flex-direction: column !important;
}


/* 1 - EMAIL */
#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-email {
    order: -30 !important;
}


/* 2 - TÉLÉPHONE */
#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-phone {
    order: -20 !important;
}

/* Réduire l'espace entre NOM et PRÉNOM */
#sb-main-container #main #sb-timeline #steps #details
.form-group:has(input[placeholder="Prénom"]) {
    margin-top: -30px !important;
}

#sb-main-container #main #sb-timeline #steps #details
.field:has(input[placeholder="Prénom"]) {
    width: 300px !important;
    max-width: 300px !important;
    min-width: 0 !important;
    flex: 0 0 500px !important;
}


/* L'input suit la largeur du conteneur */
#sb-main-container #main #sb-timeline #steps #details
.field:has(input[placeholder="Prénom"]) input {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}
/* ==========================================================
   CHAMPS NATIFS
   Mettre le libellé au-dessus de la zone de saisie
   Email / Téléphone / Nom
   ========================================================== */

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-email,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-phone,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-name {
    display: block !important;
    width: 100% !important;
}


/* Libellés : email / téléphone / nom */
#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-email > label,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-phone > label,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-name > label,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-email .control-label,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-phone .control-label,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-name .control-label {
    display: block !important;
    float: none !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 0 8px 0 !important;
    padding: 0 !important;

    text-align: left !important;
}


/* Zone de saisie sous le libellé */
#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-email .field,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-phone .field,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-name .field,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-email .controls,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-phone .controls,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-name .controls {
    display: block !important;
    float: none !important;

    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    padding-left: 0 !important;
}


/* Réduire légèrement l'espace entre les 3 champs */
#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-email,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-phone,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-name {
    margin-bottom: 25px !important;
}
/* ==========================================================
   ALIGNER EMAIL / TELEPHONE / NOM
   sur la première lettre du libellé
   ========================================================== */

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-email .field,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-phone .field,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-name .field,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-email .controls,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-phone .controls,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-name .controls {
    margin-left: 0 !important;
    padding-left: 0 !important;
}
/* ALIGNER LES LIBELLÉS NATIFS AVEC PRÉNOM / CIVILITÉ */

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-email > label,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-phone > label,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-name > label,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-email .control-label,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-phone .control-label,

#sb-main-container #main #sb-timeline #steps #details
.form-group.form-client-name .control-label {
    margin-left: 20px !important;
}
/* Masquer uniquement "Prestataire : Orfèvrerie Christofle"
   dans le récapitulatif de réservation */
#sb-main-container #main #sb-timeline #steps #details
tr.booking-info--item_provider {
    display: none !important;
}

.form-group--checkbox[data-field="67bd4316e1707bb83a2bb2cbe2d5c265"] {
    display: grid !important;
    grid-template-columns: max-content max-content !important;
    align-items: center !important;
    justify-content: start !important;
    column-gap: 10px !important;
}

.form-group--checkbox[data-field="67bd4316e1707bb83a2bb2cbe2d5c265"]::before,
.form-group--checkbox[data-field="67bd4316e1707bb83a2bb2cbe2d5c265"]::after {
    display: none !important;
    content: none !important;
}

.form-group--checkbox[data-field="67bd4316e1707bb83a2bb2cbe2d5c265"] > label.control-label {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

.form-group--checkbox[data-field="67bd4316e1707bb83a2bb2cbe2d5c265"] > .custom-checkbox {
    display: block !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

/* =========================
   CHAMP CIVILITÉ
   ========================= */

/* Le champ juste avant la newsletter = Civilité */
.form-group:has(+ .form-group--checkbox[data-field="67bd4316e1707bb83a2bb2cbe2d5c265"]) {
    margin-bottom: 0 !important;
}

/* Rapproche la zone de saisie du titre "civilité:" */
.form-group:has(+ .form-group--checkbox[data-field="67bd4316e1707bb83a2bb2cbe2d5c265"])
> .control-label {
    margin-bottom: 1px !important;
}

/* Réduit la hauteur du champ Civilité */
.form-group:has(+ .form-group--checkbox[data-field="67bd4316e1707bb83a2bb2cbe2d5c265"])
.form-control {
    height: 20px !important;
    min-height: 20px !important;
    margin-top: 0 !important;
}


/* =========================
   ESPACE AVANT LA NEWSLETTER
   ========================= */

.form-group--checkbox[data-field="67bd4316e1707bb83a2bb2cbe2d5c265"] {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}


/* =========================
   "VOIR LES CONDITIONS..."
   ========================= */

/* Élément situé juste après la checkbox */
.form-group--checkbox[data-field="67bd4316e1707bb83a2bb2cbe2d5c265"] + * {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* Et son contenu */
.form-group--checkbox[data-field="67bd4316e1707bb83a2bb2cbe2d5c265"] + * > * {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.form-group--checkbox[data-field="67bd4316e1707bb83a2bb2cbe2d5c265"] {
    padding-left: 15px !important;
    box-sizing: border-box !important;
}