:root {
    --border-hover-btn: #eabfb9;
}

html {
  scroll-behavior: smooth;
}


.nueva-receta {
    position: relative;
    overflow: hidden; /* para que el flash no se salga del botón */
    border: 2px solid transparent;
    background: var(--border-hover-btn);
    color: white;
    transition: all 0.3s ease;
}

/* Pseudo-elemento para el flash */
.nueva-receta::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%; /* empieza fuera del botón */
    width: 50%;
    height: 100%;
    background: rgba(255, 255, 255, 0.5); /* línea blanca semi-transparente */
    transform: skewX(-20deg); /* efecto inclinado */
    transition: all 0.5s ease;
}

/* Hover activa el flash */
.nueva-receta:hover::after {
    left: 100%; /* recorre todo el botón */
}


.img-receta{
    width: 100%;
    object-fit: contain;
    padding: 2rem;
}

.img-receta img{
    max-height: 350px;
    min-width: 100%;
}