.enginelogo {
    width: 48px; /* 60px * 0.8 */
    height: 48px; /* 60px * 0.8 */
}

.btn-custom-green,
.btn-custom-red,
.btn-custom-blue,
.btn-custom-yellow,
.btn-custom-gray,
.btn-custom-white,
.btn-custom-login {
    width: 130px; /* 150px * 0.8 */
    border-radius: 5px; /* 5px * 0.8 */
    padding: 6px 9px; /* 7.5px * 0.8 y 11.25px * 0.8 */
    font-size: 0.75rem; /* 0.75rem * 0.9 */
    font-weight: 500;
    box-shadow: 0 3px 4.5px rgba(0, 0, 0, 0.1); /* 3px * 0.8 y 4.5px * 0.8 */
    transition: all 0.3s ease;
}
.btn-custom-white{
    border: 0.1px solid gray;
}

.btn-custom-green:hover,
.btn-custom-red:hover,
.btn-custom-blue:hover,
.btn-custom-yellow:hover,
.btn-custom-gray:hover,
.btn-custom-white:hover,
.btn-custom-login:hover {
    /* transform: translateY(-0.6px); */
    box-shadow: 0 4.5px 6px rgba(0, 0, 0, 0.15); /* 4.5px * 0.8 y 7.5px * 0.8 */
}

.btn-custom-green:focus,
.btn-custom-red:focus,
.btn-custom-blue:focus,
.btn-custom-yellow:focus,
.btn-custom-gray:focus,
.btn-custom-white:focus,
.btn-custom-login:focus {
    outline: none;
    /* box-shadow: 0 0 0 2.4px rgba(0, 0, 0, 0.3);  3px * 0.8 */
}

.btn-custom-green:active,
.btn-custom-red:active,
.btn-custom-blue:active,
.btn-custom-yellow:active,
.btn-custom-gray:active,
.btn-custom-white:active,
.btn-custom-login:active {
    transform: scale(0.99);
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);
}

.btn-custom-green { background-color: #28a745; color: #ffffff; }
.btn-custom-green:hover { background-color: #218838; }

.btn-custom-red { background-color: #bd1616; color: #ffffff; }
.btn-custom-red:hover { background-color: #9b2a2a; }

.btn-custom-blue { background-color: #007bff; color: #ffffff; }
.btn-custom-blue:hover { background-color: #0056b3; }

.btn-custom-yellow { background-color: #ffc107; color: #ffffff; }
.btn-custom-yellow:hover { background-color: #e0a800; }

.btn-custom-gray { background-color: #6c757d; color: #ffffff; }
.btn-custom-gray:hover { background-color: #5a6268; }

.btn-custom-white { background-color: #fafafa; color: #000000; }
.btn-custom-white:hover { background-color: #fbfbfb; }

.btn-custom-login {
    background-color: transparent;
    color: #ffffff;
    border: 0.75px solid #ffffff; /* 0.75px * 0.8 */
    text-decoration: none;
}

.btn-custom-login:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.btn-small {
    padding: 3.75px 7.5px; /* 3.75px * 0.8 y 7.5px * 0.8 */
    font-size: 0.7rem; /* 0.65625rem * 0.9 */
    width: auto;
    border-radius: 4.5px; /* 4.5px * 0.8 */
}
.btn-big {
    width: 300px;
    height: 100px;
    font-size: 1.8rem;
    padding: 20px;
    border-radius: 8px;
    text-transform: uppercase;
}


.btn-custom-outline {
    background-color: #ffffff;
    color: #000000;
    border: 1px solid #343a40; /* gris oscuro */
    width: 130px;
    border-radius: 5px;
    padding: 6px 9px;
    font-size: 0.75rem;
    font-weight: 500;
    box-shadow: 0 3px 4.5px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.btn-custom-outline:hover {
    background-color: #eeeeee; /* gris muy suave */
    /* transform: translateY(-0.6px); */
    box-shadow: 0 4.5px 6px rgba(0, 0, 0, 0.15);
    border: 1px solid #343a40; /* gris oscuro */
}