x-button
{
    cursor: pointer;
    color: #424242;
    fill: #424242;  
    user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    font-weight: 400;
    box-sizing: border-box;
    display: inline-block;
    position: relative;
    background: transparent;
    text-align: center;
    font: inherit;
    text-transform: uppercase;
    outline: none !important;
    border-radius: 3px;
    z-index: 0;

    margin: 8px;
    min-width: 4em;
    padding: .5em .1em;

}
div.boxImpegno x-button{
    margin: 0px;
}
div.dialog-buttons x-button{
    margin: 8px 8px 8px 0;
    padding: unset;
    box-shadow: none;
}

x-button x-icon
{
    fill: inherit;
    margin-left: 4px;
    margin-right: 4px;
    /* margin: 8px; */

}

x-button.disabled, x-button.busy
{
  pointer-events: none;
}

x-button[raised]
{
    color: currentColor;
    border-radius: 4px;
    /* font-weight: 500; */
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
                0 1px 5px 0 rgba(0, 0, 0, 0.12),
                0 3px 1px -2px rgba(0, 0, 0, 0.2);
}
x-button.raised-important
{
    color: currentColor;
    border-radius: 4px;
    /* font-weight: 500; */
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
                0 1px 5px 0 rgba(0, 0, 0, 0.12),
                0 3px 1px -2px rgba(0, 0, 0, 0.2)!important;
}
/*x-button[default]
{
    

}*/


x-button[raised].disabled, x-button[raised].busy
{
    cursor: default;
    background-color: #ccc;
    color: #777 !important;
    fill: #777 !important;
    stroke: #777 !important;
   
}

x-button a
{
    text-transform: uppercase;
    cursor: pointer;
    display: flex;
    flex:1 0 100%;
    max-width: 100%;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    align-items: center;
    text-align: center;
    font-weight: inherit;
    outline: none !important;

    color: currentColor;
    fill: currentColor;
    
}

x-button:focus
{
    border: 1px solid #CCC;
    border-radius: 4px;
}

x-button[raised]:focus
{
    border: 1px solid orange;
    border-radius: 4px;
}

x-button:active, x-button:active a
{
    /* background-color: #2196F3;
    fill: white !important;
    color: white !important; */
}

x-button a:hover{
    /* fill: #2196F3;
    color: #2196F3; */
}


x-button[raised] a:hover{
    /* fill:inherit;
    color:inherit;
    background-color: #43ABFD; */
}

x-button[raised] a
{
    border-radius: inherit;
    background-color: inherit;

    color: currentColor;
    fill: currentColor;
}

x-button[raised].disabled a, 
x-button[raised].busy  a, 
x-button[raised].disabled a:hover, 
x-button[raised].busy  a:hover, 
x-button[raised].busy a:hover x-icon svg
{
   
    background-color: #ccc;
   
}

x-button.busy  a
{
    padding-left: 0.75em;
    padding-right: 0.75em;
}


x-button.disabled a, 
x-button.disabled a x-icon, 
x-button.disabled a:hover x-icon, 
x-button.disabled a:hover x-icon svg, 
x-button.disabled a:hover, 
x-button.busy a, 
x-button.busy a x-icon,
x-button.busy a:hover, 
x-button.busy a:hover x-icon,
x-button.busy a:hover x-icon svg
{
    cursor: default;
    color: #777 !important;
    fill: #777 !important;
    pointer-events: none;

}

x-button.busy  a
{
    padding-left: 0.75em;
    padding-right: 0.75em;
}




x-button.busy a::before {
    content: '';
    width: 0.75em;
    height: 0.75em;
    display: inline-block;
    border: solid 2px transparent;
    border-top-color:#777;
    border-left-color:#777;
    border-radius: 50%;
    margin-right: 0.5em;
    -webkit-animation: v-busy-spin 0.75s linear infinite;
    animation: v-busy-spin 0.75s linear infinite;
}

x-button[raised].busy a::before {
  
    border-top-color: white;
    border-left-color: white;
  
}

@-webkit-keyframes v-busy-spin {
    to {
      -webkit-transform: rotate(360deg);
              transform: rotate(360deg); } 
}
  
  @keyframes v-busy-spin {
    to {
      -webkit-transform: rotate(360deg);
              transform: rotate(360deg); } 
}

.radio x-button a{
    min-height: unset;
    padding: 0.5em;
}
.radio x-button{
    margin: 0;
    padding: 0;
}

x-button.dialog-custom-button {
    margin: 8px 8px 8px 0!important;
    box-shadow: none;
    outline: none;
    transform: none!important;
    padding: unset;
}
.dialog-buttons x-button a{
    padding: 0 8px;
}
/* x-button.dialog-custom-button a{
    padding: 0;
} */

/* x-button.ripple{
    background-position: center;
    transition: background 0.8s;
  }
x-button.ripple:hover {
    background: transparent radial-gradient(circle, transparent 1%, #e1e2e4 1%) center/15000%;
  }
x-button.ripple:active {
    background-color: #e1e2e4;
    background-size: 100%;
    transition: background 0s;
  } */