/* Estilos base para todos los elementos con data-overlay-dark */
[data-overlay-dark]::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #000;
    /* Fondo negro */
    z-index: 1;
}

/* Opacidad específica basada en el valor del atributo data-overlay-dark */
[data-overlay-dark="1"]::before {
    opacity: 0.1;
}

[data-overlay-dark="2"]::before {
    opacity: 0.2;
}

[data-overlay-dark="3"]::before {
    opacity: 0.3;
}

[data-overlay-dark="4"]::before {
    opacity: 0.4;
}

[data-overlay-dark="5"]::before {
    opacity: 0.5;
}

[data-overlay-dark="6"]::before {
    opacity: 0.6;
}

[data-overlay-dark="7"]::before {
    opacity: 0.7;
}

[data-overlay-dark="8"]::before {
    opacity: 0.8;
}

[data-overlay-dark="9"]::before {
    opacity: 0.9;
}

[data-overlay-dark="10"]::before {
    opacity: 1.0;
}