/* Hoja de estilos personalizada */

/* Color de fondo general de la página */
body {
    background-color: #f8f9fa; /* Puedes cambiar este color */
}

/* Estilos para el contenedor principal */
.container {
    background-color: #ffffff; /* Fondo del formulario */
    padding: 20px;
    border-radius: 10px; /* Bordes redondeados */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Sombra suave */
}

/* Estilo para los títulos */
h2 {
    color: #f77234 !important; /* Color del título principal */
    text-align: center;
}

h3 {
    color: #f77234 !important; /* Color del título principal */
    
}

.h2eval {
    color: #2593a7 !important; /* Color del título principal eval */
    text-align: center;
}

.h3eval {
    color: #2593a7 !important; /* Color del título principal eval */
    
}

.h2hse {
    color: #032c33 !important; /* Color del título principal eval */
    text-align: center;
}

.h3hse {
    color: #032c33 !important; /* Color del título principal eval */
    
}



/* Estilos para los inputs de formulario */
.form-control {
    border: 1px solid #ced4da; /* Borde de los campos de texto */
    border-radius: 5px;
}

/* Estilos para el botón */
.btn-primary {
    background-color: #036c96; /* Color de fondo del botón */
    border: none;
}

.btn-primary:hover {
    background-color: #063847; /* Color al pasar el cursor */
}


.btn-hse {
    background-color: #02315e; /* Color de fondo */
    border-color: #02315e; /* Color del borde */
    color: white; /* Color del texto */
    border-radius: 0.375rem !important; /* Restaurar bordes redondeados */
    padding: 6px 7px 
}
.btn-hse:hover {
    background-color: #021920; /* Color al pasar el cursor */
    color: white; /* Color del texto */
}

.btn-naranja {
    background-color: #a75000; /* Color de fondo */
    border-color: #a75000; /* Color del borde */
    color: white; /* Color del texto */
    border-radius: 0.375rem !important; /* Restaurar bordes redondeados */
    padding: 6px 7px 
}

.btn-naranja:hover {
    background-color: #8843028f;
    border-color: #8843028f;
    color: white; /* Color del texto */
    border-radius: 0.375rem !important; /* Restaurar bordes redondeados */
    padding: 6px 7px 
}

.resaltado {
    color: rgb(180, 46, 28); /* Cambia este color según tu necesidad */
    font-weight: bold;
}

.fondo-personalizado {
    background-color: #f0e8e0; /* Cambia este color según tu preferencia */
    padding: 15px; /* Añade espaciado para mejor apariencia */
    border-radius: 5px; /* Bordes redondeados opcionales */
}

.btn-pershe {
    background-color: #95a9b3; /* Color de fondo */
    border-color: #95a9b3; /* Color del borde */
    color: white; /* Color del texto */
    border-radius: 0.375rem !important; /* Restaurar bordes redondeados */
    padding: 6px 7px 
}

.btn-pershe:hover {
    background-color: #293033;
    border-color: #293033;
    color: white; /* Color del texto */
    border-radius: 0.375rem !important; /* Restaurar bordes redondeados */
    padding: 6px 7px 
}

.fondo-pershse {
    background-color: rgb(188, 216, 230); /* Cambia este color según tu preferencia */
    padding: 15px; /* Añade espaciado para mejor apariencia */
    border-radius: 5px; /* Bordes redondeados opcionales */
}

.fondo-dark-pershe {
    background-color: #95a9b3; /* Cambia este color según tu preferencia */
    padding: 15px; /* Añade espaciado para mejor apariencia */
    border-radius: 5px; /* Bordes redondeados opcionales */
}

.fondo-eval-personalizado {
    background-color: #caf7b6; /* Cambia este color según tu preferencia */
    padding: 15px; /* Añade espaciado para mejor apariencia */
    border-radius: 5px; /* Bordes redondeados opcionales */
}

.fondo-dark-personalizado {
    background-color: #d9e9f8; /* Cambia este color según tu preferencia */
    padding: 15px; /* Añade espaciado para mejor apariencia */
    border-radius: 5px; /* Bordes redondeados opcionales */
}

.fondo-dark {
    background-color: #f5dcc6; /* Cambia este color según tu preferencia */
    padding: 15px; /* Añade espaciado para mejor apariencia */
    border-radius: 5px; /* Bordes redondeados opcionales */
}

.custom-border {
    border-color: orange !important;
}

.custom-border-2 {
    border-color: rgb(1, 72, 114) !important;
}