@import url('https://fonts.googleapis.com/css2?family=Bungee+Spice&family=Kablammo&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Sirin+Stencil&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Croissant+One&display=swap');



:root
{


    --blanco: #ffffff;
    --negro: #000000;
    --gris-fuerte: #3a3a3a;
    --gris-medio: #dadada;

    --color-uno: #565656; /* */
    --color-dos: #C09F80; /*  */
    --color-tres: #D7CEC7; /*  */
    --color-cuatro: #76323F;
  

    --entrada-texto: #0055BC;
    --etiqueta: #49464D;

}

*
{
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
    -ms-overflow-style:  none; 
    scrollbar-width:  none;
}


input[type="text"],
input[type="password"],
input[type="date"],
input[type="color"],
input[type="time"],
input[type="tel"],
select,
textarea
{
    
    margin:  0;
    width: 120px;
    height: 25px;
    padding: 0px;
    padding-left: 5px;
    padding-right: 5px;
    border: 1px solid #C7C7C7;
    outline: none;
    font-weight: bold;
    border-radius: 3px;
    vertical-align: bottom;
    margin-bottom: 5px;
    font-size: 15px;

    background-color: lightgoldenrodyellow;
    color: var(--entrada-texto);
}


input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 1000px #fff inset;
}

input:-webkit-autofill {
    -webkit-text-fill-color: var(--entrada-texto);
}
   

select
{
    cursor: pointer;
    background-color: var(--blanco);
}   



input[type="date"]
{
    height: 16px;
    padding: 5px;
}



input[type="radio"]
{

    margin: 0;
    padding: 0;
    vertical-align: middle;
    margin-bottom: 5px;
}

button
{

    margin: 0;
    width: 120px;
    height: 25px;
    padding: 0px;
    cursor: pointer;
    outline: none;
    border: 2px solid #49464D;
    color: var(--blanco);
    font-weight: bold;
    border-radius: 3px;
    background-color: var(--color-dos);
    vertical-align: text-top;
    margin-bottom: 5px;
    margin-top: 5px;
    font-size: 15px;
    outline: none;
    border: none;
    transition: all 0.2s ease-in-out;
}

button:hover
{
    background-color: var(--color-uno);
    text-decoration: underline;
}


input[name="fechaSimpleHoy"],
input[name="fechaSimpleAyer"],
input[name="fechaInFin"],
input[name="fechaCualquiera"],
input[name="fechaCualquieraRIVER"],
input[name="fechaSimple"]
{
    background-image: url(../image/calendario.png) !important;
    background-size: 15px 15px !important;
    background-repeat: no-repeat !important;
    background-position: calc(100% - 5px) center !important;
  
}



input[type="text"]:-moz-read-only,
input[type="text"]:read-only 
{
  background-color: #E9E9E9 !important;
  cursor: not-allowed !important;
}



label
{
    display: block;
    margin:  0;
    width: 120px;
    height: 25px;
    padding: 0px;
    border: 1px solid transparent;
    vertical-align: bottom;
    margin-bottom: 5px;
    overflow: hidden;

    background-color: lightpink;
    color: var(--etiqueta);
}
