/* Cargar la tipografía JustSansVariable */
@import url('
https://fonts.googleapis.com/css2?family=Just+Sans&display=swap');
/* Aplicar JustSansVariable como fuente principal */
body, .everest-forms-input, .everest-forms-submit-button, .everest-forms-upload-title, .everest-forms-upload-hint {
font-family: 'Just Sans', sans-serif !important; /* Aplicar JustSansVariable */
}
/* Personaliza la zona de carga de archivos */
.everest-forms-uploader {
border: 2px dashed #FD5961 !important; /* Bordes rosados */
border-radius: 10px !important; /* Bordes redondeados */
padding: 30px !important;
text-align: center;
background-color: #ffffff; /* Fondo blanco */
margin-bottom: 20px !important;
width: 100%; /* Asegura que ocupe todo el ancho disponible */
max-width: 400px; /* Limita el ancho máximo */
margin-left: auto; /* Centra el contenedor horizontalmente */
margin-right: auto; /* Centra el contenedor horizontalmente */
}
/* Texto de la zona de carga */
.everest-forms-upload-title {
font-size: 30px;
color: #151562 !important; /* Color rosado */
font-weight: bold;
margin-top: 10px;
}
/* Texto adicional sobre los archivos permitidos */
.everest-forms-upload-hint {
font-size: 14px;
color: #FD5961 !important; /* Color rosado */
margin-top: 5px;
}
/* Estilo del botón de envío */
.everest-forms-submit-button {
background-color: #151562 !important; /* Fondo azul oscuro */
color: #ffffff !important; /* Texto blanco */
border: none !important; /* Quitar el borde */
padding: 15px 30px !important; /* Aumentar el padding para que el botón sea más grande */
border-radius: 10px !important;
font-weight: bold !important; /* Texto en negrita */
font-size: 20px !important; /* Aumentar el tamaño de la fuente */
cursor: pointer;
margin-top: 20px;
display: block;
width: 100%; /* Hace que el botón ocupe todo el ancho disponible */
text-align: center;
}
/* Efecto hover del botón de envío */
.everest-forms-submit-button:hover {
background-color: #FD5961 !important; /* Fondo rosado al hacer hover */
color: white !important;
}
/* Personaliza la apariencia de los campos de entrada */
.everest-forms-input, .dropzone-input {
padding: 10px;
border: 2px solid #FD5961 !important; /* Bordes rosados */
border-radius: 10px;
font-size: 14px;
width: 100%;
margin-top: 10px;
}
/* Estilo cuando no hay archivo seleccionado */
.everest-forms-uploader .dz-message {
font-size: 14px;
color: #151562 !important; /* Color de texto en gris oscuro para el área de carga */
font-weight: bold;
}
/* Estilo de la zona de subida cuando hay un archivo seleccionado */
.everest-forms-uploader.dz-clickable.dz-processing {
border-color: #FD5961 !important; /* Cambiar el borde cuando se selecciona un archivo */
}
/* Estilo del icono de carga con fondo circular y sombras con transparencia */
.everest-forms-uploader .dz-message::before {
content: "\f030"; /* Icono de cámara de FontAwesome */
font-family: 'Font Awesome 5 Free';
font-weight: 900;
font-size: 40px; /* Ajusta el tamaño del icono */
color: #FD5961; /* Color blanco para el icono */
background-color: rgba(253, 89, 97, 0.3) !important; /* Fondo rosado con 60% de transparencia */
border-radius: 50%; /* Hace que el fondo sea circular */
padding: 20px; /* Espaciado dentro del círculo */
display: inline-block;
margin-bottom: 15px;
/* Sombras rosadas con 50% de transparencia */
box-shadow:
0 0 0 12px rgba(253, 89, 97, 0.1) !important; /* Sombra interna más pequeña y con 30% de transparencia */
}
/* Para el botón de elegir fotos */
.everest-forms-uploader#foto .dz-message::before {
content: "\f030"; /* Icono de cámara */
}
/* Para el botón de elegir videos */
.everest-forms-uploader#video .dz-message::before {
content: "\f03d"; /* Icono de video */
}
/* Ocultar el icono SVG predeterminado en Everest Forms */
.everest-forms-uploader .dz-message svg {
display: none !important; /* Esto oculta el icono SVG predeterminado */
}