:root {
    --colorText: #000;
    --colorBackground: #FFF;
    --colorLink: purple;

    --colorHover: #4D0;
    --colorHover2: #FFF;
    --colorBackgroundHover: #FFA;

    --colorBoutonBackground: #FFF;
    --colorBoutonText: #000;

    --colorImportant: red;
    --colorAlert: orange;
    --colorSucces: green;
    
    --colorGreyTableBorder: #e2e2e2;
    --colorGrey1: #f2f2f2;
    --colorGrey2: #C6B3AF;
    --colorGrey3: #605351;

    --boutonRadius: 6px;
    --infoRadius: 20px;

    --border: 1px solid var(--colorGrey2);
    --borderHover: 1px solid #000;

    --spacingMini: 1px;
    --spacing1: 2px;
    --spacing2: 5px;
    --spacing3: 10px;
    --spacing4: 20px;
    --spacing5: 30px;

    --width1: 300px;
    --width2: 500px;
    
    --fontSizeSmall: 12px;
    --fontSizeNormal: 15px;
    --fontSizeMedium: 20px;
    --fontSizeBig: 40px;
    --bodyFontSize: var(--fontSizeNormal);
    --bodyLineHeight: 1.4em;

    --boxShadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
    
    --bgcolor: #2d2d2d;
}

.blocHidden { display: none; }
.show-when { display: none; }

.openButton,
.clickButton,
.onglet,
.icone-bouton,
.bouton,
.toggle-button,
.fermer-tableau,
.icone,
.icone-doc,
.pointer,
.infos-manquantes,
.highlight-element
{
    cursor: pointer;
}

.openButton::before
{
    font-family: "Font Awesome 6 Free";
    content: "\f06e";
    float: left;
    padding-right: 0.5em;
}
.openButton.open::before
{
    content: "\f070";
}

.click_to_reload
{
    position: fixed;
    width: 100vw;
    height: 100vh;
    z-index: 999999;
    top: 0;
    left: 0;
}

.inactif { cursor: not-allowed; }

.important, .erreur { color: var(--colorImportant); }
.alerte { color: var(--colorAlert); }
.succes { color: var(--colorSucces); }
.icone-bouton.bg-erreur, .bg-erreur { background-color: var(--colorImportant); }
.icone-bouton.bg-alerte, .bg-alerte { background-color: var(--colorAlert); }
.bg-alerte a { color: var(--colorGrey1); }
.bg-succes { background-color: var(--colorSucces); }
.white-board .input_jpost input.bord-erreur,
.bord-erreur { border: var(--colorImportant) 1px solid; }
.bord-alerte { border: var(--colorAlert) 1px solid; }
.bord-succes { border: var(--colorSucces) 1px solid; }
.disabled { color: var(--colorGrey2); }

.icone-aide.enabled { color: var(--colorLink); }

.highlight-bg { background-color: var(--colorAlert) !important; }

.egalise .input_jpost.hidden,
.input_jpost.hidden,
.fa.hidden,
.hidden { display: none; }

.fa { margin-right: var(--spacing1); }
.icone-bouton .fa { margin-right: 5px; }
.icone-bouton .fa:last-child,
.doc-bouton .fa:last-child
{
    margin-right: 0;
}

.metadata.notif-modif .modif h2::after,
.metadata.notif-modif .modif h3::after
{
    content: " \f303";
    font-family: "Font Awesome 6 Free";
    color: var(--colorSucces);
}

#wpadminbar ul li#wp-admin-bar-opaga {
    background-color: var(--colorAlert);
}

.opaga_tabs ul li
{
    display: inline-block;
    list-style: none;
    margin: 0 var(--spacing1);
    font-size: 1.4em;
}
.opaga_tabs ul
{
    margin: 0;
    padding: 0;
}

#notifications_text
{
    position: absolute;
    z-index: 10000;
    background-color: var(--colorBackground);
    border: 2px solid var(--colorImportant);
    padding: var(--spacing3);
    padding-right: var(--spacing5);
    font-size: 0.7em;
    line-height: 0.8em;
}

.opaga_head
{
    display: flex;
    flex-direction: row;
    flex-wrap: no-wrap;
    justify-content: flex-start;
    align-items: flex-start;
}
.opaga_head .dates
{
    flex-grow: 1;
    font-size: var(--fontSizeMedium);
}

.toggle-button,
.icone-info,
.icone-aide,
.icone-bouton,
.icone-bouton.fa
{
    padding: var(--spacing1) var(--spacing2);
    border-radius:  var(--boutonRadius);
    text-decoration: none;
    display: inline-block;
    width: auto;
    height: auto;    
}
.icone-info,
.gestion-docs-admin .icone-info
{
    padding: 0 var(--spacing1);
}
#tab-docs .gestion-docs-admin .icone-info
{
    padding: 0;
}
.gestion-docs-admin .icone-aide
{
    float: left;
    padding: 0;
}

.icone-aide:hover
{
    color: var(--colorHover);
}
.icone-aide.border 
{
    border: 1px solid var(--colorLink);
}
.icone-aide.border:hover 
{
    border-color: var(--colorHover);
}

.toggle-button.on > .off, .toggle-button.off > .on { display: none; }
.toggle-button.on > .on, .toggle-button.off > .off { display: inline; }

.toggle-button,
.icone-bouton,
a.icone-bouton
{
    border: 1px solid var(--colorBoutonBackground);
    background-color: var(--colorBoutonBackground);
    color: var(--colorBoutonText);
}
.toggle-button.off
{
    --colorBoutonBackground: var(--colorBackgroundHover);
    color: var(--colorText);
}

.icone-bouton:hover
{
    --colorBoutonBackground: var(--colorBackgroundHover);
}
.icone-bouton.border
{
    border: var(--border);
}
.icone-bouton.border:hover 
{
    border-color: var(--colorHover);
}
div.icone-info
{
    color: var(--colorGrey3);
    font-size: var(--fontSizeSmall);
    font-weight: normal;
    margin-left: var(--spacing1);
}
div.icone-info .fa {
    margin-right: var(--spacing1);
}
div.icone-info.border
{
    border: 1px solid var(--colorGrey2);
    border-radius: var(--infoRadius);
}
div.icone-info
{
    color: var(--colorGrey3);
    font-weight: var(--fontSizeNormal);
}
div.icone-info.succes .fa 
{
    color: var(--colorSucces);
}
div.icone-info.succes.border
{
    border-color: var(--colorSucces);
}
div.icone-info.alerte .fa
{
    color: var(--colorAlert);
}
div.icone-info.alerte.border
{
    border-color: var(--colorAlert);
}
.icone-bouton a,
a.icone
{
    text-decoration: none;
}
.icone-doc:hover
{
    color: var(--colorHover);
}

/* Menu */
.menu-item.connect a
{
    color: var(--colorLink);
}


/* input_jpost */
.input_jpost .icone-aide:hover
{
    border: none;
}

.icone-bouton.delete,
.icone-bouton.delete-entity
{
    background-color: white;
    color: var(--colorImportant);
    border-color: var(--colorImportant);
}
.icone-bouton.delete:hover,
.icone-bouton.delete-entity:hover
{
    background-color: var(--colorImportant);
    color: white;
}
.delete, .delete-entity { color: var(--colorImportant); }
.delete:hover, .delete-entity:hover { color: var(--colorHover2); }
span.delete:hover, span.delete-entity:hover { color: var(--colorHover); }
.switch-user { color: var(--colorAlert); }
.switch-user:hover { color: var(--colorHover); }

span.del-date:hover
{
    color: var(--colorImportant);
}

.clickButton
{
    background-color: #DD4;
    border: var(--border);
    padding: var(--spacing1) var(--spacing3);
    border-radius:  var(--boutonRadius);
    text-decoration: none;
}
.clickButton:hover
{
    background-color: var(--colorBackgroundHover);
    border: var(--borderHover);
}

.icone-bouton.premier_contact
{
    margin: var(--spacing5) 20%;
    font-size: 2em;
    text-align: center;
    width: 60%;
}
.premier_contact .fa
{
    font-size: 1.2em;
    width: auto;
    height: auto;
}

table td, table th
{
    word-break: normal;
}

table.opaga { border-collapse: collapse; }
ul.opaga.head,
table.opaga thead
{
    position: sticky;
    top: var(--spacing4);
    z-index: 100;
}
table.opaga th,
table.opaga td
{
    border: 1px solid var(--colorGreyTableBorder);
    overflow: hidden;
    padding: var(--spacing1);
    vertical-align: top;
}
table.opaga th
{
    background-color: var(--colorGrey2);
    border-color: var(--colorGrey2);
    text-align: center;
    font-weight: 400;
}
table.opaga2 tr:nth-child(2n) td
{
    background-color: white;
}
table.opaga2 tr:nth-child(2n+1) td
{
    background-color: var(--colorGrey1);
}

table.opaga th.thin
{
    width: 5%;
}

table.dataTable thead th.center,
.center { text-align: center; }
.left { text-align: left; }
.right { text-align: right; }

table.dataTable thead > tr > th.sorting::before,
table.dataTable thead > tr > th.sorting::after
{
    opacity: .4;
    right: 0;
    padding: 0 3px;
}
table.dataTable thead > tr > th.sorting_asc::before,
table.dataTable thead > tr > th.sorting_desc::after,
table.dataTable thead > tr > th.sorting_asc::before,
table.dataTable thead > tr > th.sorting_desc::after 
{
    opacity: 1;
    color: white;
    line-height: 2em;
    background-color: var(--colorBoutonBackground);
    margin: 2px 0;
}

table.dataTable thead > tr > th.sorting_asc,
table.dataTable thead > tr > th.sorting_desc
{
    background-color: var(--colorGrey3);
    color: var(--colorGrey1);
} 

table.dataTable td.cell_user_name:hover,
table.dataTable td.cell_entite_id:hover,
table.dataTable td.cell_entite_name:hover
{
    cursor: cell;
    background-color: var(--colorBackgroundHover);
}
.dt-button.buttons-columnVisibility.active span
{
    color: var(--colorSucces);
}
.dt-button.buttons-columnVisibility:not(.active) span
{
    text-decoration: line-through;
    color: var(--colorGrey2);
}

table.opaga .liste-client li::before
{
    font-size: 0.7em;
    width: 1.7em;
    height: 1.7em;
    text-align: center;
    display: block;
    float: left;
    margin-left: -2em;
    background-color: var(--colorGrey3);
    color: white;
    border-radius: 50%;
}
table.opaga .liste-client li
{
    clear: both;
    margin-left: 1.5em;
    list-style: none;
}
table.opaga .liste-client li.sous-traitance::before { content: "S"; }
table.opaga .liste-client li.morale::before { content: "M"; }
table.opaga .liste-client li.physique::before { content: "P"; }

#opaga-log
{
    display: none;
    z-index: 999999;
    position: fixed;
    bottom: 0;
    height: 100vh;
    width: 90%;
    left: 5%;
    background-color: var(--colorGrey1);
    border: var(--border);
    padding: var(--spacing1);
    overflow: auto;
    counter-reset: line;
}
#opaga-log code
{
    counter-increment: line;
    display: block;
    color: var(--colorText);
    font-weight: bold;
}
#opaga-log code pre
{
    color: var(--colorText);
    padding-left: 1em;
    font-weight: 400;
}
#opaga-log code.session { color: #600; padding-left: 5em; }
#opaga-log code.client { color: #060; padding-left: 6em; }
#opaga-log code.stagiaire { color: #006; padding-left: 7em; }
#opaga-log code::before
{
    content: counter(line);
    width: 4em;
    float: left;
    position: absolute;
    left: 0;
    text-align: right;
    color: #666;
}
#opaga-message
{
    display: none;
    z-index: 999999;
    position: fixed;
    bottom: 0;
    min-height: 5em;
    width: 90%;
    left: 5%;
    background-color: var(--colorBackground);
    border: solid 1px var(--colorSucces);
    border-radius: var(--boutonRadius) var(--boutonRadius) 0 0;
    text-align: center;
    padding: 3px 3em 1em;
}

#opaga-message .erreur
{
    border-left: 4px solid red;
    border-right: 4px solid red;
    padding: 0 5px;
    color: black;
}

#opaga-message .succes
{
    border-left: 4px solid green;
    border-right: 4px solid green;
    padding: 0 5px;
    color: black;
}

#notifications .close,
#opaga-log .close,
#opaga-message .close
{
    float: right;
    font-size: var(--fontSizeBig);
    display: block;
    position: absolute;
    right: var(--spacing4);
    color: var(--colorImportant);
    cursor: pointer;
}
#notifications .close { right: 0px; font-size: var(--fontSizeMedium); }
#opaga-log .close
{
    position: fixed;
    top: var(--spacing2);
    right: 6%;
}
p.message {
    margin: 0;
}
.info-message
{
    font-size: var(--fontSizeSmall);
    color: var(--colorGrey3);
    line-height: var(--fontSizeNormal);
}
.flexrow
{
    display: flex;
    flex-flow: row wrap;
    align-items: flex-end;
}
.flexrow.center,
.docrow .flexrow.center
{
    justify-content: space-evenly;
}
.flexrow.nowrap
{
    flex-wrap: nowrap;
}
.flexrow.flextop {
    align-items: flex-start;
    justify-content: space-between;
}
.flexrow.margin > *
{
    margin-right: var(--spacing4);
}
.flexrow.margin > *:last-child
{
    margin-right: 0;
}
.flexrow.auto-width > *
{
    flex: 1 1 auto;
}
.flexrow.auto-width.margin > *
{
    flex: 1 1 calc(50% - var(--spacing4));
}
.flexrow.auto-width3.margin > *
{
    flex: 1 1 calc(33.33% - (2 * var(--spacing4)));
}
.flexrow.auto-width3.margin > * > input
{
    width: 100%;
}
.flexcol
{
    display: flex;
    flex-flow: column wrap;
}

div.keywords
{
    max-width: var(--width1);
    height: auto;
    overflow: auto;
}
div.height-max-700 { max-height: 700px; }
div.height-max-300 { max-height: var(--width1); }

.label-fixe label:not(.top)
{
    width: 6em;
    text-align: right;
}
label.autre span
{
    margin-left: 2em;
}
label.top
{
    display: block;
    font-weight: bold;
}

.openButton
{
    background-color: var(--colorGrey1);
    border: var(--border);
    padding: var(--spacing1) var(--spacing3);
    border-radius:  var(--boutonRadius);
    display: inline-block;
}
.openButton:hover
{
    background-color: var(--colorBoutonBackground);
    color: var(--colorBoutonText);
    border: var(--borderHover);
}

.highlightButton { 
    background-color: var(--colorBoutonBackground); 
    color: var(--colorBoutonText);
}

/* patch thème Generic */
.entry-content ul, .widget-container ul, .comment-body ul, .entry-content ol, .widget-container ol, .comment-body ol
{
    text-indent: 0;
}

.white-board p,
.opaga p
{
    margin: var(--spacing1) 0;
}

.faux-bouton
{
    padding: var(--spacing1) var(--spacing3);
    margin: var(--spacing1);
    border-radius: var(--boutonRadius);
    white-space: nowrap;
    display: inline-block;
}

.float.left
{
    float: left;
    display: block;
}

.float.right
{
    float: right;
    display: block;
    margin-left: auto;
}

fieldset
{
    padding: var(--spacing1) var(--spacing3);
}

legend
{
    font-size: var(--fontSizeMedium);
    margin-top: var(--spacing2);
    margin-bottom: var(--spacing3);
}

p.infos_doc,
.page #content p.infos_doc
{
    font-size: var(--fontSizeSmall);
}
.docrow .flexrow
{
    justify-content: space-between;
}
.docrow .flexrow .doc-dwnld {
    font-weight: bold;
}
.docrow.empty
{
    opacity: 40%;
}
body.gestion financement-block.docrow.soustraitance
{
    background-color: var(--colorGrey1);
}

div#calendrier ul
{
    list-style: none;
}
div#calendrier li
{
    border-bottom: var(--border);
    margin-bottom: var(--spacing3);
    padding-bottom: var(--spacing2);
}

div#calendrier .formation
{
    display: block;
}

.opaga-board-link
{
    font-size: var(--fontSizeMedium);
    display: block;
    float: right;
}

/* Profil utilisateur */
img.photo-profil,
.presentation-formateur img#photo
{
    max-width: var(--width1);
    height: auto;
}

.posts-wrapper article.formation-detail,
.posts-wrapper article.session-detail
{
    padding: var(--spacing2);
    margin: var(--spacing1);
}
.formation-detail.prive h2::before,
.session-detail.prive h2::before,
.formation-detail.prive h3::before,
.session-detail.prive h3::before,
.formation-detail.prive h4::before,
.session-detail.prive h4::before
{
    content: "[privé]";
    float: left;
    padding-right: 0.5em;
}

/* On cache le header UM on a tout mis dans presentation-formateur */
.um-header, .um-profile-navbar {
    display: none;
}
body.um-page-user h1:not(.formateur-nom) {
    display: none;
}
.presentation-formateur {
    display: flex;
    flex-wrap: wrap;
    gap: 48px;
}
.presentation-formateur > .meta-formateur {
    flex: 1;
    min-width: var(--width1);
    display: flex;
    align-items: flex-start;
    gap: 0 24px;
    flex-wrap: wrap;
    align-content: flex-start;
}
.presentation-formateur > .content-formateur {
    flex: 3;
    min-width: var(--width2);
}
.presentation-formateur > .meta-formateur .meta-infos > * {
    margin: 0 0 24px 0 !important;
}

.content-formateur .logo_marque
{
    float: right;
    max-width: 40%;
}

/* Bulles d'aide */
.icone-aide
{
    cursor: pointer;
}

.aide_show ul
{
    list-style: disc inside;
}
.dialog form.help_dialog
{
    min-width: 20vw;
    max-width: 40vw;
}
form.help_dialog .aide_edit
{
    display: none;
}
.aide-dialog-button
{
    float: right;
}
    
span.numsep { width: 0.3em; display: inline-block; }

/* Session de formation */
/* bandeau d'onglets */
div#bandeau-onglets-session
{
    display: flex;
}
div#bandeau-onglets-session li
{
    flex-direction: row;
    font-size: 2em;
    padding: var(--spacing1) var(--spacing4) var(--spacing3) var(--spacing4);
}

div.action-flex
{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-flow: row wrap;
    font-size: 1.2em;
}
div.action-grid
{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(100px, auto);
    margin-left: auto;   
    margin-right: auto;   
}
div.action-board
{
    max-width: 300px;
    background-color: var(--colorGrey1);
    text-align: center;
}
div.action-board > *
{
    padding: var(--spacing3);
}
div.action-board h3
{
    background-color: var(--colorBoutonBackground);
    color: var(--colorBoutonText);
    padding: var(--spacing1);
    margin: 0px;
}
div.action-board .legend
{
    padding: 0px;
    margin: 0px;
    font-size: 0.8em;
}
div.action-board.important
{
    border: 2px solid var(--colorImportant);
}
div.action-board.important h3
{
    background-color: var(--colorImportant);
}

div[role="info"] p {
    margin-bottom: 0.6em;
}

div.board-stagiaire
{
    margin-top: 0;
}

div.infos-session h3,
div.board-session h3,
div.tab-session h3,
div.board-stagiaire h3
{
    margin: 0 0 var(--spacing2) 0;
    font-size: var(--fontSizeMedium);
}

div.action-resp
{
    border: solid 1px var(--colorImportant);
    border-radius: var(--boutonRadius);
    padding: 0 var(--spacing3) var(--spacing1) var(--spacing3);
    margin-bottom: var(--spacing2);
}

/* Édition en live de champs input, select, textarea */

.input_jpost
{
    margin-top: var(--spacing1);
    margin-bottom: var(--spacing1);
}

.input_jpost h3
{
    font-size: var(--fontSizeMedium);
    margin: var(--spacing3) 0 var(--spacing2) 0;
}

.input_jpost label.top
{
    display: block;
}

.input_jpost.checkbox,
.input_jpost.time,
.input_jpost.number
{
    display: flex;
    flex-wrap: wrap;
}

.right .input_jpost.checkbox,
.right .input_jpost.time,
.right .input_jpost.number
{
    justify-content: flex-end;
}
.input_jpost.checkbox label.top,
.input_jpost.time label.top,
.input_jpost.number label.top
{
    display: inline-block;
    flex-grow: 1;
}

.input_jpost label .icone-aide
{
    padding-top: 0;
    padding-bottom: 0;
}

.input_jpost input,
.input_jpost select,
.input_jpost .select-multiple,
.input_jpost textarea,
.input_jpost .wp-editor-wrap,
.table-bouton,
.edit-data .input_jpost .valeur
{
    display: none;
}

.edit-data h1 .input_jpost input
{
    font-size: 1em;
}
.edit-data h1 .input_jpost label
{
    font-size: initial;
    font-weight: initial;
}

.edit-data .input_jpost input
{
    display: inline;
}
.edit-data .input_jpost input[type=text],
.edit-data .input_jpost select,
.edit-data .input_jpost .select-multiple
{
    display: inline;
    width: 100%;
}
.edit-data .input_jpost input[type=number]
{
    width: 80px;
}

.edit-data .table-bouton,
.edit-data .input_jpost textarea,
.edit-data .input_jpost .wp-editor-wrap
{
    display: block;
}

.dialog input:not([type="checkbox"]):not([type="radio"]):not([type="button"]),
.dialog textarea,
.dialog select,
.input_jpost input:not([type="checkbox"]):not([type="radio"]):not([type="button"]),
.input_jpost textarea,
.input_jpost select
{
    font-size: var(--fontSizeNormal);
    background-color: var(--colorGrey1);
    appearance: none;
    line-height: 1em;
    border: none;
    padding: var(--spacing1);
}
.odd .input_jpost input:not([type="checkbox"]):not([type="radio"]):not([type="button"]),
.odd .input_jpost textarea,
.odd .input_jpost select
{
    background-color: var(--colorBackground);
}
.flexrow > div.input_jpost input.have-before,
.input_jpost input.have-before,
.edit-data .input_jpost input.have-before,
.flexrow > div.input_jpost input.have-after,
.input_jpost input.have-after,
.edit-data .input_jpost input.have-after {
    width: calc(100% - var(--spacing5));
}
.input_jpost span.is-before,
.input_jpost span.is-after {
    width: var(--spacing5);
/*    padding-left: var(--spacing1);*/
}
.input_jpost span.is-before .icone-bouton,
.input_jpost span.is-after .icone-bouton {
    padding: var(--spacingMini) var(--spacing1);
}
.dialog .input_jpost input,
.dialog .input_jpost textarea,
.dialog .input_jpost select
{
    font-size: var(--fontSizeNormal);
}
.input_jpost textarea
{
    width: 100%;
}
#formation .input_jpost.titre span.valeur,
#formation .input_jpost.titre input.input_jpost_value
{
    font-size: var(--fontSizeBig);
}

.editable .input_jpost
{
    cursor: pointer;
}

.edit-data .egalise .input_jpost label,
.edit-data .egalise .input_jpost input[type='text'],
.egalise .input_jpost label,
.egalise .input_jpost input[type='text'],
.egalise .input_jpost textarea
{
    display: inline-block;
    width: 50%;
    box-sizing: border-box;
}
.egalise .input_jpost
{
    display: flex;
}

/*
 * relookage des select
 */
.input_jpost:not(.select-multiple) select
{
    height: auto;
    border: 0; 
    margin: 0;
/*    padding: var(--spacing1) var(--spacing1) var(--spacing1) var(--spacing4);*/
    border-radius: 0;
    text-overflow: ellipsis;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
/* nouvelle flèche */
.input_jpost:not(.select-multiple) select
{
    background-repeat: no-repeat;
    background-position: right;
    background-size: 18px;
    padding-right: 20px !important;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCI+PHBhdGggZmlsbD0iIzYyNjI2MiIgZD0iTTE1IDhsLTQgNi00LTZoOHoiLz48L3N2Zz4=);
}
/*
.edit-data .input_jpost div.select::after 
{ 
    content: '';
    position: absolute;
    margin-top: -0.8em;
    margin-left: var(--spacing1);
    display: block; 
    width: 0; height: 0;
    border-color: transparent;
    border-top-color: #444; 
    border-width: 6px;
    border-style: solid;
    pointer-events: none;
}*/
/* pas de flèche pour les select multiple */
/*
.edit-data .input_jpost div.select-multiple::after 
{
    display: none;
}
*/

/* icônes attachées à input_jpost */
.input_jpost .valid
{
    display: none;
    color: var(--colorSucces);
}
.input_jpost .valid.visible
{
    display: inline-block;
}


/* Quiz */
.questionnaire .main-title { font-size: var(--fontSizeMedium); margin-bottom: 20px; }
.questionnaire .main-title input { font-size: var(--fontSizeMedium); flex-grow: 2; }
.questionnaire .header {  border-bottom: 1px solid lightgray; }
.questionnaire #params,
.grid-4-col
{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    padding-bottom: 20px; 
}
.questionnaire .add_question_manager
{
    background-color: var(--colorGrey3);
    width: 150px;
    position: sticky;
    top: 30px;
}
.questionnaire .body
{
    background-color: lightgrey;
    align-items: start;
}
ul.questionnaire-sortable { flex-grow: 2; }
.questionnaire .add_question_manager span.bouton
{
    display: block;
    width: 100%;
    border: none;
    color: white;
    padding: 10px 5px;
}
.questionnaire .add_question_manager span.bouton:hover
{
    border-radius: 0px;
    background-color: var(--colorHover);
    color: var(--colorGrey3);
}
.questionnaire .questionnaire-enregistrer
{
    border-color: var(--bgcolor);
    color: var(--colorGrey1);
    padding: 15px;
    margin: auto;
    width: 100%;
    text-align: center;
    font-weight: bold;
    border-radius: 0px;
    background-color: var(--bgcolor);
    margin-top: 30px;
}
.questionnaire .questionnaire-enregistrer:hover { color: var(--colorGrey3); }

.questionnaire-sortable table.icons
{
    border: none;
    display: table;
    table-layout: fixed;
    width: auto;
    margin: 0px;
    margin-left: auto;
}
.questionnaire-sortable table.icons td { min-width: 2em; }

.questionnaire-sortable li,
.quiz-sortable li
{
    cursor: pointer;
    margin: var(--spacing3);
    border-radius: 10px;
    padding: 10px;
    background-color: white;
}
.questionnaire-sortable li.noquestion { background-color: var(--colorGrey2); }
.questionnaire-sortable input[type='text'],
.quiz-sortable input[type='text']
{
    margin-top: 0px;
    width: 70%;
    background-color: var(--colorBackground);
}
.questionnaire-sortable .options { margin: 10px 3em 0; }
.questionnaire-sortable .options input[type='text'] { width: auto; }
.questionnaire-sortable .options .choices input { width: 90%; }
.questionnaire-sortable .options .choices .choice
{
    display: flex;
    justify-content: space-between;
    min-width: 600px;
    margin-bottom: 10px;
};

.questionnaire-sortable div.questionnaire-line-type,
.quiz-sortable div.quiz-line-type
{
    padding: 0 var(--spacing1);
    font-size: 0.9em;
    float: left;
}
li.title div.questionnaire-line-type
{
    font-weight: bold;
    background-color: #DDA;
}
li.desc div.questionnaire-line-type
{
    background-color: #EEC;
}

.question-alerte
{
    border: var(--colorAlert) 1px solid;
    padding:var(--spacing2);
    border-radius: 5px;
    margin-top: 10px;
    background-color: white;
}


/* Questionnaire affiché pour réponse */
.questionnaire .copy-clipboard
{
    background-color: var(--colorBoutonBackground);
    color: var(--colorGrey1);
    font-size: 1.2em;
    padding: 10px;
}
.form .question
{
    padding: 10px;
    background-color: white;
    margin-bottom: 10px;
}
.form .question .title
{
    font-size: 1.2em;
}
.form .question.title
{
    padding: 10px;
    margin-top: 20px;
    font-size: 1.6em;
    background-color: var(--colorGrey3);
    color: var(--colorGrey1);
}
.form .question.subtitle
{
    margin-top: 20px;
    text-align: center;
    font-size: 1.3em;
    color: var(--colorGrey3);
    border-bottom: var(--colorBoutonBackground) 1px solid;
    background: none;
}
.form .question.desc
{
    background-color: var(--colorGrey1);
    font-size: 0.8em;
    margin: auto;
    max-width: 600px;
}
.form .question .legend
{
    margin-bottom: 15px;
    overflow: hidden;
}
.form .question .legend > *
{
    max-width: 40%;
}
.form .question .reponse-slider
{
    width: 95%;
    margin: auto;
    background: linear-gradient(to right,#E88, #8E8)
}
.reponse-slider .handle { cursor: pointer; }
.form .question.text input,
.form .question.textarea textarea
{
    width: 100%;
}
.questionnaire .form .reponse-submit
{
    width: calc(100% - 6em);
    display: block;
    margin: 3em;
    font-size: 1.4em;
}
.questionnaire-footer
{
    border-top: 1px solid var(--colorGrey3);
}
.compil-reponses .question.title
{
    font-weight: bold;
}
.compil-reponses .reponse.title
{
    padding-left: 3em;
    font-style: italic;
}


.radio-disable input[type='radio']
{
    pointer-events: none;
}

/* Boutons */
.button, button, input[type="submit"]
{
    font-family: inherit;
}


/* jQueryUI dialog */
.ui-widget-overlay
{
    opacity: 0.9;
}

.dialog form
{
    min-width: 50vw;
    max-width: 90vw;
}
.dialog form #id,
.dialog form #identifiant
{
    display: none;
}
.dialog .input_jpost label.top
{
    display: block;
}
.dialog form label
{
    font-size: var(--fontSizeNormal);
    font-weight: normal;
    vertical-align: middle;
}
.dialog form input[type="radio"],
.dialog form input[type="checkbox"]
{
    margin-right: var(--spacing2);
}
.dialog-remove
{
    min-width: 40vw;
    min-height: 40vh;
}

.dialog-grid,
.session-infos .grid-forms,
.grid-6col,
.infos-client .infos-generales > *:not(table),
.info-generale-stagiaire,
.contact-block > .contact_field:not(.hidden),
.white-board > .attentes {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-gap: var(--spacing2);
    margin-top: var(--spacing2);
}
.grid-forms .input_jpost input[type="number"]:not(.have-after):not(.have-before),
.grid-forms .input_jpost input[type="datepicker"]:not(.have-after):not(.have-before),
.grid-forms input[type="text"],
.dialog-grid .input_jpost input[type="number"]:not(.have-after):not(.have-before),
.dialog-grid .input_jpost input[type="datepicker"]:not(.have-after):not(.have-before),
.infos-client .white-board > *:not(table) .input_jpost input[type="number"]:not(.have-after):not(.have-before),
.infos-client .white-board > *:not(table) .input_jpost input[type="datepicker"]:not(.have-after):not(.have-before) {
    width: 100%;
}
.white-board .grid-full,
.dialog-grid .grid-full {
    grid-column: 1 / 7;
}
.white-board .grid-5,
.dialog-grid .grid-5 {
    grid-column-end: span 5;
}
.white-board .grid-4,
.dialog-grid .grid-4 {
    grid-column-end: span 4;
}
.white-board .grid-3,
.dialog-grid .grid-3 {
    grid-column-end: span 3;
}
.white-board .grid-2,
.dialog-grid .grid-2 {
    grid-column-end: span 2;
}
.white-board .grid-1,
.dialog-grid .grid-1 {
    grid-column-end: span 1;
}
.grid-full.dialog-grid
{
    grid-gap: 0 var(--spacing2);
}
.infos-client .infos-generale > *:not(:first-child) {
    border-top: var(--border);
    padding-top: var(--spacing4);
}
.info-generale-stagiaire > * h2,
.infos-client .white-board > * h2 {
    grid-column: 1 / 7;
    margin-bottom: 0;
}
.contact-block > * {
    grid-column-end: span 6;
}
.contact-block > .contact_field > div {
    grid-column-end: span 2;
}
.resp-block > * {
    grid-column-end: span 3;
}
.financement-block .financement.opac {
    grid-column: 1 / 7;
}
.financement-block .confirme.checkbox {
    display: block;
}
.attentes .attentes {
    grid-column: 1 / 7;
}
.radio-disable > h2 {
    padding-top: var(--spacing4);
    margin-top: var(--spacing5);
    margin-bottom: var(--spacing4);
    border-top: var(--border);
}
.financement-block .input_jpost.number {
    display: block;
}
.info-generale-stagiaire > * {
    grid-column-end: span 3;
}

.infos-client p
{
    margin-top: 0;
}
.client_nom
{
    font-weight: bold;
}

.board-formateur .old-sessions > p,
.board-formateur .old-sessions h2 {
    margin-bottom: 0;
}

.board-formateur .old-sessions #sessions-passees {
    margin-top: var(--spacing4);
}

/* fieldset */
fieldset.metadata div
{
    margin: var(--spacing3) 0;
}
fieldset h2
{
    margin: var(--spacing3) 0 var(--spacing3);
    font-size: var(--fontSizeMedium);
}
fieldset table
{
    padding: var(--spacing4) 0;
}
table.gestion-docs-admin th
{
    border-bottom: var(--border);
    border-top: var(--border);
    padding: var(--spacing3) var(--spacing1);
    background-color: var(--colorGrey2);
}
table.gestion-docs-admin td
{
    vertical-align: top;
    border-bottom: var(--border);
    padding: 0 var(--spacing1);
}
table.gestion-docs-admin td:last-child
{
    width: 120px;
}
table.gestion-docs-admin .doc_nom
{
    margin: 0;
}
table.gestion-docs-admin .doc_nom
{
    font-size: var(--fontSizeNormal);
    font-weight: bold;
}

.big .fa
{
    font-size: var(--fontSizeMedium);
}
table.gestion-docs-admin .fa:hover
{
    color: var(--colorHover);
}
table.gestion-docs-admin .doc-bouton .fa:hover,
table.gestion-docs-admin .icone-bouton .fa:hover
{
    color: var(--colorHover2);
}
table.gestion-docs-admin .disabled,
table.gestion-docs-admin .disabled:hover
{
    color: var(--colorGrey1);
}

/*
 * Custom keyworkds, ckw, mots-clés
 */
div.ckw_bloc
{
    margin-bottom: var(--spacing4);
}
p.ckw_desc
{
    background-color: var(--colorGrey1);
    font-size: 1.2em;
    padding: var(--spacing1) var(--spacing3);
    margin-bottom: var(--spacing2);
}
p.ckw_desc .icone-bouton
{
    float: right;
    background-color: var(--colorBoutonBackground);
    color: var(--colorBoutonText);
}

table.add-compte td
{
    vertical-align: top;
}

td.td-intertitre
{
    padding: var(--spacing1);
    background: #DD4;
}

button
{
    font-family: sans;
    font-size: 0.8em;
}
button,
.bouton,
.gestion-docs-admin .doc-bouton
{
    cursor: pointer;
    padding: var(--spacing1) var(--spacing2);
    border: var(--border);
    border-radius: var(--boutonRadius);
    width: auto;
    display: inline-block;
    line-height: 1.15em;
}
.gestion-docs-admin.datatable .doc-bouton
{
    padding: var(--spacing1);
}
.bouton
{
    border-color: #4A4;
    color: #4A4;
}
.submit.enregistrement-requis
{
    background-color: #FAA;
    border: 3px solid #A44;
    color: var(--colorText);
    text-align: center;
    z-index: 50;
}
#add_compte .submit.enregistrement-requis
{
    position: relative;
    bottom: 0;
}
.bouton.enregistrement-requis:hover
{
    background-color: #A44;
    color: var(--colorHover2);
}
.bouton:hover,
.gestion-docs-admin .doc-bouton:hover
{
    background-color: var(--colorHover);
    color: var(--colorHover2);
}

.boutons {
    margin-top: var(--spacing3);
}
.boutons > div:not(last-child) {
    margin-right: var(--spacing2);
}

input, textarea
{
    padding: var(--spacing1);
    margin-top: 0;
    line-height: 1em;
}
textarea,
label
{
    vertical-align: top;
    display: inline-block;
}
input[type='number']
{
    width: 6em;
}
.gestion-docs-admin .attention,
.gestion-docs-admin .attention:hover
{
    background-color: var(--colorImportant);
    color: var(--colorHover2);
}

tr td span.attention,
.gestion-docs-admin .en-cours
{
    background-color: #FF3;
}
.gestion-docs-admin .en-cours:hover
{
    text-decoration: line-through;
}
span.alerte
{
    font-weight: bold;
}

div.liste-creneau
{
    display: flex;
    border-top: var(--border);
    align-items: last baseline;
    justify-content: flex-start;
    padding-bottom: var(--spacing1);
}
div.liste-creneau .date,
div.liste-creneau input
{
    width: 90px;
}
div.liste-creneau .creneau
{
    border: var(--border);
    border-radius: var(--boutonRadius);
    padding: var(--spacing1);
    margin: 0 var(--spacing1);
    /*cursor: pointer;*/
    width: auto;
    white-space: nowrap;
}
div.creneau-times
{
    display: flex;
}
div.creneau.activable { cursor: pointer; }
div.creneau .select-icon { opacity: 0; }
div.creneau.actif .select-icon { opacity: 1; }
div.creneau .fa
{
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    min-width: var(--spacing4);
    margin: 0;
}

div.liste-creneau span.creneau-date
{
    font-weight: bold;
}
div.liste-creneau .boutons-date {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    flex: fit-content;
}
div.liste-creneau .boutons-date > * {
    flex: initial;
    margin: 0 var(--spacing1);
    padding: var(--spacing1);
}
#tab-dates .faux-bouton
{
    padding: var(--spacingMini) var(--spacing1);
    margin: var(--spacingMini);
    font-size: var(--fontSizeSmall);
}
div.liste-creneau .creneau-day {
    min-width: 70px;
}
div.liste-creneau div.details
{
    position: absolute;
    float: left;
    display: none;
    flex-direction: column;
    background-color: var(--colorBackground);
    padding: var(--spacing3);
    text-align: right;
    border: var(--spacing1) solid;
    z-index: 500;
}
div.liste-creneau div.details label
{
    flex-direction: column;
}
.creneau.presentiel { background-color: #DAFB3F; }
.creneau.presentiel.actif { background-color: #85A000; color: var(--colorHover2); }
.creneau.foad_sync { background-color: #5CCDC9; }
.creneau.foad_sync.actif { background-color: #006561; color: var(--colorHover2); }
.creneau.foad_async { background-color: #A7ADE6; }
.creneau.foad_async.actif { background-color: #222B85; color: var(--colorHover2); }
.creneau.afest { background-color: #E89FDA; }
.creneau.afest.actif { background-color: #881D73; color: var(--colorHover2); }
.creneau.recherche { background-color: #9cc0ff; }
.creneau.recherche.actif { background-color: #0054c5; color: var(--colorHover2); }
.creneau.technique { background-color: #FFCDAF; }
.creneau.technique.actif { background-color: #A65424; color: var(--colorHover2); }

p.week_day
{
    text-align: center;
    font-size: var(--fontSizeSmall);
    margin: 0;
}
span.week_day
{
    padding: var(--spacingMini) var(--spacing2);
}
span.week_day.samedi,
span.week_day.dimanche
{
    background-color: var(--colorAlert);
    color: white;
    font-weight: bold;
}

.creneau_legende
{
    font-size: 0.9em;
    font-style: italic;
}
.creneau_legende .intitule
{
    font-weight: bold;
}

.valider_decale_date
{
    display: none;
}
.ui-datepicker {
    z-index: 1000 !important;
}
/*
.bouton.add-creneau::before,
.bouton.copy-date::before,
.bouton.add-date::before
{
    font-family: dashicons;
    font-size: 1.4em;
}
.bouton.add-creneau,
.bouton.copy-date,
.bouton.add-date
{
    font-family: inherit;
    padding: var(--spacing2);
    margin: var(--spacing2);
    font-size: 1.1em;
}
*/
.eval td.coche
{
    width: 7%;
}

form#pilote_formation
{
    border: var(--spacing1) #777 solid;
    padding: var(--spacing3) var(--spacing4);
}


/* Sous-traitance */
table#liste-stagiaires
{
    width: auto;
}
table#liste-stagiaires td
{
    padding: var(--spacing1) var(--spacing3);
    text-align: center;
}

/* Patch, en attendant une vraie page utilisateur, indépendante d'Ultimate Member */
.um-header.no-cover .um-profile-photo,
.um-profile-photo,
.um-header.no-cover .um-profile-edit,
.um-profile-edit
{
    display: none;
}

.um-field-radio.um-field-half
{
    width: 20%;
    margin-right: 3em;
}
.um-field-radio .right
{
    float: left !important;
    text-align: left;
}

.msg-validation
{
    border: 1px solid var(--colorImportant);
    border-radius: var(--boutonRadius);
    background-color: var(--colorGrey1);
    padding: var(--spacing3);
}

span.copy-clipboard
{
    cursor: pointer;
    display: inline-block;
    min-width: 6em;
    border-radius: 5px;
    border: dashed 1px var(--colorGrey2);
    padding: 1px 3px;
}
.icone-bouton span.copy-clipboard
{
    border: none;
    border-radius: 0px;
    padding: 0px;
}
span.copy-clipboard .notice
{
    display: inline-block;
    margin-right: 3px;
}
span.copy-clipboard .notice .info
{
    display: none;
}
.icone-bouton span.copy-clipboard .notice .info,
span.copy-clipboard:hover .notice .info
{
    display: inline-block;
}

div.fullscreen
{
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    background-color: white;
    z-index: 999999;
}
div.fullscreen img.qrcode
{
    max-width: 100vw;
    max-height: 100vh;
    width: 100%;
    object-fit: contain;
    image-rendering: pixelated;
}


/* Bouton « Coller en texte » du wp_editor : rouge lorsqu'il est actif */
div.mce-active i.mce-i-pastetext::before
{
    color: var(--colorImportant);
}

.wp-editor-wrap 
{
    margin-bottom: var(--spacing2);
}

.wp-editor-wrap #add-h5p
{
    display: none;
}

/* Page pilote */
body.pilote #content
{
    width: 100%;
    padding: 0;
    float: none;
    position: relative;
}
body.pilote #container,
body.pilote .entry-header,
body.pilote .entry-content,
body.pilote .entry-summary,
body.pilote .entry-footer
{
    margin: 0;
    max-width: 100%;
    width: 100%;
}
body.pilote article.page 
{
    z-index: 10;
    position: relative;
}
body.pilote #sidebar
{
    display: none;
}

body.pilote #tmp
{
    width: 96%;
    margin: 0 2%;
    top: 0;
    position: absolute;
    z-index: 11;
}

#top-bloc-pilote
{
    height: 80px;
    background-color: var(--colorBackground);
    margin: 0;
    padding: 0;
    position: sticky;
    -webkit-position: sticky;
    top: 0;
    display: flex;
    font-size: var(--fontSizeNormal);
    font-family: sans;
}
#top-bloc-pilote *
{
    display: table;
    margin: var(--spacing1) var(--spacing3) var(--spacing1) 0;
}
#top-bloc-pilote div.filtre
{
    border: var(--border);
    padding: var(--spacing1);
}
#top-bloc-pilote div.filtre span
{
    display: inline;
    font-size: 0.8em;
}

table.pilote
{
    margin-top: 0;
}
table.pilote th,
table.pilote td
{
    border: var(--border);
    font-size: var(--fontSizeNormal);
    line-height: 14px;
    font-family: sans-serif;
    word-break: normal;
    color: var(--colorText);
    min-width: 4%;
}
table.pilote p
{
    font-size: var(--fontSizeNormal);
    line-height: 14px;
    margin: 0;
}
table.pilote span
{
    font-weight: normal;
}
table.pilote input,
table.pilote select,
table.pilote textarea
{
    font-size: 0.9em;
    width: 100%; 
}
table.pilote > tbody > tr
{
    background-color: var(--colorBackground);
    padding: var(--spacing1);
    border: var(--border);
}
table.pilote tr.opac
{
    background-color: var(--colorGrey1);
}
table.pilote > thead
{
    background-color: var(--colorGrey1);
    position: sticky;
    -webkit-position: sticky;
    top: 80px;
}
table.pilote > thead th
{
    padding: var(--spacing3) 0;
    font-weight: bold;
}

table.pilote tr.session
{
    background-color: var(--colorGrey1);
    padding: 0;
}
table.pilote tr.session > td > div
{
    display: flex;
    padding: var(--spacing3) 0;
}
table.pilote tr.session > td > div > div
{
    margin: var(--spacing1) var(--spacing2);
}
table.pilote tr.session > td > div > div > *
{
    display: inline;
}
table.pilote tr.session span.legende
{
    color: #888;
    font-style: italic;
    display: block;
}

tr.pilote-tableau-stagiaires
{
    display: none;
}
table.pilote_stagiaires
{
    margin: 0;
}

table.pilote_stagiaires td,
table.pilote_stagiaires th
{
    font-size: 1em;
}

div#pilote_dialog,
div.verif_dialog,
pre.rapport_csv
{
    display: none;
}

table.sql tr:nth-child(2n)
{
    background-color: var(--colorGrey1);
}

/* Bilan pédagogique et financier */
#bpf p.value,
#bpf p.total,
#bpf p.sous_value
{
    display: flex;
    margin: var(--spacing3) 0;
}
#bpf p.sous_value
{
    border-bottom: var(--border);
}
#bpf .total
{
    font-weight: bold;
}
#bpf .erreur
{
    color: #F88;
    font-weight: normal;
}
#bpf p.total span.bpf_value
{
    margin-left: auto;
    width: 200px;
}
span.bpf_right
{
    margin-left: auto;
    margin-right: var(--spacing2);
}
span.bpf_value
{
    padding: var(--spacing1) var(--spacing3);
    width: 150px;
    display: inline-block;
    text-align: right;
    height: max-content;
}
div.bpf_group
{
    border-top: var(--border);
    border-bottom: var(--border);
    border-color: #000;
    padding: var(--spacing1) var(--spacing2);
    margin: var(--spacing5) 0;
}
#bpf div.bpf_group p.value
{
    margin: var(--spacing2) 0;
}
#bpf div.bpf_group p.sous_value
{
    margin: var(--spacing2) var(--spacing3);
}
div.bpf_ctl
{
    background-color: #EFD;
    border-radius: var(--boutonRadius);
    padding: 0 var(--spacing3);
    font-size: 0.9em;
}
div.bpf_ctl p
{
    margin: 0;
}
#bpf table td
{
    border: var(--border);
    text-align: center;
    width: 15%;
}
#bpf table td:first-child
{
    text-align: left;
    width: auto;
}
.single-formation.edit-formation h1.entry-title,
.page-membre h1.entry-title:not(.formateur-nom)
{
    display: none;
}
.flexrow > .side-formation
{
    flex-basis: 40%;
}
.flexrow > .desc-formation
{
    flex-basis: 60%;
}
.flexrow > .side-formation.white-board .input_jpost
{
    margin-bottom: var(--spacing2);
}
table.opaga.tarif h3
{
    display: inline;
    font-size: var(--fontSizeNormal);
    font-weight: normal;
}

.ui-widget-content.white-board, 
.ui-tabs .ui-tabs-panel:not(.have-white-boards),
.white-board {
    background-color: var(--colorBackground);
    margin: var(--spacing3) 0;
    padding: var(--spacing3) var(--spacing4);
    border-radius: calc(2 * var(--boutonRadius));
    box-shadow: var(--boxShadow);
}
.ui-tabs .ui-tabs-panel.have-white-boards {
    padding: 0;
}
.ui-tabs .ui-tabs-panel div.mce-panel,
.ui-tabs .ui-tabs-panel div.mce-edit-area {
    background-color: var(--colorBackground);
}

.ui-tabs .ui-tabs-panel .barre-enregistrer {
    position: fixed;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: var(--colorBackground);
    padding: var(--spacing3) var(--spacing4);
    z-index: 1000;
    margin: 0;
    box-shadow: var(--boxShadow);
}
.ui-tabs .ui-tabs-panel .barre-enregistrer .bouton {
    width: fit-content;
    float: right;
    margin-right: var(--spacing5);
}
.ui-tabs .ui-tabs-panel .html-active .switch-html, 
.ui-tabs .ui-tabs-panel .tmce-active .switch-tmce {
    background: transparent;
    border: none;
    color: var(--colorLink);
    margin-bottom: var(--spacing2);
}
.dialog-grid .input_jpost,
.white-board .input_jpost
{
    margin-top: 0;
    margin-bottom: 0;
}

.white-board .input_jpost select,
.white-board .input_jpost textarea,
.white-board .input_jpost input:not(.bouton),
.white-board input:not(.bouton),
.ui-tabs .ui-tabs-panel select,
.ui-tabs .ui-tabs-panel textarea,
.ui-tabs .ui-tabs-panel input:not(.bouton) {
    background-color: var(--colorGrey1);
    border: none;
    border-radius: var(--boutonRadius);
}
.dialog-grid select,
.dialog-grid textarea,
.dialog-grid input {
    width: 100%;
}
.dialog-grid .radio {
    display: flex;
    padding: var(--spacing1);
    gap: var(--spacing-xs);
    align-items: center;
}
.dialog-grid .radio input {
    width: auto;
}
.short-info {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
    display: block;
}
.twocols { columns: 2; }
.threecols { columns: 3; }
.twocols select,
.twocols textarea,
.twocols input:not([type='checkbox']):not([type='radio']),
.threecols select,
.threecols textarea,
.threecols input:not([type='checkbox']):not([type='radio'])
{
    width: 100%;
    margin: 4px 0;
}
.threecols > *
{
    break-inside: avoid;
}
/*
 * RESET Jquery UI
 */

/* Resets the contain background and outer borders */
.ui-widget { font-family: inherit; font-size: inherit; }
.ui-datepicker .ui-state-active {color: var(--colorHover);}

/* Resets all border radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-right,
.ui-corner-br,
.ui-corner-bl,
.ui-corner-tr,
.ui-corner-tl { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
 
/* Resets widget header tabs */
.ui-widget-header { border: none; background: none; font-weight: normal; color: var(--colorText); }
.ui-widget-header li { border: 0; padding: 0; margin: 0; }
.ui-tabs.ui-widget-content,
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active,
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover,
.ui-widget-header li a,
.ui-widget-header li a:link,
.ui-widget-header li a:visited,
.ui-widget-header li a,
.ui-widget-header li a:link,
.ui-widget-header li a:visited { border: none; background: none; font-weight: normal; margin: 0; padding: 0; }

.ui-dialog.ui-widget-content {
    border: none;
    border-radius: var(--boutonRadius);
    box-shadow: var(--boxShadow);
}

.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited, a.ui-button, a:link.ui-button, a:visited.ui-button, .ui-button,
.ui-widget-header a,
.ui-widget-content a {
    color: var(--colorLink);
}
.ui-state-default a:hover, a.ui-button:hover, .ui-widget-header a:hover, .ui-widget-content a:hover {
    color: var(--colorHover);
}
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {
    color: var(--colorText);
}

/* Resets the panel */
.ui-tabs-panel { padding: 0; }

.ui-tabs-vertical { display: flex; flex-direction: row; }
.ui-tabs-vertical .ui-tabs-nav { padding: 0; float: left; width: 12em; }
.ui-tabs-vertical .ui-tabs-nav li
{
    clear: left;
    float: right;
    width: 100%;
    border-bottom-width: 1px !important;
    border-right-width: 0 !important;
    margin: .3em -1px 0 0;
}
/*.ui-tabs-vertical .ui-tabs-nav li.tab-client */
.ui-tabs-vertical .ui-tabs-nav li.tab-stagiaire
{
    width: 90%;
    margin: 0 -1px 0 0;
}
.ui-tabs .ui-tabs-nav li.tab-stagiaire .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.tab-client .ui-tabs-anchor
{
    padding: .2em 0 .2em .4em;
    white-space: normal;
}

.ui-tabs-vertical .ui-tabs-nav li a { display:block; width: 100%; }
.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; }
.ui-tabs-vertical .ui-tabs-panel { padding: 1em; float: right; }
.ui-tabs-vertical > * { flex-grow: 1 5;}

.ui-widget-overlay {
    background-color: var(--colorGrey1);
}
.ui-dialog p
{
    margin-top: 20px;
    margin-bottom: 10px;
}
.ui-dialog button:disabled
{
    background-color: var(--colorGrey2);
    cursor: not-allowed;
}

/*
 * RESET select2 et UM
 */
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    line-height: 1em !important;
}

.select-multiple .select2.select2-container .select2-selection {
    background-color: var(--colorGrey1) !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered li.select2-search {
    margin-top: 0;
}
.select2-container {
    width: 100%;
}
.select2-dropdown--below
{
    top: 2em;
}

/* select2 personnalisation */
.opaga .select2-container--default .select2-selection--multiple .select2-selection__choice
{
    padding: 3px 3px 3px 1px;
    font-size: var(--fontSizeNormal);
    background-color: var(--colorBoutonBackground);
    color: var(--colorBoutonText);
}
.opaga .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
{
    color: var(--colorBoutonText);
    font-size: var(--fontSizeMedium);
}
.select2-search__field
{
    max-width: 250px;
}

 /* calendriers (via datepicker) */
.ui-datepicker td a
{
    text-align: center;
}
.ui-datepicker td a:hover,
.ui-datepicker td.ui-datepicker-current-day a
{
    font-weight: bold;
    background-color: var(--colorBackgroundHover);
    color: var(--colorHover2);
}
.ui-datepicker td.ui-datepicker-today
{
    border: 1px dashed var(--colorBackgroundHover);
}
.ui-datepicker td.ui-datepicker-week-end
{
    background-color: var(--colorGrey2);
}

/*.ui-widget-content a,*/
.icone-bouton a,
.icone-bouton:hover a
{
    color: var(--colorBoutonText);
}

.ui-button.ui-state-active,
.ui-button:active,
.ui-button.ui-state-active:hover
{
    padding: 10px;
    background-color: var(--colorBoutonBackground);
    margin-bottom: 5px;
    color: var(--colorHover2);
    border: 1px solid var(--colorGrey2);
}
.ui-slider .ui-slider-handle,
.ui-slider .ui-slider-handle.ui-state-active
{
    width: 3.5em;
    height: 2.1em;
    top: -.8em;
    margin-left: -1.5em;
    text-align: center;
    vertical-align: middle;
    line-height: 1.6em;
    background-color: var(--colorBoutonBackground);
    border: var(--colorGrey1) 1px solid;
    color: var(--colorGrey1);
    font-weight: bold;
    font-size: 1.15em;
}

.ui-checkboxradio-label
{
    width: 100%;
    padding: 10px;
    margin-bottom: 5px;
    border: 1px solid var(--colorGrey2);
    background-color: var(--colorGrey1);
    text-align: left;
    color: var(--colorText);
}
.ui-checkboxradio-label .ui-checkboxradio-icon
{
    margin: auto 1em;
}
.ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon,
.ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon
{
    width: 16px;
    height: 16px;
    border: solid 2px var(--colorGrey1);
    background-color: var(--colorGrey3);
}
.likert-choice
{
    display: flex;
    flex-wrap: none;
    flex-direction: row;
}
.likert-choice .ui-checkboxradio-label.ui-state-active,
.likert-choice .ui-checkboxradio-label
{
    text-align: center;
    font-size: 1.2em;
    font-weight: bold;
    padding: 10px 0;
}