:root { --ajuste-lum: 30%;  --color-primario-hue: 224; --color-primario-saturation: 100%; --color-primario-lightness: 54%; --color-primario: hsl( var(--color-primario-hue), var(--color-primario-saturation), var(--color-primario-lightness) ); --color-primario-claro: hsl( var(--color-primario-hue), var(--color-primario-saturation), calc(var(--color-primario-lightness) + var(--ajuste-lum)) ); --color-primario-oscuro: hsl( var(--color-primario-hue), var(--color-primario-saturation), calc(var(--color-primario-lightness) - var(--ajuste-lum)) );  --color-secundario-hue: 320; --color-secundario-saturation: 48%; --color-secundario-lightness: 40%; --color-secundario: hsl( var(--color-secundario-hue), var(--color-secundario-saturation), var(--color-secundario-lightness) ); --color-secundario-claro: hsl( var(--color-secundario-hue), var(--color-secundario-saturation), calc(var(--color-secundario-lightness) + var(--ajuste-lum)) ); --color-secundario-oscuro: hsl( var(--color-secundario-hue), var(--color-secundario-saturation), calc(var(--color-secundario-lightness) - var(--ajuste-lum)) );  --color-atencion-hue: 342; --color-atencion-saturation: 100%; --color-atencion-lightness: 45%; --color-atencion: hsl( var(--color-atencion-hue), var(--color-atencion-saturation), var(--color-atencion-lightness) ); --color-atencion-claro: hsl( var(--color-atencion-hue), var(--color-atencion-saturation), calc(var(--color-atencion-lightness) + var(--ajuste-lum)) ); --color-atencion-oscuro: hsl( var(--color-atencion-hue), var(--color-atencion-saturation), calc(var(--color-atencion-lightness) - var(--ajuste-lum)) );  --color-exito-hue: 77; --color-exito-saturation: 67%; --color-exito-lightness: 50%; --color-exito: hsl( var(--color-exito-hue), var(--color-exito-saturation), var(--color-exito-lightness) ); --color-exito-claro: hsl( var(--color-exito-hue), var(--color-exito-saturation), calc(var(--color-exito-lightness) + var(--ajuste)) ); --color-exito-oscuro: hsl( var(--color-exito-hue), var(--color-exito-saturation), calc(var(--color-exito-lightness) - var(--ajuste)) );  --color-error-hue: 0; --color-error-saturation: 58%; --color-error-lightness: 41%; --color-error: hsl( var(--color-error-hue), var(--color-error-saturation), var(--color-error-lightness) ); --color-error-claro: hsl( var(--color-error-hue), var(--color-error-saturation), calc(var(--color-error-lightness) + var(--ajuste-lum)) ); --color-error-oscuro: hsl( var(--color-error-hue), var(--color-error-saturation), calc(var(--color-error-lightness) - var(--ajuste-lum)) );  --color-warning-hue: 34; --color-warning-saturation: 100%; --color-warning-lightness: 56%; --color-warning: hsl( var(--color-warning-hue), var(--color-warning-saturation), var(--color-warning-lightness) ); --color-warning-claro: hsl( var(--color-warning-hue), var(--color-warning-saturation), calc(var(--color-warning-lightness) + var(--ajuste-lum)) ); --color-warning-oscuro: hsl( var(--color-warning-hue), var(--color-warning-saturation), calc(var(--color-warning-lightness) - var(--ajuste-lum)) );  --color-negro: #000; --color-blanco: #fff;  --color-gris-hue: 0; --color-gris-saturation: 0%; --color-gris-lightness: 44%; --color-gris: hsl( var(--color-gris-hue), var(--color-gris-saturation), var(--color-gris-lightness) ); --color-gris-claro: hsl( var(--color-gris-hue), var(--color-gris-saturation), calc(var(--color-gris-lightness) + 17%) ); --color-gris-oscuro: hsl( var(--color-gris-hue), var(--color-gris-saturation), calc(var(--color-gris-lightness) - var(--ajuste-lum)) );