/* ***************** *******************************************************************
* WordPress Theme  | LanteasOpenSoclePremiumThemeChild [Boutons UIX] - Lanteas.
* ***************** *******************************************************************
*/

.area-boxed  .btn-bottom-bar, 
.main_color div .area-boxed  .btn-bottom-bar,
.main_color div .iconbox_top .area-boxed.iconbox_content  .btn-bottom-bar,
.main_color.iconbox_top .iconbox_content  .btn-bottom-bar,
div>section.box-panel  .btn-bottom-bar,
.btn-bottom-bar {
	-webkit-box-pack: justify!important;
	-ms-flex-pack: justify!important;
	justify-content: space-between!important;
	display: -webkit-box!important;
	display: -ms-flexbox!important;
	display: flex!important;
    margin-top: 2rem;
}

/* Pas de marge gauche pour le premier bouton aligné sur la gauche */
.button:first-of-type { margin-left: 0; }
/* Pas de marge droite pour le premier bouton aligné sur la droite */
.button:last-of-type, .button:nth-last-of-type(n) { margin-right: 0; }


/* Remove tox CSS support because buttons are overrided by the theme style and change Wysiwyg aspect, so bypass by :not(.tox-tbtn); */
[role="main"].content input[type="button"], 
[role="main"].content input[type="submit"], 
[role="main"].content button:not(.tox-tbtn), 
[role="main"].content a.button,
[role="main"].content .avia-button {
    padding: 9px 22px;
    white-space: nowrap;
	overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-size: inherit;
    font-weight: normal;
    font-family: inherit;
    text-decoration: none;
    text-align: center;
    color: var( --main_color_bg2 );
    background-color: var( --main_color_primary );
    border-color: rgba( 80, 80, 80 , 0.3);
    border-radius: .25rem;
    border-width: 1px;
    border-style: solid;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}


[role="main"].content input[type="button"]:hover, 
[role="main"].content input[type="submit"]:hover, 
[role="main"].content button:not(.tox-tbtn):hover, 
[role="main"].content a.button:hover,
[role="main"].content .avia-button:hover {
    padding: 9px 22px;
    /*
    background-color: var( --main_color_secondary );
    color: var( --main_color_bg );
    border-color: rgba( 80, 80, 80 , 0.3);
    /**/
    font-size: inherit;
    font-weight: normal;
    text-decoration: none;
    white-space: nowrap;
    background-color: var( --main_color_bg );
    color: var( --main_color_primary );
    border-color: var( --main_color_secondary );/
}
#top [role="main"].content  .avia-button:hover span {
    color: var( --main_color_primary );
    background-color: transparent;
}

/* A declined button for special link/button actions - used with .btn class */
[role="main"].content input[type="button"].btn-action, [role="main"].content a.btn-action {
  padding: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-weight: normal;
  font-family: inherit;
  text-decoration: none;
  text-align: center;
  color: var( --main_color_primary );
  background-color: transparent;
  border: none;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

[role="main"].content input[type="button"].btn-action:hover,
[role="main"].content input[type="button"].btn-action:active,
[role="main"].content input[type="button"].btn-action:focus,
[role="main"].content a.btn-action:hover,
[role="main"].content a.btn-action:active,
[role="main"].content a.btn-action:focus{
  padding: 0;
  background-color: transparent;
  color: var( --main_color_secondary );
  font-weight: normal;
  text-decoration: none;
  white-space: nowrap;
}


/* Rend possible d'ajouter un icon sur les élémenty <button ..> */
[role="main"].content .fa.button:before { margin-right: 0.25rem; font: normal normal normal 14px/1 FontAwesome; }

/* Permet de faire des boutons sans text seulement avec l'icon contient la classe « fa-only-icon ») */
.fa.button.fa-only-icon, .fa.button.fa-only-icon:hover { padding-left: 9px; padding-right: 9px; }
.fa.button.fa-only-icon:before { margin-left: 0; margin-right: 0; }


/* Special Lien avec icon Fontawesome (contient la classe « fa » ) - Permet de préserver le style bouton (contient la classe « button » ) en ajoutant un picto sur la gauche */
[role="main"].content a.fa.button{
	text-transform: none;
    box-shadow: none;
    font-family: inherit;
    line-height: 1.5rem;
    color: var( --main_color_bg2 );
    background-color: var( --main_color_primary );
    border-color: rgba( 80, 80, 80 , 0.3);
}/*a.fa.button:before {content: "\f040";} /* Force pencil */
    

[role="main"].content a.fa.button:hover{ background-color: var( --main_color_secondary ); color: var( --main_color_bg ); border-color: rgba( 80, 80, 80 , 0.3); }
[role="main"].content a.fa.button img.emoji{display: none!important; }

[role="main"].content a.fa.button.link-action {
    background-color: transparent !important;
    color: var( --header_color_heading );
    border-color: transparent;
    padding: 9px 0px;
    line-height: 1rem;
}
[role="main"].content a.fa.button.link-action:before{ font-size: 1.33rem; }
[role="main"].content a.fa.button.link-action:hover{ color: var( --main_color_secondary ) !important; background-color: transparent !important; }

/* Custom pour les disabled (ontient la classe « disabled » ) ou véritable attribut disabled (disabled="disabled") */
[role="main"].content input[type="button"].disabled, [role="main"].content input[type="button"][disabled="disabled"],
[role="main"].content input[type="submit"].disabled, [role="main"].content input[type="submit"][disabled="disabled"], 
[role="main"].content button.disabled:not(.tox-tbtn), [role="main"].content button[disabled="disabled"], 
[role="main"].content a.button.disabled, [role="main"].content a[disabled="disabled"].button,
[role="main"].content .avia-button.disabled, [role="main"].content [disabled="disabled"].avia-button{
    background-color: var( --header_color_bg2 );
    color: var( --alternate_color_primary );
    border-color: var( --main_color_border );
    cursor: not-allowed;
}

#top .los-icon-button {
    background: none;
    border: none;
    color: var(--main_color_primary);
}